diff --git a/index.css b/index.css index 5ee2f01..7288fc3 100644 --- a/index.css +++ b/index.css @@ -1 +1 @@ -.google-search-preview{position:relative;width:100%;max-width:480px;background:#fff;border:1px solid #ccc;font-family:Helvetica Neue,Helvetica,Arial,sans-serif}.google-search-preview__content-container{padding:1em}.google-search-preview__headline{margin-top:0;margin-bottom:.25em;font-size:1.25em;font-weight:400;color:#1a0dab}.google-search-preview__paragraph{margin:0;font-size:.875em;line-height:1.3em;color:#3c4043}.google-search-preview__url{display:block;margin-bottom:.5em;font-size:.875em;color:#006621}.google-icon{display:inline-block;width:1.25em;height:1.25em;transform:translateY(.25em);line-height:2;background-image:url("data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTI4IiBoZWlnaHQ9IjEyOCIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj48cGF0aCBkPSJNMTE5LjQ4NyA0MS4wNzZDMTIyLjUwMiA0OC4zNSAxMjQgNTYuMDA2IDEyNCA2NC4wMWMwIDguMDA0LTEuNTE3IDE1LjY2LTQuNTEzIDIyLjkzMy0zLjAxNiA3LjI3My03LjM2NSAxMy43NzgtMTMuMDY2IDE5LjQ3OS01LjcwMSA1LjcwMS0xMi4xODggMTAuMDY5LTE5LjQ3OSAxMy4wNjYtNy4yOTEgMy4wMTUtMTQuOTMgNC41MTMtMjIuOTMzIDQuNTEzLTguMDA0IDAtMTUuNjYtMS41MTctMjIuOTMzLTQuNTEzLTcuMjcyLTMuMDE2LTEzLjc3OC03LjM2NS0xOS40NzktMTMuMDY2LTUuNzAxLTUuNzAxLTEwLjA2OC0xMi4xODgtMTMuMDg0LTE5LjQ3OUM1LjUxNyA3OS42NjkgNCA3Mi4wMTIgNCA2NC4wMDljMC04LjAwNCAxLjQ5OC0xNS42NiA0LjUxMy0yMi45MzMgMy4wMTYtNy4yNzIgNy4zNjUtMTMuNzc4IDEzLjA4NC0xOS40NzkgNS43Mi01LjcwMSAxMi4xODgtMTAuMDY4IDE5LjQ4LTEzLjA4NEM0OC4zNDggNS40OTggNTYuMDA0IDQgNjQuMDA4IDRjOC4wMDQgMCAxNS42NiAxLjUxNyAyMi45MzMgNC41MTMgNy4yNzMgMy4wMTYgMTMuNzc4IDcuMzY1IDE5LjQ3OSAxMy4wODQgNS43MDEgNS43MDEgMTAuMDY5IDEyLjE4OCAxMy4wNjYgMTkuNDh6TTk3LjE5MyA2My41OWMwLTIuMTAyLS4yNTYtNC4yMDMtLjc4NS02LjMwNEg2NC43NFY3MC40NmgxOC4yYy0uOTY4IDQuNDk1LTMuMjcgNy44NTctNi45MjUgMTAuMTIzLTMuMTk4IDIuMDY1LTYuOTYzIDMuMDg4LTExLjI5MyAzLjA4OC04Ljk3MiAwLTE1LjMzMS00LjU4Ny0xOS4wNi0xMy43Nzh2LS4wNTVoLS4wNTRhMTkuNDcgMTkuNDcgMCAwMS0xLjAyMy02LjI1YzAtMi4yNjUuMzY1LTQuNDAzIDEuMDk2LTYuNDMxIDMuNzI4LTkuMTkyIDEwLjA2OS0xMy43NzggMTkuMDYtMTMuNzc4IDQuNzY4IDAgOC45MzUgMS41MTYgMTIuNDk4IDQuNTVsOS44ODYtMTAuMDE0Yy02LjIzMS01LjU5Mi0xMy42ODctOC4zNy0yMi4zODUtOC4zNy0xMy40NjcgMC0yMy42NDUgNi4zMDUtMzAuNTE2IDE4LjkzMi0yLjM0IDQuNjA1LTMuNTI3IDkuNjQ4LTMuNTI3IDE1LjExMiAwIDUuMzM2IDEuMTcgMTAuMzYgMy41MjcgMTUuMDM5QzQxLjA5NCA5MS4yIDUxLjI3MyA5Ny41MDQgNjQuNzQgOTcuNTA0YzguMjk2IDAgMTUuNjc4LTIuODE0IDIyLjE0Ny04LjQ0MiA2Ljg3LTUuOTQgMTAuMzA2LTE0LjQzNiAxMC4zMDYtMjUuNDczeiIgZmlsbD0iI2ZmZiIvPjxwYXRoIGQ9Ik05Ni40MDcgNTcuMjY2Yy41MyAyLjEwMi43ODYgNC4yMDMuNzg2IDYuMzA1IDAgMTEuMDM3LTMuNDM1IDE5LjUzNC0xMC4zMDYgMjUuNDlsLTEwLjg1NC04LjQ5NmMzLjYzNi0yLjI2NiA1LjkzOS01LjY0NyA2LjkyNS0xMC4xMjRINjQuNzRWNTcuMjY2aDMxLjY2OHoiIGZpbGw9IiM0Mjg1RjQiLz48cGF0aCBkPSJNODYuODg3IDg5LjA2MmMtNi40NjkgNS42MjgtMTMuODUgOC40NDItMjIuMTQ3IDguNDQyLTEzLjQ2NyAwLTIzLjY0NS02LjI4Ni0zMC41MTYtMTguODc2bDExLjQ3NS04LjczNWMzLjcyOCA5LjE5MiAxMC4wNjkgMTMuNzc4IDE5LjA2IDEzLjc3OCA0LjMzIDAgOC4wOTQtMS4wMjMgMTEuMjkyLTMuMDg4bDEwLjgzNiA4LjQ3OXoiIGZpbGw9IiMzNEE4NTMiLz48cGF0aCBkPSJNNDUuNjgxIDY5Ljg5M2wtMTEuNDU3IDguNzM1Yy0yLjM0LTQuNjk3LTMuNTI3LTkuNzAzLTMuNTI3LTE1LjA0IDAtNS40NjMgMS4xNy0xMC40ODggMy41MjctMTUuMTExbDExLjQ3NSA4LjY4Yy0uNzMgMi4wMjgtMS4wOTYgNC4xNjYtMS4wOTYgNi40MzIgMCAyLjEwMS4zNDcgNC4xODQgMS4wMjMgNi4yNWguMDU1di4wNTR6IiBmaWxsPSIjRkJCQzA1Ii8+PHBhdGggZD0iTTg3LjEyNSAzNy45MTVsLTkuODg2IDEwLjAxNGMtMy41NjMtMy4wMzQtNy43My00LjU1LTEyLjQ5OS00LjU1LTguOTcyIDAtMTUuMzMxIDQuNTg2LTE5LjA1OSAxMy43NzhsLTExLjQ1Ny04LjY4YzYuODctMTIuNjI3IDE3LjA0OS0xOC45MzEgMzAuNTE2LTE4LjkzMSA4LjY5OCAwIDE2LjE1NCAyLjc5NiAyMi4zODUgOC4zNjl6IiBmaWxsPSIjRUE0MzM1Ii8+PC9zdmc+");background-size:100%;background-repeat:no-repeat}.open-graph-preview{position:relative;display:flex;flex-direction:column;width:100%;max-width:438px;background:#fff;border:1px solid #ccc;font-family:Helvetica Neue,Helvetica,Arial,sans-serif}.open-graph-preview__image-container{position:relative;width:100%;padding-bottom:52.25%}.open-graph-preview__image-container:before{content:"Image Missing";color:#ddd;position:absolute;font-size:2em;top:50%;left:50%;width:100%;text-align:center;transform:translateX(-50%) translateY(-50%)}.open-graph-preview__preview-image{position:absolute;width:100%;height:100%;object-fit:cover}.open-graph-preview__content-container{padding:.25em .75em .5em;background:#f2f3f5;border-top:1px solid #dddfe2}.open-graph-preview__url{font-size:.625em;text-transform:uppercase;color:#5e6771}.open-graph-preview__preview-headline{margin:0 0 .25em;padding:0;font-size:1em;color:#1c212a}.open-graph-preview__preview-paragraph{margin:0;padding:0;font-size:.75em;color:#5e6771}.facebook-icon{display:inline-block;width:1.25em;height:1.25em;transform:translateY(.25em);line-height:2;background-image:url("data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTI4IiBoZWlnaHQ9IjEyOCIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj48cGF0aCBkPSJNMTI0IDY0YzAtMzMuMTM1LTI2Ljg2NS02MC02MC02MEMzMC44NjUgNCA0IDMwLjg2NSA0IDY0YzAgMjkuOTQ1IDIxLjkzOCA1NC43NjkgNTAuNjI2IDU5LjI3NFY4MS4zNDhIMzkuMzg3VjY0aDE1LjIzOVY1MC43NzhjMC0xNS4wMzYgOC45Ni0yMy4zNDcgMjIuNjYzLTIzLjM0NyA2LjU2NSAwIDEzLjQzMyAxLjE3MyAxMy40MzMgMS4xNzNWNDMuMzdoLTcuNTY5Yy03LjQ1IDAtOS43NzkgNC42MjQtOS43NzkgOS4zNzRWNjRoMTYuNjRsLTIuNjU5IDE3LjM0OGgtMTMuOTh2NDEuOTI2QzEwMi4wNjEgMTE4Ljc3NyAxMjQgOTMuOTU0IDEyNCA2NHoiIGZpbGw9IiMxOTc3RjMiLz48cGF0aCBkPSJNODcuMzU1IDgxLjM0OEw5MC4wMTMgNjRINzMuMzc0VjUyLjc0NGMwLTQuNzQyIDIuMzItOS4zNzQgOS43OC05LjM3NGg3LjU2OFYyOC42MDRzLTYuODY4LTEuMTczLTEzLjQzMy0xLjE3M2MtMTMuNzAzIDAtMjIuNjYzIDguMzAzLTIyLjY2MyAyMy4zNDdWNjRIMzkuMzg3djE3LjM0OGgxNS4yMzl2NDEuOTI2YzMuMDU0LjQ4MSA2LjE4NS43MjYgOS4zNzQuNzI2IDMuMTkgMCA2LjMyLS4yNTMgOS4zNzQtLjcyNlY4MS4zNDhoMTMuOTgxeiIgZmlsbD0iI0ZFRkVGRSIvPjwvc3ZnPg==");background-size:100%;background-repeat:no-repeat}.twitter-card{display:flex;width:100%;margin-bottom:1em;max-width:438px;background:#fff;font-family:Helvetica Neue,Helvetica,Arial,sans-serif;line-height:1.3em;border:1px solid #ccc;border-radius:.85714em;overflow:hidden}.twitter-card--horizontal{flex-direction:column;max-width:507px}.twitter-card--horizontal .twitter-card__image{width:100%;padding-bottom:52.25%;border-bottom:1px solid #e1e8ed;border-right:none}.twitter-card__image{position:relative;width:25%;padding-bottom:25%;border-right:1px solid #e1e8ed}.twitter-card__image:before{content:"Image Missing";color:#ddd;position:absolute;font-size:1em;top:50%;left:50%;width:100%;text-align:center;transform:translateX(-50%) translateY(-50%)}.twitter-card--horizontal .twitter-card__image:before{font-size:2em}.twitter-card__preview-image{position:absolute;width:100%;height:100%;object-fit:cover}.twitter-card__content-container{padding:1em;width:75%}.twitter-card__preview-headline{margin-top:0;margin-bottom:.33em;font-size:1em}.twitter-card__preview-paragraph{margin:0;font-size:.875em}.twitter-card__url{display:block;margin-top:.33em;margin-bottom:0;padding:0;font-size:.875em;color:#8899a6}.twitter-icon{display:inline-block;width:1.25em;height:1.25em;transform:translateY(.25em);line-height:2;background-image:url("data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTI4IiBoZWlnaHQ9IjEyOCIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj48cGF0aCBkPSJNMTE5LjQ4NyA0MS4wNzZDMTIyLjUwMiA0OC4zNSAxMjQgNTYuMDA2IDEyNCA2NC4wMWMwIDguMDA0LTEuNTE3IDE1LjY2LTQuNTEzIDIyLjkzMy0zLjAxNiA3LjI3My03LjM2NSAxMy43NzgtMTMuMDY2IDE5LjQ3OS01LjcwMSA1LjcwMS0xMi4xODggMTAuMDY5LTE5LjQ3OSAxMy4wNjYtNy4yOTEgMy4wMTUtMTQuOTMgNC41MTMtMjIuOTMzIDQuNTEzLTguMDA0IDAtMTUuNjYtMS41MTctMjIuOTMzLTQuNTEzLTcuMjcyLTMuMDE2LTEzLjc3OC03LjM2NS0xOS40NzktMTMuMDY2LTUuNzAxLTUuNzAxLTEwLjA2OC0xMi4xODgtMTMuMDg0LTE5LjQ3OUM1LjUxNyA3OS42NjkgNCA3Mi4wMTIgNCA2NC4wMDljMC04LjAwNCAxLjQ5OC0xNS42NiA0LjUxMy0yMi45MzMgMy4wMTYtNy4yNzIgNy4zNjUtMTMuNzc4IDEzLjA4NC0xOS40NzkgNS43Mi01LjcwMSAxMi4xODgtMTAuMDY4IDE5LjQ4LTEzLjA4NEM0OC4zNDggNS40OTggNTYuMDA0IDQgNjQuMDA4IDRjOC4wMDQgMCAxNS42NiAxLjUxNyAyMi45MzMgNC41MTMgNy4yNzMgMy4wMTYgMTMuNzc4IDcuMzY1IDE5LjQ3OSAxMy4wODQgNS43MDEgNS43MDEgMTAuMDY5IDEyLjE4OCAxMy4wNjYgMTkuNDh6IiBmaWxsPSIjZmZmIi8+PHBhdGggZD0iTTUyLjM2NCA5My43NjNjMjcuNzQgMCA0Mi45MS0yMi4xMyA0Mi45MS00MS4zMiAwLS42MjgtLjAxNC0xLjI1My0uMDQzLTEuODc2YTMwLjA1IDMwLjA1IDAgMDA3LjUyMi03LjUyIDMwLjk3NiAzMC45NzYgMCAwMS04LjY2IDIuMjg2YzMuMTE0LTEuNzk4IDUuNTA0LTQuNjQyIDYuNjMyLTguMDMyYTMwLjk2OCAzMC45NjggMCAwMS05LjU3NyAzLjUyNWMtMi43NTItMi44MjMtNi42Ny00LjU4OS0xMS4wMDgtNC41ODktOC4zMjkgMC0xNS4wODMgNi41MDQtMTUuMDgzIDE0LjUyIDAgMS4xNC4xMzMgMi4yNDkuMzkxIDMuMzEyLTEyLjUzNC0uNjA3LTIzLjY0OC02LjM4Ni0zMS4wODYtMTUuMTczYTE0LjA3NSAxNC4wNzUgMCAwMC0yLjA0MiA3LjNjMCA1LjAzOCAyLjY2MyA5LjQ4NiA2LjcxMSAxMi4wODdhMTUuNDExIDE1LjQxMSAwIDAxLTYuODMtMS44MTZjLS4wMDIuMDYxLS4wMDIuMTItLjAwMi4xODYgMCA3LjAzMyA1LjE5OCAxMi45MDUgMTIuMSAxNC4yMzVhMTUuNjQ2IDE1LjY0NiAwIDAxLTYuODEyLjI1YzEuOTIgNS43NyA3LjQ4NyA5Ljk2OCAxNC4wODggMTAuMDg2LTUuMTYxIDMuODk2LTExLjY2NCA2LjIxNi0xOC43MyA2LjIxNi0xLjIxNyAwLTIuNDE4LS4wNjYtMy41OTgtLjIgNi42NzQgNC4xMTkgMTQuNiA2LjUyMyAyMy4xMTggNi41MjMiIGZpbGw9IiMxREExRjIiLz48L3N2Zz4=");background-size:100%;background-repeat:no-repeat} \ No newline at end of file +.google-search-preview{position:relative;width:100%;max-width:480px;background:#fff;border:1px solid #ccc;font-family:Helvetica Neue,Helvetica,Arial,sans-serif}.google-search-preview__content-container{padding:1em}.google-search-preview__headline{margin-top:0;margin-bottom:.25em;font-size:1.25em;font-weight:400;color:#1a0dab}.google-search-preview__paragraph{margin:0;font-size:.875em;line-height:1.3em;color:#3c4043}.google-search-preview__url{display:block;margin-bottom:.5em;font-size:.875em;color:#006621}.google-icon{display:inline-block;width:1.25em;height:1.25em;transform:translateY(.25em);line-height:2;background-image:url("data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTI4IiBoZWlnaHQ9IjEyOCIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj48cGF0aCBkPSJNMTE5LjQ4NyA0MS4wNzZDMTIyLjUwMiA0OC4zNSAxMjQgNTYuMDA2IDEyNCA2NC4wMWMwIDguMDA0LTEuNTE3IDE1LjY2LTQuNTEzIDIyLjkzMy0zLjAxNiA3LjI3My03LjM2NSAxMy43NzgtMTMuMDY2IDE5LjQ3OS01LjcwMSA1LjcwMS0xMi4xODggMTAuMDY5LTE5LjQ3OSAxMy4wNjYtNy4yOTEgMy4wMTUtMTQuOTMgNC41MTMtMjIuOTMzIDQuNTEzLTguMDA0IDAtMTUuNjYtMS41MTctMjIuOTMzLTQuNTEzLTcuMjcyLTMuMDE2LTEzLjc3OC03LjM2NS0xOS40NzktMTMuMDY2LTUuNzAxLTUuNzAxLTEwLjA2OC0xMi4xODgtMTMuMDg0LTE5LjQ3OUM1LjUxNyA3OS42NjkgNCA3Mi4wMTIgNCA2NC4wMDljMC04LjAwNCAxLjQ5OC0xNS42NiA0LjUxMy0yMi45MzMgMy4wMTYtNy4yNzIgNy4zNjUtMTMuNzc4IDEzLjA4NC0xOS40NzkgNS43Mi01LjcwMSAxMi4xODgtMTAuMDY4IDE5LjQ4LTEzLjA4NEM0OC4zNDggNS40OTggNTYuMDA0IDQgNjQuMDA4IDRjOC4wMDQgMCAxNS42NiAxLjUxNyAyMi45MzMgNC41MTMgNy4yNzMgMy4wMTYgMTMuNzc4IDcuMzY1IDE5LjQ3OSAxMy4wODQgNS43MDEgNS43MDEgMTAuMDY5IDEyLjE4OCAxMy4wNjYgMTkuNDh6TTk3LjE5MyA2My41OWMwLTIuMTAyLS4yNTYtNC4yMDMtLjc4NS02LjMwNEg2NC43NFY3MC40NmgxOC4yYy0uOTY4IDQuNDk1LTMuMjcgNy44NTctNi45MjUgMTAuMTIzLTMuMTk4IDIuMDY1LTYuOTYzIDMuMDg4LTExLjI5MyAzLjA4OC04Ljk3MiAwLTE1LjMzMS00LjU4Ny0xOS4wNi0xMy43Nzh2LS4wNTVoLS4wNTRhMTkuNDcgMTkuNDcgMCAwMS0xLjAyMy02LjI1YzAtMi4yNjUuMzY1LTQuNDAzIDEuMDk2LTYuNDMxIDMuNzI4LTkuMTkyIDEwLjA2OS0xMy43NzggMTkuMDYtMTMuNzc4IDQuNzY4IDAgOC45MzUgMS41MTYgMTIuNDk4IDQuNTVsOS44ODYtMTAuMDE0Yy02LjIzMS01LjU5Mi0xMy42ODctOC4zNy0yMi4zODUtOC4zNy0xMy40NjcgMC0yMy42NDUgNi4zMDUtMzAuNTE2IDE4LjkzMi0yLjM0IDQuNjA1LTMuNTI3IDkuNjQ4LTMuNTI3IDE1LjExMiAwIDUuMzM2IDEuMTcgMTAuMzYgMy41MjcgMTUuMDM5QzQxLjA5NCA5MS4yIDUxLjI3MyA5Ny41MDQgNjQuNzQgOTcuNTA0YzguMjk2IDAgMTUuNjc4LTIuODE0IDIyLjE0Ny04LjQ0MiA2Ljg3LTUuOTQgMTAuMzA2LTE0LjQzNiAxMC4zMDYtMjUuNDczeiIgZmlsbD0iI2ZmZiIvPjxwYXRoIGQ9Ik05Ni40MDcgNTcuMjY2Yy41MyAyLjEwMi43ODYgNC4yMDMuNzg2IDYuMzA1IDAgMTEuMDM3LTMuNDM1IDE5LjUzNC0xMC4zMDYgMjUuNDlsLTEwLjg1NC04LjQ5NmMzLjYzNi0yLjI2NiA1LjkzOS01LjY0NyA2LjkyNS0xMC4xMjRINjQuNzRWNTcuMjY2aDMxLjY2OHoiIGZpbGw9IiM0Mjg1RjQiLz48cGF0aCBkPSJNODYuODg3IDg5LjA2MmMtNi40NjkgNS42MjgtMTMuODUgOC40NDItMjIuMTQ3IDguNDQyLTEzLjQ2NyAwLTIzLjY0NS02LjI4Ni0zMC41MTYtMTguODc2bDExLjQ3NS04LjczNWMzLjcyOCA5LjE5MiAxMC4wNjkgMTMuNzc4IDE5LjA2IDEzLjc3OCA0LjMzIDAgOC4wOTQtMS4wMjMgMTEuMjkyLTMuMDg4bDEwLjgzNiA4LjQ3OXoiIGZpbGw9IiMzNEE4NTMiLz48cGF0aCBkPSJNNDUuNjgxIDY5Ljg5M2wtMTEuNDU3IDguNzM1Yy0yLjM0LTQuNjk3LTMuNTI3LTkuNzAzLTMuNTI3LTE1LjA0IDAtNS40NjMgMS4xNy0xMC40ODggMy41MjctMTUuMTExbDExLjQ3NSA4LjY4Yy0uNzMgMi4wMjgtMS4wOTYgNC4xNjYtMS4wOTYgNi40MzIgMCAyLjEwMS4zNDcgNC4xODQgMS4wMjMgNi4yNWguMDU1di4wNTR6IiBmaWxsPSIjRkJCQzA1Ii8+PHBhdGggZD0iTTg3LjEyNSAzNy45MTVsLTkuODg2IDEwLjAxNGMtMy41NjMtMy4wMzQtNy43My00LjU1LTEyLjQ5OS00LjU1LTguOTcyIDAtMTUuMzMxIDQuNTg2LTE5LjA1OSAxMy43NzhsLTExLjQ1Ny04LjY4YzYuODctMTIuNjI3IDE3LjA0OS0xOC45MzEgMzAuNTE2LTE4LjkzMSA4LjY5OCAwIDE2LjE1NCAyLjc5NiAyMi4zODUgOC4zNjl6IiBmaWxsPSIjRUE0MzM1Ii8+PC9zdmc+");background-size:100%;background-repeat:no-repeat}.google-progress{background-color:#d9d9d9;overflow:hidden}.google-progresscalc{height:10px}.google-progressheader{display:flex;justify-content:space-between;font-size:.875em;margin-block-start:.8rem}.google-progresscalc--ok{background-color:green}.google-progresscalc--warning{background-color:#ff0}.google-progresscalc--error{background-color:red}.open-graph-preview{position:relative;display:flex;flex-direction:column;width:100%;max-width:438px;background:#fff;border:1px solid #ccc;font-family:Helvetica Neue,Helvetica,Arial,sans-serif}.open-graph-preview__image-container{position:relative;width:100%;padding-bottom:52.25%}.open-graph-preview__image-container:before{content:"Image Missing";color:#ddd;position:absolute;font-size:2em;top:50%;left:50%;width:100%;text-align:center;transform:translateX(-50%) translateY(-50%)}.open-graph-preview__preview-image{position:absolute;width:100%;height:100%;object-fit:cover}.open-graph-preview__content-container{padding:.25em .75em .5em;background:#f2f3f5;border-top:1px solid #dddfe2}.open-graph-preview__url{font-size:.625em;text-transform:uppercase;color:#5e6771}.open-graph-preview__preview-headline{margin:0 0 .25em;padding:0;font-size:1em;color:#1c212a}.open-graph-preview__preview-paragraph{margin:0;padding:0;font-size:.75em;color:#5e6771}.facebook-icon{display:inline-block;width:1.25em;height:1.25em;transform:translateY(.25em);line-height:2;background-image:url("data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTI4IiBoZWlnaHQ9IjEyOCIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj48cGF0aCBkPSJNMTI0IDY0YzAtMzMuMTM1LTI2Ljg2NS02MC02MC02MEMzMC44NjUgNCA0IDMwLjg2NSA0IDY0YzAgMjkuOTQ1IDIxLjkzOCA1NC43NjkgNTAuNjI2IDU5LjI3NFY4MS4zNDhIMzkuMzg3VjY0aDE1LjIzOVY1MC43NzhjMC0xNS4wMzYgOC45Ni0yMy4zNDcgMjIuNjYzLTIzLjM0NyA2LjU2NSAwIDEzLjQzMyAxLjE3MyAxMy40MzMgMS4xNzNWNDMuMzdoLTcuNTY5Yy03LjQ1IDAtOS43NzkgNC42MjQtOS43NzkgOS4zNzRWNjRoMTYuNjRsLTIuNjU5IDE3LjM0OGgtMTMuOTh2NDEuOTI2QzEwMi4wNjEgMTE4Ljc3NyAxMjQgOTMuOTU0IDEyNCA2NHoiIGZpbGw9IiMxOTc3RjMiLz48cGF0aCBkPSJNODcuMzU1IDgxLjM0OEw5MC4wMTMgNjRINzMuMzc0VjUyLjc0NGMwLTQuNzQyIDIuMzItOS4zNzQgOS43OC05LjM3NGg3LjU2OFYyOC42MDRzLTYuODY4LTEuMTczLTEzLjQzMy0xLjE3M2MtMTMuNzAzIDAtMjIuNjYzIDguMzAzLTIyLjY2MyAyMy4zNDdWNjRIMzkuMzg3djE3LjM0OGgxNS4yMzl2NDEuOTI2YzMuMDU0LjQ4MSA2LjE4NS43MjYgOS4zNzQuNzI2IDMuMTkgMCA2LjMyLS4yNTMgOS4zNzQtLjcyNlY4MS4zNDhoMTMuOTgxeiIgZmlsbD0iI0ZFRkVGRSIvPjwvc3ZnPg==");background-size:100%;background-repeat:no-repeat}.twitter-card{display:flex;width:100%;margin-bottom:1em;max-width:438px;background:#fff;font-family:Helvetica Neue,Helvetica,Arial,sans-serif;line-height:1.3em;border:1px solid #ccc;border-radius:.85714em;overflow:hidden}.twitter-card--horizontal{flex-direction:column;max-width:507px}.twitter-card--horizontal .twitter-card__image{width:100%;padding-bottom:52.25%;border-bottom:1px solid #e1e8ed;border-right:none}.twitter-card__image{position:relative;width:25%;padding-bottom:25%;border-right:1px solid #e1e8ed}.twitter-card__image:before{content:"Image Missing";color:#ddd;position:absolute;font-size:1em;top:50%;left:50%;width:100%;text-align:center;transform:translateX(-50%) translateY(-50%)}.twitter-card--horizontal .twitter-card__image:before{font-size:2em}.twitter-card__preview-image{position:absolute;width:100%;height:100%;object-fit:cover}.twitter-card__content-container{padding:1em;width:75%}.twitter-card__preview-headline{margin-top:0;margin-bottom:.33em;font-size:1em}.twitter-card__preview-paragraph{margin:0;font-size:.875em}.twitter-card__url{display:block;margin-top:.33em;margin-bottom:0;padding:0;font-size:.875em;color:#8899a6}.twitter-icon{display:inline-block;width:1.25em;height:1.25em;transform:translateY(.25em);line-height:2;background-image:url("data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTI4IiBoZWlnaHQ9IjEyOCIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj48cGF0aCBkPSJNMTE5LjQ4NyA0MS4wNzZDMTIyLjUwMiA0OC4zNSAxMjQgNTYuMDA2IDEyNCA2NC4wMWMwIDguMDA0LTEuNTE3IDE1LjY2LTQuNTEzIDIyLjkzMy0zLjAxNiA3LjI3My03LjM2NSAxMy43NzgtMTMuMDY2IDE5LjQ3OS01LjcwMSA1LjcwMS0xMi4xODggMTAuMDY5LTE5LjQ3OSAxMy4wNjYtNy4yOTEgMy4wMTUtMTQuOTMgNC41MTMtMjIuOTMzIDQuNTEzLTguMDA0IDAtMTUuNjYtMS41MTctMjIuOTMzLTQuNTEzLTcuMjcyLTMuMDE2LTEzLjc3OC03LjM2NS0xOS40NzktMTMuMDY2LTUuNzAxLTUuNzAxLTEwLjA2OC0xMi4xODgtMTMuMDg0LTE5LjQ3OUM1LjUxNyA3OS42NjkgNCA3Mi4wMTIgNCA2NC4wMDljMC04LjAwNCAxLjQ5OC0xNS42NiA0LjUxMy0yMi45MzMgMy4wMTYtNy4yNzIgNy4zNjUtMTMuNzc4IDEzLjA4NC0xOS40NzkgNS43Mi01LjcwMSAxMi4xODgtMTAuMDY4IDE5LjQ4LTEzLjA4NEM0OC4zNDggNS40OTggNTYuMDA0IDQgNjQuMDA4IDRjOC4wMDQgMCAxNS42NiAxLjUxNyAyMi45MzMgNC41MTMgNy4yNzMgMy4wMTYgMTMuNzc4IDcuMzY1IDE5LjQ3OSAxMy4wODQgNS43MDEgNS43MDEgMTAuMDY5IDEyLjE4OCAxMy4wNjYgMTkuNDh6IiBmaWxsPSIjZmZmIi8+PHBhdGggZD0iTTUyLjM2NCA5My43NjNjMjcuNzQgMCA0Mi45MS0yMi4xMyA0Mi45MS00MS4zMiAwLS42MjgtLjAxNC0xLjI1My0uMDQzLTEuODc2YTMwLjA1IDMwLjA1IDAgMDA3LjUyMi03LjUyIDMwLjk3NiAzMC45NzYgMCAwMS04LjY2IDIuMjg2YzMuMTE0LTEuNzk4IDUuNTA0LTQuNjQyIDYuNjMyLTguMDMyYTMwLjk2OCAzMC45NjggMCAwMS05LjU3NyAzLjUyNWMtMi43NTItMi44MjMtNi42Ny00LjU4OS0xMS4wMDgtNC41ODktOC4zMjkgMC0xNS4wODMgNi41MDQtMTUuMDgzIDE0LjUyIDAgMS4xNC4xMzMgMi4yNDkuMzkxIDMuMzEyLTEyLjUzNC0uNjA3LTIzLjY0OC02LjM4Ni0zMS4wODYtMTUuMTczYTE0LjA3NSAxNC4wNzUgMCAwMC0yLjA0MiA3LjNjMCA1LjAzOCAyLjY2MyA5LjQ4NiA2LjcxMSAxMi4wODdhMTUuNDExIDE1LjQxMSAwIDAxLTYuODMtMS44MTZjLS4wMDIuMDYxLS4wMDIuMTItLjAwMi4xODYgMCA3LjAzMyA1LjE5OCAxMi45MDUgMTIuMSAxNC4yMzVhMTUuNjQ2IDE1LjY0NiAwIDAxLTYuODEyLjI1YzEuOTIgNS43NyA3LjQ4NyA5Ljk2OCAxNC4wODggMTAuMDg2LTUuMTYxIDMuODk2LTExLjY2NCA2LjIxNi0xOC43MyA2LjIxNi0xLjIxNyAwLTIuNDE4LS4wNjYtMy41OTgtLjIgNi42NzQgNC4xMTkgMTQuNiA2LjUyMyAyMy4xMTggNi41MjMiIGZpbGw9IiMxREExRjIiLz48L3N2Zz4=");background-size:100%;background-repeat:no-repeat} \ No newline at end of file diff --git a/index.js b/index.js index b77bc23..f7738d0 100644 --- a/index.js +++ b/index.js @@ -1 +1 @@ -(function () {var a={data:function(){return{headline:null,site_title:null,this_page_title:null,url:null,meta_image:null}},created:function(){var t=this;this.load().then(function(e){t.headline=e.headline,t.page_title=e.title.value,t.meta_url=e.url,t.uid=e.uid,t.siteTitleAfterPageTitle=e.siteTitleAfterPageTitle,t.siteTitleAsHomePageTitle=e.siteTitleAsHomePageTitle,t.separator=e.separator}),this.$api.site.get().then(function(e){t.site_title=e.title,t.site_meta_title=e.content.meta_title})},computed:{meta_title:function(){var t=this.$store.getters["content/values"]().meta_title;return this.site_title==this.page_title?""==t&&(t=this.site_title):t="home"==this.uid&&this.siteTitleAsHomePageTitle?this.site_meta_title||this.site_title:1==this.siteTitleAfterPageTitle?""==t?this.page_title+this.separator+this.site_title:t+this.separator+this.site_title:""==t?this.site_title+this.separator+this.page_title:this.site_title+this.separator+t,t},meta_description:function(){var t=this.$store.getters["content/values"]().meta_description;return t.length<1?"[Description Missing]":t},store_image:function(){return this.$store.getters["content/values"]().meta_image}},watch:{store_image:{handler:function(){var t=this;0===this.store_image.length?this.meta_image=null:this.$api.files.get(this.$store.getters["content/model"]().api,this.store_image[0].filename,{view:"compact"}).then(function(e){t.meta_image=e.url})},immediate:!0}}};if(typeof a==="function"){a=a.options}Object.assign(a,function(){var render=function(){var _vm=this;var _h=_vm.$createElement;var _c=_vm._self._c||_h;return _c("div",[_c("div",{staticClass:"k-field-label"},[_c("span",{staticClass:"google-icon"}),_vm._v(" "+_vm._s(_vm.headline)+" ")]),_vm._v(" "),_c("div",{staticClass:"google-search-preview"},[_c("div",{staticClass:"google-search-preview__content-container"},[_c("h2",{staticClass:"google-search-preview__headline"},[_vm._v(" "+_vm._s(_vm.meta_title)+" ")]),_vm._v(" "),_c("span",{staticClass:"google-search-preview__url"},[_vm._v(_vm._s(_vm.meta_url))]),_vm._v(" "),_c("p",{staticClass:"google-search-preview__paragraph"},[_vm._v(" "+_vm._s(_vm.meta_description)+" ")])])]),_vm._v(" "),_vm.siteTitleAsHomePageTitle&&_vm.uid=="home"?_c("div",{staticClass:"k-field-help k-text",attrs:{"data-theme":"help"}},[_c("p",[_vm._v("Using the site title as home page title.")])]):_vm._e()])};var staticRenderFns=[];return{render:render,staticRenderFns:staticRenderFns,_compiled:true,_scopeId:null,functional:undefined}}());var b={data:function(){return{headline:"Basic Meta Information",site_title:null,page_title:null,url:null,og_image:null}},created:function(){var t=this;this.load().then(function(e){t.headline=e.headline,t.page_title=e.title.value,t.url=e.url}),this.$api.site.get().then(function(e){t.site_title=e.title})},computed:{og_title:function(){var t=this.$store.getters["content/values"]().og_title,e=this.$store.getters["content/values"]().meta_title,i=this.page_title;return t.length<1&&(t=e.length>0?e:i),t},og_description:function(){var t=this.$store.getters["content/values"]().og_description,e=this.$store.getters["content/values"]().meta_description;return t.length<1&&(t=e,e.length<1&&(t="[OG Description and Fallback Description Missing]")),t},og_site_name:function(){var t=this.$store.getters["content/values"]().og_site_name;return t.length<1?(t=this.site_title,t):t},store_image:function(){return this.$store.getters["content/values"]().og_image}},watch:{store_image:{handler:function(){var t=this;0===this.store_image.length?this.og_image=this.site_og_image_url:this.$api.files.get(this.$store.getters["content/model"]().api,this.store_image[0].filename,{view:"compact"}).then(function(e){t.og_image=e.url})},immediate:!0}}};if(typeof b==="function"){b=b.options}Object.assign(b,function(){var render=function(){var _vm=this;var _h=_vm.$createElement;var _c=_vm._self._c||_h;return _c("div",[_c("div",{staticClass:"k-field-label"},[_c("span",{staticClass:"facebook-icon"}),_vm._v(" "+_vm._s(_vm.headline)+" ")]),_vm._v(" "),_c("div",{staticClass:"open-graph-preview"},[_c("div",{staticClass:"open-graph-preview__image-container"},[this.store_image.length?_c("img",{staticClass:"open-graph-preview__preview-image",attrs:{"src":_vm.og_image}}):_vm._e()]),_vm._v(" "),_c("div",{staticClass:"open-graph-preview__content-container"},[_c("span",{staticClass:"open-graph-preview__url"},[_vm._v(_vm._s(_vm.og_site_name))]),_vm._v(" "),_c("h2",{staticClass:"open-graph-preview__preview-headline"},[_vm._v(" "+_vm._s(_vm.og_title)+" ")]),_vm._v(" "),_c("p",{staticClass:"open-graph-preview__preview-paragraph"},[_vm._v(" "+_vm._s(_vm.og_description)+" ")])])])])};var staticRenderFns=[];return{render:render,staticRenderFns:staticRenderFns,_compiled:true,_scopeId:null,functional:undefined}}());var c={data:function(){return{headline:"Basic Meta Information",site_title:null,page_title:null,url:null,twitter_image:null}},created:function(){var t=this;this.load().then(function(e){t.headline=e.headline,t.url=e.url,t.page_title=e.title.value,t.twitter_url=e.url})},computed:{twitter_card_type:function(){var t=this.$store.getters["content/values"]().twitter_card_type;return t},twitter_title:function(){var t=this.$store.getters["content/values"]().twitter_title,e=this.$store.getters["content/values"]().meta_title,i=this.page_title;return t.length<1&&(t=e.length>0?e:i),t},twitter_description:function(){var t=this.$store.getters["content/values"]().twitter_description,e=this.$store.getters["content/values"]().meta_description;return t.length<1&&(t=e,e.length<1&&(t="[Twitter Description and Fallback Description Missing]")),t},store_image:function(){return this.$store.getters["content/values"]().twitter_image}},watch:{store_image:{handler:function(){var t=this;0===this.store_image.length?this.twitter_image=null:this.$api.files.get(this.$store.getters["content/model"]().api,this.store_image[0].filename,{view:"compact"}).then(function(e){t.twitter_image=e.url})},immediate:!0}}};if(typeof c==="function"){c=c.options}Object.assign(c,function(){var render=function(){var _vm=this;var _h=_vm.$createElement;var _c=_vm._self._c||_h;return _c("div",[_c("div",{staticClass:"k-field-label"},[_c("span",{staticClass:"twitter-icon"}),_vm._v(" "+_vm._s(_vm.headline)+" ")]),_vm._v(" "),_c("div",{staticClass:"twitter-cards"},[_vm.twitter_card_type==="summary_large_image"?[_c("div",{staticClass:"twitter-card twitter-card--horizontal"},[_c("div",{staticClass:"twitter-card__image"},[this.store_image.length?_c("img",{staticClass:"twitter-card__preview-image",attrs:{"src":_vm.twitter_image}}):_vm._e()]),_vm._v(" "),_c("div",{staticClass:"twitter-card__content-container"},[_c("h2",{staticClass:"twitter-card__preview-headline"},[_vm._v(_vm._s(_vm.twitter_title))]),_vm._v(" "),_c("p",{staticClass:"twitter-card__preview-paragraph"},[_vm._v(" "+_vm._s(_vm.twitter_description)+" ")]),_vm._v(" "),_c("span",{staticClass:"twitter-card__url"},[_vm._v(_vm._s(_vm.twitter_url))])])])]:[_c("div",{staticClass:"twitter-card"},[_c("div",{staticClass:"twitter-card__image"},[this.store_image.length?_c("img",{staticClass:"twitter-card__preview-image",attrs:{"src":_vm.twitter_image}}):_vm._e()]),_vm._v(" "),_c("div",{staticClass:"twitter-card__content-container"},[_c("h2",{staticClass:"twitter-card__preview-headline"},[_vm._v(_vm._s(_vm.twitter_title))]),_vm._v(" "),_c("p",{staticClass:"twitter-card__preview-paragraph"},[_vm._v(" "+_vm._s(_vm.twitter_description)+" ")]),_vm._v(" "),_c("span",{staticClass:"twitter-card__url"},[_vm._v(_vm._s(_vm.twitter_url))])])])]],2)])};var staticRenderFns=[];return{render:render,staticRenderFns:staticRenderFns,_compiled:true,_scopeId:null,functional:undefined}}());panel.plugin("diesdasdigital/kirby-meta-knight",{sections:{google_search_preview:a,facebook_sharing_preview:b,twitter_card_preview:c}});})(); \ No newline at end of file +(function () {var a={data:function(){return{headline:null,site_title:null,this_page_title:null,url:null,meta_image:null,titleMaxPxLength:580,descMaxPxLength:990,titleFontSize:20,descFontSize:14}},created:function(){var t=this;this.load().then(function(e){t.headline=e.headline,t.page_title=e.title.value,t.meta_url=e.url,t.uid=e.uid,t.siteTitleAfterPageTitle=e.siteTitleAfterPageTitle,t.siteTitleAsHomePageTitle=e.siteTitleAsHomePageTitle,t.separator=e.separator}),this.$api.site.get().then(function(e){t.site_title=e.title,t.site_meta_title=e.content.meta_title})},computed:{meta_title:function(){var t=this.$store.getters["content/values"]().meta_title;return this.site_title==this.page_title?""==t&&(t=this.site_title):t="home"==this.uid&&this.siteTitleAsHomePageTitle?this.site_meta_title||this.site_title:1==this.siteTitleAfterPageTitle?""==t?this.page_title+this.separator+this.site_title:t+this.separator+this.site_title:""==t?this.site_title+this.separator+this.page_title:this.site_title+this.separator+t,t},meta_description:function(){var t=this.$store.getters["content/values"]().meta_description;return t.length<1?"[Description Missing]":t},store_image:function(){return this.$store.getters["content/values"]().meta_image},titleLengthInPx:function(){return this.measureTextPxWidth(this.meta_title,this.titleFontSize)},titleProgressInPercent:function(){return this.getProgressWidthInPercent(this.titleMaxPxLength,this.titleLengthInPx)},titleProgressClass:function(){return{"google-progresscalc--error":this.titleProgressInPercent>=100,"google-progresscalc--warning":this.titleProgressInPercent>=80,"google-progresscalc--ok":this.titleProgressInPercent<80}},titleProgressStyle:function(){return{width:this.titleProgressInPercent+"%"}},descLengthInPx:function(){return this.$store.getters["content/values"]().meta_description.length<1?0:this.measureTextPxWidth(this.meta_description,this.descFontSize)},descProgressInPercent:function(){return this.$store.getters["content/values"]().meta_description.length<1?0:this.getProgressWidthInPercent(this.descMaxPxLength,this.descLengthInPx)},descProgressClass:function(){return this.progressbarClass(this.descProgressInPercent)},descProgressStyle:function(){return{width:this.descProgressInPercent+"%"}}},methods:{measureTextPxWidth:function(t,e){var i=document.createElement("span");i.style.setProperty("all","revert","important"),i.style.setProperty("position","position","important"),i.style.setProperty("visibility","hidden","important"),i.style.setProperty("width","max-content","important"),i.style.setProperty("font-family","\"arial\",\"sans-serif\"","important"),i.style.setProperty("font-size",e+"px","important"),i.innerText=t,document.body.appendChild(i);var s=i.getBoundingClientRect().width;return document.body.removeChild(i),Math.round(s)},getProgressWidthInPercent:function(t,e){return 100*e/t},progressbarClass:function(t){return t>=100?"google-progresscalc--error":t>=80?"google-progresscalc--warning":"google-progresscalc--ok"}},watch:{store_image:{handler:function(){var t=this;0===this.store_image.length?this.meta_image=null:this.$api.files.get(this.$store.getters["content/model"]().api,this.store_image[0].filename,{view:"compact"}).then(function(e){t.meta_image=e.url})},immediate:!0}}};if(typeof a==="function"){a=a.options}Object.assign(a,function(){var render=function(){var _vm=this;var _h=_vm.$createElement;var _c=_vm._self._c||_h;return _c("div",[_c("div",{staticClass:"k-field-label"},[_c("span",{staticClass:"google-icon"}),_vm._v(" "+_vm._s(_vm.headline)+" ")]),_vm._v(" "),_c("div",{staticClass:"google-search-preview"},[_c("div",{staticClass:"google-search-preview__content-container"},[_c("h2",{staticClass:"google-search-preview__headline"},[_vm._v(" "+_vm._s(_vm.meta_title)+" ")]),_vm._v(" "),_c("span",{staticClass:"google-search-preview__url"},[_vm._v(_vm._s(_vm.meta_url))]),_vm._v(" "),_c("p",{staticClass:"google-search-preview__paragraph"},[_vm._v(" "+_vm._s(_vm.meta_description)+" ")])])]),_vm._v(" "),_c("p",{staticClass:"google-progressheader"},[_c("span",[_vm._v("Title:")]),_c("span",[_vm._v(_vm._s(_vm.titleLengthInPx)+"px / "+_vm._s(_vm.titleMaxPxLength)+"px")])]),_vm._v(" "),_c("div",{staticClass:"google-progress"},[_c("div",{staticClass:"google-progresscalc",class:_vm.titleProgressClass,style:_vm.titleProgressStyle})]),_vm._v(" "),_c("p",{staticClass:"google-progressheader"},[_c("span",[_vm._v("Description:")]),_c("span",[_vm._v(_vm._s(_vm.descLengthInPx)+"px / "+_vm._s(_vm.descMaxPxLength)+"px")])]),_vm._v(" "),_c("div",{staticClass:"google-progress"},[_c("div",{staticClass:"google-progresscalc",class:_vm.descProgressClass,style:_vm.descProgressStyle})]),_vm._v(" "),_vm.siteTitleAsHomePageTitle&&_vm.uid=="home"?_c("div",{staticClass:"k-field-help k-text",attrs:{"data-theme":"help"}},[_c("p",[_vm._v("Using the site title as home page title.")])]):_vm._e()])};var staticRenderFns=[];return{render:render,staticRenderFns:staticRenderFns,_compiled:true,_scopeId:null,functional:undefined}}());var b={data:function(){return{headline:"Basic Meta Information",site_title:null,page_title:null,url:null,og_image:null}},created:function(){var t=this;this.load().then(function(e){t.headline=e.headline,t.page_title=e.title.value,t.url=e.url}),this.$api.site.get().then(function(e){t.site_title=e.title})},computed:{og_title:function(){var t=this.$store.getters["content/values"]().og_title,e=this.$store.getters["content/values"]().meta_title,i=this.page_title;return t.length<1&&(t=e.length>0?e:i),t},og_description:function(){var t=this.$store.getters["content/values"]().og_description,e=this.$store.getters["content/values"]().meta_description;return t.length<1&&(t=e,e.length<1&&(t="[OG Description and Fallback Description Missing]")),t},og_site_name:function(){var t=this.$store.getters["content/values"]().og_site_name;return t.length<1?(t=this.site_title,t):t},store_image:function(){return this.$store.getters["content/values"]().og_image}},watch:{store_image:{handler:function(){var t=this;0===this.store_image.length?this.og_image=this.site_og_image_url:this.$api.files.get(this.$store.getters["content/model"]().api,this.store_image[0].filename,{view:"compact"}).then(function(e){t.og_image=e.url})},immediate:!0}}};if(typeof b==="function"){b=b.options}Object.assign(b,function(){var render=function(){var _vm=this;var _h=_vm.$createElement;var _c=_vm._self._c||_h;return _c("div",[_c("div",{staticClass:"k-field-label"},[_c("span",{staticClass:"facebook-icon"}),_vm._v(" "+_vm._s(_vm.headline)+" ")]),_vm._v(" "),_c("div",{staticClass:"open-graph-preview"},[_c("div",{staticClass:"open-graph-preview__image-container"},[this.store_image.length?_c("img",{staticClass:"open-graph-preview__preview-image",attrs:{"src":_vm.og_image}}):_vm._e()]),_vm._v(" "),_c("div",{staticClass:"open-graph-preview__content-container"},[_c("span",{staticClass:"open-graph-preview__url"},[_vm._v(_vm._s(_vm.og_site_name))]),_vm._v(" "),_c("h2",{staticClass:"open-graph-preview__preview-headline"},[_vm._v(" "+_vm._s(_vm.og_title)+" ")]),_vm._v(" "),_c("p",{staticClass:"open-graph-preview__preview-paragraph"},[_vm._v(" "+_vm._s(_vm.og_description)+" ")])])])])};var staticRenderFns=[];return{render:render,staticRenderFns:staticRenderFns,_compiled:true,_scopeId:null,functional:undefined}}());var c={data:function(){return{headline:"Basic Meta Information",site_title:null,page_title:null,url:null,twitter_image:null}},created:function(){var t=this;this.load().then(function(e){t.headline=e.headline,t.url=e.url,t.page_title=e.title.value,t.twitter_url=e.url})},computed:{twitter_card_type:function(){var t=this.$store.getters["content/values"]().twitter_card_type;return t},twitter_title:function(){var t=this.$store.getters["content/values"]().twitter_title,e=this.$store.getters["content/values"]().meta_title,i=this.page_title;return t.length<1&&(t=e.length>0?e:i),t},twitter_description:function(){var t=this.$store.getters["content/values"]().twitter_description,e=this.$store.getters["content/values"]().meta_description;return t.length<1&&(t=e,e.length<1&&(t="[Twitter Description and Fallback Description Missing]")),t},store_image:function(){return this.$store.getters["content/values"]().twitter_image}},watch:{store_image:{handler:function(){var t=this;0===this.store_image.length?this.twitter_image=null:this.$api.files.get(this.$store.getters["content/model"]().api,this.store_image[0].filename,{view:"compact"}).then(function(e){t.twitter_image=e.url})},immediate:!0}}};if(typeof c==="function"){c=c.options}Object.assign(c,function(){var render=function(){var _vm=this;var _h=_vm.$createElement;var _c=_vm._self._c||_h;return _c("div",[_c("div",{staticClass:"k-field-label"},[_c("span",{staticClass:"twitter-icon"}),_vm._v(" "+_vm._s(_vm.headline)+" ")]),_vm._v(" "),_c("div",{staticClass:"twitter-cards"},[_vm.twitter_card_type==="summary_large_image"?[_c("div",{staticClass:"twitter-card twitter-card--horizontal"},[_c("div",{staticClass:"twitter-card__image"},[this.store_image.length?_c("img",{staticClass:"twitter-card__preview-image",attrs:{"src":_vm.twitter_image}}):_vm._e()]),_vm._v(" "),_c("div",{staticClass:"twitter-card__content-container"},[_c("h2",{staticClass:"twitter-card__preview-headline"},[_vm._v(_vm._s(_vm.twitter_title))]),_vm._v(" "),_c("p",{staticClass:"twitter-card__preview-paragraph"},[_vm._v(" "+_vm._s(_vm.twitter_description)+" ")]),_vm._v(" "),_c("span",{staticClass:"twitter-card__url"},[_vm._v(_vm._s(_vm.twitter_url))])])])]:[_c("div",{staticClass:"twitter-card"},[_c("div",{staticClass:"twitter-card__image"},[this.store_image.length?_c("img",{staticClass:"twitter-card__preview-image",attrs:{"src":_vm.twitter_image}}):_vm._e()]),_vm._v(" "),_c("div",{staticClass:"twitter-card__content-container"},[_c("h2",{staticClass:"twitter-card__preview-headline"},[_vm._v(_vm._s(_vm.twitter_title))]),_vm._v(" "),_c("p",{staticClass:"twitter-card__preview-paragraph"},[_vm._v(" "+_vm._s(_vm.twitter_description)+" ")]),_vm._v(" "),_c("span",{staticClass:"twitter-card__url"},[_vm._v(_vm._s(_vm.twitter_url))])])])]],2)])};var staticRenderFns=[];return{render:render,staticRenderFns:staticRenderFns,_compiled:true,_scopeId:null,functional:undefined}}());panel.plugin("diesdasdigital/kirby-meta-knight",{sections:{google_search_preview:a,facebook_sharing_preview:b,twitter_card_preview:c}});})(); \ No newline at end of file diff --git a/src/components/sections/google_search_preview.vue b/src/components/sections/google_search_preview.vue index 29c346c..255d317 100644 --- a/src/components/sections/google_search_preview.vue +++ b/src/components/sections/google_search_preview.vue @@ -14,10 +14,18 @@

+

Title:{{titleLengthInPx}}px / {{titleMaxPxLength}}px

+
+
+
+

Description:{{descLengthInPx}}px / {{descMaxPxLength}}px

+
+
+

Using the site title as home page title.

@@ -27,12 +35,21 @@