├── .editorconfig
├── .github
    └── FUNDING.yml
├── .gitignore
├── .stylelintrc.json
├── LICENSE
├── README.md
├── amp.hbs
├── assets
    ├── images
    │   ├── avatar.png
    │   ├── screenshot-desktop.jpg
    │   └── screenshot-mobile.jpg
    ├── scripts
    │   └── main.js
    └── styles
    │   ├── amp.css
    │   └── main.css
├── author.hbs
├── custom-archive-tags.hbs
├── default.hbs
├── docs
    ├── ghost-api.jpg
    ├── ghost-settings.jpg
    ├── language.jpg
    └── prismjs.jpg
├── donate.gif
├── error-404.hbs
├── gulpfile.js
├── index.hbs
├── locales
    ├── en.json
    ├── es.json
    └── tr.json
├── package.json
├── page.hbs
├── partials
    ├── amp
    │   ├── amp-body.hbs
    │   ├── amp-header.hbs
    │   ├── amp-related.hbs
    │   ├── amp-sidebar.hbs
    │   ├── amp-styles.hbs
    │   ├── icon-facebook.hbs
    │   ├── icon-instagram.hbs
    │   ├── icon-snapchap.hbs
    │   ├── icon-telegram.hbs
    │   ├── icon-twitter.hbs
    │   └── icon-youtube.hbs
    ├── article
    │   ├── article-author.hbs
    │   ├── article-comments.hbs
    │   ├── article-prev-next.hbs
    │   ├── article-related.hbs
    │   ├── article-share.hbs
    │   └── article-tags.hbs
    ├── components
    │   └── author-meta.hbs
    ├── footer.hbs
    ├── header.hbs
    ├── icons
    │   ├── icons.hbs
    │   └── selection.json
    ├── loop.hbs
    ├── main-styles.hbs
    ├── pagination.hbs
    ├── sidenav.hbs
    ├── story
    │   ├── story-card-large.hbs
    │   ├── story-featured-sidenav.hbs
    │   └── story.hbs
    ├── styles.hbs
    └── widget
    │   ├── widget-subscribe.hbs
    │   └── witget-social-media.hbs
├── post.hbs
├── src
    ├── css
    │   ├── abstracts
    │   │   ├── constrols.css
    │   │   ├── extend.css
    │   │   └── variables.css
    │   ├── amp.css
    │   ├── amp
    │   │   └── utilities.css
    │   ├── base
    │   │   ├── base.css
    │   │   ├── global.css
    │   │   ├── root.css
    │   │   └── typography.css
    │   ├── cards
    │   │   ├── blockquote.css
    │   │   ├── bookmark.css
    │   │   ├── cards.css
    │   │   └── gallery.css
    │   ├── components
    │   │   ├── code.css
    │   │   ├── modal.css
    │   │   └── story.css
    │   ├── elements
    │   │   ├── buttons.css
    │   │   ├── form.css
    │   │   ├── icon.css
    │   │   └── table.css
    │   ├── layout
    │   │   ├── footer.css
    │   │   ├── header.css
    │   │   └── sidenav.css
    │   ├── main.css
    │   └── pages
    │   │   └── post.css
    ├── fonts
    │   ├── paway.eot
    │   ├── paway.svg
    │   ├── paway.ttf
    │   └── paway.woff
    ├── img
    │   ├── avatar.png
    │   ├── screenshot-desktop.jpg
    │   └── screenshot-mobile.jpg
    ├── js
    │   └── main.js
    └── svg-icon
    │   ├── selection.json
    │   └── symbol-defs.svg
├── tag.hbs
└── tailwind.config.js


/.editorconfig:
--------------------------------------------------------------------------------
 1 | # editorconfig.org
 2 | 
 3 | root = true
 4 | 
 5 | [*]
 6 | charset = utf-8
 7 | indent_style = space
 8 | indent_size = 2
 9 | end_of_line = lf
10 | insert_final_newline = true
11 | trim_trailing_whitespace = true
12 | 
13 | [*.hbs]
14 | indent_size = 4
15 | insert_final_newline = false
16 | 
17 | [*.md]
18 | trim_trailing_whitespace = false
19 | 


--------------------------------------------------------------------------------
/.github/FUNDING.yml:
--------------------------------------------------------------------------------
1 | custom: ['https://www.paypal.me/godofredoninja']
2 | 


--------------------------------------------------------------------------------
/.gitignore:
--------------------------------------------------------------------------------
 1 | b-cov
 2 | *.seed
 3 | *.log
 4 | *.csv
 5 | *.dat
 6 | *.out
 7 | *.pid
 8 | *.gz
 9 | *.zip
10 | *.swp
11 | *.html
12 | *.map
13 | *.vscode
14 | 
15 | 
16 | pids
17 | logs
18 | results
19 | 
20 | npm-debug.log
21 | node_modules
22 | package-lock.json
23 | 
24 | .idea/*
25 | *.iml
26 | projectFilesBackup
27 | 
28 | .DS_Store
29 | 
30 | dist/
31 | 
32 | config.json
33 | changelog.md
34 | changelog.md.bk
35 | 
36 | .sass-lint.yml
37 | .cache-loader
38 | yarn-error.log
39 | yarn.lock
40 | 


--------------------------------------------------------------------------------
/.stylelintrc.json:
--------------------------------------------------------------------------------
 1 | {
 2 |   "extends": "stylelint-config-recommended",
 3 |   "rules": {
 4 |     "max-nesting-depth": 3,
 5 |     "property-no-vendor-prefix": true,
 6 |     "max-empty-lines": 2,
 7 |     "indentation": 2,
 8 |     "function-calc-no-unspaced-operator": true,
 9 |     "string-quotes": "double",
10 |     "no-duplicate-selectors": null,
11 |     "at-rule-no-unknown": null,
12 |     "color-hex-case": null,
13 |     "color-named": "never",
14 |     "selector-max-id": 0,
15 |     "selector-combinator-space-after": "always",
16 |     "declaration-block-trailing-semicolon": "always",
17 |     "declaration-colon-space-before": "never",
18 |     "declaration-colon-space-after": "always",
19 |     "rule-empty-line-before": ["always-multi-line", {
20 |       "ignore": ["after-comment", "first-nested", "inside-block"]
21 |     }],
22 |     "media-feature-range-operator-space-before": "always",
23 |     "media-feature-range-operator-space-after": "always",
24 |     "media-feature-parentheses-space-inside": "never",
25 |     "media-feature-colon-space-before": "never",
26 |     "media-feature-colon-space-after": "always"
27 |   }
28 | }
29 | 


--------------------------------------------------------------------------------
/README.md:
--------------------------------------------------------------------------------
 1 | # Paway free theme for [Ghost](https://github.com/tryghost/ghost/)
 2 | 
 3 | [![Ghost version](https://img.shields.io/badge/Ghost-5.x-brightgreen.svg)](https://github.com/TryGhost/Ghost)
 4 | [![Donate](https://img.shields.io/badge/donate-paypal-blue.svg)](https://www.paypal.me/godofredoninja)
 5 | 
 6 | > For fancy people, Photographers and Travel Lovers
 7 | 
 8 | Paway theme is for photo blog writers and for those who like to share their stories in a simple and elegant way. The theme has a clean and modern design, using all the browser screen space.
 9 | It is suitable for any kind of blog: personal, fashion, food, travel, photography.
10 | 
11 | [![donate](./donate.gif)](https://www.paypal.me/godofredoninja)
12 | 
13 |  
14 | 
15 | [![Paway free theme for ghost](./assets/images/screenshot-desktop.jpg)](https://www.behance.net/gallery/89704867/Paway-For-fancy-people-Photographers-and-Travel-Lover)
16 | 
17 | ## Demo
18 | 
19 | See the screenshot on [behance](https://www.behance.net/gallery/89704867/Paway-For-fancy-people-Photographers-and-Travel-Lover)
20 | 
21 | ## Featured
22 | 
23 | - Support for different [languages](http://themes.ghost.org/docs/i18n#section-how-to-add-any-language) (en - es)
24 | - [AMP](https://github.com/godofredoninja/Hodor-AMP-Ghost) Template
25 | - Responsive Layout
26 | - Tag Page
27 | - Site Navigation
28 | - Related Articles (3 articles)
29 | - Links to Social Media
30 | - Page 404
31 | - Native Comments
32 | - Native Search
33 | - Buttons to share the article (Facebook - Twitter - Reddit - Linkedin)
34 | - YouTube, Vimeo, kickstarter, dailymotion => Responsive
35 | - Lazy load Image for better performance
36 | - [Theme Translation](#theme-translation)
37 | - [AMP](#amp)
38 | 
39 | ## Theme Translation
40 | 
41 | > Paway supports
42 | 
43 | - `en` — English default language
44 | - `es` — Spanish
45 | 
46 | if you want to have in another language you just have to copy `locales>en.json` and rename the file then translate to your favorite language:
47 | 
48 | Just enter the [language/locale tag](https://www.w3schools.com/tags/ref_language_codes.asp) of the files to use (e.g.: `fr.json` for French, `zh.json` for Chinese, `ja.json` for Japanese)
49 | 
50 | ## AMP
51 | 
52 | — *Paway has a nice page for **AMP***
53 | 
54 | - Navigation
55 | - links to followers in social media
56 | - Tags
57 | - Related Articles (6 articles)
58 | - Buttons to share the article (Facebook - Twitter - Whatsapp)
59 | 
60 | To customize the AMP page [read here](https://github.com/godofredoninja/Hodor-AMP-Ghost)
61 | 
62 | ### Credits
63 | 
64 | - [Hodor AMP](https://github.com/godofredoninja/Hodor-AMP-Ghost)
65 | - [Normalize](https://necolas.github.io/normalize.css/)
66 | - [Lazysizes](https://github.com/aFarkas/lazysizes)
67 | - [lightgallery.js](https://github.com/sachinchoolur/lightgallery.js/)
68 | - [Fonts](https://fonts.google.com/?query=lor&selection.family=Lora|Playfair+Display)
69 | - [Safari Light - Mockup](https://www.uplabs.com/posts/safari-light-version)
70 | 
71 | ## Copyright & License
72 | 
73 | Copyright (c) 2019 GodoFredo - Released under the [GPLv3 license](LICENSE)
74 | 


--------------------------------------------------------------------------------
/amp.hbs:
--------------------------------------------------------------------------------
 1 | <!DOCTYPE html>
 2 | <html amp lang="{{@site.locale}}">
 3 | <head>
 4 |     <meta charset="utf-8">
 5 |     <title>{{meta_title}}</title>
 6 | 
 7 |     {{!-- Mobile Meta --}}
 8 |     <meta name="HandheldFriendly" content="True" />
 9 |     <meta name="viewport" content="width=device-width,minimum-scale=1,initial-scale=1">
10 | 
11 |     {{amp_ghost_head}}
12 | 
13 |     {{!-- Only For dev --}}
14 |     {{!-- <link rel="stylesheet" type="text/css" href="{{asset "styles/amp.css"}}"/>
15 |     <style>{{amp_style}}</style> --}}
16 | 
17 |     {{!-- Style Custom --}}
18 |     <style amp-custom>{{> "amp/amp-styles"}}{{amp_style}}</style>
19 |     {{!-- <style amp-custom>:root {--ghost-accent-color:#005af0}{{> "amp/amp-styles"}}</style> --}}
20 | 
21 |     {{!-- The AMP boilerplate --}}
22 |     <style amp-boilerplate>body{-webkit-animation:-amp-start 8s steps(1,end) 0s 1 normal both;-moz-animation:-amp-start 8s steps(1,end) 0s 1 normal both;-ms-animation:-amp-start 8s steps(1,end) 0s 1 normal both;animation:-amp-start 8s steps(1,end) 0s 1 normal both}@-webkit-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@-moz-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@-ms-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@-o-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}</style><noscript><style amp-boilerplate>body{-webkit-animation:none;-moz-animation:none;-ms-animation:none;animation:none}</style></noscript>
23 |     <script async src="https://cdn.ampproject.org/v0.js"></script>
24 |     <script async custom-element="amp-sidebar" src="https://cdn.ampproject.org/v0/amp-sidebar-0.1.js"></script>
25 |     <script async custom-element="amp-social-share" src="https://cdn.ampproject.org/v0/amp-social-share-0.1.js"></script>
26 | 
27 |     {{amp_components}}
28 | 
29 |     {{#post}}{{#if feature_image}}<link rel="preload" href="{{img_url feature_image size="m" absolute="true"}}" as="image">{{/if}}{{/post}}
30 | </head>
31 | <body class="amp-template">
32 |     {{!-- Header --}}
33 |     {{> "amp/amp-header"}}
34 | 
35 |     <main class="main">
36 |         {{#post}}
37 |         {{!-- Content --}}
38 |         {{> "amp/amp-body"}}
39 | 
40 |         {{!-- Related --}}
41 |         {{> "amp/amp-related"}}
42 |         {{/post}}
43 |     </main>
44 | 
45 |     {{!-- Sidenav --}}
46 |     {{> "amp/amp-sidebar"}}
47 | 
48 |     {{!-- Footer copyright --}}
49 |     <footer class="footer text-gray-500 text-sm pt-8 pb-8">
50 |         <section class="container copyright text-center font-medium">
51 |             &copy; {{date format="YYYY"}} <a href="{{@site.url}}">{{@site.title}}</a>
52 |             Design with ♥ by <a href="https://godofredo.ninja" aria-label="Design with love by GodoFredo">GodoFredo</a>
53 |         </section>
54 |     </footer>
55 | 
56 |     {{amp_analytics}}
57 | </body>
58 | </html>


--------------------------------------------------------------------------------
/assets/images/avatar.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/godofredoninja/Paway/82cf16ecb035047f0a69accab3eceed31106a8f4/assets/images/avatar.png


--------------------------------------------------------------------------------
/assets/images/screenshot-desktop.jpg:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/godofredoninja/Paway/82cf16ecb035047f0a69accab3eceed31106a8f4/assets/images/screenshot-desktop.jpg


--------------------------------------------------------------------------------
/assets/images/screenshot-mobile.jpg:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/godofredoninja/Paway/82cf16ecb035047f0a69accab3eceed31106a8f4/assets/images/screenshot-mobile.jpg


--------------------------------------------------------------------------------
/assets/scripts/main.js:
--------------------------------------------------------------------------------
1 | /*!
2 |  * paway v0.0.4
3 |  * Copyright 2022 GodoFredo <hello@godofredo.ninja> (https://github.com/godofredoninja/Paway.git)
4 |  * Licensed under GPLv3
5 |  */!function i(a,r,o){function s(t,e){if(!r[t]){if(!a[t]){var n="function"==typeof require&&require;if(!e&&n)return n(t,!0);if(l)return l(t,!0);throw(e=new Error("Cannot find module '"+t+"'")).code="MODULE_NOT_FOUND",e}n=r[t]={exports:{}},a[t][0].call(n.exports,function(e){return s(a[t][1][e]||e)},n,n.exports,i,a,r,o)}return r[t].exports}for(var l="function"==typeof require&&require,e=0;e<o.length;e++)s(o[e]);return s}({1:[function(e,t,n){var i="undefined"!=typeof window?window:{},a=function(i,f,r){"use strict";var h,m,e,B={lazyClass:"lazyload",loadedClass:"lazyloaded",loadingClass:"lazyloading",preloadClass:"lazypreload",errorClass:"lazyerror",autosizesClass:"lazyautosizes",fastLoadedClass:"ls-is-cached",iframeLoadMode:0,srcAttr:"data-src",srcsetAttr:"data-srcset",sizesAttr:"data-sizes",minSize:40,customMedia:{},init:!0,expFactor:1.5,hFac:.8,loadMode:2,loadHidden:!0,ricTimeout:0,throttleDelay:125};for(e in m=i.lazySizesConfig||i.lazysizesConfig||{},B)e in m||(m[e]=B[e]);if(!f||!f.getElementsByClassName)return{init:function(){},cfg:m,noSupport:!0};function d(e,t){s(e,t)||e.setAttribute("class",(e[g]("class")||"").trim()+" "+t)}function u(e,t){(t=s(e,t))&&e.setAttribute("class",(e[g]("class")||"").replace(t," "))}function D(e,t){var n;!P&&(n=i.picturefill||m.pf)?(t&&t.src&&!e[g]("srcset")&&e.setAttribute("srcset",t.src),n({reevaluate:!0,elements:[e]})):t&&t.src&&(e.src=t.src)}var F,H,O,R,n,y=f.documentElement,P=i.HTMLPictureElement,a="addEventListener",g="getAttribute",t=i[a].bind(i),p=i.setTimeout,$=i.requestAnimationFrame||p,U=i.requestIdleCallback,I=/^picture$/i,G=["load","error","lazyincluded","_lazyloaded"],o={},X=Array.prototype.forEach,s=function(e,t){return o[t]||(o[t]=new RegExp("(\\s|^)"+t+"(\\s|$)")),o[t].test(e[g]("class")||"")&&o[t]},Y=function(t,n,e){var i=e?a:"removeEventListener";e&&Y(t,n),G.forEach(function(e){t[i](e,n)})},v=function(e,t,n,i,a){var r=f.createEvent("Event");return(n=n||{}).instance=h,r.initEvent(t,!i,!a),r.detail=n,e.dispatchEvent(r),r},z=function(e,t){return(getComputedStyle(e,null)||{})[t]},J=function(e,t,n){for(n=n||e.offsetWidth;n<m.minSize&&t&&!e._lazysizesWidth;)n=t.offsetWidth,t=t.parentNode;return n},C=(R=[],n=O=[],Q._lsFlush=K,Q);function K(){var e=n;for(n=O.length?R:O,H=!(F=!0);e.length;)e.shift()();F=!1}function Q(e,t){F&&!t?e.apply(this,arguments):(n.push(e),H||(H=!0,(f.hidden?p:$)(K)))}function l(n,e){return e?function(){C(n)}:function(){var e=this,t=arguments;C(function(){n.apply(e,t)})}}function V(e){function t(){var e=r.now()-i;e<99?p(t,99-e):(U||a)(a)}var n,i,a=function(){n=null,e()};return function(){i=r.now(),n=n||p(t,99)}}le=/^img$/i,ce=/^iframe$/i,de="onscroll"in i&&!/(gle|ing)bot/.test(navigator.userAgent),q=-1,ue=function(e){return(M=null==M?"hidden"==z(f.body,"visibility"):M)||!("hidden"==z(e.parentNode,"visibility")&&"hidden"==z(e,"visibility"))},ie=ve,re=x=S=0,oe=m.throttleDelay,c=m.ricTimeout,se=U&&49<c?function(){U(ze,{timeout:c}),c!==m.ricTimeout&&(c=m.ricTimeout)}:l(function(){p(ze)},!0),fe=l(Ce),he=function(e){fe({target:e.target})},me=l(function(t,e,n,i,a){var r,o,s,l,c;(o=v(t,"lazybeforeunveil",e)).defaultPrevented||(i&&(n?d(t,m.autosizesClass):t.setAttribute("sizes",i)),n=t[g](m.srcsetAttr),i=t[g](m.srcAttr),a&&(r=(l=t.parentNode)&&I.test(l.nodeName||"")),s=e.firesLoad||"src"in t&&(n||i||r),o={target:t},d(t,m.loadingClass),s&&(clearTimeout(Z),Z=p(pe,2500),Y(t,he,!0)),r&&X.call(l.getElementsByTagName("source"),be),n?t.setAttribute("srcset",n):i&&!r&&(ce.test(t.nodeName)?(e=i,0==(c=(l=t).getAttribute("data-load-mode")||m.iframeLoadMode)?l.contentWindow.location.replace(e):1==c&&(l.src=e)):t.src=i),a&&(n||r)&&D(t,{src:i})),t._lazyRace&&delete t._lazyRace,u(t,m.lazyClass),C(function(){var e=t.complete&&1<t.naturalWidth;s&&!e||(e&&d(t,m.fastLoadedClass),Ce(o),t._lazyCache=!0,p(function(){"_lazyCache"in t&&delete t._lazyCache},9)),"lazy"==t.loading&&x--},!0)}),ye=V(function(){m.loadMode=3,T()});var b,E,Z,A,ee,te,ne,w,_,L,N,M,ie,ae,re,oe,c,se,le,ce,de,S,x,q,ue,T,fe,he,me,k,ye,ge={_:function(){ee=r.now(),h.elements=f.getElementsByClassName(m.lazyClass),b=f.getElementsByClassName(m.lazyClass+" "+m.preloadClass),t("scroll",T,!0),t("resize",T,!0),t("pageshow",function(e){var t;e.persisted&&(t=f.querySelectorAll("."+m.loadingClass)).length&&t.forEach&&$(function(){t.forEach(function(e){e.complete&&k(e)})})}),i.MutationObserver?new MutationObserver(T).observe(y,{childList:!0,subtree:!0,attributes:!0}):(y[a]("DOMNodeInserted",T,!0),y[a]("DOMAttrModified",T,!0),setInterval(T,999)),t("hashchange",T,!0),["focus","mouseover","click","load","transitionend","animationend"].forEach(function(e){f[a](e,T,!0)}),/d$|^c/.test(f.readyState)?W():(t("load",W),f[a]("DOMContentLoaded",T),p(W,2e4)),h.elements.length?(ve(),C._lsFlush()):T()},checkElems:T=function(e){var t;(e=!0===e)&&(c=33),ae||(ae=!0,(t=oe-(r.now()-re))<0&&(t=0),e||t<9?se():p(se,t))},unveil:k=function(e){var t,n,i,a;e._lazyRace||(!(a="auto"==(i=(n=le.test(e.nodeName))&&(e[g](m.sizesAttr)||e[g]("sizes"))))&&E||!n||!e[g]("src")&&!e.srcset||e.complete||s(e,m.errorClass)||!s(e,m.lazyClass))&&(t=v(e,"lazyunveilread").detail,a&&Le.updateElem(e,!0,e.offsetWidth),e._lazyRace=!0,x++,me(e,t,a,i,n))},_aLSL:Ee};function pe(e){x--,e&&!(x<0)&&e.target||(x=0)}function ve(){var e,t,n,i,a,r,o,s,l,c,d,u=h.elements;if((A=m.loadMode)&&x<8&&(e=u.length)){for(t=0,q++;t<e;t++)if(u[t]&&!u[t]._lazyRace)if(!de||h.prematureUnveil&&h.prematureUnveil(u[t]))k(u[t]);else if((o=u[t][g]("data-expand"))&&(a=+o)||(a=S),l||(l=!m.expand||m.expand<1?500<y.clientHeight&&500<y.clientWidth?500:370:m.expand,c=(h._defEx=l)*m.expFactor,d=m.hFac,M=null,S<c&&x<1&&2<q&&2<A&&!f.hidden?(S=c,q=0):S=1<A&&1<q&&x<6?l:0),s!==a&&(te=innerWidth+a*d,ne=innerHeight+a,r=-1*a,s=a),c=u[t].getBoundingClientRect(),(N=c.bottom)>=r&&(w=c.top)<=ne&&(L=c.right)>=r*d&&(_=c.left)<=te&&(N||L||_||w)&&(m.loadHidden||ue(u[t]))&&(E&&x<3&&!o&&(A<3||q<4)||function(e,t){var n,i=e,a=ue(e);for(w-=t,N+=t,_-=t,L+=t;a&&(i=i.offsetParent)&&i!=f.body&&i!=y;)(a=0<(z(i,"opacity")||1))&&"visible"!=z(i,"overflow")&&(n=i.getBoundingClientRect(),a=L>n.left&&_<n.right&&N>n.top-1&&w<n.bottom+1);return a}(u[t],a))){if(k(u[t]),i=!0,9<x)break}else!i&&E&&!n&&x<4&&q<4&&2<A&&(b[0]||m.preloadAfterLoad)&&(b[0]||!o&&(N||L||_||w||"auto"!=u[t][g](m.sizesAttr)))&&(n=b[0]||u[t]);n&&!i&&k(n)}}function ze(){ae=!1,re=r.now(),ie()}function Ce(e){var t=e.target;t._lazyCache?delete t._lazyCache:(pe(e),d(t,m.loadedClass),u(t,m.loadingClass),Y(t,he),v(t,"lazyloaded"))}function be(e){var t,n=e[g](m.srcsetAttr);(t=m.customMedia[e[g]("data-media")||e[g]("media")])&&e.setAttribute("media",t),n&&e.setAttribute("srcset",n)}function Ee(){3==m.loadMode&&(m.loadMode=2),ye()}function W(){E||(r.now()-ee<999?p(W,999):(E=!0,m.loadMode=3,T(),t("scroll",Ee,!0)))}we=l(function(e,t,n,i){var a,r,o;if(e._lazysizesWidth=i,e.setAttribute("sizes",i+="px"),I.test(t.nodeName||""))for(r=0,o=(a=t.getElementsByTagName("source")).length;r<o;r++)a[r].setAttribute("sizes",i);n.detail.dataAttr||D(e,n.detail)});var Ae,we,_e,Le={_:function(){Ae=f.getElementsByClassName(m.autosizesClass),t("resize",_e)},checkElems:_e=V(function(){var e,t=Ae.length;if(t)for(e=0;e<t;e++)Ne(Ae[e])}),updateElem:Ne};function Ne(e,t,n){var i=e.parentNode;i&&(n=J(e,i,n),(t=v(e,"lazybeforesizes",{width:n,dataAttr:!!t})).defaultPrevented||(n=t.detail.width)&&n!==e._lazysizesWidth&&we(e,i,t,n))}function j(){!j.i&&f.getElementsByClassName&&(j.i=!0,Le._(),ge._())}return p(function(){m.init&&j()}),h={cfg:m,autoSizer:Le,loader:ge,init:j,uP:D,aC:d,rC:u,hC:s,fire:v,gW:J,rAF:C}};a=a(i,i.document,Date),i.lazySizes=a,"object"==typeof t&&t.exports&&(t.exports=a)},{}],2:[function(e,t,n){"use strict";function i(e,t){var n=r.createElement("script");n.src=e,t&&n.addEventListener("load",t),r.body.appendChild(n)}var a,r,o;e("lazysizes"),a=window,(r=document).querySelectorAll(".js-menu-toggle").forEach(function(e){return e.addEventListener("click",function(e){e.preventDefault(),r.body.classList.toggle("has-sidenav")})}),r.querySelector(".post-body")&&((e=r.querySelectorAll(['iframe[src*="player.vimeo.com"]','iframe[src*="dailymotion.com"]','iframe[src*="youtube.com"]','iframe[src*="youtube-nocookie.com"]','iframe[src*="kickstarter.com"][src*="video.html"]'].join(","))).length&&e.forEach(function(e){var t=r.createElement("div");t.className="video-responsive",e.parentNode.insertBefore(t,e),t.appendChild(e)}),r.querySelectorAll(".post-body img").forEach(function(e){var t;e.closest("a")||(e.classList.add("paway-light-gallery"),e.setAttribute("data-src",e.src),null!==(t=e.nextSibling)&&"figcaption"===t.nodeName.toLowerCase()&&e.setAttribute("data-sub-html",t.innerHTML))}),r.querySelectorAll(".paway-light-gallery").length&&(e="https://unpkg.com/lightgallery.js/dist/css/lightgallery.min.css",(o=r.createElement("link")).rel="stylesheet",o.href=e,r.head.appendChild(o),i("https://cdn.jsdelivr.net/npm/lightgallery.js@1.1.3/dist/js/lightgallery.min.js",function(){i("https://unpkg.com/lg-zoom.js@1.0.1/dist/lg-zoom.min.js"),a.lightGallery(r.querySelector(".post-body"),{selector:".paway-light-gallery"})})),r.querySelectorAll(".js-share").forEach(function(e){return e.addEventListener("click",function(e){var t=void 0!==a.screenLeft?a.screenLeft:a.screenX,n=void 0!==a.screenTop?a.screenTop:a.screenY,t=(a.innerWidth||r.documentElement.clientWidth||a.screen.width)/2-320+t,n=(a.innerHeight||r.documentElement.clientHeight||a.screen.height)/2-200+n,n=a.open(e.currentTarget.href,"share-window","scrollbars=yes, width=".concat(640,", height=").concat(400,", top=").concat(n,", left=").concat(t));a.focus&&n.focus(),e.preventDefault()})}))},{lazysizes:1}]},{},[2]);


--------------------------------------------------------------------------------
/assets/styles/amp.css:
--------------------------------------------------------------------------------
1 | /*!
2 |  * paway v0.0.4
3 |  * Copyright 2022 GodoFredo <hello@godofredo.ninja> (https://github.com/godofredoninja/Paway.git)
4 |  * Licensed under GPLv3
5 |  */html{-webkit-text-size-adjust:100%;line-height:1.15}body{margin:0}main{display:block}h1{font-size:2em;margin:.67em 0}pre{font-family:monospace,monospace;font-size:1em}a{background-color:transparent}abbr[title]{border-bottom:none;text-decoration:underline;-webkit-text-decoration:underline dotted;text-decoration:underline dotted}b,strong{font-weight:bolder}code,kbd,samp{font-family:monospace,monospace;font-size:1em}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-.25em}sup{top:-.5em}img{border-style:none}button,input,optgroup,select,textarea{font-family:inherit;font-size:100%;line-height:1.15;margin:0}button,input{overflow:visible}button,select{text-transform:none}[type=button],[type=reset],[type=submit],button{-webkit-appearance:button}[type=button]::-moz-focus-inner,[type=reset]::-moz-focus-inner,[type=submit]::-moz-focus-inner,button::-moz-focus-inner{border-style:none;padding:0}[type=button]:-moz-focusring,[type=reset]:-moz-focusring,[type=submit]:-moz-focusring,button:-moz-focusring{outline:1px dotted ButtonText}fieldset{padding:.35em .75em .625em}legend{box-sizing:border-box;color:inherit;display:table;max-width:100%;padding:0;white-space:normal}progress{vertical-align:baseline}textarea{overflow:auto}[type=checkbox],[type=radio]{box-sizing:border-box;padding:0}[type=number]::-webkit-inner-spin-button,[type=number]::-webkit-outer-spin-button{height:auto}[type=search]{-webkit-appearance:textfield;outline-offset:-2px}[type=search]::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit}details{display:block}summary{display:list-item}[hidden],template{display:none}.container{margin-left:auto;margin-right:auto;padding-left:1rem;padding-right:1rem}.text-gray-800{color:#292929}.text-white{color:#fff}.text-gray-500{color:#757575}.block{display:block}.uppercase{text-transform:uppercase}.capitalize{text-transform:capitalize}.tracking-wider{letter-spacing:.05em}.leading-snug{line-height:1.375}.text-sm{font-size:.875rem}.text-lg{font-size:1.25rem}.text-center{text-align:center}.font-medium{font-weight:500}.h-16{height:4rem}.m-0{margin:0}.mt-8{margin-top:2rem}.mr-3{margin-right:.75rem}.mb-3{margin-bottom:.75rem}.mb-5{margin-bottom:1.25rem}.mx-1{margin-left:.25rem;margin-right:.25rem}.pt-8{padding-top:2rem}.pb-8{padding-bottom:2rem}.px-4{padding-left:1rem;padding-right:1rem}.rounded-full{border-radius:9999px}.overflow-hidden{overflow:hidden}.flex{display:flex}.flex-none{flex:none}.flex-auto{flex:1 1 auto}.flex-col{flex-direction:column}.items-center{align-items:center}.justify-between{justify-content:space-between}.kg-bookmark-container,body,figcaption,h1,h2,h3,h4,h5,h6{font-family:Whitney SSm A,Whitney SSm B,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Open Sans,Helvetica Neue,sans-serif}*,:after,:before{box-sizing:border-box}body{text-rendering:optimizeLegibility;-webkit-text-size-adjust:100%;-moz-text-size-adjust:100%;text-size-adjust:100%;color:#292929;font-size:1rem;font-style:normal;font-weight:400;letter-spacing:0;line-height:1.5}a{color:var(--ghost-accent-color);text-decoration:none;word-break:break-word}a:active,a:hover{outline:0}blockquote{border-left:4px solid #292929;font-size:1.125rem;font-style:italic;margin-left:-5px;margin-right:0;padding-bottom:2px;padding-left:1.25rem}figure{margin:0;padding:0}img{-o-object-fit:cover;object-fit:cover;-o-object-position:center;object-position:center}figcaption{color:#757575;display:block;font-size:.875rem;font-style:normal;font-weight:400;margin-top:.75rem;text-align:center;width:100%}h1,h2,h3,h4,h5,h6{color:#18181b;font-style:normal;font-weight:700;line-height:1.25;margin:1.5rem 0 0;word-break:break-word}h1{font-size:2.25rem}h2{font-size:1.75rem}h3{font-size:1.5rem}h4{font-size:1.375rem}h5{font-size:1.25rem}h6{font-size:1.125rem}strong{font-weight:700}p{margin:1.25rem 0 0}hr{border:0;border-top:1px solid #e2ecec;box-sizing:content-box;height:0;margin:1rem 0;overflow:visible}mark{background-color:transparent;background-image:linear-gradient(180deg,#d7fdd3,#d7fdd3);color:rgba(0,0,0,.8)}code,pre{word-wrap:normal;font-family:Menlo,Courier,monospace;-webkit-hyphens:none;hyphens:none;-moz-tab-size:4;-o-tab-size:4;tab-size:4;white-space:pre;word-break:normal;word-spacing:normal}:not(pre)>code{background:#e5eff5;border-radius:2px;color:#2a3644;font-size:1rem;padding:1px 6px}pre{background:#2a3644;border:0;border-radius:8px;color:#e5eff5;font-size:.875rem;line-height:1.6em;margin:0;overflow-x:auto;padding:1.25rem}pre code{background:transparent;padding:0}svg{height:100%;width:100%}svg:not(:root){overflow:hidden}table{-webkit-overflow-scrolling:touch;border-collapse:collapse;border-spacing:0;display:inline-block;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Helvetica,Arial,sans-serif,Apple Color Emoji,Segoe UI Emoji,Segoe UI Symbol;font-size:1rem;line-height:1.5;margin:1.25rem 0 0;max-width:100%;overflow-x:auto;vertical-align:top;white-space:nowrap;width:auto}table td,table th{border:1px solid #dfe2e5;padding:.5rem .875rem}table tr:nth-child(2n){background-color:#f6f8fa}table th{font-weight:500;letter-spacing:.2px;text-transform:uppercase}.header{box-shadow:0 0 3px rgba(0,0,0,.03),0 3px 46px rgba(0,0,0,.07)}.logo-link{color:#000;font-size:1.75rem;font-weight:700}.social-media a{display:inline-block;height:2.5rem;margin:.5rem 0;padding:.5rem;vertical-align:middle;width:2.5rem}.sidebar{background:#fff;width:18rem}.sidebar ul{list-style:none;list-style-image:none;margin:1.125rem 0 1.25rem;padding:0}.sidebar ul li a{color:#292929;display:block;font-size:1.125rem;font-weight:500;padding:.5rem 1.25rem}.close-sidebar{font-size:1.5rem;outline:none}.hamburgermenu{background-color:transparent;border:0;height:3rem;margin-right:-1rem;outline:none;padding:0;position:relative;transition:transform .4s;width:3rem}.hamburgermenu span{background-color:currentColor;display:block;height:2px;left:.875rem;margin-top:-1px;position:absolute;top:50%;width:1.25rem}.hamburgermenu span:first-child{transform:translateY(-6px)}.hamburgermenu span:last-child{transform:translateY(6px)}.main{margin:0 auto;max-width:42.5rem}.article-body{font-family:charter,Georgia,Cambria,Times New Roman,Times,serif;font-size:1.125rem;line-height:1.7em}.article-body>*{margin-bottom:1.5rem}.article-body a:not(.kg-bookmark-container){text-decoration:underline;word-break:break-word}.article-body ol,.article-body ul{padding-left:1.25rem}.article-body ol li,.article-body ul li{margin-bottom:5px}.button-tags{background-color:var(--ghost-accent-color);border:0;border-radius:1.5625rem;color:#fff;display:inline-block;margin:.3125rem;padding:.3125rem 1.25rem}amp-social-share.custom-style{background-color:teal;background-image:url(https://raw.githubusercontent.com/google/material-design-icons/master/social/1x_web/ic_share_white_48dp.png);background-position:50%;background-repeat:no-repeat;background-size:contain}amp-social-share.rounded{background-size:85%;border-radius:10%}.story-link-text{color:#18181b;font-size:1rem;font-weight:700}.story-link-icon{background-color:var(--ghost-accent-color);color:#fff;font-size:1.5rem;font-weight:500;height:2.5rem;text-align:center;width:2.5rem}.kg-bookmark-container{border:1px solid rgba(0,0,0,.1);display:flex;flex-direction:column}.kg-bookmark-content{order:1;padding:1.25rem}.kg-bookmark-title{font-size:1.125rem;font-weight:500;line-height:1.2}.kg-bookmark-description{color:#757575;font-size:.875rem;line-height:1.4;margin-top:.75rem}.kg-bookmark-metadata{align-items:center;display:flex;font-size:.875rem;margin-top:.75rem}.kg-bookmark-icon{margin-right:5px}.kg-bookmark-author:after{content:"•";margin:0 6px}.kg-bookmark-publisher{color:inherit}.kg-embed-card{align-items:center;display:flex;flex-direction:column;width:100%}.kg-image-card img{margin:auto}.kg-gallery-card+.kg-gallery-card{margin-top:.75em}.kg-gallery-container{position:relative}.kg-gallery-row{display:flex;flex-direction:row;justify-content:center}.kg-gallery-image{height:100%;width:100%}.kg-gallery-row:not(:first-of-type){margin:.75em 0 0}.kg-gallery-image:not(:first-of-type){margin:0 0 0 .75em}.kg-toggle-card-icon{display:none}.kg-toggle-content{margin-top:.8rem}.kg-product-card-container{background:transparent;border-radius:5px;box-shadow:inset 0 0 0 1px rgba(124,139,154,.25);padding:20px;width:100%}.kg-product-card-description p{margin-top:1.5em}.kg-product-card-description ul{margin-left:24px}.kg-product-card-title{font-size:1.9rem;font-weight:700}.kg-product-card-rating-star{height:28px;margin-right:2px;width:20px}.kg-product-card-rating-star svg{fill:currentColor;height:16px;opacity:.15;width:16px}.kg-product-card-rating-active.kg-product-card-rating-star svg{opacity:1}.kg-nft-card-container{background:#fff;border-radius:5px;box-shadow:0 2px 6px -2px rgba(0,0,0,.1),0 0 1px rgba(0,0,0,.4);color:#15212a;display:flex;flex:auto;flex-direction:column;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Open Sans,Helvetica Neue,sans-serif;font-size:1.4rem;font-weight:400;margin:0 auto;max-width:512px;position:relative;text-decoration:none;transition:none;width:100%}.kg-nft-metadata{padding:2rem}.kg-nft-image-container{position:relative}.kg-nft-image{border-radius:5px 5px 0 0;display:flex}.kg-nft-header{grid-gap:20px;align-items:flex-start;display:flex;gap:20px;justify-content:space-between}.kg-nft-header h4.kg-nft-title{color:#15212a;font-size:1.9rem;font-weight:700;margin:0}.kg-nft-header amp-img{max-height:26px;max-width:114px}.kg-nft-opensea-logo{margin-top:2px;width:100px}.kg-nft-creator{color:#95a1ad;font-family:inherit}.kg-nft-creator span{color:#15212a;font-weight:500}.kg-nft-card p.kg-nft-description{color:#222;font-size:1.4rem;line-height:1.4em;margin:2rem 0 0}.kg-button-card{justify-content:center;width:100%}.kg-btn,.kg-button-card{align-items:center;display:flex;position:static}.kg-btn{border-radius:5px;font-size:1.65rem;font-weight:600;height:4rem;line-height:4rem;padding:0 2rem;text-decoration:none;transition:opacity .2s ease-in-out}.kg-btn:hover{opacity:.85}.kg-btn-accent{background-color:#1292ee;background-color:var(--ghost-accent-color,#1292ee);color:#fff}.kg-callout-card{border-radius:3px;display:flex;padding:20px 28px}.kg-callout-card-grey{background:rgba(124,139,154,.13)}.kg-callout-card-white{background:transparent;box-shadow:inset 0 0 0 1px rgba(124,139,154,.25)}.kg-callout-card-blue{background:rgba(33,172,232,.12)}.kg-callout-card-green{background:rgba(52,183,67,.12)}.kg-callout-card-yellow{background:rgba(240,165,15,.13)}.kg-callout-card-red{background:rgba(209,46,46,.11)}.kg-callout-card-pink{background:rgba(225,71,174,.11)}.kg-callout-card-purple{background:rgba(135,85,236,.12)}.kg-callout-card-accent{background:var(--ghost-accent-color);color:#fff}.kg-callout-card-accent a{color:#fff}.kg-callout-emoji{font-size:1.25em;line-height:1.3;padding-right:16px}.kg-header-card{align-items:center;display:flex;flex-direction:column;justify-content:center;padding:6em 3em;text-align:center}.kg-header-card.kg-size-small{padding-bottom:4em;padding-top:4em}.kg-header-card.kg-size-large{padding-bottom:12em;padding-top:12em}.kg-header-card.kg-width-full{padding-left:4em;padding-right:4em}.kg-header-card.kg-align-left{align-items:flex-start;text-align:left}.kg-header-card.kg-style-dark{background:#15171a;color:#fff}.kg-header-card.kg-style-light{border:1px solid rgba(124,139,154,.25);border-width:1px 0;color:#15171a}.kg-header-card.kg-style-accent{background-color:var(--ghost-accent-color)}.kg-header-card.kg-style-image{background-color:#e7e7eb;background-position:50%;background-size:cover}.kg-header-card h2{font-size:4em;font-weight:700;line-height:1.1em;margin:0}.kg-header-card h2 strong{font-weight:800}.kg-header-card.kg-size-small h2{font-size:3em}.kg-header-card.kg-size-large h2{font-size:5em}.kg-header-card h3{font-size:1.25em;font-weight:500;line-height:1.3em;margin:0}.kg-header-card h3 strong{font-weight:600}.kg-header-card.kg-size-small h3{font-size:1em}.kg-header-card.kg-size-large h3{font-size:1.5em}.kg-header-card:not(.kg-style-light) h2,.kg-header-card:not(.kg-style-light) h3{color:#fff}.kg-header-card a.kg-header-card-button{align-items:center;background-color:var(--ghost-accent-color);border-radius:5px;color:#fff;display:flex;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Fira Sans,Droid Sans,Helvetica Neue,sans-serif;font-size:.95em;font-weight:600;height:2.4em;line-height:1em;margin:1.75em 0 0;padding:0 1.2em;position:static;text-decoration:none;transition:opacity .2s ease-in-out}.kg-header-card a.kg-header-card-button:hover{opacity:.85}.kg-header-card.kg-size-large a.kg-header-card-button{margin-top:2em}.kg-header-card.kg-size-small a.kg-header-card-button{margin-top:1.5em}.kg-header-card.kg-style-dark a.kg-header-card-button,.kg-header-card.kg-style-image a.kg-header-card-button{background:#fff;color:#15171a}.kg-header-card.kg-style-accent a.kg-header-card-button{background:#fff;color:var(--ghost-accent-color)}.kg-audio-card{box-shadow:inset 0 0 0 1px rgba(124,139,154,.25);display:flex;width:100%}.kg-audio-thumbnail{align-items:center;aspect-ratio:1/1;background:transparent;border-radius:3px 0 0 3px;display:flex;height:80px;justify-content:center;min-width:80px;-o-object-fit:cover;object-fit:cover;width:80px}.kg-audio-thumbnail.placeholder{background:var(--ghost-accent-color)}.kg-audio-thumbnail.placeholder svg{fill:#fff;height:24px;width:24px}.kg-audio-player-container{--seek-before-width:0%;--volume-before-width:100%;--buffered-width:0%;display:flex;flex-direction:column;justify-content:space-between;position:relative;width:100%}.kg-audio-title{background:transparent;border:none;font-family:inherit;font-size:1.1em;font-weight:700;padding:8px 12px 0;width:100%}.kg-audio-player{display:none}.kg-width-full.kg-card-hascaption{display:grid;grid-template-columns:inherit}


--------------------------------------------------------------------------------
/author.hbs:
--------------------------------------------------------------------------------
 1 | {{!< default}}
 2 | {{!-- The tag above means: insert everything in this file
 3 | into the {body} of the default.hbs template --}}
 4 | 
 5 | {{#author}}
 6 | <header class="py-vw6 text-center max-w-2xl mx-auto px-4">
 7 |     <img class="inline-block mb-4 h-32 w-32 rounded-full"
 8 |         src="{{#if profile_image}}{{img_url profile_image size="s"}}{{else}}{{asset "images/avatar.png"}}{{/if}}"
 9 |         alt="{{t "Go to the profile of "}} {{name}}"/>
10 |     <h1 class="text-title text-4xl leading-none md:text-5xl">{{name}}</h1>
11 |     {{#if bio}}<p class="font-serif text-xl text-gray-500 italic mt-6">{{bio}}</p>{{/if}}
12 | 
13 |     {{!-- Facebook - Twitter - Webpage --}}
14 |     {{#has any="twitter, facebook, website"}}
15 |     <div class="post-author-meta mt-6">
16 |         <ul class="uppercase text-xs space-x-2 font-medium tracking-wider">
17 |             <li class="inline-block text-gray-500">{{t "follow me"}}</li>
18 |             {{#if facebook}}<li class="inline-block"><a class="border-b border-gray-300" href="{{facebook_url}}" title="Facebook" target="_blank" rel="noopener noreferrer">Facebook</a></li>{{/if}}
19 |             {{#if twitter}}<li class="inline-block"><a class="border-b border-gray-300" href="{{twitter_url}}" title="Twitter" target="_blank" rel="noopener noreferrer">Twitter</a></li>{{/if}}
20 |             {{#if website}}<li class="inline-block"><a class="border-b border-gray-300" href="{{website}}" title="Website" target="_blank" rel="noopener noreferrer">Website</a></li>{{/if}}
21 |         </ul>
22 |     </div>
23 |     {{/has}}
24 | </header>
25 | {{/author}}
26 | 
27 | {{!-- All Story - partials/loop.hbs --}}
28 | {{> "loop"}}
29 | 
30 | {{!-- Pagination --}}
31 | {{"pagination"}}


--------------------------------------------------------------------------------
/custom-archive-tags.hbs:
--------------------------------------------------------------------------------
 1 | {{!< default}}
 2 | {{!-- The tag above means: insert everything in this file
 3 | into the {body} of the default.hbs template --}}
 4 | 
 5 | {{#post}}
 6 |     <header class="py-vw6 text-center max-w-2xl mx-auto px-4">
 7 |         <h1 class="text-title text-4xl leading-none md:text-5xl">{{title}}</h1>
 8 |         <div class="font-serif text-xl text-gray-500 italic mt-6">{{content}}</div>
 9 |     </header>
10 | {{/post}}
11 | 
12 | <section class="topic-container pb-8">
13 |     <div class="px-4 topic-wrap grid md:grid-cols-2 gap-5 lg:grid-cols-3">
14 | 
15 |         {{#get "tags" limit="18" filter="visibility:public" include="count.posts" order="count.posts desc"}}
16 | 
17 |             {{#foreach tags}}
18 |                 <article class="relative h-64 flex items-center justify-center bg-dark" {{#if accent_color}}style="background-color:{{accent_color}}"{{/if}}>
19 |                     <a href="{{url}}">
20 |                         {{#if feature_image}}
21 |                             <img class="inset-image brightness-50 blur-up lazyload"
22 |                                 src="data:image/gif;base64,R0lGODlhAQABAAAAACH5BAEKAAEALAAAAAABAAEAAAICTAEAOw=="
23 |                                 data-srcset="{{img_url feature_image size="s"}} 300w,
24 |                                         {{img_url feature_image size="m"}} 600w,
25 |                                         {{img_url feature_image size="l"}} 1000w,
26 |                                         {{img_url feature_image size="xl"}} 2000w"
27 |                                 data-sizes="auto"
28 |                                 alt="{{name}}"
29 |                             />
30 |                         {{/if}}
31 | 
32 |                         <header class="topic-header text-white relative z-3 text-center sha">
33 |                             <div class="topic-count-post font-serif italic mb-2">{{count.posts}} {{t "Stories"}}</div>
34 |                             <h2 class="topic-title text-3xl">{{name}}</h2>
35 |                         </header>
36 |                     </a>
37 |                 </article>
38 |             {{/foreach}}
39 | 
40 |         {{/get}}
41 | 
42 |     </div>
43 | </section>


--------------------------------------------------------------------------------
/default.hbs:
--------------------------------------------------------------------------------
 1 | <!DOCTYPE html>
 2 | <!--
 3 |     Design by:
 4 |     ——————————
 5 |         GODO FREDO
 6 |         ✉ https://godofredo.ninja
 7 |         ✎ @GodoFredoNinja
 8 |         ✈ Lima - Perú
 9 | -->
10 | <html lang="{{@site.locale}}">
11 | <head>
12 |     {{!-- Document Settings --}}
13 |     <meta charset="utf-8" />
14 |     <meta http-equiv="X-UA-Compatible" content="IE=edge" />
15 | 
16 |     {{!-- Base Meta --}}
17 |     <title>{{meta_title}}</title>
18 |     <meta name="HandheldFriendly" content="True" />
19 |     <meta name="viewport" content="width=device-width, initial-scale=1.0" />
20 | 
21 |     {{!-- fonts --}}
22 |     <link rel="preconnect" href="https://fonts.googleapis.com">
23 |     <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
24 |     <link href="https://fonts.googleapis.com/css2?family=Lora:ital,wght@0,400;0,700;1,400;1,700&display=swap" rel="stylesheet">
25 | 
26 |     <link rel="stylesheet" type="text/css" href="{{asset "styles/main.css"}}"/>
27 | 
28 |     {{#match @custom.title_font "=" "Playfair Display"}}
29 |     <link href="https://fonts.googleapis.com/css2?family=Playfair+Display:ital,wght@0,400;0,700;1,400;1,700&display=swap" rel="stylesheet">
30 |     <style>:root{--font-title:"Playfair Display"}</style>
31 |     {{/match}}
32 | 
33 |     {{!-- This tag outputs SEO meta+structured data and other important settings --}}
34 |     {{ghost_head}}
35 | 
36 | </head>
37 | <body class="{{body_class}}">
38 |     {{!-- Site Header - partials/header.hbs --}}
39 |     {{> "header"}}
40 | 
41 |     <div class="site-wrapper">
42 |         {{!-- All the main content gets inserted here, index.hbs, post.hbs, etc --}}
43 |         {{{body}}}
44 |     </div>
45 | 
46 |     {{!-- Site Fotoer - partials/footer.hbs--}}
47 |     {{> "footer"}}
48 | 
49 |     {{!-- Sidenav - partials/sidenav.hbs --}}
50 |     {{> "sidenav"}}
51 | 
52 |     {{!-- icons --}}
53 |     {{> "icons/icons"}}
54 | 
55 |     {{!-- Ghost outputs important scripts and data with this tag --}}
56 |     {{ghost_foot}}
57 | 
58 |     {{!-- Main Scripts --}}
59 |     <script src="{{asset "scripts/main.js"}}"></script>
60 | 
61 |     {{!-- The #block helper will pull in data from the #contentFor other template files. --}}
62 |     {{{block "scripts"}}}
63 | </body>
64 | </html>


--------------------------------------------------------------------------------
/docs/ghost-api.jpg:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/godofredoninja/Paway/82cf16ecb035047f0a69accab3eceed31106a8f4/docs/ghost-api.jpg


--------------------------------------------------------------------------------
/docs/ghost-settings.jpg:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/godofredoninja/Paway/82cf16ecb035047f0a69accab3eceed31106a8f4/docs/ghost-settings.jpg


--------------------------------------------------------------------------------
/docs/language.jpg:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/godofredoninja/Paway/82cf16ecb035047f0a69accab3eceed31106a8f4/docs/language.jpg


--------------------------------------------------------------------------------
/docs/prismjs.jpg:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/godofredoninja/Paway/82cf16ecb035047f0a69accab3eceed31106a8f4/docs/prismjs.jpg


--------------------------------------------------------------------------------
/donate.gif:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/godofredoninja/Paway/82cf16ecb035047f0a69accab3eceed31106a8f4/donate.gif


--------------------------------------------------------------------------------
/error-404.hbs:
--------------------------------------------------------------------------------
 1 | {{!< default}}
 2 | {{!-- The tag above means: insert everything in this file
 3 | into the {body} of the default.hbs template --}}
 4 | 
 5 | <div class="container mx-auto text-center py-vw4">
 6 |     <h1 class="text-2xl font-normal">{{t "Page not found..."}}</h1>
 7 |     <div class="page-error-number text-title text-9xl font-serif font-bold my-10">404</div>
 8 |     <p class="mb-8 max-w-lg text-xl mx-auto">{{t "Sorry, but the page you are looking for is not found. Please, make sure you have typed the current URL."}}</p>
 9 |     <a href="{{@site.url}}" class="button is-primary">{{t "go to home"}}</a>
10 | </div>


--------------------------------------------------------------------------------
/gulpfile.js:
--------------------------------------------------------------------------------
  1 | const { series, watch, src, dest, parallel } = require('gulp')
  2 | const pump = require('pump')
  3 | const del = require('del')
  4 | 
  5 | const rename = require('gulp-rename')
  6 | const replace = require('gulp-replace')
  7 | 
  8 | // gulp plugins and utils
  9 | const livereload = require('gulp-livereload')
 10 | const beeper = require('beeper')
 11 | const postcss = require('gulp-postcss')
 12 | const zip = require('gulp-zip')
 13 | const gulpif = require('gulp-if')
 14 | const sourcemaps = require('gulp-sourcemaps')
 15 | const header = require('gulp-header')
 16 | 
 17 | // Babel
 18 | const browserify = require('browserify')
 19 | const source = require('vinyl-source-stream')
 20 | const buffer = require('vinyl-buffer')
 21 | const uglify = require('gulp-uglify')
 22 | //
 23 | const merge = require('merge-stream')
 24 | 
 25 | // postcss plugins
 26 | const cssnano = require('cssnano')
 27 | const autoprefixer = require('autoprefixer')
 28 | const comments = require('postcss-discard-comments')
 29 | const simpleExtend = require('postcss-extend')
 30 | const tailwindcss = require('tailwindcss')
 31 | // const lol = require('postcss-advanced-variables')
 32 | const postImport = require('postcss-import')
 33 | const precss = require('precss')
 34 | const postNesting = require('tailwindcss/nesting') // postcss-nested
 35 | 
 36 | // sass
 37 | // const sass = require('gulp-sass')(require('sass'))
 38 | 
 39 | // environment
 40 | const isProduction = process.argv.includes('--production') || process.env.NODE_ENV === 'production'
 41 | 
 42 | // Data collection on the theme
 43 | const { name, version, author, license, repository } = require('./package.json')
 44 | 
 45 | // Build Comments
 46 | const BuildComments = `/*!
 47 |  * ${name} v${version}
 48 |  * Copyright ${new Date().getFullYear()} ${author.name} <${author.email}> (${repository.url})
 49 |  * Licensed under ${license}
 50 |  */`
 51 | 
 52 | // clean assets
 53 | const clean = () => {
 54 |   return del([
 55 |     'assets',
 56 |     'partials/styles',
 57 |     'dis'
 58 |   ], { force: true })
 59 | }
 60 | 
 61 | function serve (done) {
 62 |   livereload.listen()
 63 |   done()
 64 | }
 65 | 
 66 | const handleError = done => {
 67 |   return function (err) {
 68 |     if (err) {
 69 |       beeper()
 70 |     }
 71 |     return done(err)
 72 |   }
 73 | }
 74 | 
 75 | // hbs
 76 | // function hbs (done) {
 77 | //   pump([
 78 | //     src(['*.hbs', 'partials/**/*.hbs']),
 79 | //     livereload()
 80 | //   ], handleError(done))
 81 | // }
 82 | 
 83 | const postcssPluginsDev = [
 84 |   postImport(),
 85 |   simpleExtend(),
 86 |   precss(),
 87 |   postNesting(),
 88 |   tailwindcss()
 89 | ]
 90 | 
 91 | const postcssPluginsPro = [
 92 |   autoprefixer(),
 93 |   cssnano(),
 94 |   comments({ removeAll: true })
 95 | ]
 96 | 
 97 | // style
 98 | function styles (done) {
 99 |   pump([
100 |     src('src/css/*.css'),
101 |     gulpif(!isProduction, sourcemaps.init()),
102 |     // sass({ outputStyle: 'expanded' }).on('error', sass.logError),
103 |     gulpif(!isProduction, postcss(postcssPluginsDev)),
104 |     gulpif(isProduction, postcss(postcssPluginsDev.concat(postcssPluginsPro))),
105 |     gulpif(isProduction, header(BuildComments)),
106 |     gulpif(!isProduction, sourcemaps.write('./map')),
107 |     dest('assets/styles'),
108 |     livereload()
109 |   ], handleError(done))
110 | }
111 | 
112 | // Scripts
113 | function scripts (done) {
114 |   const files = ['main']
115 | 
116 |   merge(files.map(function (file) {
117 |     return pump([
118 |       browserify({
119 |         basedir: '.',
120 |         debug: true,
121 |         entries: `./src/js/${file}.js`,
122 |         cache: {},
123 |         packageCache: {}
124 |       }).transform('babelify', {
125 |         presets: ['@babel/env'],
126 |         plugins: ['@babel/plugin-transform-runtime']
127 |       }).bundle(),
128 |       source(`${file}.js`),
129 |       buffer(),
130 |       gulpif(!isProduction, sourcemaps.init()),
131 |       gulpif(isProduction, uglify()),
132 |       gulpif(isProduction, header(BuildComments)),
133 |       gulpif(!isProduction, sourcemaps.write('./map')),
134 |       dest('assets/scripts'),
135 |       livereload()
136 |     ], handleError(done))
137 |   }))
138 | }
139 | 
140 | // Image
141 | function images (done) {
142 |   pump([
143 |     src('src/img/**/*.*'),
144 |     dest('assets/images'),
145 |     livereload()
146 |   ], handleError(done))
147 | }
148 | 
149 | function copyAmpStyle (done) {
150 |   pump([
151 |     src('assets/styles/amp.css'),
152 |     replace('@charset "UTF-8";', ''),
153 |     postcss([cssnano(), comments({ removeAll: true })]),
154 |     rename('amp-styles.hbs'),
155 |     dest('partials/amp')
156 |   ], handleError(done))
157 | }
158 | 
159 | function copyMainStyle (done) {
160 |   pump([
161 |     src('assets/styles/main.css'),
162 |     replace('@charset "UTF-8";', ''),
163 |     postcss([cssnano(), comments({ removeAll: true })]),
164 |     rename('main-styles.hbs'),
165 |     dest('partials')
166 |   ], handleError(done))
167 | }
168 | 
169 | // ZIP
170 | function zipper (done) {
171 |   const filename = `${name}-v${version}.zip`
172 | 
173 |   pump([
174 |     src([
175 |       'assets/**',
176 |       'locales/*.json',
177 |       '*.hbs',
178 |       'partials/**',
179 |       'LICENSE',
180 |       'package.json',
181 |       'README.md',
182 |       '!node_modules', '!node_modules/**',
183 |       '!dist', '!dist/**',
184 |       '!src', '!src/**'
185 |     ], { base: '.' }),
186 |     zip(filename),
187 |     dest('dist')
188 |   ], handleError(done))
189 | }
190 | 
191 | const cssWatcher = () => watch('src/css/**', styles)
192 | const jsWatcher = () => watch(['src/js/**', '*.js'], scripts)
193 | const imgWatcher = () => watch('src/img/**', images)
194 | // const hbsWatcher = () => watch(['*.hbs', 'partials/**/*.hbs'], hbs)
195 | const hbsWatcher = () => watch(['*.hbs', 'partials/**/*.hbs'], styles)
196 | 
197 | const compile = parallel(styles, scripts, images)
198 | const watcher = parallel(cssWatcher, jsWatcher, imgWatcher, hbsWatcher)
199 | 
200 | const build = series(clean, compile)
201 | const production = series(build, copyAmpStyle, copyMainStyle, zipper)
202 | // const production = series(build)
203 | const development = series(build, serve, watcher)
204 | 
205 | module.exports = { build, development, production }
206 | 


--------------------------------------------------------------------------------
/index.hbs:
--------------------------------------------------------------------------------
 1 | {{!< default}}
 2 | {{!-- The tag above means: insert everything in this file
 3 | into the {body} of the default.hbs template --}}
 4 | 
 5 | {{#match @custom.publication_cover "Featured"}}{{#get "posts" limit="1" include="tags,authors" filter="featured:true" as |godo_featured_post| }}
 6 |     {{#if godo_featured_post}} {{#foreach godo_featured_post}}{{> "story/story-card-large"}}{{/foreach}}{{/if}}
 7 | {{/get}}{{/match}}
 8 | 
 9 | {{!-- All Story - partials/loop.hbs --}}
10 | {{> "loop"}}
11 | 
12 | {{!-- Pagination - partials/pagination.hbs --}}
13 | {{"pagination"}}


--------------------------------------------------------------------------------
/locales/en.json:
--------------------------------------------------------------------------------
 1 | {
 2 |   "Back": "Back",
 3 |   "Newer Posts": "Newer Posts",
 4 |   "Older Posts": "Older Posts",
 5 |   "Page {page} of {pages}": "Page {page} of {pages}",
 6 |   "Account": "Account",
 7 |   "Subscribe": "Subscribe",
 8 |   "Subscribe to {blogtitle}": "Subscribe to {blogtitle}",
 9 |   "Subscribed!": "Subscribed!",
10 |   "with the email address": "with the email address",
11 |   "Your email address": "Your email address",
12 |   "You've successfully subscribed to": "You've successfully subscribed to",
13 |   "A collection of posts": "A collection of posts",
14 |   "A collection of 1 post": "A collection of 1 post",
15 |   "A collection of % posts": "A collection of % posts",
16 |   "Comments": "Comments",
17 |   "Get the latest posts delivered right to your inbox": "Get the latest posts delivered right to your inbox",
18 |   "Latest Posts": "Latest Posts",
19 |   "<a href='{url}'>More posts</a> by {name}": "<a href='{url}'>More posts</a> by {name}",
20 |   "No posts": "No posts",
21 |   " (Page %)": " (Page %)",
22 |   "Read More": "Read More",
23 |   "Read <a href='{url}'>more posts</a> by this author": "Read <a href='{url}'>more posts</a> by this author",
24 |   "See all % posts": "See all % posts",
25 |   "Continue reading": "Continue reading",
26 |   "Share this": "Share this",
27 |   "Stay up to date! Get all the latest & greatest posts delivered straight to your inbox": "Stay up to date! Get all the latest & greatest posts delivered straight to your inbox",
28 |   "This post was a collaboration between": "This post was a collaboration between",
29 |   "youremail@example.com": "youremail@example.com",
30 |   "1 post": "1 post",
31 |   "% posts": "% posts",
32 |   "1 min read": "1 min read",
33 |   "% min read": "% min read",
34 |   "By": "By",
35 |   "Type to search...": "Type to search...",
36 |   "Subscribe to the best creative feed.": "Subscribe to the best creative feed.",
37 |   "in": "in",
38 |   "Author": "Author",
39 |   "follow me": "follow me",
40 |   "All Rights Reserved.": "All Rights Reserved.",
41 |   "Design with": "Design with",
42 |   "Page not found...": "Page not found...",
43 |   "Sorry, but the page you are looking for is not found. Please, make sure you have typed the current URL.": "Sorry, but the page you are looking for is not found. Please, make sure you have typed the current URL.",
44 |   "go to home": "go to home"
45 | }
46 | 


--------------------------------------------------------------------------------
/locales/es.json:
--------------------------------------------------------------------------------
 1 | {
 2 |   "Back": "Volver",
 3 |   "Newer Posts": "Artículos Siguientes",
 4 |   "Older Posts": "Artículos Anteriores",
 5 |   "Page {page} of {pages}": "Página {page} de {pages}",
 6 |   "Account": "Cuenta",
 7 |   "Subscribe": "Suscríbete",
 8 |   "Subscribe to {blogtitle}": "Suscríbete a {blogtitle}",
 9 |   "Subscribed!": "¡Suscrito!",
10 |   "with the email address": "con el correo electrónico",
11 |   "Your email address": "Tu correo electrónico",
12 |   "You've successfully subscribed to": "Te has suscrito con éxito a",
13 |   "A collection of posts": "Una colección de artículos",
14 |   "A collection of 1 post": "Una colección de 1 artículo",
15 |   "A collection of % posts": "Una colección de % artículos",
16 |   "Comments": "Comentarios",
17 |   "Get the latest posts delivered right to your inbox": "Recibe los últimos artículos directamente en tu buzón",
18 |   "Latest Posts": "Últimos Artículos",
19 |   "<a href='{url}'>More posts</a> by {name}": "<a href='{url}'>Más artículos</a> de {name}",
20 |   "No posts": "No hay artículos",
21 |   " (Page %)": " (Página %)",
22 |   "Read More": "Lee Más",
23 |   "Read <a href='{url}'>more posts</a> by this author": "Lee <a href='{url}'>más artículos</a> de este autor",
24 |   "See all % posts": "Ver todos los % artículos",
25 |   "Continue reading": "Seguir leyendo",
26 |   "Share this": "Comparte",
27 |   "Stay up to date! Get all the latest & greatest posts delivered straight to your inbox": "¡Mantente al día! Recibe todos los últimos y mejores artículos directamente en tu buzón",
28 |   "This post was a collaboration between": "Este artículo fue una colaboración entre",
29 |   "youremail@example.com": "tucorreo@ejemplo.com",
30 |   "1 post": "1 artículo",
31 |   "% posts": "% artículos",
32 |   "1 min read": "1 min de lectura",
33 |   "% min read": "% min de lectura",
34 |   "< 1 min read": "< 1 min de lectura",
35 |   "By": "Por",
36 |   "Type to search...": "Escriba para buscar....",
37 |   "Subscribe to the best creative feed.": "Suscríbete al mejor contenido creativo.",
38 |   "in": "en",
39 |   "Author": "Autor",
40 |   "follow me": "sígueme",
41 |   "All Rights Reserved.": "Todos los derechos reservados.",
42 |   "Design with":"Diseñado con",
43 |   "Page not found...": "Página no encontrada....",
44 |   "Sorry, but the page you are looking for is not found. Please, make sure you have typed the current URL.": "Lo sentimos, pero la página que está buscando no se encuentra. Por favor, asegúrese de haber escrito la URL actual.",
45 |   "go to home": "volver al inicio"
46 | }
47 | 


--------------------------------------------------------------------------------
/locales/tr.json:
--------------------------------------------------------------------------------
 1 | {
 2 |   "Back": "Geri",
 3 |   "Newer Posts": "Yeni Gönderiler",
 4 |   "Older Posts": "Eski Gönderiler",
 5 |   "Page {page} of {pages}": "{page} sayfada {pages} sayfadasınız",
 6 |   "Subscribe": "Abone Ol",
 7 |   "Subscribe to {blogtitle}": "{blogtitle} sitesine Abone Ol",
 8 |   "Subscribed!": "Abone Olundu!!",
 9 |   "with the email address": "e-posta adresi ile",
10 |   "Your email address": "E-Posta adresiniz",
11 |   "You've successfully subscribed to": "Başarıyla abone oldunuz",
12 |   "A collection of posts": "Gönderi koleksiyonu",
13 |   "A collection of 1 post": "1 gönderi koleksiyonu",
14 |   "A collection of % posts": "% gönderi koleksiyonu",
15 |   "Get the latest posts delivered right to your inbox": "Son gönderileri gelen kutunuza alın",
16 |   "Latest Posts": "Son Gönderiler",
17 |   "<a href='{url}'>More posts</a> by {name}": "{name} tarafından yazılmış <a href='{url}'>daha fazla gönderi</a>",
18 |   "No posts": "Gönderi yok",
19 |   " (Page %)": " (Sayfa %)",
20 |   "Read More": "Daha Fazla Gönderi",
21 |   "Read <a href='{url}'>more posts</a> by this author": "Bu yazardan <a href='{url}'>daha fazla gönderi</a> oku",
22 |   "See all % posts": "% gönderinin tümünü gör",
23 |   "Share this": "Bunu paylaş",
24 |   "Stay up to date! Get all the latest & greatest posts delivered straight to your inbox": "Güncel kalın! Tüm yeni ve güncel gönderileri gelen kutunuza alın",
25 |   "This post was a collaboration between": "Bu gönderi işbirliği ile hazırlandı",
26 |   "youremail@example.com": "sizinpostaniz@ornek.com",
27 |   "1 post": "1 gönderi",
28 |   "% posts": "% gönderi",
29 |   "1 min read": "1 dakikada okunur",
30 |   "% min read": "% dakikada okunur",
31 |   "By": "By",
32 |   "Type to search...": "Aramak için yazın...",
33 |   "Subscribe to the best creative feed.": "En yaratıcı akışa abone olun.",
34 |   "in": "içinde",
35 |   "Author": "Yazar",
36 |   "follow me": "takip et",
37 |   "All Rights Reserved.": "Tüm Hakları Saklıdır.",
38 |   "Design with": "Tasarlayan: ",
39 |   "Page not found...": "Sayfa bulunamadı...",
40 |   "Sorry, but the page you are looking for is not found. Please, make sure you have typed the current URL.": "Üzgünüz, aradığınız sayda bulunamadı. Lütfen bağlatıyı doğru yazdığınızdan emin olun.",
41 |   "go to home": "anasayfaya dön"
42 | }
43 | 


--------------------------------------------------------------------------------
/package.json:
--------------------------------------------------------------------------------
  1 | {
  2 |   "name": "paway",
  3 |   "description": "For fancy people, Photographers and Travel Lovers",
  4 |   "demo": "https://godofredo.ninja",
  5 |   "version": "0.0.4",
  6 |   "engines": {
  7 |     "ghost": ">=5.0.0"
  8 |   },
  9 |   "license": "GPLv3",
 10 |   "screenshots": {
 11 |     "desktop": "assets/images/screenshot-desktop.jpg",
 12 |     "mobile": "assets/images/screenshot-mobile.jpg"
 13 |   },
 14 |   "author": {
 15 |     "name": "GodoFredo",
 16 |     "email": "hello@godofredo.ninja",
 17 |     "url": "https://godofredo.ninja"
 18 |   },
 19 |   "gpm": {
 20 |     "type": "theme",
 21 |     "categories": [
 22 |       "Minimal",
 23 |       "Blog",
 24 |       "Magazine",
 25 |       "photographer",
 26 |       "travel"
 27 |     ]
 28 |   },
 29 |   "keywords": [
 30 |     "ghost",
 31 |     "theme",
 32 |     "photographer",
 33 |     "godofredo",
 34 |     "ghost-theme"
 35 |   ],
 36 |   "repository": {
 37 |     "type": "git",
 38 |     "url": "https://github.com/godofredoninja/Paway.git"
 39 |   },
 40 |   "bugs": "https://github.com/godofredoninja/Paway/issues",
 41 |   "config": {
 42 |     "posts_per_page": 12,
 43 |     "image_sizes": {
 44 |       "xxs": {
 45 |         "width": 30
 46 |       },
 47 |       "xs": {
 48 |         "width": 100
 49 |       },
 50 |       "s": {
 51 |         "width": 300
 52 |       },
 53 |       "m": {
 54 |         "width": 600
 55 |       },
 56 |       "l": {
 57 |         "width": 1000
 58 |       },
 59 |       "xl": {
 60 |         "width": 2000
 61 |       }
 62 |     },
 63 |     "card_assets": {
 64 |       "exclude": [
 65 |         "bookmark",
 66 |         "blockquote"
 67 |       ]
 68 |     },
 69 |     "custom": {
 70 |       "instagram_url": {
 71 |         "type": "text"
 72 |       },
 73 |       "youtube_url": {
 74 |         "type": "text"
 75 |       },
 76 |       "publication_cover": {
 77 |         "type": "select",
 78 |         "options": [
 79 |           "None",
 80 |           "Featured"
 81 |         ],
 82 |         "default": "Featured",
 83 |         "group": "homepage"
 84 |       },
 85 |       "title_font": {
 86 |         "type": "select",
 87 |         "options": [
 88 |             "Modern sans-serif",
 89 |             "Playfair Display"
 90 |         ],
 91 |         "default": "Modern sans-serif"
 92 |       }
 93 |     }
 94 |   },
 95 |   "browserslist": [
 96 |     "defaults"
 97 |   ],
 98 |   "cssnano": {
 99 |     "preset": [
100 |       "advanced",
101 |       {
102 |         "reduceIdents": false
103 |       }
104 |     ]
105 |   },
106 |   "scripts": {
107 |     "build": "gulp build",
108 |     "prod": "cross-env NODE_ENV=production gulp production --production",
109 |     "dev": "gulp development",
110 |     "lint:js": "standard src/js/**/*.js gulpfile.js",
111 |     "lint:css": "stylelint src/css/**/*.css",
112 |     "lint": "yarn lint:js && yarn lint:css",
113 |     "test": "yarn lint && gscan .",
114 |     "scan": "gscan ."
115 |   },
116 |   "devDependencies": {
117 |     "@babel/core": "^7.18.10",
118 |     "@babel/plugin-transform-runtime": "^7.18.10",
119 |     "@babel/preset-env": "^7.18.10",
120 |     "@babel/runtime": "^7.18.9",
121 |     "@tailwindcss/line-clamp": "^0.4.0",
122 |     "@tailwindcss/typography": "^0.5.4",
123 |     "autoprefixer": "^10.4.8",
124 |     "babelify": "^10.0.0",
125 |     "beeper": "^2.1.0",
126 |     "browserify": "^17.0.0",
127 |     "cross-env": "^7.0.3",
128 |     "cssnano": "^5.1.12",
129 |     "cssnano-preset-advanced": "^5.3.8",
130 |     "del": "^6.1.1",
131 |     "gscan": "^4.34.0",
132 |     "gulp": "^4.0.2",
133 |     "gulp-header": "^2.0.9",
134 |     "gulp-if": "^3.0.0",
135 |     "gulp-livereload": "^4.0.2",
136 |     "gulp-postcss": "^9.0.1",
137 |     "gulp-rename": "^2.0.0",
138 |     "gulp-replace": "^1.1.3",
139 |     "gulp-sourcemaps": "^3.0.0",
140 |     "gulp-strip-comments": "^2.5.2",
141 |     "gulp-uglify": "^3.0.2",
142 |     "gulp-zip": "^5.1.0",
143 |     "merge-stream": "^2.0.0",
144 |     "postcss": "^8.4.16",
145 |     "postcss-discard-comments": "^5.1.2",
146 |     "postcss-extend": "^1.0.5",
147 |     "postcss-import": "^14.1.0",
148 |     "postcss-nested": "^5.0.6",
149 |     "precss": "^4.0.0",
150 |     "pump": "^3.0.0",
151 |     "standard": "^17.0.0",
152 |     "stylelint": "^14.9.1",
153 |     "stylelint-config-recommended": "^8.0.0",
154 |     "vinyl-buffer": "^1.0.1",
155 |     "vinyl-source-stream": "^2.0.0"
156 |   },
157 |   "dependencies": {
158 |     "lazysizes": "^5.3.2",
159 |     "normalize.css": "^8.0.1",
160 |     "tailwindcss": "^3.1.8"
161 |   }
162 | }
163 | 


--------------------------------------------------------------------------------
/page.hbs:
--------------------------------------------------------------------------------
 1 | {{!< default}}
 2 | {{!-- The tag above means: insert everything in this file
 3 | into the {body} of the default.hbs template --}}
 4 | {{#post}}
 5 | 
 6 | <article class="page relative pb-vmin8">
 7 |     <header class="page-header relative flex items-center justify-center {{#unless feature_image}}text-title pt-vmin8{{else}}text-white h-96{{/unless}}">
 8 |         {{#if feature_image}}
 9 |         <img class="post-img inset-image brightness-75"
10 |             srcset="{{img_url feature_image size="s"}} 300w,
11 |                     {{img_url feature_image size="m"}} 600w,
12 |                     {{img_url feature_image size="l"}} 1000w,
13 |                     {{img_url feature_image size="xl"}} 2000w"
14 |             sizes="(max-width: 800px) 400px,
15 |                     (max-width: 1170px) 700px,
16 |                     1400px"
17 |             src="{{img_url feature_image size="xl"}}"
18 |             alt="{{#if feature_image_alt}}{{feature_image_alt}}{{else}}{{title}}{{/if}}"
19 |         />
20 |         {{/if}}
21 | 
22 |         <h1 class="page-title text-44 relative z-3 max-w-3xl mx-4">{{title}}</h1>
23 |     </header>
24 | 
25 |     <div class="post-body godo-canvas font-serif">
26 |         {{content}}
27 |     </div>
28 | </article>
29 | 
30 | {{/post}}
31 | 


--------------------------------------------------------------------------------
/partials/amp/amp-body.hbs:
--------------------------------------------------------------------------------
 1 | <article class="article pt-8">
 2 |     <header class="article-header container">
 3 |         {{#if primary_tag}}{{#primary_tag}}
 4 |             <div class="categories mb-3 tracking-wider text-sm font-medium"><a href="{{url}}" title="{{name}}" class="uppercase text-gray-500">{{name}}</a></div>
 5 |         {{/primary_tag}}{{/if}}
 6 | 
 7 |         <h1 class="article-title m-0 mb-5">{{title}}</h1>
 8 |         {{#if custom_excerpt}}<p class="article-excerpt text-gray-500 text-lg m-0 mb-5">{{custom_excerpt}}</p>{{/if}}
 9 | 
10 |         <div class="flex items-center overflow-hidden">
11 |             {{#primary_author}}
12 |             <div class="flex-none mr-3">
13 |                 <a href="{{url}}" title="{{t "Go to the profile of"}} {{name}}">
14 |                     <amp-img class="object-cover rounded-full"
15 |                         src="{{#if profile_image}} {{img_url profile_image absolute="true" size="xs"}} {{else}} {{asset "images/avatar.png" absolute="true"}} {{/if}}"
16 |                         width="36"
17 |                         height="36"
18 |                         alt="{{name}}">
19 |                     </amp-img>
20 |                 </a>
21 |             </div>
22 | 
23 |             <div class="flex-auto">
24 |                 <div class="text-sm font-medium"><a href="{{url}}" class="text-gray-800">{{name}}</a></div>
25 |             {{/primary_author}}
26 |                 <div class="flex items-center text-gray-500 text-sm">
27 |                     <time class="capitalize" datetime="{{date format="YYYY-MM-DD"}}">{{date format="D MMM YYYY"}}</time>
28 |                     <span class="mx-1">·</span>
29 |                     <span title="{{reading_time seconds=(t "< 1 min read") minute=(t "1 min read") minutes=(t "% min read")}}">{{reading_time seconds=(t "< 1 min read") minute=(t "1 min read") minutes=(t "% min read")}}</span>
30 |                 </div>
31 |             </div>
32 |         </div>
33 |     </header>
34 | 
35 |     {{#if feature_image}}
36 |     <figure class="article-image pt-8">
37 |         <amp-img src="{{img_url feature_image size="m" absolute="true"}}" width="600" height="350" layout="responsive" alt="{{title}}"></amp-img>
38 |     </figure>
39 |     {{/if}}
40 | 
41 |     {{!-- article body (all content) --}}
42 |     <div class="article-body container"> {{amp_content}} </div>
43 | 
44 |     {{!-- Post All Tags (category) --}}
45 |     {{#if tags}}
46 |     <div class="article-tags container mt-8">
47 |         {{#foreach tags}}<a href="{{url absolute="true"}}" title="{{name}}" class="button-tags capitalize font-medium text-sm">{{name}}</a>{{/foreach}}
48 |     </div>
49 |     {{/if}}
50 | 
51 |     {{!-- Share social Media --}}
52 |     <footer class="share container mt-8">
53 |         <div class="share-title block text-gray-500 text-sm mb-3">{{t "Share"}}:</div>
54 |         <amp-social-share class="rounded"
55 |         type="email"
56 |         width="36"
57 |         height="36"></amp-social-share>
58 |         <amp-social-share class="rounded"
59 |         type="facebook"
60 |         data-param-app_id="254325784911610"
61 |         width="36"
62 |         height="36"></amp-social-share>
63 |         <amp-social-share class="rounded"
64 |         type="twitter"
65 |         width="36"
66 |         height="36"></amp-social-share>
67 |         <amp-social-share class="rounded"
68 |         type="linkedin"
69 |         width="36"
70 |         height="36"></amp-social-share>
71 |         <amp-social-share class="rounded"
72 |         type="whatsapp"
73 |         width="36"
74 |         height="36"></amp-social-share>
75 |     </footer>
76 | 
77 | </article>
78 | 


--------------------------------------------------------------------------------
/partials/amp/amp-header.hbs:
--------------------------------------------------------------------------------
 1 | <header class="header h-16 flex items-center container justify-between">
 2 |     {{!--
 3 |         - Active Logo in AMP Page
 4 |         - uncomment the lines below.
 5 |         - but in the width and height properties (width="110" height="30")
 6 |         - you have to add exact sizes of your reduced logo
 7 |         - so you do not have problems with amp
 8 | 
 9 |         - then comment page name
10 |     --}}
11 | 
12 |     {{!-- <a href="{{@site.url}}">
13 |         <amp-img src="{{@site.logo}}" width="110" height="30" alt="{{@site.title}}"></amp-img>
14 |     </a> --}}
15 | 
16 |     <a href="{{@site.url}}" class="logo-link">
17 |         {{#if @site.icon}}
18 |             <amp-img class="site-icon" src="{{img_url @site.icon size="s" absolute="true"}}" width="35" height="35" layout="fixed" alt="{{@site.title}}"></amp-img>
19 |         {{else}}
20 |             {{@site.title}}
21 |         {{/if}}
22 |     </a>
23 | 
24 |     {{!-- Open Sidenav --}}
25 |     <button class="hamburgermenu text-gray-500" on="tap:sidenav.open" tabindex="0" aria-label="Toggle Menu"><span></span><span></span><span></span></button>
26 | </header>


--------------------------------------------------------------------------------
/partials/amp/amp-related.hbs:
--------------------------------------------------------------------------------
 1 | {{#if primary_tag}}
 2 | {{#get "posts" filter="tags:{{primary_tag.slug}}+id:-{{comment_id}}" limit="4" as |related_posts|}}
 3 | {{#if related_posts}}
 4 |     <div class="related container mt-8">
 5 |         <div class="share-title block text-gray-500 text-sm mb-3">{{t "Related Articles"}}:</div>
 6 | 
 7 |         {{#foreach related_posts}}
 8 |         <div class="story">
 9 |             <a href="{{url absolute="true"}}amp/" class="story-link relative flex items-center mb-3">
10 |                 <span class="story-link-icon felx items-center flex-none mr-3">{{@number}}</span>
11 |                 <span class="story-link-text leading-snug">{{title}}</span>
12 |             </a>
13 |         </div>
14 |         {{/foreach}}
15 | 
16 |     </div>
17 | {{/if}}{{/get}}{{/if}}


--------------------------------------------------------------------------------
/partials/amp/amp-sidebar.hbs:
--------------------------------------------------------------------------------
 1 | <amp-sidebar id="sidenav" class="sidebar flex flex-col" layout="nodisplay" side="right">
 2 |     <div class="sidebar-header h-16 flex justify-between items-center px-4 text-gray-500">
 3 |         <div class="text-lg">{{t "Menu"}}</div>
 4 |         <div class="close-sidebar" role="button" aria-label="close sidebar" on="tap:sidenav.close" tabindex="0">✕</div>
 5 |     </div>
 6 | 
 7 |     {{!-- Navigation --}}
 8 |     <div class="flex-auto">
 9 |         {{#if @site.navigation}}{{navigation navigationMobile=true}}{{/if}}
10 |     </div>
11 | 
12 |     {{!-- Social media --}}
13 |     <div class="social-media px-4">
14 |         {{#if @site.facebook}}
15 |             <a href="{{facebook_url}}" target="_blank" rel="noopener noreferrer">{{> "amp/icon-facebook"}}</a>
16 |         {{/if}}
17 | 
18 |         {{#if @site.twitter}}
19 |             <a href="{{twitter_url}}" target="_blank" rel="noopener noreferrer">{{> "amp/icon-twitter"}}</a>
20 |         {{/if}}
21 | 
22 |         {{!-- Instagram --}}
23 |         {{!-- <a href="" target="_blank" rel="noopener noreferrer">{{> "amp/icon-instagram"}}</a> --}}
24 | 
25 |         {{!-- Youtube  --}}
26 |         {{!-- <a href="" target="_blank" rel="noopener noreferrer">{{> "amp/icon-youtube"}}</a> --}}
27 | 
28 |         {{!-- Telegram --}}
29 |         {{!-- <a href="" target="_blank" rel="noopener noreferrer">{{> "amp/icon-telegram"}}</a> --}}
30 | 
31 |         {{!-- SnapChap  --}}
32 |         {{!-- <a href="" target="_blank" rel="noopener noreferrer">{{> "amp/icon-snapchap"}}</a> --}}
33 |     </div>
34 | 
35 | </amp-sidebar>
36 | 


--------------------------------------------------------------------------------
/partials/amp/amp-styles.hbs:
--------------------------------------------------------------------------------
1 | html{-webkit-text-size-adjust:100%;line-height:1.15}body{margin:0}main{display:block}h1{font-size:2em;margin:.67em 0}pre{font-family:monospace,monospace;font-size:1em}a{background-color:transparent}abbr[title]{border-bottom:none;text-decoration:underline;-webkit-text-decoration:underline dotted;text-decoration:underline dotted}b,strong{font-weight:bolder}code,kbd,samp{font-family:monospace,monospace;font-size:1em}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-.25em}sup{top:-.5em}img{border-style:none}button,input,optgroup,select,textarea{font-family:inherit;font-size:100%;line-height:1.15;margin:0}button,input{overflow:visible}button,select{text-transform:none}[type=button],[type=reset],[type=submit],button{-webkit-appearance:button}[type=button]::-moz-focus-inner,[type=reset]::-moz-focus-inner,[type=submit]::-moz-focus-inner,button::-moz-focus-inner{border-style:none;padding:0}[type=button]:-moz-focusring,[type=reset]:-moz-focusring,[type=submit]:-moz-focusring,button:-moz-focusring{outline:1px dotted ButtonText}fieldset{padding:.35em .75em .625em}legend{box-sizing:border-box;color:inherit;display:table;max-width:100%;padding:0;white-space:normal}progress{vertical-align:baseline}textarea{overflow:auto}[type=checkbox],[type=radio]{box-sizing:border-box;padding:0}[type=number]::-webkit-inner-spin-button,[type=number]::-webkit-outer-spin-button{height:auto}[type=search]{-webkit-appearance:textfield;outline-offset:-2px}[type=search]::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit}details{display:block}summary{display:list-item}[hidden],template{display:none}.container{margin-left:auto;margin-right:auto;padding-left:1rem;padding-right:1rem}.text-gray-800{color:#292929}.text-white{color:#fff}.text-gray-500{color:#757575}.block{display:block}.uppercase{text-transform:uppercase}.capitalize{text-transform:capitalize}.tracking-wider{letter-spacing:.05em}.leading-snug{line-height:1.375}.text-sm{font-size:.875rem}.text-lg{font-size:1.25rem}.text-center{text-align:center}.font-medium{font-weight:500}.h-16{height:4rem}.m-0{margin:0}.mt-8{margin-top:2rem}.mr-3{margin-right:.75rem}.mb-3{margin-bottom:.75rem}.mb-5{margin-bottom:1.25rem}.mx-1{margin-left:.25rem;margin-right:.25rem}.pt-8{padding-top:2rem}.pb-8{padding-bottom:2rem}.px-4{padding-left:1rem;padding-right:1rem}.rounded-full{border-radius:9999px}.overflow-hidden{overflow:hidden}.flex{display:flex}.flex-none{flex:none}.flex-auto{flex:1 1 auto}.flex-col{flex-direction:column}.items-center{align-items:center}.justify-between{justify-content:space-between}.kg-bookmark-container,body,figcaption,h1,h2,h3,h4,h5,h6{font-family:Whitney SSm A,Whitney SSm B,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Open Sans,Helvetica Neue,sans-serif}*,:after,:before{box-sizing:border-box}body{text-rendering:optimizeLegibility;-webkit-text-size-adjust:100%;-moz-text-size-adjust:100%;text-size-adjust:100%;color:#292929;font-size:1rem;font-style:normal;font-weight:400;letter-spacing:0;line-height:1.5}a{color:var(--ghost-accent-color);text-decoration:none;word-break:break-word}a:active,a:hover{outline:0}blockquote{border-left:4px solid #292929;font-size:1.125rem;font-style:italic;margin-left:-5px;margin-right:0;padding-bottom:2px;padding-left:1.25rem}figure{margin:0;padding:0}img{-o-object-fit:cover;object-fit:cover;-o-object-position:center;object-position:center}figcaption{color:#757575;display:block;font-size:.875rem;font-style:normal;font-weight:400;margin-top:.75rem;text-align:center;width:100%}h1,h2,h3,h4,h5,h6{color:#18181b;font-style:normal;font-weight:700;line-height:1.25;margin:1.5rem 0 0;word-break:break-word}h1{font-size:2.25rem}h2{font-size:1.75rem}h3{font-size:1.5rem}h4{font-size:1.375rem}h5{font-size:1.25rem}h6{font-size:1.125rem}strong{font-weight:700}p{margin:1.25rem 0 0}hr{border:0;border-top:1px solid #e2ecec;box-sizing:content-box;height:0;margin:1rem 0;overflow:visible}mark{background-color:transparent;background-image:linear-gradient(180deg,#d7fdd3,#d7fdd3);color:rgba(0,0,0,.8)}code,pre{word-wrap:normal;font-family:Menlo,Courier,monospace;-webkit-hyphens:none;hyphens:none;-moz-tab-size:4;-o-tab-size:4;tab-size:4;white-space:pre;word-break:normal;word-spacing:normal}:not(pre)>code{background:#e5eff5;border-radius:2px;color:#2a3644;font-size:1rem;padding:1px 6px}pre{background:#2a3644;border:0;border-radius:8px;color:#e5eff5;font-size:.875rem;line-height:1.6em;margin:0;overflow-x:auto;padding:1.25rem}pre code{background:transparent;padding:0}svg{height:100%;width:100%}svg:not(:root){overflow:hidden}table{-webkit-overflow-scrolling:touch;border-collapse:collapse;border-spacing:0;display:inline-block;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Helvetica,Arial,sans-serif,Apple Color Emoji,Segoe UI Emoji,Segoe UI Symbol;font-size:1rem;line-height:1.5;margin:1.25rem 0 0;max-width:100%;overflow-x:auto;vertical-align:top;white-space:nowrap;width:auto}table td,table th{border:1px solid #dfe2e5;padding:.5rem .875rem}table tr:nth-child(2n){background-color:#f6f8fa}table th{font-weight:500;letter-spacing:.2px;text-transform:uppercase}.header{box-shadow:0 0 3px rgba(0,0,0,.03),0 3px 46px rgba(0,0,0,.07)}.logo-link{color:#000;font-size:1.75rem;font-weight:700}.social-media a{display:inline-block;height:2.5rem;margin:.5rem 0;padding:.5rem;vertical-align:middle;width:2.5rem}.sidebar{background:#fff;width:18rem}.sidebar ul{list-style:none;list-style-image:none;margin:1.125rem 0 1.25rem;padding:0}.sidebar ul li a{color:#292929;display:block;font-size:1.125rem;font-weight:500;padding:.5rem 1.25rem}.close-sidebar{font-size:1.5rem;outline:none}.hamburgermenu{background-color:transparent;border:0;height:3rem;margin-right:-1rem;outline:none;padding:0;position:relative;transition:transform .4s;width:3rem}.hamburgermenu span{background-color:currentColor;display:block;height:2px;left:.875rem;margin-top:-1px;position:absolute;top:50%;width:1.25rem}.hamburgermenu span:first-child{transform:translateY(-6px)}.hamburgermenu span:last-child{transform:translateY(6px)}.main{margin:0 auto;max-width:42.5rem}.article-body{font-family:charter,Georgia,Cambria,Times New Roman,Times,serif;font-size:1.125rem;line-height:1.7em}.article-body>*{margin-bottom:1.5rem}.article-body a:not(.kg-bookmark-container){text-decoration:underline;word-break:break-word}.article-body ol,.article-body ul{padding-left:1.25rem}.article-body ol li,.article-body ul li{margin-bottom:5px}.button-tags{background-color:var(--ghost-accent-color);border:0;border-radius:1.5625rem;color:#fff;display:inline-block;margin:.3125rem;padding:.3125rem 1.25rem}amp-social-share.custom-style{background-color:teal;background-image:url(https://raw.githubusercontent.com/google/material-design-icons/master/social/1x_web/ic_share_white_48dp.png);background-position:50%;background-repeat:no-repeat;background-size:contain}amp-social-share.rounded{background-size:85%;border-radius:10%}.story-link-text{color:#18181b;font-size:1rem;font-weight:700}.story-link-icon{background-color:var(--ghost-accent-color);color:#fff;font-size:1.5rem;font-weight:500;height:2.5rem;text-align:center;width:2.5rem}.kg-bookmark-container{border:1px solid rgba(0,0,0,.1);display:flex;flex-direction:column}.kg-bookmark-content{order:1;padding:1.25rem}.kg-bookmark-title{font-size:1.125rem;font-weight:500;line-height:1.2}.kg-bookmark-description{color:#757575;font-size:.875rem;line-height:1.4;margin-top:.75rem}.kg-bookmark-metadata{align-items:center;display:flex;font-size:.875rem;margin-top:.75rem}.kg-bookmark-icon{margin-right:5px}.kg-bookmark-author:after{content:"•";margin:0 6px}.kg-bookmark-publisher{color:inherit}.kg-embed-card{align-items:center;display:flex;flex-direction:column;width:100%}.kg-image-card img{margin:auto}.kg-gallery-card+.kg-gallery-card{margin-top:.75em}.kg-gallery-container{position:relative}.kg-gallery-row{display:flex;flex-direction:row;justify-content:center}.kg-gallery-image{height:100%;width:100%}.kg-gallery-row:not(:first-of-type){margin:.75em 0 0}.kg-gallery-image:not(:first-of-type){margin:0 0 0 .75em}.kg-toggle-card-icon{display:none}.kg-toggle-content{margin-top:.8rem}.kg-product-card-container{background:transparent;border-radius:5px;box-shadow:inset 0 0 0 1px rgba(124,139,154,.25);padding:20px;width:100%}.kg-product-card-description p{margin-top:1.5em}.kg-product-card-description ul{margin-left:24px}.kg-product-card-title{font-size:1.9rem;font-weight:700}.kg-product-card-rating-star{height:28px;margin-right:2px;width:20px}.kg-product-card-rating-star svg{fill:currentColor;height:16px;opacity:.15;width:16px}.kg-product-card-rating-active.kg-product-card-rating-star svg{opacity:1}.kg-nft-card-container{background:#fff;border-radius:5px;box-shadow:0 2px 6px -2px rgba(0,0,0,.1),0 0 1px rgba(0,0,0,.4);color:#15212a;display:flex;flex:auto;flex-direction:column;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Open Sans,Helvetica Neue,sans-serif;font-size:1.4rem;font-weight:400;margin:0 auto;max-width:512px;position:relative;text-decoration:none;transition:none;width:100%}.kg-nft-metadata{padding:2rem}.kg-nft-image-container{position:relative}.kg-nft-image{border-radius:5px 5px 0 0;display:flex}.kg-nft-header{grid-gap:20px;align-items:flex-start;display:flex;gap:20px;justify-content:space-between}.kg-nft-header h4.kg-nft-title{color:#15212a;font-size:1.9rem;font-weight:700;margin:0}.kg-nft-header amp-img{max-height:26px;max-width:114px}.kg-nft-opensea-logo{margin-top:2px;width:100px}.kg-nft-creator{color:#95a1ad;font-family:inherit}.kg-nft-creator span{color:#15212a;font-weight:500}.kg-nft-card p.kg-nft-description{color:#222;font-size:1.4rem;line-height:1.4em;margin:2rem 0 0}.kg-button-card{justify-content:center;width:100%}.kg-btn,.kg-button-card{align-items:center;display:flex;position:static}.kg-btn{border-radius:5px;font-size:1.65rem;font-weight:600;height:4rem;line-height:4rem;padding:0 2rem;text-decoration:none;transition:opacity .2s ease-in-out}.kg-btn:hover{opacity:.85}.kg-btn-accent{background-color:#1292ee;background-color:var(--ghost-accent-color,#1292ee);color:#fff}.kg-callout-card{border-radius:3px;display:flex;padding:20px 28px}.kg-callout-card-grey{background:rgba(124,139,154,.13)}.kg-callout-card-white{background:transparent;box-shadow:inset 0 0 0 1px rgba(124,139,154,.25)}.kg-callout-card-blue{background:rgba(33,172,232,.12)}.kg-callout-card-green{background:rgba(52,183,67,.12)}.kg-callout-card-yellow{background:rgba(240,165,15,.13)}.kg-callout-card-red{background:rgba(209,46,46,.11)}.kg-callout-card-pink{background:rgba(225,71,174,.11)}.kg-callout-card-purple{background:rgba(135,85,236,.12)}.kg-callout-card-accent{background:var(--ghost-accent-color);color:#fff}.kg-callout-card-accent a{color:#fff}.kg-callout-emoji{font-size:1.25em;line-height:1.3;padding-right:16px}.kg-header-card{align-items:center;display:flex;flex-direction:column;justify-content:center;padding:6em 3em;text-align:center}.kg-header-card.kg-size-small{padding-bottom:4em;padding-top:4em}.kg-header-card.kg-size-large{padding-bottom:12em;padding-top:12em}.kg-header-card.kg-width-full{padding-left:4em;padding-right:4em}.kg-header-card.kg-align-left{align-items:flex-start;text-align:left}.kg-header-card.kg-style-dark{background:#15171a;color:#fff}.kg-header-card.kg-style-light{border:1px solid rgba(124,139,154,.25);border-width:1px 0;color:#15171a}.kg-header-card.kg-style-accent{background-color:var(--ghost-accent-color)}.kg-header-card.kg-style-image{background-color:#e7e7eb;background-position:50%;background-size:cover}.kg-header-card h2{font-size:4em;font-weight:700;line-height:1.1em;margin:0}.kg-header-card h2 strong{font-weight:800}.kg-header-card.kg-size-small h2{font-size:3em}.kg-header-card.kg-size-large h2{font-size:5em}.kg-header-card h3{font-size:1.25em;font-weight:500;line-height:1.3em;margin:0}.kg-header-card h3 strong{font-weight:600}.kg-header-card.kg-size-small h3{font-size:1em}.kg-header-card.kg-size-large h3{font-size:1.5em}.kg-header-card:not(.kg-style-light) h2,.kg-header-card:not(.kg-style-light) h3{color:#fff}.kg-header-card a.kg-header-card-button{align-items:center;background-color:var(--ghost-accent-color);border-radius:5px;color:#fff;display:flex;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Fira Sans,Droid Sans,Helvetica Neue,sans-serif;font-size:.95em;font-weight:600;height:2.4em;line-height:1em;margin:1.75em 0 0;padding:0 1.2em;position:static;text-decoration:none;transition:opacity .2s ease-in-out}.kg-header-card a.kg-header-card-button:hover{opacity:.85}.kg-header-card.kg-size-large a.kg-header-card-button{margin-top:2em}.kg-header-card.kg-size-small a.kg-header-card-button{margin-top:1.5em}.kg-header-card.kg-style-dark a.kg-header-card-button,.kg-header-card.kg-style-image a.kg-header-card-button{background:#fff;color:#15171a}.kg-header-card.kg-style-accent a.kg-header-card-button{background:#fff;color:var(--ghost-accent-color)}.kg-audio-card{box-shadow:inset 0 0 0 1px rgba(124,139,154,.25);display:flex;width:100%}.kg-audio-thumbnail{align-items:center;aspect-ratio:1/1;background:transparent;border-radius:3px 0 0 3px;display:flex;height:80px;justify-content:center;min-width:80px;-o-object-fit:cover;object-fit:cover;width:80px}.kg-audio-thumbnail.placeholder{background:var(--ghost-accent-color)}.kg-audio-thumbnail.placeholder svg{fill:#fff;height:24px;width:24px}.kg-audio-player-container{--seek-before-width:0%;--volume-before-width:100%;--buffered-width:0%;display:flex;flex-direction:column;justify-content:space-between;position:relative;width:100%}.kg-audio-title{background:transparent;border:none;font-family:inherit;font-size:1.1em;font-weight:700;padding:8px 12px 0;width:100%}.kg-audio-player{display:none}.kg-width-full.kg-card-hascaption{display:grid;grid-template-columns:inherit}


--------------------------------------------------------------------------------
/partials/amp/icon-facebook.hbs:
--------------------------------------------------------------------------------
1 | <svg width="21" height="24" viewBox="0 0 21 24"><path d="M19.433 1.714c0.629 0 1.138 0.509 1.138 1.138v18.295c0 0.629-0.509 1.138-1.138 1.138h-5.237v-7.969h2.665l0.402-3.107h-3.067v-1.982c0-0.897 0.241-1.5 1.54-1.5l1.634-0.013v-2.772c-0.281-0.040-1.259-0.121-2.384-0.121-2.371 0-4.004 1.446-4.004 4.098v2.29h-2.679v3.107h2.679v7.969h-9.844c-0.629 0-1.138-0.509-1.138-1.138v-18.295c0-0.629 0.509-1.138 1.138-1.138h18.295z"></path></svg>
2 | 


--------------------------------------------------------------------------------
/partials/amp/icon-instagram.hbs:
--------------------------------------------------------------------------------
1 | <svg  width="21" height="24" viewBox="0 0 21 24"><path d="M13.714 12c0-1.888-1.54-3.429-3.429-3.429s-3.429 1.54-3.429 3.429 1.54 3.429 3.429 3.429 3.429-1.54 3.429-3.429zM15.563 12c0 2.92-2.357 5.277-5.277 5.277s-5.277-2.357-5.277-5.277 2.357-5.277 5.277-5.277 5.277 2.357 5.277 5.277zM17.009 6.509c0 0.683-0.549 1.232-1.232 1.232s-1.232-0.549-1.232-1.232 0.549-1.232 1.232-1.232 1.232 0.549 1.232 1.232zM10.286 3.563c-1.5 0-4.714-0.121-6.067 0.415-0.469 0.188-0.817 0.415-1.179 0.777s-0.589 0.71-0.777 1.179c-0.536 1.353-0.415 4.567-0.415 6.067s-0.121 4.714 0.415 6.067c0.188 0.469 0.415 0.817 0.777 1.179s0.71 0.589 1.179 0.777c1.353 0.536 4.567 0.415 6.067 0.415s4.714 0.121 6.067-0.415c0.469-0.188 0.817-0.415 1.179-0.777s0.589-0.71 0.777-1.179c0.536-1.353 0.415-4.567 0.415-6.067s0.121-4.714-0.415-6.067c-0.188-0.469-0.415-0.817-0.777-1.179s-0.71-0.589-1.179-0.777c-1.353-0.536-4.567-0.415-6.067-0.415zM20.571 12c0 1.42 0.013 2.826-0.067 4.246-0.080 1.647-0.455 3.107-1.661 4.313s-2.665 1.58-4.313 1.661c-1.42 0.080-2.826 0.067-4.246 0.067s-2.826 0.013-4.246-0.067c-1.647-0.080-3.107-0.455-4.313-1.661s-1.58-2.665-1.661-4.313c-0.080-1.42-0.067-2.826-0.067-4.246s-0.013-2.826 0.067-4.246c0.080-1.647 0.455-3.107 1.661-4.313s2.665-1.58 4.313-1.661c1.42-0.080 2.826-0.067 4.246-0.067s2.826-0.013 4.246 0.067c1.647 0.080 3.107 0.455 4.313 1.661s1.58 2.665 1.661 4.313c0.080 1.42 0.067 2.826 0.067 4.246z"></path></svg>
2 | 


--------------------------------------------------------------------------------
/partials/amp/icon-snapchap.hbs:
--------------------------------------------------------------------------------
1 | <svg width="22" height="24" viewBox="0 0 22 24"><path d="M11.357 1.714c2.411-0.027 4.406 1.326 5.411 3.496 0.308 0.656 0.362 1.674 0.362 2.397 0 0.857-0.067 1.701-0.121 2.558 0.107 0.054 0.254 0.094 0.375 0.094 0.482 0 0.884-0.362 1.366-0.362 0.455 0 1.112 0.321 1.112 0.857 0 1.286-2.692 1.045-2.692 2.17 0 0.201 0.080 0.388 0.161 0.576 0.643 1.406 1.862 2.759 3.308 3.362 0.348 0.147 0.696 0.228 1.071 0.308 0.241 0.054 0.375 0.228 0.375 0.469 0 0.911-2.317 1.286-2.933 1.379-0.268 0.415-0.067 1.393-0.777 1.393-0.549 0-1.098-0.174-1.688-0.174-0.281 0-0.563 0.013-0.83 0.067-1.594 0.268-2.129 1.982-4.741 1.982-2.518 0-3.121-1.714-4.674-1.982-0.281-0.054-0.563-0.067-0.844-0.067-0.603 0-1.179 0.201-1.661 0.201-0.75 0-0.522-0.991-0.804-1.42-0.616-0.094-2.933-0.469-2.933-1.379 0-0.241 0.134-0.415 0.375-0.469 0.375-0.080 0.723-0.161 1.071-0.308 1.433-0.589 2.679-1.955 3.308-3.362 0.080-0.188 0.161-0.375 0.161-0.576 0-1.125-2.705-0.911-2.705-2.156 0-0.522 0.616-0.857 1.085-0.857 0.415 0 0.83 0.348 1.353 0.348 0.147 0 0.295-0.027 0.429-0.094-0.054-0.844-0.121-1.688-0.121-2.545 0-0.723 0.054-1.754 0.362-2.411 1.179-2.545 3.174-3.469 5.839-3.496z"></path></svg>
2 | 


--------------------------------------------------------------------------------
/partials/amp/icon-telegram.hbs:
--------------------------------------------------------------------------------
1 | <svg width="24" height="24" viewBox="0 0 24 24"><path d="M15.924 17.504l1.969-9.281c0.174-0.817-0.295-1.138-0.83-0.938l-11.571 4.46c-0.79 0.308-0.777 0.75-0.134 0.951l2.96 0.924 6.871-4.326c0.321-0.214 0.616-0.094 0.375 0.121l-5.558 5.022-0.214 3.054c0.308 0 0.442-0.134 0.603-0.295l1.446-1.393 3 2.21c0.549 0.308 0.938 0.147 1.085-0.509zM24 12c0 6.629-5.371 12-12 12s-12-5.371-12-12 5.371-12 12-12 12 5.371 12 12z"></path></svg>
2 | 


--------------------------------------------------------------------------------
/partials/amp/icon-twitter.hbs:
--------------------------------------------------------------------------------
1 | <svg viewBox="0 0 18 18" width="100%" height="100%"><path d="M12.077 2c-1.812 0-3.282 1.582-3.282 3.534 0 .277.03.547.085.806-2.728-.148-5.147-1.555-6.766-3.693-.283.522-.445 1.13-.445 1.777 0 1.226.58 2.308 1.46 2.942-.54-.02-1.05-.178-1.49-.443v.045c0 1.712 1.13 3.14 2.63 3.465-.28.08-.57.124-.87.124-.21 0-.418-.022-.62-.063.418 1.404 1.63 2.426 3.067 2.455-1.125.94-2.54 1.51-4.078 1.51-.267 0-.528-.02-.785-.05 1.46 1 3.185 1.59 5.04 1.59 6.037 0 9.34-5.39 9.34-10.06 0-.153-.005-.306-.01-.457.64-.5 1.197-1.12 1.637-1.83-.59.28-1.22.47-1.885.557.677-.437 1.198-1.13 1.443-1.955-.633.405-1.336.7-2.084.858C13.88 2.43 13.028 2 12.08 2"></path></svg>
2 | 


--------------------------------------------------------------------------------
/partials/amp/icon-youtube.hbs:
--------------------------------------------------------------------------------
1 | <svg width="24" height="24" viewBox="0 0 24 24"><path d="M9.522 15.107l6.482-3.348-6.482-3.388v6.737zM12 3.563c5.049 0 8.397 0.241 8.397 0.241 0.469 0.054 1.5 0.054 2.411 1.018 0 0 0.737 0.723 0.951 2.384 0.254 1.942 0.241 3.884 0.241 3.884v1.821s0.013 1.942-0.241 3.884c-0.214 1.647-0.951 2.384-0.951 2.384-0.911 0.951-1.942 0.951-2.411 1.004 0 0-3.348 0.254-8.397 0.254v0c-6.241-0.054-8.156-0.241-8.156-0.241-0.536-0.094-1.741-0.067-2.652-1.018 0 0-0.737-0.737-0.951-2.384-0.254-1.942-0.241-3.884-0.241-3.884v-1.821s-0.013-1.942 0.241-3.884c0.214-1.661 0.951-2.384 0.951-2.384 0.911-0.964 1.942-0.964 2.411-1.018 0 0 3.348-0.241 8.397-0.241v0z"></path></svg>
2 | 


--------------------------------------------------------------------------------
/partials/article/article-author.hbs:
--------------------------------------------------------------------------------
 1 | {{#primary_author}}
 2 | <div class="post-author py-vmin8 text-center">
 3 |     {{!-- avatar --}}
 4 |     <img class="post-author-avatar inline-block mb-4 h-24 w-24 rounded-full"
 5 |         src="{{#if profile_image}}{{img_url profile_image size="s"}}{{else}}{{asset "images/avatar.png"}}{{/if}}"
 6 |         alt="{{t "Go to the profile of "}} {{name}}"/>
 7 |     {{!-- Name --}}
 8 |     <h2 class="post-author-name text-3xl">{{name}}</h2>
 9 |     {{!-- bio --}}
10 |     {{#if bio}}<p class="post-author-bio my-6">{{bio}}</p>{{/if}}
11 |     {{!-- Facebook - Twitter - Webpage --}}
12 |     {{#has any="twitter, facebook, website"}}
13 |     <div class="post-author-meta">
14 |         <ul class="uppercase text-xs space-x-2 font-medium tracking-wider">
15 |             <li class="inline-block text-gray-500">{{t "follow me"}}</li>
16 |             {{#if facebook}}<li class="inline-block"><a class="post-author-meta-link border-b border-gray-300" href="{{facebook_url}}" title="Facebook" target="_blank" rel="noopener noreferrer">Facebook</a></li>{{/if}}
17 |             {{#if twitter}}<li class="inline-block"><a class="post-author-meta-link border-b border-gray-300" href="{{twitter_url}}" title="Twitter" target="_blank" rel="noopener noreferrer">Twitter</a></li>{{/if}}
18 |             {{#if website}}<li class="inline-block"><a class="post-author-meta-link border-b border-gray-300" href="{{website}}" title="Website" target="_blank" rel="noopener noreferrer">Website</a></li>{{/if}}
19 |         </ul>
20 |     </div>
21 |     {{/has}}
22 | 
23 | </div>
24 | {{/primary_author}}
25 | 


--------------------------------------------------------------------------------
/partials/article/article-comments.hbs:
--------------------------------------------------------------------------------
1 | {{#if comments}}
2 |    <div class="container mx-auto max-w-4xl py-vmin8">
3 |         {{comments title=(t "Comments") mode="light"}}
4 |     </div>
5 | {{/if}}


--------------------------------------------------------------------------------
/partials/article/article-prev-next.hbs:
--------------------------------------------------------------------------------
 1 | <div class="prev-next-item relative overflow-hidden text-center flex items-center justify-center {{#if class}}{{class}}{{/if}}">
 2 |     <a class="prev-next-link flex-grow" href="{{url}}">
 3 |         {{#if feature_image}}
 4 |         <img class="story-img inset-image blur-up lazyload"
 5 |             src="data:image/gif;base64,R0lGODlhAQABAAAAACH5BAEKAAEALAAAAAABAAEAAAICTAEAOw=="
 6 |             data-srcset="{{img_url feature_image size="s"}} 300w,
 7 |                     {{img_url feature_image size="m"}} 600w,
 8 |                     {{img_url feature_image size="l"}} 1000w,
 9 |                     {{img_url feature_image size="xl"}} 2000w"
10 |             data-sizes="auto"
11 |             alt="{{#if feature_image_alt}}{{feature_image_alt}}{{else}}{{title}}{{/if}}"
12 |         />
13 |         {{/if}}
14 | 
15 |         <div class="prev-next-body relative z-3 text-white">
16 |             <span class="uppercase mb-4 text-sm tracking-wider font-bold leading-normal inline-block border-white border-b-3 border-opacity-25">{{mytitle}}</span>
17 |             <h2 class="prev-next-title text-3xl font-title md:text-4xl">{{title}}</h2>
18 |         </div>
19 |     </a>
20 | </div>


--------------------------------------------------------------------------------
/partials/article/article-related.hbs:
--------------------------------------------------------------------------------
1 | {{#get "posts" limit="3" filter="tags:[{{post.tags}}]+id:-{{post.id}}" include="tags,authors" as |post_related|}}
2 | <div class="post-related grid md:grid-cols-2 lg:grid-cols-3">
3 |     {{#foreach post_related}}
4 |         {{> "story/story"}}
5 |     {{/foreach}}
6 | </div>
7 | {{/get}}


--------------------------------------------------------------------------------
/partials/article/article-share.hbs:
--------------------------------------------------------------------------------
 1 | <aside class="post-share relative text-center overflow-hidden mt-12 mb-5">
 2 |     <div class="post-share-wrap inline-block relative space-x-2">
 3 |         <a href="https://www.facebook.com/sharer/sharer.php?u={{url absolute="true"}}"
 4 |             target="_blank"
 5 |             rel="noopener noreferrer"
 6 |             title="{{t "Share on"}} Facebook"
 7 |             class="js-share button is-circle text-sm is-outlined">
 8 |             <svg class="icon"><use xlink:href="#icon-facebook"></use></svg>
 9 |         </a>
10 |         <a href="https://twitter.com/share?text={{encode title}}&amp;url={{url absolute="true"}}"
11 |             target="_blank"
12 |             rel="noopener noreferrer"
13 |             title="{{t "Share on"}} Twitter"
14 |             class="js-share button is-circle text-sm is-outlined">
15 |             <svg class="icon"><use xlink:href="#icon-twitter"></use></svg>
16 |         </a>
17 |         <a href="https://www.reddit.com/submit?url={{url absolute="true"}}&amp;title={{encode title}}"
18 |             target="_blank"
19 |             rel="noopener noreferrer"
20 |             title="{{t "Share on"}} Reddit"
21 |             class="js-share button is-circle text-sm is-outlined">
22 |             <svg class="icon"><use xlink:href="#icon-reddit"></use></svg>
23 |         </a>
24 |         <a href="https://www.linkedin.com/shareArticle?mini=true&url={{url absolute="true"}}&amp;title={{encode title}}"
25 |             target="_blank"
26 |             rel="noopener noreferrer"
27 |             title="{{t "Share on"}} Linkeding"
28 |             class="js-share button is-circle text-sm is-outlined">
29 |             <svg class="icon"><use xlink:href="#icon-linkedin"></use></svg>
30 |         </a>
31 |     </div>
32 | </aside>
33 | 


--------------------------------------------------------------------------------
/partials/article/article-tags.hbs:
--------------------------------------------------------------------------------
1 | {{#if tags}}
2 | <div class="tags-links mt-10 uppercase mb-4 text-sm tracking-wider font-bold leading-normal space-x-3">
3 |     {{#foreach tags}}
4 |         <a href="{{url absolute="true"}}" title="{{name}}" class="inline-block hover:text-primary border-gray-300 border-b-3 border-opacity-25">{{name}}</a>
5 |     {{/foreach}}
6 | </div>
7 | {{/if}}
8 | 


--------------------------------------------------------------------------------
/partials/components/author-meta.hbs:
--------------------------------------------------------------------------------
 1 | <div class="story-meta italic font-serif {{#if class}}{{class}}{{else}}text-lg text-gray-500{{/if}}">
 2 |     <span class="posted-on">
 3 |         {{t "Posted on"}}
 4 |         <time class="datetime capitalize" datetime="{{date format="YYYY-MM-DD"}}">{{date format="MMMM D, YYYY"}}</time>
 5 |     </span>
 6 |     <span class="byline">
 7 |         {{#primary_author}}
 8 |         {{t "by"}}
 9 |         <a href="{{url}}" class="underline hover:no-underline {{#if classLink}}{{classLink}}{{else}}{{/if}}">{{name}}</a>
10 |         {{/primary_author}}
11 |     </span>
12 | </div>


--------------------------------------------------------------------------------
/partials/footer.hbs:
--------------------------------------------------------------------------------
 1 | <footer class="footer flex flex-col bg-black text-white text-opacity-60 text-center pt-8 lg:pt-vw4">
 2 |     <div class="container mx-auto">
 3 |         {{#if @site.members_enabled}}
 4 |         <div class="f-subscribe">
 5 |             <h2 class="italic font-serif font-normal text-4xl text-white">{{t "Subscribe to the best creative feed."}}</h2>
 6 |             <p class="mt-2 mb-8 text-sm">{{t "Stay up to date! Get all the latest & greatest posts delivered straight to your inbox"}}</p>
 7 | 
 8 |             <div class="max-w-xl mx-auto">
 9 |                 <a class="flex" href="#/portal" data-portal>
10 |                     <div class="input flex items-center px-4 flex-auto cursor-pointer">{{t "youremail@example.com"}}</div>
11 |                     <div class="button is-primary">
12 |                         <span>{{t "Subscribe"}}</span>
13 |                         <svg class="icon ml-2"><use xlink:href="#icon-send"></use></svg>
14 |                     </div>
15 |                 </a>
16 |             </div>
17 |         </div>
18 |         {{/if}}
19 | 
20 |         {{!-- Facebook & Twitter - partials/witget/witget-social-media.hbs --}}
21 |         {{> "widget/witget-social-media"}}
22 | 
23 |         <div class="copyright py-14 mt-16 text-sm">
24 |             &copy; {{date format="YYYY"}} {{@site.title}}.
25 |             Design by <a href="http://godofredo.ninja/about-me/" class="text-white hover:text-primary" title="Developer FullStack.">GodoFredo</a>
26 |         </div>
27 |     </div>
28 | </footer>


--------------------------------------------------------------------------------
/partials/header.hbs:
--------------------------------------------------------------------------------
 1 | <header class="header bg-white sticky top-0 z-10">
 2 |     <div class="header-wrap flex mx-4 h-20">
 3 |         {{!-- Logo --}}
 4 |         <div class="logo flex flex-grow items-center">
 5 |             {{#if @site.logo}}
 6 |                 <a class="logo-link-img h-8 md:h-10" href="{{@site.url}}"><img class="logo-img h-full" src="{{img_url @site.logo size="m"}}" alt="{{@site.title}}"/></a>
 7 |             {{else}}
 8 |                 <a class="logo-link" href="{{@site.url}}"><span class="logo-txt text-4xl font-bold text-black leading-none">{{@site.title}}</span></a>
 9 |             {{/if}}
10 |         </div>
11 | 
12 |         {{!-- navbar --}}
13 |         <nav class="navbar hidden justify-center items-center lg:flex">{{navigation}}</nav>
14 | 
15 |         <div class="header-right flex flex-grow justify-end">
16 |             {{!-- Facebook & Twitter - partials/witget/witget-social-media.hbs --}}
17 |             {{!-- {{> "widget/witget-social-media"}} --}}
18 | 
19 |             <ul class="flex items-center ml-3 space-x-5">
20 |                 {{!-- Toggle Search --}}
21 |                 <li class="search-toggle cursor-pointer" data-ghost-search><svg class="icon"><use xlink:href="#icon-search"></use></svg></li>
22 |                 {{#if @site.members_enabled}}
23 |                 <li>
24 |                     {{#unless @member}}
25 |                         <a class="button is-primary" href="#/portal/signup" data-portal="signup">{{t "Subscribe"}}</a>
26 |                     {{else}}
27 |                         <a class="button is-primary" href="#/portal/account" data-portal="account">{{t "Account"}}</a>
28 |                     {{/unless}}
29 |                 </li>
30 |                 {{/if}}
31 |                 {{!-- Toggle Menu --}}
32 |                 <li class="js-menu-toggle menu-toggle cursor-pointer"><svg class="icon is-stroke"><use xlink:href="#icon-menu"></use></svg></li>
33 |             </ul>
34 |         </div>
35 |     </div>
36 | </header>


--------------------------------------------------------------------------------
/partials/icons/icons.hbs:
--------------------------------------------------------------------------------
 1 | <svg aria-hidden="true" style="position: absolute; width: 0; height: 0; overflow: hidden;" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
 2 | <defs>
 3 | <symbol id="icon-arrow" viewBox="0 0 24 24">
 4 | <path stroke-linejoin="round" stroke-linecap="round" stroke-miterlimit="4" stroke-width="2.25" d="M5.25 11.438l6.75-6.75 6.75 6.75M12 5.625v13.688"></path>
 5 | </symbol>
 6 | <symbol id="icon-close" viewBox="0 0 24 24">
 7 | <path stroke-linejoin="round" stroke-linecap="round" stroke-miterlimit="4" stroke-width="1.5" d="M17.25 17.25l-10.5-10.5M17.25 6.75l-10.5 10.5"></path>
 8 | </symbol>
 9 | <symbol id="icon-menu" viewBox="0 0 24 24">
10 | <path stroke-linejoin="miter" stroke-linecap="round" stroke-miterlimit="10" stroke-width="1.5" d="M3.75 7.5h16.5M3.75 12h16.5M3.75 16.5h16.5"></path>
11 | </symbol>
12 | <symbol id="icon-search" viewBox="0 0 24 24">
13 | <path d="M21.407 19.753l-4.41-4.41c1.020-1.346 1.633-3.048 1.633-4.893 0-0.003 0-0.006 0-0.009v0c0-4.516-3.674-8.19-8.19-8.19s-8.19 3.674-8.19 8.19 3.674 8.19 8.19 8.19c0.003 0 0.006 0 0.009 0 1.845 0 3.548-0.614 4.914-1.648l-0.020 0.015 4.41 4.41c0.206 0.185 0.48 0.298 0.781 0.298 0.647 0 1.172-0.525 1.172-1.172 0-0.301-0.113-0.575-0.299-0.782l0.001 0.001zM4.59 10.44c0-3.231 2.619-5.85 5.85-5.85s5.85 2.619 5.85 5.85c0 3.231-2.619 5.85-5.85 5.85v0c-3.229-0.004-5.846-2.621-5.85-5.85v-0z"></path>
14 | </symbol>
15 | <symbol id="icon-linkedin" viewBox="0 0 24 24">
16 | <path d="M20.82 1.5h-17.526c-0.958 0-1.794 0.689-1.794 1.635v17.565c0 0.952 0.837 1.8 1.794 1.8h17.521c0.963 0 1.685-0.854 1.685-1.8v-17.565c0.006-0.946-0.722-1.635-1.68-1.635zM8.010 19.005h-3.008v-9.354h3.008zM6.609 8.228h-0.022c-0.963 0-1.586-0.717-1.586-1.614 0-0.914 0.64-1.613 1.624-1.613s1.587 0.695 1.608 1.613c-0 0.897-0.624 1.614-1.625 1.614zM19.005 19.005h-3.008v-5.115c0-1.225-0.438-2.063-1.526-2.063-0.832 0-1.324 0.563-1.543 1.11-0.082 0.197-0.104 0.465-0.104 0.739v5.328h-3.008v-9.354h3.008v1.302c0.438-0.623 1.122-1.521 2.713-1.521 1.975 0 3.469 1.302 3.469 4.108z"></path>
17 | </symbol>
18 | <symbol id="icon-youtube" viewBox="0 0 24 24">
19 | <path d="M23.843 6.975c0-2.109-1.552-3.806-3.469-3.806-2.597-0.121-5.245-0.168-7.952-0.168h-0.844c-2.7 0-5.353 0.047-7.95 0.169-1.912 0-3.464 1.706-3.464 3.816-0.117 1.668-0.167 3.337-0.164 5.006q-0.007 2.503 0.159 5.011c0 2.109 1.552 3.82 3.464 3.82 2.728 0.127 5.527 0.183 8.372 0.178q4.275 0.014 8.372-0.178c1.917 0 3.469-1.711 3.469-3.82 0.112-1.673 0.164-3.342 0.159-5.016q0.016-2.503-0.153-5.011zM9.703 16.589v-9.211l6.797 4.603z"></path>
20 | </symbol>
21 | <symbol id="icon-twitter" viewBox="0 0 24 24">
22 | <path d="M23.25 5.133c-0.772 0.345-1.667 0.597-2.605 0.713l-0.046 0.005c0.952-0.564 1.669-1.438 2.022-2.48l0.009-0.032c-0.845 0.503-1.828 0.885-2.874 1.092l-0.059 0.010c-0.848-0.887-2.041-1.439-3.362-1.439-0.003 0-0.006 0-0.009 0h0c-2.551 0-4.615 2.034-4.615 4.542-0 0.007-0 0.015-0 0.023 0 0.36 0.043 0.709 0.125 1.043l-0.006-0.030c-3.834-0.185-7.213-1.984-9.498-4.727l-0.017-0.021c-0.393 0.653-0.627 1.44-0.628 2.283v0c0 1.575 0.822 2.967 2.062 3.783-0.773-0.019-1.493-0.227-2.122-0.579l0.023 0.012v0.056c0 2.203 1.594 4.036 3.703 4.453-0.365 0.101-0.784 0.159-1.216 0.159h-0c-0.002 0-0.005 0-0.008 0-0.304 0-0.601-0.031-0.888-0.089l0.028 0.005c0.586 1.805 2.293 3.117 4.315 3.155-1.562 1.213-3.551 1.945-5.711 1.945-0.008 0-0.016 0-0.024-0h0.001c-0.389-0.001-0.771-0.024-1.147-0.070l0.046 0.005c1.989 1.288 4.42 2.053 7.030 2.053 0.012 0 0.025-0 0.037-0h-0.002c8.501 0 13.146-6.923 13.146-12.928 0-0.197-0.005-0.394-0.015-0.586 0.906-0.65 1.67-1.43 2.282-2.322l0.020-0.032z"></path>
23 | </symbol>
24 | <symbol id="icon-instagram" viewBox="0 0 24 24">
25 | <path d="M16.375 3.25c2.413 0.007 4.368 1.962 4.375 4.375v8.75c-0.007 2.413-1.962 4.368-4.375 4.375h-8.75c-2.413-0.007-4.368-1.962-4.375-4.375v-8.75c0.007-2.413 1.962-4.368 4.375-4.375h8.75zM16.375 1.5h-8.75c-3.369 0-6.125 2.756-6.125 6.125v8.75c0 3.369 2.756 6.125 6.125 6.125h8.75c3.369 0 6.125-2.756 6.125-6.125v-8.75c0-3.369-2.756-6.125-6.125-6.125z"></path>
26 | <path d="M17.687 7.625c-0.725 0-1.313-0.588-1.313-1.313s0.588-1.313 1.313-1.313c0.725 0 1.313 0.588 1.313 1.313v0c0 0.001 0 0.002 0 0.003 0 0.723-0.586 1.31-1.31 1.31-0.001 0-0.002 0-0.003 0h0zM12 8.5c1.933 0 3.5 1.567 3.5 3.5s-1.567 3.5-3.5 3.5c-1.933 0-3.5-1.567-3.5-3.5v0c0.002-1.932 1.568-3.498 3.5-3.5h0zM12 6.75c-2.899 0-5.25 2.351-5.25 5.25s2.351 5.25 5.25 5.25c2.899 0 5.25-2.351 5.25-5.25v0c0-2.899-2.351-5.25-5.25-5.25v0z"></path>
27 | </symbol>
28 | <symbol id="icon-facebook" viewBox="0 0 24 24">
29 | <path d="M22.5 12.063c0-5.798-4.702-10.5-10.5-10.5s-10.5 4.702-10.5 10.5c0 5.241 3.839 9.585 8.859 10.373v-7.337h-2.667v-3.036h2.667v-2.313c0-2.631 1.568-4.086 3.966-4.086 1.149 0 2.351 0.205 2.351 0.205v2.584h-1.325c-1.304 0-1.711 0.809-1.711 1.641v1.969h2.912l-0.465 3.036h-2.446v7.338c5.020-0.788 8.859-5.132 8.859-10.374z"></path>
30 | </symbol>
31 | <symbol id="icon-send" viewBox="0 0 24 24">
32 | <path d="M23.625 0.147c0.281 0.201 0.415 0.522 0.362 0.857l-3.429 20.571c-0.040 0.254-0.201 0.469-0.429 0.603-0.121 0.067-0.268 0.107-0.415 0.107-0.107 0-0.214-0.027-0.321-0.067l-6.067-2.478-3.241 3.951c-0.161 0.201-0.402 0.308-0.656 0.308-0.094 0-0.201-0.013-0.295-0.054-0.335-0.121-0.563-0.442-0.563-0.804v-4.674l11.571-14.183-14.317 12.388-5.29-2.17c-0.308-0.121-0.509-0.402-0.536-0.737-0.013-0.321 0.147-0.629 0.429-0.79l22.286-12.857c0.134-0.080 0.281-0.121 0.429-0.121 0.174 0 0.348 0.054 0.482 0.147z"></path>
33 | </symbol>
34 | <symbol id="icon-reddit" viewBox="0 0 24 24">
35 | <path d="M24 11.33c0 1.045-0.589 1.942-1.46 2.384 0.107 0.415 0.161 0.844 0.161 1.286 0 4.232-4.781 7.661-10.674 7.661-5.879 0-10.661-3.429-10.661-7.661 0-0.429 0.054-0.857 0.147-1.259-0.897-0.442-1.513-1.353-1.513-2.411 0-1.473 1.192-2.665 2.665-2.665 0.763 0 1.446 0.321 1.942 0.844 1.808-1.259 4.219-2.076 6.897-2.17l1.554-6.978c0.054-0.241 0.308-0.402 0.549-0.348l4.942 1.085c0.321-0.643 1.004-1.098 1.781-1.098 1.112 0 2.009 0.897 2.009 1.996 0 1.112-0.897 2.009-2.009 2.009-1.098 0-1.996-0.897-1.996-1.996l-4.473-0.991-1.393 6.321c2.692 0.080 5.129 0.884 6.951 2.143 0.482-0.509 1.165-0.817 1.915-0.817 1.473 0 2.665 1.192 2.665 2.665zM5.598 13.996c0 1.112 0.897 2.009 1.996 2.009 1.112 0 2.009-0.897 2.009-2.009 0-1.098-0.897-1.996-2.009-1.996-1.098 0-1.996 0.897-1.996 1.996zM16.446 18.75c0.201-0.201 0.201-0.496 0-0.696-0.188-0.188-0.496-0.188-0.683 0-0.804 0.817-2.531 1.098-3.763 1.098s-2.96-0.281-3.763-1.098c-0.188-0.188-0.496-0.188-0.683 0-0.201 0.188-0.201 0.496 0 0.696 1.272 1.272 3.723 1.366 4.446 1.366s3.174-0.094 4.446-1.366zM16.406 16.004c1.098 0 1.996-0.897 1.996-2.009 0-1.098-0.897-1.996-1.996-1.996-1.112 0-2.009 0.897-2.009 1.996 0 1.112 0.897 2.009 2.009 2.009z"></path>
36 | </symbol>
37 | </defs>
38 | </svg>
39 | 


--------------------------------------------------------------------------------
/partials/icons/selection.json:
--------------------------------------------------------------------------------
  1 | {
  2 |   "IcoMoonType": "selection",
  3 |   "icons": [
  4 |     {
  5 |       "icon": {
  6 |         "paths": [
  7 |           "M810 274l-238 238 238 238-60 60-238-238-238 238-60-60 238-238-238-238 60-60 238 238 238-238z"
  8 |         ],
  9 |         "attrs": [],
 10 |         "isMulticolor": false,
 11 |         "isMulticolor2": false,
 12 |         "tags": [
 13 |           "clear, close"
 14 |         ],
 15 |         "grid": 24
 16 |       },
 17 |       "attrs": [],
 18 |       "properties": {
 19 |         "order": 2,
 20 |         "ligatures": "clear, close",
 21 |         "id": 153,
 22 |         "prevSize": 24,
 23 |         "name": "close"
 24 |       },
 25 |       "setIdx": 0,
 26 |       "setId": 3,
 27 |       "iconIdx": 153
 28 |     },
 29 |     {
 30 |       "icon": {
 31 |         "paths": [
 32 |           "M128 256h768v86h-768v-86zM128 554v-84h768v84h-768zM128 768v-86h768v86h-768z"
 33 |         ],
 34 |         "attrs": [],
 35 |         "isMulticolor": false,
 36 |         "isMulticolor2": false,
 37 |         "tags": [
 38 |           "menu"
 39 |         ],
 40 |         "grid": 24
 41 |       },
 42 |       "attrs": [],
 43 |       "properties": {
 44 |         "order": 3,
 45 |         "ligatures": "menu",
 46 |         "id": 600,
 47 |         "prevSize": 24,
 48 |         "name": "menu"
 49 |       },
 50 |       "setIdx": 0,
 51 |       "setId": 3,
 52 |       "iconIdx": 600
 53 |     },
 54 |     {
 55 |       "icon": {
 56 |         "paths": [
 57 |           "M170 512l342-342 342 342-62 60-238-238v520h-84v-520l-240 238z"
 58 |         ],
 59 |         "attrs": [],
 60 |         "isMulticolor": false,
 61 |         "isMulticolor2": false,
 62 |         "tags": [
 63 |           "arrow_upward"
 64 |         ],
 65 |         "grid": 24
 66 |       },
 67 |       "attrs": [],
 68 |       "properties": {
 69 |         "order": 10,
 70 |         "ligatures": "arrow_upward",
 71 |         "id": 606,
 72 |         "prevSize": 24,
 73 |         "name": "arrow"
 74 |       },
 75 |       "setIdx": 0,
 76 |       "setId": 3,
 77 |       "iconIdx": 606
 78 |     },
 79 |     {
 80 |       "icon": {
 81 |         "paths": [
 82 |           "M658.286 475.429c0-141.143-114.857-256-256-256s-256 114.857-256 256 114.857 256 256 256 256-114.857 256-256zM950.857 950.857c0 40-33.143 73.143-73.143 73.143-19.429 0-38.286-8-51.429-21.714l-196-195.429c-66.857 46.286-146.857 70.857-228 70.857-222.286 0-402.286-180-402.286-402.286s180-402.286 402.286-402.286 402.286 180 402.286 402.286c0 81.143-24.571 161.143-70.857 228l196 196c13.143 13.143 21.143 32 21.143 51.429z"
 83 |         ],
 84 |         "width": 950.8571428571428,
 85 |         "attrs": [],
 86 |         "isMulticolor": false,
 87 |         "isMulticolor2": false,
 88 |         "tags": [
 89 |           "search"
 90 |         ],
 91 |         "defaultCode": 61442,
 92 |         "grid": 14
 93 |       },
 94 |       "attrs": [],
 95 |       "properties": {
 96 |         "name": "search",
 97 |         "id": 6,
 98 |         "order": 9,
 99 |         "prevSize": 24
100 |       },
101 |       "setIdx": 1,
102 |       "setId": 2,
103 |       "iconIdx": 6
104 |     },
105 |     {
106 |       "icon": {
107 |         "paths": [
108 |           "M925.714 233.143c-25.143 36.571-56.571 69.143-92.571 95.429 0.571 8 0.571 16 0.571 24 0 244-185.714 525.143-525.143 525.143-104.571 0-201.714-30.286-283.429-82.857 14.857 1.714 29.143 2.286 44.571 2.286 86.286 0 165.714-29.143 229.143-78.857-81.143-1.714-149.143-54.857-172.571-128 11.429 1.714 22.857 2.857 34.857 2.857 16.571 0 33.143-2.286 48.571-6.286-84.571-17.143-148-91.429-148-181.143v-2.286c24.571 13.714 53.143 22.286 83.429 23.429-49.714-33.143-82.286-89.714-82.286-153.714 0-34.286 9.143-65.714 25.143-93.143 90.857 112 227.429 185.143 380.571 193.143-2.857-13.714-4.571-28-4.571-42.286 0-101.714 82.286-184.571 184.571-184.571 53.143 0 101.143 22.286 134.857 58.286 41.714-8 81.714-23.429 117.143-44.571-13.714 42.857-42.857 78.857-81.143 101.714 37.143-4 73.143-14.286 106.286-28.571z"
109 |         ],
110 |         "width": 950.8571428571428,
111 |         "attrs": [],
112 |         "isMulticolor": false,
113 |         "isMulticolor2": false,
114 |         "tags": [
115 |           "twitter"
116 |         ],
117 |         "defaultCode": 61593,
118 |         "grid": 14
119 |       },
120 |       "attrs": [],
121 |       "properties": {
122 |         "name": "twitter",
123 |         "id": 145,
124 |         "order": 5,
125 |         "prevSize": 24
126 |       },
127 |       "setIdx": 1,
128 |       "setId": 2,
129 |       "iconIdx": 145
130 |     },
131 |     {
132 |       "icon": {
133 |         "paths": [
134 |           "M199.429 357.143v566.286h-188.571v-566.286h188.571zM211.429 182.286c0.571 54.286-40.571 97.714-106.286 97.714v0h-1.143c-63.429 0-104-43.429-104-97.714 0-55.429 42.286-97.714 106.286-97.714 64.571 0 104.571 42.286 105.143 97.714zM877.714 598.857v324.571h-188v-302.857c0-76-27.429-128-95.429-128-52 0-82.857 34.857-96.571 68.571-4.571 12.571-6.286 29.143-6.286 46.286v316h-188c2.286-513.143 0-566.286 0-566.286h188v82.286h-1.143c24.571-38.857 69.143-95.429 170.857-95.429 124 0 216.571 81.143 216.571 254.857z"
135 |         ],
136 |         "width": 877.7142857142857,
137 |         "attrs": [],
138 |         "isMulticolor": false,
139 |         "isMulticolor2": false,
140 |         "tags": [
141 |           "linkedin"
142 |         ],
143 |         "defaultCode": 61665,
144 |         "grid": 14
145 |       },
146 |       "attrs": [],
147 |       "properties": {
148 |         "name": "linkedin",
149 |         "id": 200,
150 |         "order": 12,
151 |         "prevSize": 24
152 |       },
153 |       "setIdx": 1,
154 |       "setId": 2,
155 |       "iconIdx": 200
156 |     },
157 |     {
158 |       "icon": {
159 |         "paths": [
160 |           "M406.286 644.571l276.571-142.857-276.571-144.571v287.429zM512 152c215.429 0 358.286 10.286 358.286 10.286 20 2.286 64 2.286 102.857 43.429 0 0 31.429 30.857 40.571 101.714 10.857 82.857 10.286 165.714 10.286 165.714v77.714s0.571 82.857-10.286 165.714c-9.143 70.286-40.571 101.714-40.571 101.714-38.857 40.571-82.857 40.571-102.857 42.857 0 0-142.857 10.857-358.286 10.857v0c-266.286-2.286-348-10.286-348-10.286-22.857-4-74.286-2.857-113.143-43.429 0 0-31.429-31.429-40.571-101.714-10.857-82.857-10.286-165.714-10.286-165.714v-77.714s-0.571-82.857 10.286-165.714c9.143-70.857 40.571-101.714 40.571-101.714 38.857-41.143 82.857-41.143 102.857-43.429 0 0 142.857-10.286 358.286-10.286v0z"
161 |         ],
162 |         "width": 1024,
163 |         "attrs": [],
164 |         "isMulticolor": false,
165 |         "isMulticolor2": false,
166 |         "tags": [
167 |           "youtube-play"
168 |         ],
169 |         "defaultCode": 61802,
170 |         "grid": 14
171 |       },
172 |       "attrs": [],
173 |       "properties": {
174 |         "name": "youtube",
175 |         "id": 326,
176 |         "order": 6,
177 |         "prevSize": 24
178 |       },
179 |       "setIdx": 1,
180 |       "setId": 2,
181 |       "iconIdx": 326
182 |     },
183 |     {
184 |       "icon": {
185 |         "paths": [
186 |           "M585.143 512c0-80.571-65.714-146.286-146.286-146.286s-146.286 65.714-146.286 146.286 65.714 146.286 146.286 146.286 146.286-65.714 146.286-146.286zM664 512c0 124.571-100.571 225.143-225.143 225.143s-225.143-100.571-225.143-225.143 100.571-225.143 225.143-225.143 225.143 100.571 225.143 225.143zM725.714 277.714c0 29.143-23.429 52.571-52.571 52.571s-52.571-23.429-52.571-52.571 23.429-52.571 52.571-52.571 52.571 23.429 52.571 52.571zM438.857 152c-64 0-201.143-5.143-258.857 17.714-20 8-34.857 17.714-50.286 33.143s-25.143 30.286-33.143 50.286c-22.857 57.714-17.714 194.857-17.714 258.857s-5.143 201.143 17.714 258.857c8 20 17.714 34.857 33.143 50.286s30.286 25.143 50.286 33.143c57.714 22.857 194.857 17.714 258.857 17.714s201.143 5.143 258.857-17.714c20-8 34.857-17.714 50.286-33.143s25.143-30.286 33.143-50.286c22.857-57.714 17.714-194.857 17.714-258.857s5.143-201.143-17.714-258.857c-8-20-17.714-34.857-33.143-50.286s-30.286-25.143-50.286-33.143c-57.714-22.857-194.857-17.714-258.857-17.714zM877.714 512c0 60.571 0.571 120.571-2.857 181.143-3.429 70.286-19.429 132.571-70.857 184s-113.714 67.429-184 70.857c-60.571 3.429-120.571 2.857-181.143 2.857s-120.571 0.571-181.143-2.857c-70.286-3.429-132.571-19.429-184-70.857s-67.429-113.714-70.857-184c-3.429-60.571-2.857-120.571-2.857-181.143s-0.571-120.571 2.857-181.143c3.429-70.286 19.429-132.571 70.857-184s113.714-67.429 184-70.857c60.571-3.429 120.571-2.857 181.143-2.857s120.571-0.571 181.143 2.857c70.286 3.429 132.571 19.429 184 70.857s67.429 113.714 70.857 184c3.429 60.571 2.857 120.571 2.857 181.143z"
187 |         ],
188 |         "width": 877.7142857142857,
189 |         "attrs": [],
190 |         "isMulticolor": false,
191 |         "isMulticolor2": false,
192 |         "tags": [
193 |           "instagram"
194 |         ],
195 |         "defaultCode": 61805,
196 |         "grid": 14
197 |       },
198 |       "attrs": [],
199 |       "properties": {
200 |         "name": "instagram",
201 |         "id": 329,
202 |         "order": 7,
203 |         "prevSize": 24
204 |       },
205 |       "setIdx": 1,
206 |       "setId": 2,
207 |       "iconIdx": 329
208 |     },
209 |     {
210 |       "icon": {
211 |         "paths": [
212 |           "M1008 6.286c12 8.571 17.714 22.286 15.429 36.571l-146.286 877.714c-1.714 10.857-8.571 20-18.286 25.714-5.143 2.857-11.429 4.571-17.714 4.571-4.571 0-9.143-1.143-13.714-2.857l-258.857-105.714-138.286 168.571c-6.857 8.571-17.143 13.143-28 13.143-4 0-8.571-0.571-12.571-2.286-14.286-5.143-24-18.857-24-34.286v-199.429l493.714-605.143-610.857 528.571-225.714-92.571c-13.143-5.143-21.714-17.143-22.857-31.429-0.571-13.714 6.286-26.857 18.286-33.714l950.857-548.571c5.714-3.429 12-5.143 18.286-5.143 7.429 0 14.857 2.286 20.571 6.286z"
213 |         ],
214 |         "width": 1025.1702857142857,
215 |         "attrs": [],
216 |         "isMulticolor": false,
217 |         "isMulticolor2": false,
218 |         "tags": [
219 |           "paper-plane",
220 |           "send"
221 |         ],
222 |         "defaultCode": 61912,
223 |         "grid": 14
224 |       },
225 |       "attrs": [],
226 |       "properties": {
227 |         "name": "send",
228 |         "id": 429,
229 |         "order": 13,
230 |         "prevSize": 24
231 |       },
232 |       "setIdx": 1,
233 |       "setId": 2,
234 |       "iconIdx": 429
235 |     },
236 |     {
237 |       "icon": {
238 |         "paths": [
239 |           "M829.143 73.143c26.857 0 48.571 21.714 48.571 48.571v780.571c0 26.857-21.714 48.571-48.571 48.571h-223.429v-340h113.714l17.143-132.571h-130.857v-84.571c0-38.286 10.286-64 65.714-64l69.714-0.571v-118.286c-12-1.714-53.714-5.143-101.714-5.143-101.143 0-170.857 61.714-170.857 174.857v97.714h-114.286v132.571h114.286v340h-420c-26.857 0-48.571-21.714-48.571-48.571v-780.571c0-26.857 21.714-48.571 48.571-48.571h780.571z"
240 |         ],
241 |         "width": 877.7142857142857,
242 |         "attrs": [],
243 |         "isMulticolor": false,
244 |         "isMulticolor2": false,
245 |         "tags": [
246 |           "facebook-official"
247 |         ],
248 |         "defaultCode": 62000,
249 |         "grid": 14
250 |       },
251 |       "attrs": [],
252 |       "properties": {
253 |         "name": "facebook",
254 |         "id": 509,
255 |         "order": 4,
256 |         "prevSize": 24
257 |       },
258 |       "setIdx": 1,
259 |       "setId": 2,
260 |       "iconIdx": 509
261 |     },
262 |     {
263 |       "icon": {
264 |         "paths": [
265 |           "M1024 483.429c0 44.571-25.143 82.857-62.286 101.714 4.571 17.714 6.857 36 6.857 54.857 0 180.571-204 326.857-455.429 326.857-250.857 0-454.857-146.286-454.857-326.857 0-18.286 2.286-36.571 6.286-53.714-38.286-18.857-64.571-57.714-64.571-102.857 0-62.857 50.857-113.714 113.714-113.714 32.571 0 61.714 13.714 82.857 36 77.143-53.714 180-88.571 294.286-92.571l66.286-297.714c2.286-10.286 13.143-17.143 23.429-14.857l210.857 46.286c13.714-27.429 42.857-46.857 76-46.857 47.429 0 85.714 38.286 85.714 85.143 0 47.429-38.286 85.714-85.714 85.714-46.857 0-85.143-38.286-85.143-85.143l-190.857-42.286-59.429 269.714c114.857 3.429 218.857 37.714 296.571 91.429 20.571-21.714 49.714-34.857 81.714-34.857 62.857 0 113.714 50.857 113.714 113.714zM238.857 597.143c0 47.429 38.286 85.714 85.143 85.714 47.429 0 85.714-38.286 85.714-85.714 0-46.857-38.286-85.143-85.714-85.143-46.857 0-85.143 38.286-85.143 85.143zM701.714 800c8.571-8.571 8.571-21.143 0-29.714-8-8-21.143-8-29.143 0-34.286 34.857-108 46.857-160.571 46.857s-126.286-12-160.571-46.857c-8-8-21.143-8-29.143 0-8.571 8-8.571 21.143 0 29.714 54.286 54.286 158.857 58.286 189.714 58.286s135.429-4 189.714-58.286zM700 682.857c46.857 0 85.143-38.286 85.143-85.714 0-46.857-38.286-85.143-85.143-85.143-47.429 0-85.714 38.286-85.714 85.143 0 47.429 38.286 85.714 85.714 85.714z"
266 |         ],
267 |         "width": 1024,
268 |         "attrs": [],
269 |         "isMulticolor": false,
270 |         "isMulticolor2": false,
271 |         "tags": [
272 |           "reddit-alien"
273 |         ],
274 |         "defaultCode": 62081,
275 |         "grid": 14
276 |       },
277 |       "attrs": [],
278 |       "properties": {
279 |         "name": "reddit",
280 |         "id": 585,
281 |         "order": 11,
282 |         "prevSize": 24
283 |       },
284 |       "setIdx": 1,
285 |       "setId": 2,
286 |       "iconIdx": 585
287 |     }
288 |   ],
289 |   "height": 1024,
290 |   "preferences": {
291 |     "showGlyphs": true,
292 |     "showQuickUse": true,
293 |     "showQuickUse2": true,
294 |     "showSVGs": true,
295 |     "fontPref": {
296 |       "prefix": "icon-",
297 |       "metadata": {
298 |         "fontFamily": "icomoon"
299 |       },
300 |       "metrics": {
301 |         "emSize": 1024,
302 |         "baseline": 6.25,
303 |         "whitespace": 50
304 |       },
305 |       "embed": false
306 |     },
307 |     "imagePref": {
308 |       "prefix": "icon-",
309 |       "png": false,
310 |       "useClassSelector": true,
311 |       "color": 0,
312 |       "bgColor": 16777215,
313 |       "classSelector": ".icon",
314 |       "name": "Paway",
315 |       "height": 32,
316 |       "columns": 16,
317 |       "margin": 16
318 |     },
319 |     "historySize": 50,
320 |     "showCodes": true,
321 |     "gridSize": 16
322 |   }
323 | }


--------------------------------------------------------------------------------
/partials/loop.hbs:
--------------------------------------------------------------------------------
1 | <div class="feed-entry-content">
2 |     <div class="story-feed grid md:grid-cols-2 lg:grid-cols-3">
3 |         {{#foreach posts}}
4 |             {{!-- markup for each stories - partials/story/story.hbs --}}
5 |             {{> "story/story"}}
6 |         {{/foreach}}
7 |     </div>
8 | </div>


--------------------------------------------------------------------------------
/partials/pagination.hbs:
--------------------------------------------------------------------------------
 1 | <nav class="pagination flex flex-col justify-center space-x-5 md:flex-row my-20 px-4 text-xl text-center text-title">
 2 |     {{#if prev}}
 3 |         <a class="newer-posts text-gray-500 underline-offset-4 hover:text-title hover:underline" href="{{page_url prev}}">
 4 |             <svg class="icon is-stroke -rotate-90"><use xlink:href="#icon-arrow"></use></svg>
 5 |             {{t "Newer Posts"}}
 6 |         </a>
 7 |     {{/if}}
 8 |     <span class="page-number">{{t "Page {page} of {pages}" page=page pages=pages}}</span>
 9 |     {{#if next}}
10 |         <a class="older-posts text-gray-500 underline-offset-4 hover:text-title hover:underline" href="{{page_url next}}">
11 |             {{t "Older Posts"}}
12 |             <svg class="icon is-stroke rotate-90"><use xlink:href="#icon-arrow"></use></svg>
13 |         </a>
14 |     {{/if}}
15 | </nav>
16 | 


--------------------------------------------------------------------------------
/partials/sidenav.hbs:
--------------------------------------------------------------------------------
 1 | <div class="sidenav fixed h-full flex flex-col bg-black text-white top-0 text-center z-20 overflow-x-hidden scroll-transparent w-full">
 2 |     <div class="js-menu-toggle sidenav-close absolute cursor-pointer top-3 right-3 p-3">
 3 |         <svg class="icon is-stroke"><use xlink:href="#icon-close"></use></svg>
 4 |     </div>
 5 | 
 6 |     <div class="text-white mb-8 font-serif font-bold text-4xl">{{@site.title}}</div>
 7 |     {{#if @site.description}}<div class="sidenav-des mb-8 text-lg">{{@site.description}}</div>{{/if}}
 8 | 
 9 |     {{!-- navigation --}}
10 |     <nav class="sidenav-nav mb-8 lg:hidden">{{navigation}}</nav>
11 | 
12 |     {{!-- Featured Post Featured Article --}}
13 |     {{#get "posts" limit="3" filter="featured:true" as |sidenav_featured_post|}}
14 |         {{#if sidenav_featured_post}}
15 |             <div class="mb-8">
16 |                 {{#foreach sidenav_featured_post}}
17 |                     {{> "story/story-featured-sidenav"}}
18 |                 {{/foreach}}
19 |             </div>
20 |         {{/if}}
21 |     {{/get}}
22 | 
23 |     <div class="flex-auto"></div>
24 | 
25 |     {{!-- Secondary menu --}}
26 |     {{#if @site.secondary_navigation}}
27 |         <nav class="sidenav-menu-secondary mb-8">
28 |             {{navigation type="secondary"}}
29 |         </nav>
30 |     {{/if}}
31 | 
32 |     {{!-- social Media --}}
33 |     {{> "widget/witget-social-media"}}
34 | </div>


--------------------------------------------------------------------------------
/partials/story/story-card-large.hbs:
--------------------------------------------------------------------------------
 1 | <article class="relative flex items-center justify-center flex-col min-h-screen text-center bg-dark">
 2 |     {{#if feature_image}}
 3 |     <a href="{{url}}">
 4 |         <picture>
 5 |             <source
 6 |                 srcset="{{img_url feature_image size="s" format="avif"}} 300w,
 7 |                         {{img_url feature_image size="m" format="avif"}} 600w,
 8 |                         {{img_url feature_image size="l" format="avif"}} 1000w,
 9 |                         {{img_url feature_image size="xl" format="avif"}} 2000w"
10 |                 sizes="(min-width: 1400px) 1400px, 92vw"
11 |                 type="image/avif"
12 |             >
13 |             <source
14 |                 srcset="{{img_url feature_image size="s" format="webp"}} 300w,
15 |                         {{img_url feature_image size="m" format="webp"}} 600w,
16 |                         {{img_url feature_image size="l" format="webp"}} 1000w,
17 |                         {{img_url feature_image size="xl" format="webp"}} 2000w"
18 |                 sizes="(min-width: 1400px) 1400px, 92vw"
19 |                 type="image/webp"
20 |             >
21 |             <img
22 |                 srcset="{{img_url feature_image size="s"}} 300w,
23 |                         {{img_url feature_image size="m"}} 600w,
24 |                         {{img_url feature_image size="l"}} 1000w,
25 |                         {{img_url feature_image size="xl"}} 2000w"
26 |                 sizes="(min-width: 1400px) 1400px, 92vw"
27 |                 class="inset-image brightness-50"
28 |                 src="{{img_url feature_image size="xl"}}"
29 |                 alt="{{#if feature_image_alt}}{{feature_image_alt}}{{else}}{{title}}{{/if}}"
30 |             >
31 |         </picture>
32 |     </a>
33 |     {{/if}}
34 | 
35 |     <div class="relative z-2 max-w-3xl mx-auto px-4 py-vw6">
36 |         {{#if primary_tag}}{{#primary_tag}}
37 |         <div class="cat-links uppercase mb-4 text-lg tracking-wider font-bold leading-normal">
38 |             <a href="{{url}}" title="{{name}}" class="cat-links-item text-white inline-block border-white border-b-3 border-opacity-25">{{name}}</a>
39 |         </div>
40 |         {{/primary_tag}}{{/if}}
41 | 
42 |         <h2 class="story-title text-white mb-4 leading-tight text-5xl md:text-7xl font-title"><a href="{{url}}">{{title}}</a></h2>
43 | 
44 |         {{!-- Author Meta partials/components/author-meta.hbs --}}
45 |         {{> "components/author-meta" class="text-xl text-white text-opacity-90" classLink="hover:text-white"}}
46 |     </div>
47 | </article>


--------------------------------------------------------------------------------
/partials/story/story-featured-sidenav.hbs:
--------------------------------------------------------------------------------
 1 | <div class="flex items-center justify-center mb-7">
 2 |     {{!-- Featured Image --}}
 3 |     {{#if feature_image}}
 4 |     <a class="flex-none" href="{{url}}">
 5 |         <img class="story-img rounded-full h-20 w-20 blur-up lazyload"
 6 |             src="data:image/gif;base64,R0lGODlhAQABAAAAACH5BAEKAAEALAAAAAABAAEAAAICTAEAOw=="
 7 |             data-srcset="{{img_url feature_image size="s"}} 300w,
 8 |                     {{img_url feature_image size="m"}} 600w"
 9 |             data-sizes="auto"
10 |             height="80"
11 |             width="80"
12 |             alt="{{#if feature_image_alt}}{{feature_image_alt}}{{else}}{{title}}{{/if}}"
13 |         />
14 |     </a>
15 |     {{/if}}
16 | 
17 |     <div class="flex-1 text-left pl-4">
18 |         <time class="datetime text-xs font-medium uppercase text-white text-opacity-60" datetime="{{date format=" YYYY-MM-DD "}}">{{date published_at format="MMMM DD, YYYY"}}</time>
19 |         <h2 class="text-lg font-serif font-semibold line-clamp-2 hover:text-primary"><a href="{{url}}">{{title}}</a></h2>
20 |     </div>
21 | </div>


--------------------------------------------------------------------------------
/partials/story/story.hbs:
--------------------------------------------------------------------------------
 1 | <article class="story relative overflow-hidden">
 2 |     {{#if feature_image}}
 3 |         <figure class="story-figure">
 4 |             <a href="{{url}}" class="story-image-link" aria-hidden="true" tabindex="-1">
 5 |                 <picture>
 6 |                     <source
 7 |                         data-srcset="{{img_url feature_image size="s" format="avif"}} 300w,
 8 |                                 {{img_url feature_image size="m" format="avif"}} 600w,
 9 |                                 {{img_url feature_image size="l" format="avif"}} 1000w,
10 |                                 {{img_url feature_image size="xl" format="avif"}} 2000w"
11 |                         data-sizes="auto"
12 |                         type="image/avif"
13 |                     >
14 |                     <source
15 |                         data-srcset="{{img_url feature_image size="s" format="webp"}} 300w,
16 |                                 {{img_url feature_image size="m" format="webp"}} 600w,
17 |                                 {{img_url feature_image size="l" format="webp"}} 1000w,
18 |                                 {{img_url feature_image size="xl" format="webp"}} 2000w"
19 |                         data-sizes="auto"
20 |                         type="image/webp"
21 |                     >
22 |                     <img class="story-img inset-image blur-up lazyload"
23 |                         data-srcset="{{img_url feature_image size="s"}} 300w,
24 |                                 {{img_url feature_image size="m"}} 600w,
25 |                                 {{img_url feature_image size="l"}} 1000w,
26 |                                 {{img_url feature_image size="xl"}} 2000w"
27 |                         data-sizes="auto"
28 |                         src="data:image/gif;base64,R0lGODlhAQABAAAAACH5BAEKAAEALAAAAAABAAEAAAICTAEAOw=="
29 |                         alt="{{#if feature_image_alt}}{{feature_image_alt}}{{else}}{{title}}{{/if}}"
30 |                     >
31 |                 </picture>
32 |             </a>
33 |         </figure>
34 |         <div class="story-body absolute z-2 bottom-0 left-0 right-0">
35 |             {{#if primary_tag}}{{#primary_tag}}
36 |             <div class="cat-links uppercase mb-4 text-sm tracking-wider font-bold leading-normal">
37 |                 <a href="{{url}}" title="{{name}}" class="cat-links-item text-white inline-block border-white border-b-3 border-opacity-25">{{name}}</a>
38 |             </div>
39 |             {{/primary_tag}}{{/if}}
40 | 
41 |             <h2 class="story-title font-title text-white mb-4 md:text-40"><a href="{{url}}">{{title}}</a></h2>
42 | 
43 |             {{!-- Author Meta partials/components/author-meta.hbs --}}
44 |             {{> "components/author-meta" class="text-base text-white text-opacity-60" classLink="hover:text-white"}}
45 |         </div>
46 | 
47 |     {{else}}
48 | 
49 |         <div class="story-body">
50 |             {{#if primary_tag}}{{#primary_tag}}
51 |             <div class="cat-links uppercase mb-4 text-sm tracking-wider font-bold leading-normal">
52 |                 <a href="{{url}}" title="{{name}}" class="cat-links-item inline-block hover:text-primary border-gray-300 border-b-3 border-opacity-50">{{name}}</a>
53 |             </div>
54 |             {{/primary_tag}}{{/if}}
55 | 
56 |             <h2 class="story-title font-title text-title mb-4 md:text-40"><a class="hover:text-primary" href="{{url}}">{{title}}</a></h2>
57 | 
58 |             {{!-- Author Meta partials/components/author-meta.hbs --}}
59 |             {{> "components/author-meta" class="text-base text-gray-500"}}
60 | 
61 |             <div class="text-lg leading-relaxed font-serif mt-6 line-clamp-5">{{excerpt}}</div>
62 | 
63 |             <div class="mt-6 text-gray-500 italic font-serif"><a href="{{url}}" class="more-link underline hover:no-underline">{{t "Continue reading"}}</a></div>
64 |         </div>
65 | 
66 |     {{/if}}
67 | </article>


--------------------------------------------------------------------------------
/partials/widget/widget-subscribe.hbs:
--------------------------------------------------------------------------------
 1 | <div class="f-subscribe">
 2 |     <div class="f-subscribe-content">
 3 |         <h2 class="f-subscribe-title">{{t "Subscribe to the best creative feed."}}</h2>
 4 |         <p class="f-subscribe-des">{{t "Stay up to date! Get all the latest & greatest posts delivered straight to your inbox"}}</p>
 5 | 
 6 |         <form class="footer-form" data-members-form="subscribe">
 7 |             <div class="form-group">
 8 |                 <input class="u-flex1" data-members-email placeholder="youremail@example.com" aria-label="{{t "youremail@example.com"}}" autocomplete="off" />
 9 |                 <button class="button button--primary u-flex0" type="submit">
10 |                     <span class="button-content">{{t "Subscribe"}}</span>
11 |                     <svg class="icon icon--send"><use xlink:href="#icon-send"></use></svg>
12 |                     <svg class="icon icon--loader u-hide" version="1.1" xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewBox="0 0 32 32"><path d="M32 16c-0.040-2.089-0.493-4.172-1.331-6.077-0.834-1.906-2.046-3.633-3.533-5.060-1.486-1.428-3.248-2.557-5.156-3.302-1.906-0.748-3.956-1.105-5.981-1.061-2.025 0.040-4.042 0.48-5.885 1.292-1.845 0.809-3.517 1.983-4.898 3.424s-2.474 3.147-3.193 4.994c-0.722 1.846-1.067 3.829-1.023 5.79 0.040 1.961 0.468 3.911 1.254 5.694 0.784 1.784 1.921 3.401 3.316 4.736 1.394 1.336 3.046 2.391 4.832 3.085 1.785 0.697 3.701 1.028 5.598 0.985 1.897-0.040 3.78-0.455 5.502-1.216 1.723-0.759 3.285-1.859 4.574-3.208 1.29-1.348 2.308-2.945 2.977-4.67 0.407-1.046 0.684-2.137 0.829-3.244 0.039 0.002 0.078 0.004 0.118 0.004 1.105 0 2-0.895 2-2 0-0.056-0.003-0.112-0.007-0.167h0.007zM28.822 21.311c-0.733 1.663-1.796 3.169-3.099 4.412s-2.844 2.225-4.508 2.868c-1.663 0.646-3.447 0.952-5.215 0.909-1.769-0.041-3.519-0.429-5.119-1.14-1.602-0.708-3.053-1.734-4.25-2.991s-2.141-2.743-2.76-4.346c-0.621-1.603-0.913-3.319-0.871-5.024 0.041-1.705 0.417-3.388 1.102-4.928 0.683-1.541 1.672-2.937 2.883-4.088s2.642-2.058 4.184-2.652c1.542-0.596 3.192-0.875 4.832-0.833 1.641 0.041 3.257 0.404 4.736 1.064 1.48 0.658 2.82 1.609 3.926 2.774s1.975 2.54 2.543 4.021c0.57 1.481 0.837 3.064 0.794 4.641h0.007c-0.005 0.055-0.007 0.11-0.007 0.167 0 1.032 0.781 1.88 1.784 1.988-0.195 1.088-0.517 2.151-0.962 3.156z"></path></svg>
13 |                 </button>
14 |             </div>
15 |             <div class="message-success u-hide">{{{t "<strong>Great!</strong> Check your inbox and click the link to confirm your subscription."}}}</div>
16 |             <div class="message-error u-hide">{{t "Please enter a valid email address!"}}</div>
17 |         </form>
18 |     </div>
19 | </div>


--------------------------------------------------------------------------------
/partials/widget/witget-social-media.hbs:
--------------------------------------------------------------------------------
 1 | <ul class="social-media js-social-media flex items-center justify-center space-x-5">
 2 |     {{#if @site.facebook}}
 3 |     <li>
 4 |         <a href="{{facebook_url}}" title="Facebook {{@site.facebook}}" aria-label="Facebook {{@site.facebook}}" target="_blank" rel="noopener noreferrer">
 5 |             <svg class="icon"><use xlink:href="#icon-facebook"></use></svg>
 6 |             <span class="hidden">Facebook</span>
 7 |         </a>
 8 |     </li>
 9 |     {{/if}}
10 | 
11 |     {{#if @site.twitter}}
12 |     <li>
13 |         <a href="{{twitter_url}}" title="Twitter {{@site.twitter}}" aria-label="Twitter {{@site.twitter}}" target="_blank" rel="noopener noreferrer">
14 |             <svg class="icon"><use xlink:href="#icon-twitter"></use></svg>
15 |             <span class="hidden">Twitter</span>
16 |         </a>
17 |     </li>
18 |     {{/if}}
19 | 
20 |     {{#if @custom.instagram_url}}
21 |     <li>
22 |         <a href="{{@custom.instagram_url}}" title="Instagram" aria-label="Instagram" target="_blank" rel="noopener noreferrer">
23 |             <svg class="icon"><use xlink:href="#icon-instagram"></use></svg>
24 |             <span class="hidden">Instagram</span>
25 |         </a>
26 |     </li>
27 |     {{/if}}
28 | 
29 |     {{#if @custom.youtube_url}}
30 |     <li>
31 |         <a href="{{@custom.youtube_url}}" title="YouTube" aria-label="YouTube" target="_blank" rel="noopener noreferrer">
32 |             <svg class="icon"><use xlink:href="#icon-youtube"></use></svg>
33 |             <span class="hidden">YouTube</span>
34 |         </a>
35 |     </li>
36 |     {{/if}}
37 | </ul>


--------------------------------------------------------------------------------
/post.hbs:
--------------------------------------------------------------------------------
 1 | {{!< default}}
 2 | {{!-- The tag above means: insert everything in this file
 3 | into the {body} of the default.hbs template --}}
 4 | 
 5 | {{#post}}
 6 | <article class="post py-vmin8 relative">
 7 |     <header class="post-header godo-canvas">
 8 |         {{!-- Category --}}
 9 |         {{#if primary_tag}}{{#primary_tag}}
10 |         <div class="cat-links uppercase mb-4 text-base tracking-wider font-bold leading-normal">
11 |             <a href="{{url}}" title="{{name}}" class="cat-links-item inline-block hover:text-primary border-gray-300 border-b-3 border-opacity-50">{{name}}</a>
12 |         </div>
13 |         {{/primary_tag}}{{/if}}
14 | 
15 |         {{!-- Post Title --}}
16 |         <h1 class="post-title mb-4 text-5xl text-title font-title leading-tight">{{title}}</h1>
17 | 
18 |         {{!-- Author Meta partials/components/author-meta.hbs --}}
19 |         {{> "components/author-meta"}}
20 |     </header>
21 | 
22 |     {{!-- Featured Image --}}
23 |     {{#if feature_image}}
24 |     <figure class="post-image godo-canvas mt-7">
25 |         <picture class="post-img kg-width-full w-full">
26 |             <source
27 |                 srcset="{{img_url feature_image size="s" format="avif"}} 300w,
28 |                         {{img_url feature_image size="m" format="avif"}} 600w,
29 |                         {{img_url feature_image size="l" format="avif"}} 1000w,
30 |                         {{img_url feature_image size="xl" format="avif"}} 2000w"
31 |                 sizes="(min-width: 1400px) 1400px, 92vw"
32 |                 type="image/avif"
33 |             >
34 |             <source
35 |                 srcset="{{img_url feature_image size="s" format="webp"}} 300w,
36 |                         {{img_url feature_image size="m" format="webp"}} 600w,
37 |                         {{img_url feature_image size="l" format="webp"}} 1000w,
38 |                         {{img_url feature_image size="xl" format="webp"}} 2000w"
39 |                 sizes="(min-width: 1400px) 1400px, 92vw"
40 |                 type="image/webp"
41 |             >
42 |             <img
43 |                 srcset="{{img_url feature_image size="s"}} 300w,
44 |                         {{img_url feature_image size="m"}} 600w,
45 |                         {{img_url feature_image size="l"}} 1000w,
46 |                         {{img_url feature_image size="xl"}} 2000w"
47 |                 sizes="(min-width: 1400px) 1400px, 92vw"
48 |                 src="{{img_url feature_image size="xl"}}"
49 |                 alt="{{#if feature_image_alt}}{{feature_image_alt}}{{else}}{{title}}{{/if}}"
50 |             >
51 |         </picture>
52 | 
53 |         {{#if feature_image_caption}}<figcaption class="post-figcaption">{{feature_image_caption}}</figcaption>{{/if}}
54 |     </figure>
55 |     {{/if}}
56 | 
57 |     <div class="post-body godo-canvas font-serif">
58 |         {{content}}
59 |     </div>
60 | 
61 |     {{!-- Post footer --}}
62 |     <footer class="post-footer godo-canvas">
63 |         {{!-- Tags Cloud - Partials/article/article-tags.hbs --}}
64 |         {{> "article/article-tags"}}
65 | 
66 |         {{!-- Share in Social Media - Partials/article/article-share.hbs --}}
67 |         {{> "article/article-share"}}
68 | 
69 |         {{!-- Author info - Partials/article/article-author.hbs --}}
70 |         {{> "article/article-author"}}
71 |     </footer>
72 | </article>
73 | 
74 | {{!-- Prev and next post --}}
75 | <div class="prev-next story-feed relative flex flex-wrap">
76 |     {{#prev_post}}
77 |         {{> "article/article-prev-next" mytitle="previous post" class="nav-previous"}}
78 |     {{/prev_post}}
79 | 
80 |     {{#next_post}}
81 |         {{> "article/article-prev-next" mytitle="next post" class="nav-next"}}
82 |     {{/next_post}}
83 | </div>
84 | {{!-- ./end prev next post ---}}
85 | 
86 | {{> "article/article-comments"}}
87 | 
88 | {{/post}}
89 | 
90 | {{#if post.tags}}{{> "article/article-related"}}{{/if}}
91 | 


--------------------------------------------------------------------------------
/src/css/abstracts/constrols.css:
--------------------------------------------------------------------------------
 1 | $control-radius: 4px;
 2 | $control-radius-small: 2px;
 3 | 
 4 | $control-border-width: 1px;
 5 | 
 6 | $control-height: 2.5em;
 7 | $control-line-height: 1.5;
 8 | 
 9 | $control-padding-vertical: calc(0.5em - $control-border-width);
10 | $control-padding-horizontal: calc(0.75em - $control-border-width);
11 | 
12 | %control {
13 |   @apply text-base;
14 | 
15 |   @extend %font-sans;
16 | 
17 |   /* stylelint-disable-next-line */
18 |   -moz-appearance: none;
19 |   /* stylelint-disable-next-line */
20 |   -webkit-appearance: none;
21 |   align-items: center;
22 |   border: $control-border-width solid transparent;
23 |   border-radius: $control-radius;
24 |   box-shadow: none;
25 |   display: inline-flex;
26 |   height: $control-height;
27 |   justify-content: flex-start;
28 |   line-height: $control-line-height;
29 |   padding: $control-padding-vertical $control-padding-horizontal;
30 |   position: relative;
31 |   vertical-align: top;
32 | 
33 |   /* States */
34 |   /* &:focus,
35 |   &.is-focused,
36 |   &:active,
37 |   &.is-active {
38 |     outline: none;
39 |   } */
40 | 
41 |   &[disabled],
42 |   fieldset[disabled] & {
43 |     cursor: not-allowed;
44 |   }
45 | }
46 | 


--------------------------------------------------------------------------------
/src/css/abstracts/extend.css:
--------------------------------------------------------------------------------
 1 | %font-sans {
 2 |   @apply font-sans;
 3 | }
 4 | 
 5 | %inset-image {
 6 |   @apply inset-0 object-center object-cover absolute w-full h-full;
 7 | }
 8 | 
 9 | %card {
10 |   background: var(--card-bg);
11 |   border: 1px solid rgba(0, 0, 0, 0.1);
12 |   border-radius: 5px;
13 |   box-shadow: rgba(0, 0, 0, 0.1) 0 1px 4px;
14 |   overflow: hidden;
15 | }
16 | 


--------------------------------------------------------------------------------
/src/css/abstracts/variables.css:
--------------------------------------------------------------------------------
 1 | /* Colors
 2 | /* ---------------------------------------------------------- */
 3 | 
 4 | $primary-color: #8c7154;
 5 | 
 6 | /* Header
 7 | /* ---------------------------------------------------------- */
 8 | 
 9 | $header-height: 5rem;
10 | 


--------------------------------------------------------------------------------
/src/css/amp.css:
--------------------------------------------------------------------------------
  1 | /* stylelint-disable */
  2 | 
  3 | /* https://github.com/TryGhost/Ghost/blob/main/core/frontend/apps/amp/lib/views/amp.hbs */
  4 | 
  5 | /* 01. Narmalize css && utilities
  6 | /* ---------------------------------------------------------- */
  7 | 
  8 | @import "normalize.css/normalize";
  9 | @import "./amp/utilities.css";
 10 | 
 11 | /* 02. Variables
 12 | /* ---------------------------------------------------------- */
 13 | 
 14 | /* font default page and titles */
 15 | $primary-font: Whitney SSm A, Whitney SSm B, -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Oxygen, Ubuntu, Cantarell, Open Sans, Helvetica Neue, sans-serif;
 16 | 
 17 | /* font for content */
 18 | $secondary-font: charter, Georgia, Cambria, "Times New Roman", Times, serif;
 19 | 
 20 | $header-height: 4rem;
 21 | 
 22 | $primary-color: #292929;
 23 | $secondary-color: #757575;
 24 | $complementary-color: var(--ghost-accent-color);
 25 | $title-color: #18181b;
 26 | $sidenar-link-color: #292929;
 27 | 
 28 | $text-gray-500: #757575;
 29 | 
 30 | /* 03. extend
 31 | /* ---------------------------------------------------------- */
 32 | 
 33 | %primary-font {
 34 |   font-family: $primary-font;
 35 | }
 36 | 
 37 | %secondary-font {
 38 |   font-family: $secondary-font;
 39 | }
 40 | 
 41 | /* 04. Global
 42 | /* ---------------------------------------------------------- */
 43 | 
 44 | *,
 45 | *::before,
 46 | *::after {
 47 |   box-sizing: border-box;
 48 | }
 49 | 
 50 | body {
 51 |   @extend %primary-font;
 52 | 
 53 |   color: $primary-color;
 54 |   font-size: 1rem;
 55 |   font-style: normal;
 56 |   font-weight: 400;
 57 |   letter-spacing: 0;
 58 |   line-height: 1.5;
 59 |   text-rendering: optimizeLegibility;
 60 |   text-size-adjust: 100%;
 61 | }
 62 | 
 63 | a {
 64 |   color: $complementary-color;
 65 |   text-decoration: none;
 66 |   word-break: break-word;
 67 | 
 68 |   &:active,
 69 |   &:hover {
 70 |     outline: 0;
 71 |   }
 72 | }
 73 | 
 74 | blockquote {
 75 |   border-left: 4px solid $primary-color;
 76 |   font-size: 1.125rem;
 77 |   font-style: italic;
 78 |   margin-left: -5px;
 79 |   margin-right: 0;
 80 |   padding-bottom: 2px;
 81 |   padding-left: 1.25rem;
 82 | }
 83 | 
 84 | figure {
 85 |   margin: 0;
 86 |   padding: 0;
 87 | }
 88 | 
 89 | img {
 90 |   object-fit: cover;
 91 |   object-position: center;
 92 | }
 93 | 
 94 | figcaption {
 95 |   @extend %primary-font;
 96 | 
 97 |   color: $secondary-color;
 98 |   display: block;
 99 |   font-size: 0.875rem;
100 |   font-style: normal;
101 |   font-weight: 400;
102 |   margin-top: 0.75rem;
103 |   text-align: center;
104 |   width: 100%;
105 | }
106 | 
107 | /* 05.typography - Titles
108 | /* ---------------------------------------------------------- */
109 | 
110 | h1, h2, h3, h4, h5, h6 {
111 |   @extend %primary-font;
112 | 
113 |   color: $title-color;
114 |   font-style: normal;
115 |   font-weight: 700;
116 |   line-height: 1.25;
117 |   margin: 1.5rem 0 0;
118 |   word-break: break-word;
119 | }
120 | 
121 | h1 { font-size: 2.25rem; }
122 | h2 { font-size: 1.75rem; }
123 | h3 { font-size: 1.5rem; }
124 | h4 { font-size: 1.375rem; }
125 | h5 { font-size: 1.25rem; }
126 | h6 { font-size: 1.125rem; }
127 | 
128 | strong {
129 |   font-weight: 700;
130 | }
131 | 
132 | p {
133 |   margin: 1.25rem 0 0;
134 | }
135 | 
136 | /* 06. <hr> <Mark>
137 | /* ---------------------------------------------------------- */
138 | 
139 | hr {
140 |   box-sizing: content-box;
141 |   height: 0;
142 |   margin: 1rem 0;
143 |   overflow: visible;
144 |   border: 0;
145 |   border-top: 1px solid #e2ecec;
146 | }
147 | 
148 | mark {
149 |   background-color: transparent;
150 |   background-image: linear-gradient(to bottom, rgba(215, 253, 211, 1), rgba(215, 253, 211, 1));
151 |   color: rgba(0, 0, 0, 0.8);
152 | }
153 | 
154 | /* 07. Code and pre
155 | /* ---------------------------------------------------------- */
156 | 
157 | $whitegrey: #e5eff5;
158 | $darkgrey: #2a3644;
159 | 
160 | code,
161 | pre {
162 |   font-family: Menlo, Courier, monospace;
163 |   hyphens: none;
164 |   tab-size: 4;
165 |   white-space: pre;
166 |   word-break: normal;
167 |   word-spacing: normal;
168 |   word-wrap: normal;
169 | }
170 | 
171 | :not(pre) > code {
172 |   background: $whitegrey;
173 |   border-radius: 2px;
174 |   color: $darkgrey;
175 |   font-size: 1rem;
176 |   padding: 1px 6px;
177 | }
178 | 
179 | pre {
180 |   background: $darkgrey;
181 |   border: 0;
182 |   color: $whitegrey;
183 |   font-size: 0.875rem;
184 |   line-height: 1.6em;
185 |   margin: 0;
186 |   overflow-x: auto;
187 |   padding: 1.25rem;
188 |   border-radius: 8px;
189 | 
190 |   code {
191 |     background: transparent;
192 |     padding: 0;
193 |   }
194 | }
195 | 
196 | /* 08. SVG
197 | /* ---------------------------------------------------------- */
198 | 
199 | svg {
200 |   height: 100%;
201 |   width: 100%;
202 | }
203 | 
204 | svg:not(:root) {
205 |   overflow: hidden;
206 | }
207 | 
208 | /* 08. SVG
209 | /* ---------------------------------------------------------- */
210 | 
211 | table {
212 |   border-collapse: collapse;
213 |   border-spacing: 0;
214 |   display: inline-block;
215 |   font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
216 |   font-size: 1rem;
217 |   line-height: 1.5;
218 |   margin: 1.25rem 0 0;
219 |   max-width: 100%;
220 |   overflow-x: auto;
221 |   vertical-align: top;
222 |   white-space: nowrap;
223 |   width: auto;
224 |   -webkit-overflow-scrolling: touch;
225 | 
226 |   th,
227 |   td {
228 |     border: 1px solid #dfe2e5;
229 |     padding: 0.5rem 0.875rem;
230 |   }
231 | 
232 |   tr:nth-child(2n) {
233 |     background-color: #f6f8fa;
234 |   }
235 | 
236 |   th {
237 |     font-weight: 500;
238 |     letter-spacing: 0.2px;
239 |     text-transform: uppercase;
240 |   }
241 | }
242 | 
243 | /* 09. Header
244 | /* ---------------------------------------------------------- */
245 | 
246 | .header {
247 |   box-shadow: 0 0 3px rgba(0, 0, 0, .03), 0 3px 46px rgba(0, 0, 0, .07);
248 | }
249 | 
250 | .logo-link {
251 |   color: #000;
252 |   font-size: 1.75rem;
253 |   font-weight: 700;
254 | }
255 | 
256 | /* 10. Social Media
257 | /* ---------------------------------------------------------- */
258 | 
259 | .social-media a {
260 |   display: inline-block;
261 |   height: 2.5rem;
262 |   margin: 0.5rem 0;
263 |   padding: 0.5rem;
264 |   vertical-align: middle;
265 |   width: 2.5rem;
266 | }
267 | 
268 | /* 11. Sidenav
269 | /* ---------------------------------------------------------- */
270 | 
271 | .sidebar {
272 |   background: #fff;
273 |   width: 18rem;
274 | }
275 | 
276 | .sidebar ul {
277 |   list-style: none;
278 |   list-style-image: none;
279 |   margin: 1.125rem 0 1.25rem;
280 |   padding: 0;
281 | }
282 | 
283 | .sidebar ul li a {
284 |   color: $sidenar-link-color;
285 |   display: block;
286 |   font-size: 1.125rem;
287 |   font-weight: 500;
288 |   padding: 0.5rem 1.25rem;
289 | }
290 | 
291 | .close-sidebar {
292 |   font-size: 1.5rem;
293 |   outline: none;
294 | }
295 | 
296 | .hamburgermenu {
297 |   background-color: transparent;
298 |   border: 0;
299 |   height: 3rem;
300 |   margin-right: -1rem;
301 |   padding: 0;
302 |   position: relative;
303 |   transition: transform 0.4s;
304 |   width: 3rem;
305 |   outline: none;
306 | 
307 |   span {
308 |     background-color: currentColor;
309 |     display: block;
310 |     height: 2px;
311 |     left: 0.875rem;
312 |     margin-top: -1px;
313 |     position: absolute;
314 |     top: 50%;
315 |     width: 1.25rem;
316 | 
317 |     &:first-child {
318 |       transform: translate(0, -6px);
319 |     }
320 | 
321 |     &:last-child {
322 |       transform: translate(0, 6px);
323 |     }
324 |   }
325 | }
326 | 
327 | /* 12. Conten main
328 | /* ---------------------------------------------------------- */
329 | 
330 | .main {
331 |   margin: 0 auto;
332 |   max-width: 42.5rem;
333 | }
334 | 
335 | /* 13. Article
336 | /* ---------------------------------------------------------- */
337 | 
338 | .article-body {
339 |   font-family: $secondary-font;
340 |   font-size: 1.125rem;
341 |   line-height: 1.7em;
342 | }
343 | 
344 | .article-body > * {
345 |   margin-bottom: 1.5rem;
346 | }
347 | 
348 | .article-body a:not(.kg-bookmark-container) {
349 |   text-decoration: underline;
350 |   word-break: break-word;
351 | }
352 | 
353 | .article-body ul, .article-body ol {
354 |   padding-left: 1.25rem;
355 | }
356 | 
357 | .article-body ul li, .article-body ol li {
358 |   margin-bottom: 5px;
359 | }
360 | 
361 | /* 14. Buttons for Tag
362 | /* ---------------------------------------------------------- */
363 | 
364 | .button-tags {
365 |   background-color: $complementary-color;
366 |   border-radius: 1.5625rem;
367 |   border: 0;
368 |   color: #fff;
369 |   display: inline-block;
370 |   margin: 0.3125rem;
371 |   padding: 0.3125rem 1.25rem;
372 | }
373 | 
374 | /* 15. share
375 | /* ---------------------------------------------------------- */
376 | 
377 | amp-social-share.custom-style {
378 |   background-color: #008080;
379 |   background-image: url("https://raw.githubusercontent.com/google/material-design-icons/master/social/1x_web/ic_share_white_48dp.png");
380 |   background-repeat: no-repeat;
381 |   background-position: center;
382 |   background-size: contain;
383 | }
384 | 
385 | amp-social-share.rounded {
386 |   border-radius: 10%;
387 |   background-size: 85%;
388 | }
389 | 
390 | /* 16. Related Article
391 | /* ---------------------------------------------------------- */
392 | 
393 | .story-link-text {
394 |   font-size: 1rem;
395 |   font-weight: 700;
396 |   color: $title-color;
397 | }
398 | 
399 | .story-link-icon {
400 |   background-color: $complementary-color;
401 |   height: 2.5rem;
402 |   text-align: center;
403 |   width: 2.5rem;
404 |   color: #fff;
405 |   font-size: 1.5rem;
406 |   font-weight: 500;
407 | }
408 | 
409 | /* 17. Bookmark card
410 | /* ---------------------------------------------------------- */
411 | 
412 | .kg-bookmark-container {
413 |   @extend %primary-font;
414 | }
415 | 
416 | .kg-bookmark {
417 |   &-container {
418 |     border: 1px solid rgba(0, 0, 0, 0.1);
419 |     display: flex;
420 |     flex-direction: column;
421 |   }
422 | 
423 |   &-content {
424 |     order: 1;
425 |     padding: 1.25rem;
426 |   }
427 | 
428 |   &-title {
429 |     font-size: 1.125rem;
430 |     font-weight: 500;
431 |     line-height: 1.2;
432 |   }
433 | 
434 |   &-description {
435 |     color: $secondary-color;
436 |     font-size: 0.875rem;
437 |     line-height: 1.4;
438 |     margin-top: 0.75rem;
439 |   }
440 | 
441 |   &-metadata {
442 |     align-items: center;
443 |     display: flex;
444 |     font-size: 0.875rem;
445 |     margin-top: 0.75rem;
446 |   }
447 | 
448 |   &-icon {
449 |     margin-right: 5px;
450 |   }
451 | 
452 |   &-author::after {
453 |     content: "•";
454 |     margin: 0 6px;
455 |   }
456 | 
457 |   &-publisher {
458 |     color: inherit;
459 |   }
460 | }
461 | 
462 | /* 18. Embed card
463 | /* ---------------------------------------------------------- */
464 | 
465 | .kg-embed-card {
466 |   display: flex;
467 |   flex-direction: column;
468 |   align-items: center;
469 |   width: 100%;
470 | }
471 | 
472 | /* 19 gallery Card
473 | /* ---------------------------------------------------------- */
474 | 
475 | .kg-image-card img {
476 |   margin: auto;
477 | }
478 | 
479 | .kg-gallery-card + .kg-gallery-card {
480 |   margin-top: 0.75em;
481 | }
482 | 
483 | .kg-gallery-container {
484 |   position: relative;
485 | }
486 | 
487 | .kg-gallery-row {
488 |   display: flex;
489 |   flex-direction: row;
490 |   justify-content: center;
491 | }
492 | 
493 | .kg-gallery-image {
494 |   width: 100%;
495 |   height: 100%;
496 | }
497 | 
498 | .kg-gallery-row:not(:first-of-type) {
499 |   margin: 0.75em 0 0 0;
500 | }
501 | 
502 | .kg-gallery-image:not(:first-of-type) {
503 |   margin: 0 0 0 0.75em;
504 | }
505 | 
506 | /* 20. Toggle Card
507 | /* ---------------------------------------------------------- */
508 | 
509 | .kg-toggle-card-icon {
510 |   display: none;
511 | }
512 | 
513 | .kg-toggle-content {
514 |   margin-top: 0.8rem;
515 | }
516 | 
517 | /* 21. Prodct card
518 | /* ---------------------------------------------------------- */
519 | 
520 | .kg-product-card-container {
521 |   background: transparent;
522 |   padding: 20px;
523 |   width: 100%;
524 |   border-radius: 5px;
525 |   box-shadow: inset 0 0 0 1px rgb(124 139 154 / 25%);
526 | }
527 | 
528 | .kg-product-card-description p {
529 |   margin-top: 1.5em;
530 | }
531 | 
532 | .kg-product-card-description ul {
533 |   margin-left: 24px;
534 | }
535 | 
536 | .kg-product-card-title {
537 |   font-size: 1.9rem;
538 |   font-weight: 700;
539 | }
540 | 
541 | .kg-product-card-rating-star {
542 |   height: 28px;
543 |   width: 20px;
544 |   margin-right: 2px;
545 | }
546 | 
547 | .kg-product-card-rating-star svg {
548 |   width: 16px;
549 |   height: 16px;
550 |   fill: currentColor;
551 |   opacity: 0.15;
552 | }
553 | 
554 | .kg-product-card-rating-active.kg-product-card-rating-star svg {
555 |   opacity: 1;
556 | }
557 | 
558 | /* 22. ntf card
559 | /* ---------------------------------------------------------- */
560 | 
561 | .kg-nft-card-container {
562 |   position: relative;
563 |   display: flex;
564 |   flex: auto;
565 |   flex-direction: column;
566 |   text-decoration: none;
567 |   font-family: -apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Open Sans,Helvetica Neue,sans-serif;
568 |   font-size: 1.4rem;
569 |   font-weight: 400;
570 |   box-shadow: 0 2px 6px -2px rgb(0 0 0 / 10%), 0 0 1px rgb(0 0 0 / 40%);
571 |   width: 100%;
572 |   max-width: 512px;
573 |   color: #15212A;
574 |   background: #fff;
575 |   border-radius: 5px;
576 |   transition: none;
577 |   margin: 0 auto;
578 | }
579 | 
580 | .kg-nft-metadata {
581 |   padding: 2.0rem;
582 | }
583 | 
584 | .kg-nft-image-container {
585 |   position: relative;
586 | }
587 | 
588 | .kg-nft-image {
589 |   display: flex;
590 |   border-radius: 5px 5px 0 0;
591 | }
592 | 
593 | .kg-nft-header {
594 |   display: flex;
595 |   justify-content: space-between;
596 |   align-items: flex-start;
597 |   gap: 20px;
598 | }
599 | 
600 | .kg-nft-header h4.kg-nft-title {
601 |   font-size: 1.9rem;
602 |   font-weight: 700;
603 |   margin: 0;
604 |   color: #15212A;
605 | }
606 | 
607 | .kg-nft-header amp-img {
608 |   max-width: 114px;
609 |   max-height: 26px;
610 | }
611 | 
612 | .kg-nft-opensea-logo {
613 |   margin-top: 2px;
614 |   width: 100px;
615 | }
616 | 
617 | .kg-nft-creator {
618 |   font-family: inherit;
619 |   color: #95A1AD;
620 | }
621 | 
622 | .kg-nft-creator span {
623 |   font-weight: 500;
624 |   color: #15212A;
625 | }
626 | 
627 | .kg-nft-card p.kg-nft-description {
628 |   font-size: 1.4rem;
629 |   line-height: 1.4em;
630 |   margin: 2.0rem 0 0;
631 |   color: #222;
632 | }
633 | 
634 | /* 23. Button Card
635 | /* ---------------------------------------------------------- */
636 | 
637 | .kg-button-card {
638 |   display: flex;
639 |   position: static;
640 |   align-items: center;
641 |   width: 100%;
642 |   justify-content: center;
643 | }
644 | 
645 | .kg-btn {
646 |   display: flex;
647 |   position: static;
648 |   align-items: center;
649 |   padding: 0 2.0rem;
650 |   height: 4.0rem;
651 |   line-height: 4.0rem;
652 |   font-size: 1.65rem;
653 |   font-weight: 600;
654 |   text-decoration: none;
655 |   border-radius: 5px;
656 |   transition: opacity 0.2s ease-in-out;
657 | }
658 | 
659 | .kg-btn:hover {
660 |   opacity: 0.85;
661 | }
662 | 
663 | .kg-btn-accent {
664 |   background-color: var(--ghost-accent-color, #1292EE);
665 |   color: #fff;
666 | }
667 | 
668 | /* 24. callout card
669 | /* ---------------------------------------------------------- */
670 | 
671 | .kg-callout-card {
672 |   display: flex;
673 |   padding: 20px 28px;
674 |   border-radius: 3px;
675 | }
676 | 
677 | .kg-callout-card-grey {
678 |   background: rgba(124, 139, 154, 0.13);
679 | }
680 | 
681 | .kg-callout-card-white {
682 |   background: transparent;
683 |   box-shadow: inset 0 0 0 1px rgba(124, 139, 154, 0.25);
684 | }
685 | 
686 | .kg-callout-card-blue {
687 |   background: rgba(33, 172, 232, 0.12);
688 | }
689 | 
690 | .kg-callout-card-green {
691 |   background: rgba(52, 183, 67, 0.12);
692 | }
693 | 
694 | .kg-callout-card-yellow {
695 |   background: rgba(240, 165, 15, 0.13);
696 | }
697 | 
698 | .kg-callout-card-red {
699 |   background: rgba(209, 46, 46, 0.11);
700 | }
701 | 
702 | .kg-callout-card-pink {
703 |   background: rgba(225, 71, 174, 0.11);
704 | }
705 | 
706 | .kg-callout-card-purple {
707 |   background: rgba(135, 85, 236, 0.12);
708 | }
709 | 
710 | .kg-callout-card-accent {
711 |   background: var(--ghost-accent-color);
712 |   color: #fff;
713 | }
714 | 
715 | .kg-callout-card-accent a {
716 |   color: #fff;
717 | }
718 | 
719 | .kg-callout-emoji {
720 |   padding-right: 16px;
721 |   line-height: 1.3;
722 |   font-size: 1.25em;
723 | }
724 | 
725 | /* 25. Header Card
726 | /* ---------------------------------------------------------- */
727 | 
728 | .kg-header-card {
729 |   padding: 6em 3em;
730 |   display: flex;
731 |   flex-direction: column;
732 |   align-items: center;
733 |   justify-content: center;
734 |   text-align: center;
735 | }
736 | 
737 | .kg-header-card.kg-size-small {
738 |   padding-top: 4em;
739 |   padding-bottom: 4em;
740 | }
741 | 
742 | .kg-header-card.kg-size-large {
743 |   padding-top: 12em;
744 |   padding-bottom: 12em;
745 | }
746 | 
747 | .kg-header-card.kg-width-full {
748 |   padding-left: 4em;
749 |   padding-right: 4em;
750 | }
751 | 
752 | .kg-header-card.kg-align-left {
753 |   text-align: left;
754 |   align-items: flex-start;
755 | }
756 | 
757 | .kg-header-card.kg-style-dark {
758 |   background: #15171a;
759 |   color: #ffffff;
760 | }
761 | 
762 | .kg-header-card.kg-style-light {
763 |   color: #15171a;
764 |   border: 1px solid rgba(124, 139, 154, 0.25);
765 |   border-width: 1px 0;
766 | }
767 | 
768 | .kg-header-card.kg-style-accent {
769 |   background-color: var(--ghost-accent-color);
770 | }
771 | 
772 | .kg-header-card.kg-style-image {
773 |   background-color: #e7e7eb;
774 |   background-size: cover;
775 |   background-position: center center;
776 | }
777 | 
778 | .kg-header-card h2 {
779 |   font-size: 4em;
780 |   font-weight: 700;
781 |   line-height: 1.1em;
782 |   margin: 0;
783 | }
784 | 
785 | .kg-header-card h2 strong {
786 |   font-weight: 800;
787 | }
788 | 
789 | .kg-header-card.kg-size-small h2 {
790 |   font-size: 3em;
791 | }
792 | 
793 | .kg-header-card.kg-size-large h2 {
794 |   font-size: 5em;
795 | }
796 | 
797 | .kg-header-card h3 {
798 |   font-size: 1.25em;
799 |   font-weight: 500;
800 |   line-height: 1.3em;
801 |   margin: 0;
802 | }
803 | 
804 | .kg-header-card h3 strong {
805 |   font-weight: 600;
806 | }
807 | 
808 | .kg-header-card.kg-size-small h3 {
809 |   font-size: 1em;
810 | }
811 | 
812 | .kg-header-card.kg-size-large h3 {
813 |   font-size: 1.5em;
814 | }
815 | 
816 | .kg-header-card:not(.kg-style-light) h2,
817 | .kg-header-card:not(.kg-style-light) h3 {
818 |   color: #ffffff;
819 | }
820 | 
821 | .kg-header-card a.kg-header-card-button {
822 |   display: flex;
823 |   position: static;
824 |   align-items: center;
825 |   padding: 0 1.2em;
826 |   height: 2.4em;
827 |   line-height: 1em;
828 |   font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", "Roboto", "Oxygen", "Ubuntu", "Cantarell", "Fira Sans", "Droid Sans", "Helvetica Neue", sans-serif;
829 |   font-size: 0.95em;
830 |   font-weight: 600;
831 |   text-decoration: none;
832 |   border-radius: 5px;
833 |   transition: opacity 0.2s ease-in-out;
834 |   background-color: var(--ghost-accent-color);
835 |   color: #ffffff;
836 |   margin: 1.75em 0 0;
837 | }
838 | 
839 | .kg-header-card a.kg-header-card-button:hover {
840 |   opacity: 0.85;
841 | }
842 | 
843 | .kg-header-card.kg-size-large a.kg-header-card-button {
844 |   margin-top: 2em;
845 | }
846 | 
847 | .kg-header-card.kg-size-small a.kg-header-card-button {
848 |   margin-top: 1.5em;
849 | }
850 | 
851 | .kg-header-card.kg-style-image a.kg-header-card-button,
852 | .kg-header-card.kg-style-dark a.kg-header-card-button {
853 |   background: #ffffff;
854 |   color: #15171a;
855 | }
856 | 
857 | .kg-header-card.kg-style-accent a.kg-header-card-button {
858 |   background: #ffffff;
859 |   color: var(--ghost-accent-color);
860 | }
861 | 
862 | /* 26. Audio Card
863 | /* ---------------------------------------------------------- */
864 | 
865 | .kg-audio-card {
866 |   display: flex;
867 |   width: 100%;
868 |   box-shadow: inset 0 0 0 1px rgba(124, 139, 154, 0.25);
869 | }
870 | 
871 | .kg-audio-thumbnail {
872 |   display: flex;
873 |   justify-content: center;
874 |   align-items: center;
875 |   width: 80px;
876 |   min-width: 80px;
877 |   height: 80px;
878 |   background: transparent;
879 |   object-fit: cover;
880 |   aspect-ratio: 1/1;
881 |   border-radius: 3px 0 0 3px;
882 | }
883 | 
884 | .kg-audio-thumbnail.placeholder {
885 |   background: var(--ghost-accent-color);
886 | }
887 | 
888 | .kg-audio-thumbnail.placeholder svg {
889 |   width: 24px;
890 |   height: 24px;
891 |   fill: white;
892 | }
893 | 
894 | .kg-audio-player-container {
895 |   position: relative;
896 |   display: flex;
897 |   flex-direction: column;
898 |   justify-content: space-between;
899 |   width: 100%;
900 |   --seek-before-width: 0%;
901 |   --volume-before-width: 100%;
902 |   --buffered-width: 0%;
903 | }
904 | 
905 | .kg-audio-title {
906 |   width: 100%;
907 |   padding: 8px 12px 0;
908 |   border: none;
909 |   font-family: inherit;
910 |   font-size: 1.1em;
911 |   font-weight: 700;
912 |   background: transparent;
913 | }
914 | 
915 | .kg-audio-player {
916 |   display: none;
917 | }
918 | 
919 | .kg-width-full.kg-card-hascaption {
920 |   display: grid;
921 |   grid-template-columns: inherit;
922 | }
923 | 
924 | 


--------------------------------------------------------------------------------
/src/css/amp/utilities.css:
--------------------------------------------------------------------------------
  1 | /* stylelint-disable */
  2 | .container {
  3 |   margin-left: auto;
  4 |   margin-right: auto;
  5 |   padding-left: 1rem;
  6 |   padding-right: 1rem;
  7 | }
  8 | 
  9 | .text-gray-800 {
 10 |   color: #292929;
 11 | }
 12 | 
 13 | .text-white {
 14 |   color: #fff;
 15 | }
 16 | 
 17 | .text-gray-500 {
 18 |   color: #757575;
 19 | }
 20 | 
 21 | .block {
 22 |   display: block;
 23 | }
 24 | 
 25 | .uppercase {
 26 |   text-transform: uppercase;
 27 | }
 28 | 
 29 | .capitalize {
 30 |   text-transform: capitalize;
 31 | }
 32 | 
 33 | .tracking-wider {
 34 |   letter-spacing: 0.05em;
 35 | }
 36 | 
 37 | .leading-snug {
 38 |   line-height: 1.375;
 39 | }
 40 | 
 41 | .text-sm {
 42 |   font-size: 0.875rem;
 43 | }
 44 | 
 45 | .text-lg {
 46 |   font-size: 1.25rem;
 47 | }
 48 | 
 49 | .text-center {
 50 |   text-align: center;
 51 | }
 52 | 
 53 | .font-medium {
 54 |   font-weight: 500;
 55 | }
 56 | 
 57 | .h-16 {
 58 |   height: 4rem;
 59 | }
 60 | 
 61 | .m-0 {
 62 |   margin: 0;
 63 | }
 64 | 
 65 | .mt-8 {
 66 |   margin-top: 2rem;
 67 | }
 68 | 
 69 | .mr-3 {
 70 |   margin-right: 0.75rem;
 71 | }
 72 | 
 73 | .mb-3 {
 74 |   margin-bottom: 0.75rem;
 75 | }
 76 | 
 77 | .mb-5 {
 78 |   margin-bottom: 1.25rem;
 79 | }
 80 | 
 81 | .mx-1 {
 82 |   margin-left: 0.25rem;
 83 |   margin-right: 0.25rem;
 84 | }
 85 | 
 86 | .pt-8 {
 87 |   padding-top: 2rem;
 88 | }
 89 | 
 90 | .pb-8 {
 91 |   padding-bottom: 2rem;
 92 | }
 93 | 
 94 | .px-4 {
 95 |   padding-right: 1rem;
 96 |   padding-left: 1rem;
 97 | }
 98 | 
 99 | .rounded-full {
100 |   border-radius: 9999px;
101 | }
102 | 
103 | .overflow-hidden {
104 |   overflow: hidden;
105 | }
106 | 
107 | .flex {
108 |   display: flex;
109 | }
110 | 
111 | .flex-none {
112 |   flex: none;
113 | }
114 | 
115 | .flex-auto {
116 |   flex: 1 1 auto;
117 | }
118 | 
119 | .flex-col {
120 |   flex-direction: column;
121 | }
122 | 
123 | .items-center {
124 |   align-items: center;
125 | }
126 | 
127 | .justify-between {
128 |   justify-content: space-between;
129 | }
130 | 


--------------------------------------------------------------------------------
/src/css/base/base.css:
--------------------------------------------------------------------------------
  1 | html {
  2 |   @apply text-base;
  3 | }
  4 | 
  5 | body {
  6 |   @apply
  7 |     /* bg-base */
  8 |     font-normal
  9 |     leading-normal
 10 |     /* text-base */
 11 |     text-global;
 12 | 
 13 |   color: var(--text-base);
 14 |   background-color: var(--bg-base) ;
 15 |   letter-spacing: 0;
 16 |   margin: 0 auto;
 17 |   overflow-x: hidden;
 18 |   text-rendering: optimizeLegibility;
 19 | }
 20 | 
 21 | a {
 22 |   color: inherit;
 23 |   text-decoration: none;
 24 |   transition: all .25s ease-in-out;
 25 | 
 26 |   /* &:focus,
 27 |   &:active,
 28 |   &:hover {
 29 |     outline: 0;
 30 |   } */
 31 | }
 32 | 
 33 | /* 1. Blockquote
 34 | /* ---------------------------------------------------------- */
 35 | 
 36 | blockquote:not([class]) {
 37 |   @apply text-2xl italic;
 38 | 
 39 |   border-left: 3px solid currentColor;
 40 |   line-height: 1.5;
 41 |   /* margin: 2rem 0 2rem -1.5rem; */
 42 |   /* padding-bottom: .125rem; */
 43 |   padding-left: 4vmin;
 44 |   margin-left: -.25rem;
 45 | 
 46 |   /* p:first-of-type {
 47 |     margin-top: 0;
 48 |   } */
 49 | 
 50 |   @media (min-width: theme("screens.sm")) {
 51 |     font-size: 1.5rem;
 52 |     margin-left: -4vmin;
 53 |   }
 54 | }
 55 | 
 56 | /* 2. cite - figcamption - figure
 57 | /* ---------------------------------------------------------- */
 58 | 
 59 | cite,
 60 | figcaption {
 61 |   @apply
 62 |     block
 63 |     font-medium
 64 |     text-center
 65 |     text-gray-500
 66 |     font-serif
 67 |     italic
 68 |     text-base;
 69 | 
 70 |   font-feature-settings: "liga" on, "lnum" on;
 71 |   line-height: 1.4em;
 72 |   padding: 1rem 1.25rem 0;
 73 |   /* width: 100%; */
 74 | 
 75 |   a {
 76 |     text-decoration: underline;
 77 |   }
 78 | }
 79 | 
 80 | cite {
 81 |   text-align: left;
 82 | }
 83 | 
 84 | /* 3. hr
 85 | /* ---------------------------------------------------------- */
 86 | 
 87 | hr {
 88 |   border-top: 1px solid var(--border-color);
 89 |   box-sizing: content-box;
 90 |   margin: 2rem 0;
 91 | }
 92 | 
 93 | /* 4. Image
 94 | /* ---------------------------------------------------------- */
 95 | 
 96 | img {
 97 |   vertical-align: middle;
 98 |   width: auto;
 99 | }
100 | 
101 | img:not([src]) {
102 |   visibility: hidden;
103 | }
104 | 
105 | /* 5. List ol - ul
106 | /* ---------------------------------------------------------- */
107 | 
108 | /* 6. Mark
109 | /* ---------------------------------------------------------- */
110 | 
111 | mark {
112 |   @apply bg-mark;
113 | 
114 |   color: inherit;
115 | }
116 | 


--------------------------------------------------------------------------------
/src/css/base/global.css:
--------------------------------------------------------------------------------
 1 | /* Img Blur lazyloaded
 2 | /* ---------------------------------------------------------- */
 3 | 
 4 | .blur-up {
 5 |   opacity: 0;
 6 | }
 7 | 
 8 | .blur-up.lazyloaded {
 9 |   opacity: 1;
10 |   transition: opacity 0.5s ease-in-out;
11 | }
12 | 
13 | /* Loanding Bar
14 | /* ---------------------------------------------------------- */
15 | 
16 | .loadingBar {
17 |   background-color: #48e79a;
18 |   height: 2px;
19 |   transform: translateX(100%);
20 |   z-index: 800;
21 | }
22 | 
23 | .is-loading .loadingBar {
24 |   animation: loading-bar 1s ease-in-out infinite;
25 |   animation-delay: 0.8s;
26 |   display: block;
27 | }
28 | 
29 | @keyframes loading-bar {
30 |   0% { transform: translateX(-100%); }
31 |   40% { transform: translateX(0); }
32 |   60% { transform: translateX(0); }
33 |   100% { transform: translateX(100%); }
34 | }
35 | 
36 | /* Inset Image
37 | /* ---------------------------------------------------------- */
38 | 
39 | .inset-image {
40 |   @extend %inset-image;
41 | }
42 | 
43 | /* Video Responsive
44 | /* ---------------------------------------------------------- */
45 | 
46 | .video-responsive {
47 |   display: block;
48 |   height: 0;
49 |   overflow: hidden;
50 |   padding: 0 0 56.25%;
51 |   position: relative;
52 |   width: 100%;
53 | 
54 |   video,
55 |   iframe {
56 |     border: 0;
57 |     bottom: 0;
58 |     height: 100%;
59 |     left: 0;
60 |     position: absolute;
61 |     top: 0;
62 |     width: 100%;
63 |   }
64 | }
65 | 
66 | /* Error Page
67 | /* ---------------------------------------------------------- */
68 | 
69 | @screen lg {
70 |   .page-error-number {
71 |     font-size: 15rem !important;
72 |   }
73 | }
74 | 


--------------------------------------------------------------------------------
/src/css/base/root.css:
--------------------------------------------------------------------------------
 1 | /* Root
 2 | /* ---------------------------------------------------------- */
 3 | 
 4 | :root {
 5 |   --ghost-accent-color: $primary-color;
 6 |   --color-primary: var(--ghost-accent-color);
 7 |   --blank: #fff;
 8 | 
 9 |   /* Global Color */
10 |   --bg-base: #fff;
11 |   --text-base: #292929;
12 | 
13 |   /* Header */
14 |   --header-text-link: #292929;
15 |   --header-bg: #fff;
16 | 
17 |   /* font title */
18 |   /* font-title: '' */
19 | 
20 |   /* story */
21 |   --story-small-bg: #fff;
22 |   --card-bg: #fff;
23 | 
24 |   /* title */
25 |   --title-color: #18181B;
26 | 
27 |   /* link */
28 |   --color-link: var(--ghost-accent-color);
29 | 
30 |   --border-color: #e2ecec;
31 | 
32 |   /* Button */
33 |   --button-color: #292929;
34 |   --button-bg: #f2f2f2;
35 |   --button-hover-color: rgba(0,0,0,.7);
36 |   --button-hover-bg: #ececec;
37 | 
38 |   /* Button white */
39 |   --button-white-color: #191919;
40 |   --button-white-bg: #fff;
41 |   --button-white-hover-color: #757575;
42 |   --button-white-hover-bg: #f9f9f9;
43 | 
44 |   /* form */
45 |   --input-color: hsl(0, 0%, 21%);
46 |   --input-bg: #fff;
47 |   --input-border-color: #ced4da;
48 |   --input-hover-border-color: var(--ghost-accent-color);
49 |   --input-focus-border-color: var(--ghost-accent-color);
50 |   --placeholder-color: rgba(54, 54, 54, 0.8);
51 | }
52 | 


--------------------------------------------------------------------------------
/src/css/base/typography.css:
--------------------------------------------------------------------------------
 1 | $font-size-h1: 2.25rem;
 2 | $font-size-h2: 2rem;
 3 | $font-size-h3: 1.75rem;
 4 | $font-size-h4: 1.5rem;
 5 | $font-size-h5: 1.375rem;
 6 | $font-size-h6: 1.125rem;
 7 | 
 8 | h1,
 9 | h2,
10 | h3,
11 | h4,
12 | h5,
13 | h6 {
14 |   @extend %font-sans;
15 | 
16 |   font-weight: 700;
17 |   line-height: 1.25;
18 | }
19 | 
20 | h1 {
21 |   font-size: $font-size-h1;
22 | }
23 | 
24 | h2 {
25 |   font-size: $font-size-h2;
26 | }
27 | 
28 | h3 {
29 |   font-size: $font-size-h3;
30 | }
31 | 
32 | h4 {
33 |   font-size: $font-size-h4;
34 | }
35 | 
36 | h5 {
37 |   font-size: $font-size-h5;
38 | }
39 | 
40 | h6 {
41 |   font-size: $font-size-h6;
42 | }
43 | 
44 | 


--------------------------------------------------------------------------------
/src/css/cards/blockquote.css:
--------------------------------------------------------------------------------
 1 | .kg-blockquote-alt {
 2 |   @apply text-title;
 3 | 
 4 |   font-size: 1.2em;
 5 |   font-style: italic;
 6 |   line-height: 1.7em;
 7 |   padding: 0 1.2em;
 8 |   text-align: center;
 9 | 
10 |   &::before,
11 |   &::after {
12 |     position: absolute;
13 |     opacity: .12;
14 |     font-size: 8em;
15 |     line-height: 1;
16 |   }
17 | 
18 |   &::before {
19 |     top: -1.125rem;
20 |     left: -.5rem;
21 |     content: "\201c";
22 |   }
23 | 
24 |   &::after {
25 |     right: -.375rem;
26 |     bottom: -4rem;
27 |     content: "\201d";
28 |   }
29 | }
30 | 
31 | @screen md {
32 |   .kg-blockquote-alt {
33 |     font-size: 1.5em;
34 |     padding: 0 2em;
35 |   }
36 | }
37 | 


--------------------------------------------------------------------------------
/src/css/cards/bookmark.css:
--------------------------------------------------------------------------------
 1 | .kg-bookmark {
 2 |   &-card {
 3 |     position: relative;
 4 |   }
 5 | 
 6 |   /* &-publisher {
 7 |     color: var(--ghost-accent-color);
 8 |   } */
 9 | 
10 |   &-content {
11 |     @apply flex flex-col grow order-1 p-5;
12 |   }
13 | 
14 |   &-title {
15 |     @apply text-title text-xl font-semibold leading-tight;
16 |   }
17 | 
18 |   &-description {
19 |     @apply text-gray-500 text-base line-clamp-2 mt-3;
20 |   }
21 | 
22 |   &-metadata {
23 |     @apply text-sm flex items-center mt-3;
24 |   }
25 | 
26 |   &-thumbnail {
27 |     flex-grow: 1;
28 |     min-height: 10rem;
29 |     min-width: 33%;
30 |     position: relative;
31 |   }
32 | 
33 |   &-icon {
34 |     @apply w-5 h-5 mr-2;
35 |   }
36 | 
37 |   &-author::after {
38 |     content: "•";
39 |     margin: 0 0.25rem;
40 |     opacity: .4;
41 |   }
42 | }
43 | 
44 | .kg-bookmark-container {
45 |   @extend %card;
46 | 
47 |   display: flex;
48 |   flex-direction: column;
49 |   text-decoration: none !important;
50 | }
51 | 
52 | .kg-bookmark-thumbnail img {
53 |   @extend %inset-image;
54 | }
55 | 
56 | @screen md {
57 |   .kg-bookmark-container {
58 |     flex-direction: row-reverse;
59 |   }
60 | }
61 | 


--------------------------------------------------------------------------------
/src/css/cards/cards.css:
--------------------------------------------------------------------------------
 1 | /* .kg-card {
 2 |   @extend %font-sans;
 3 | } */
 4 | 
 5 | .kg-card:not(.kg-callout-card) {
 6 |   @apply text-base;
 7 | }
 8 | 
 9 | /* Add extra margin before/after any cards,
10 | except for when immediately preceeded by a heading */
11 | .post-body :not(.kg-card):not([id]) + .kg-card {
12 |   margin-top: 6vmin;
13 |   margin-bottom: 0;
14 | }
15 | 
16 | .post-body .kg-card + :not(.kg-card) {
17 |   margin-top: 6vmin;
18 |   margin-bottom: 0;
19 | }
20 | 
21 | /* This keeps small embeds centered */
22 | .kg-embed-card {
23 |   display: flex;
24 |   flex-direction: column;
25 |   align-items: center;
26 |   width: 100%;
27 | }
28 | 
29 | /* This keeps small iamges centered */
30 | .kg-image-card img {
31 |   margin: auto;
32 | }
33 | 


--------------------------------------------------------------------------------
/src/css/cards/gallery.css:
--------------------------------------------------------------------------------
 1 | /* Card captions
 2 | /* ---------------------------------------------------------- */
 3 | 
 4 | .kg-width-full {
 5 |   grid-column: full-start / full-end;
 6 |   z-index: 2;
 7 | 
 8 |   img {
 9 |     width: 100%;
10 |   }
11 | 
12 |   &.kg-card-hascaption {
13 |     display: grid;
14 |     grid-template-columns: inherit;
15 |   }
16 | 
17 |   &.kg-card-hascaption img {
18 |     grid-column: 1 / -1;
19 |   }
20 | 
21 |   &.kg-card-hascaption figcaption {
22 |     grid-column: main-start / main-end;
23 |   }
24 | }
25 | 
26 | .kg-width-wide {
27 |   grid-column: wide-start / wide-end;
28 |   z-index: 2;
29 | 
30 |   &.kg-card-hascaption img {
31 |     grid-column: wide-start / wide-end;
32 |   }
33 | }
34 | 
35 | 


--------------------------------------------------------------------------------
/src/css/components/code.css:
--------------------------------------------------------------------------------
  1 | $whitegrey: #e5eff5;
  2 | $darkgrey: #343f44;
  3 | $blue: #3eb0ef;
  4 | 
  5 | :not(pre) > code {
  6 |   border-radius: 3px;
  7 |   white-space: normal;
  8 |   background: $whitegrey;
  9 |   text-shadow: none;
 10 |   color: $darkgrey;
 11 |   font-size: .875em;
 12 |   padding: .2rem .33rem;
 13 |   vertical-align: 1%;
 14 | }
 15 | 
 16 | pre {
 17 |   overflow-x: auto;
 18 |   margin: 0;
 19 |   padding: 20px;
 20 |   max-width: 100%;
 21 |   border: 0;
 22 |   color: $whitegrey;
 23 |   font-size: 0.875rem;
 24 |   line-height: 1.6em;
 25 |   background: #2a3644;
 26 |   border-radius: 5px;
 27 | 
 28 |   code {
 29 |     padding: 0;
 30 |     font-size: inherit;
 31 |     line-height: inherit;
 32 |     background: transparent;
 33 |     white-space: pre;
 34 | 
 35 |     * { color: inherit; }
 36 |   }
 37 | }
 38 | 
 39 | /* Code Boxes
 40 | /* ---------------------------------------------------------- */
 41 | 
 42 | /* stylelint-disable-next-line */
 43 | code,
 44 | pre {
 45 |   /* font-family: Space Mono, SFMono-Regular, Menlo, Monaco, Consolas, Liberation Mono, Courier New, monospace; */
 46 |   white-space: pre;
 47 |   word-spacing: normal;
 48 |   word-break: normal;
 49 |   word-wrap: normal;
 50 |   tab-size: 4;
 51 |   hyphens: none;
 52 | }
 53 | 
 54 | /* Prism
 55 | /* ---------------------------------------------------------- */
 56 | pre[class*="language-"] {
 57 |   padding: 1.25rem;
 58 |   /* margin-bottom: 1rem; */
 59 |   overflow: auto;
 60 |   border-radius: 8px;
 61 | }
 62 | 
 63 | :not(pre) > code[class*="language-"],
 64 | pre[class*="language-"] {
 65 |   border: 0;
 66 | }
 67 | 
 68 | /* Inline code */
 69 | :not(pre) > code[class*="language-"] {
 70 |   padding: .3em .4em;
 71 |   border-radius: .3em;
 72 |   white-space: normal;
 73 |   background: $whitegrey;
 74 |   text-shadow: none;
 75 |   color: $darkgrey;
 76 |   font-size: 0.9em;
 77 | }
 78 | 
 79 | a > code[class*="language-"] {
 80 |   color: $blue;
 81 | }
 82 | 
 83 | .token.comment,
 84 | .token.prolog,
 85 | .token.doctype,
 86 | .token.cdata {
 87 |   color: rgba(255, 255, 255, 0.5);
 88 | }
 89 | 
 90 | .token.punctuation {
 91 |   color: #fff;
 92 | }
 93 | 
 94 | .namespace {
 95 |   opacity: .7;
 96 | }
 97 | 
 98 | .token.property,
 99 | .token.tag,
100 | .token.constant,
101 | .token.symbol,
102 | .token.deleted {
103 |   color: #ff5884;
104 | }
105 | 
106 | .token.boolean,
107 | .token.number {
108 |   color: #ae81ff;
109 | }
110 | 
111 | .token.selector,
112 | .token.attr-name,
113 | .token.string,
114 | .token.char,
115 | .token.builtin,
116 | .token.inserted {
117 |   color: #e6db74;
118 | }
119 | 
120 | .token.operator,
121 | .token.entity,
122 | .token.url,
123 | .language-css .token.string,
124 | .style .token.string,
125 | .token.variable {
126 |   color: #fff;
127 | }
128 | 
129 | .token.atrule,
130 | .token.attr-value,
131 | .token.function,
132 | .token.class-name {
133 |   color: #a6e22e;
134 | }
135 | 
136 | .token.keyword {
137 |   color: #66d9ef;
138 | }
139 | 
140 | .token.regex,
141 | .token.important {
142 |   color: #fd971f;
143 | }
144 | 
145 | .token.important,
146 | .token.bold {
147 |   font-weight: bold;
148 | }
149 | 
150 | .token.italic {
151 |   font-style: italic;
152 | }
153 | 
154 | .token.entity {
155 |   cursor: help;
156 | }
157 | 


--------------------------------------------------------------------------------
/src/css/components/modal.css:
--------------------------------------------------------------------------------
 1 | /* Modal
 2 | /* ---------------------------------------------------------- */
 3 | 
 4 | %modal {
 5 |   opacity: 0;
 6 |   transition: opacity .2s ease-out .1s, visibility 0s .4s;
 7 |   visibility: hidden;
 8 |   z-index: 100;
 9 | }
10 | 
11 | %modal-inner {
12 |   opacity: 0;
13 |   transform: scale(.6);
14 |   transition: transform .3s cubic-bezier(.06, .47, .38, .99), opacity .3s cubic-bezier(.06, .47, .38, .99);
15 | }
16 | 
17 | %modal-active {
18 |   opacity: 1;
19 |   transform: scale(1);
20 |   transition: transform .8s cubic-bezier(.26, .63, 0, .96);
21 | }
22 | 
23 | .modal {
24 |   @extend %modal;
25 | 
26 |   &-content {
27 |     @extend %modal-inner;
28 |   }
29 | 
30 |   &.is-active{
31 |     opacity: 1;
32 |     transition: opacity .3s ease;
33 |     visibility: visible;
34 | 
35 |     /* .modal-content {
36 |       @extend %modal-active;
37 |     } */
38 |   }
39 | }
40 | 
41 | .modal.is-active .modal-content {
42 |   @extend %modal-active;
43 | }
44 | 


--------------------------------------------------------------------------------
/src/css/components/story.css:
--------------------------------------------------------------------------------
 1 | .story {
 2 |   /* background-color: #222831; */
 3 |   max-height: 660px;
 4 | 
 5 |   &-body {
 6 |     padding: 10% 5%;
 7 |   }
 8 | 
 9 |   /* Hover */
10 |   &:hover .story-image-link::before {
11 |     background-color: rgba(0, 0, 0, .55);
12 |   }
13 | }
14 | 
15 | .story-figure {
16 |   padding-top: 90%;
17 |   overflow: hidden;
18 | }
19 | 
20 | .story-image-link::before {
21 |   position: absolute;
22 |   z-index: 1;
23 |   top: 0;
24 |   left: 0;
25 |   width: 100%;
26 |   height: 100%;
27 |   content: "";
28 |   transition: background-color .5s ease-in-out;
29 |   opacity: 1;
30 |   background-color: transparent;
31 |   background-image: linear-gradient(to top, rgba(0, 0, 0, .8) 0%, rgba(255, 255, 255, 0) 60%);
32 | }
33 | 
34 | /* .cat-links-item {
35 |   display: inline-block;
36 |   text-decoration: none;
37 |   color: #212025;
38 |   border-bottom: 3px solid #efeff0;
39 | } */
40 | 
41 | .more-link::after {
42 |   display: inline-block;
43 |   margin-left: .125em;
44 |   content: "\2026";
45 | }
46 | 
47 | /* Previus and next post
48 | /* ---------------------------------------------------------- */
49 | 
50 | .prev-next-body {
51 |   padding: 10% 5%;
52 | }
53 | 
54 | .prev-next-link::before {
55 |   position: absolute;
56 |   top: 0;
57 |   left: 0;
58 |   width: 100%;
59 |   height: 100%;
60 |   content: "";
61 |   transition: background-color .5s ease-in-out;
62 |   background-color: rgba(0, 0, 0, .4);
63 |   z-index: 1;
64 | }
65 | 
66 | .prev-next {
67 |   &-item {
68 |     flex: 1 1 100%;
69 | 
70 |     &:hover .prev-next-link::before {
71 |       background-color: rgba(0, 0, 0, .6);
72 |     }
73 |   }
74 | }
75 | 
76 | 
77 | /* Mediquery afer md
78 | /* ---------------------------------------------------------- */
79 | 
80 | @screen md {
81 |   .story-figure {
82 |     padding-top: 125%;
83 |   }
84 | 
85 |   .prev-next-body {
86 |     padding: 20% 10%;
87 |   }
88 | 
89 |   .prev-next-item {
90 |     flex: 1 1 50%;
91 |   }
92 | }
93 | 


--------------------------------------------------------------------------------
/src/css/elements/buttons.css:
--------------------------------------------------------------------------------
 1 | .button {
 2 |   @extend %control;
 3 |   /* @extend %font-sans; */
 4 | 
 5 |   user-select: none;
 6 |   background-color: var(--button-bg);
 7 |   border-color: transparent;
 8 |   border-width: 1px;
 9 |   color: var(--button-color);
10 |   cursor: pointer;
11 |   justify-content: center;
12 |   padding: 0 .875em;
13 |   text-align: center;
14 |   white-space: nowrap;
15 |   text-decoration: none !important;
16 |   transition: all .15s linear;
17 | 
18 |   &:hover{
19 |     background-color: var(--button-hover-bg);
20 |     color: var(--button-hover-color);
21 |   }
22 | 
23 |   & > .icon {
24 |     &,
25 |     &.is-small,
26 |     &.is-medium {
27 |       height: 1.5em;
28 |       width: 1.5em;
29 |     }
30 | 
31 |     &:first-child:last-child {
32 |       margin-left: calc(-.5em - 1px);
33 |       margin-right: calc(-.5em - 1px);
34 |     }
35 | 
36 |     &:first-child:not(:last-child) {
37 |       margin-left: calc(-.5em - 1px);
38 |       margin-right: .25em;
39 |     }
40 |   }
41 | }
42 | 
43 | .button.is-white {
44 |   background-color: var(--button-white-bg);
45 |   color: var(--button-white-color);
46 | 
47 |   &:hover {
48 |     background-color: var(--button-white-hover-bg);
49 |     color: var(--button-white-hover-color);
50 |   }
51 | }
52 | 
53 | .button.is-primary {
54 |   background-color: var(--ghost-accent-color);
55 |   color: #fff;
56 | 
57 |   &:hover {
58 |     opacity: .9;
59 |   }
60 | }
61 | 
62 | .button.is-black {
63 |   background-color: #191919;
64 |   color: #fff;
65 | }
66 | 
67 | /* circle */
68 | .button.is-circle {
69 |   width: 2.25rem;
70 |   height: 2.25rem;
71 |   border-radius: 50%;
72 |   padding: 0;
73 | }
74 | 
75 | .button.is-outlined {
76 |   color: #000;
77 |   border: 1px solid #000;
78 |   background-color: transparent;
79 | 
80 |   &:hover {
81 |     background-color: #000;
82 |     color: #fff;
83 |   }
84 | }
85 | 
86 | .buttons {
87 |   align-items: center;
88 |   display: flex;
89 |   flex-wrap: wrap;
90 |   justify-content: flex-start;
91 | 
92 |   .button {
93 |     margin-bottom: 0.5rem;
94 |     &:not(:last-child) {
95 |       margin-right: .5rem;
96 |     }
97 |   }
98 | }
99 | 


--------------------------------------------------------------------------------
/src/css/elements/form.css:
--------------------------------------------------------------------------------
 1 | $input-background: hsl(0, 0%, 96%);
 2 | 
 3 | $input-focus-box-shadow-size: 0 0.625rem 1.25rem;
 4 | 
 5 | $input-focus-box-shadow-color: rgba(0, 0, 0, .1);
 6 | 
 7 | $input-disabled-background-color: $input-background;
 8 | $input-disabled-border-color: $input-background;
 9 | $input-disabled-color: rgba(117, 117, 117, 0.3);
10 | $input-disabled-placeholder-color: rgba(117, 117, 117, 0.3);
11 | 
12 | $input-shadow: inset 0 0.0625em 0.125em rgb(10 10 10 / 5%);
13 | 
14 | $textarea-padding: $control-padding-horizontal;
15 | $textarea-max-height: 40em;
16 | $textarea-min-height: 8em;
17 | 
18 | %input {
19 |   @extend %control;
20 | 
21 |   background-color: var(--input-bg);
22 |   border-color: var(--input-border-color);
23 |   color: var(--input-color);
24 | 
25 |   &::placeholder {
26 |     color: var(--placeholder-color);
27 |   }
28 | 
29 |   &:hover {
30 |     border-color: var(--input-hover-border-color);
31 |   }
32 | 
33 |   &:focus,
34 |   &:active {
35 |     outline: none;
36 |     border-color: var(--input-focus-border-color);
37 |     box-shadow: $input-focus-box-shadow-size $input-focus-box-shadow-color;
38 |   }
39 | 
40 |   &[disabled],
41 |   fieldset[disabled] & {
42 |     background-color: $input-disabled-background-color;
43 |     border-color: $input-disabled-border-color;
44 |     box-shadow: none;
45 |     color: $input-disabled-color;
46 | 
47 |     &::placeholder {
48 |       color: $input-disabled-placeholder-color;
49 |     }
50 |   }
51 | }
52 | 
53 | %input-textarea {
54 |   @extend %input;
55 | 
56 |   box-shadow: $input-shadow;
57 |   max-width: 100%;
58 |   width: 100%;
59 | 
60 |   &[readonly] {
61 |     box-shadow: none;
62 |   }
63 | }
64 | 
65 | [type="text"],
66 | [type="email"],
67 | [type="url"],
68 | [type="password"],
69 | [type="number"],
70 | [type="date"],
71 | [type="search"] {
72 |   @extend %input-textarea;
73 | }
74 | 
75 | textarea {
76 |   @extend %input-textarea;
77 | 
78 |   display: block;
79 |   max-width: 100%;
80 |   min-width: 100%;
81 |   padding: $textarea-padding;
82 |   resize: vertical;
83 | 
84 |   &:not([rows]) {
85 |     max-height: $textarea-max-height;
86 |     min-height: $textarea-min-height;
87 |   }
88 | 
89 |   &[rows] {
90 |     height: initial;
91 |   }
92 | }
93 | 


--------------------------------------------------------------------------------
/src/css/elements/icon.css:
--------------------------------------------------------------------------------
 1 | $icon-dimensions: 1.5rem;
 2 | $icon-dimensions-small: 1rem;
 3 | $icon-dimensions-medium: 1.25rem;
 4 | $icon-dimensions-large: 3rem;
 5 | 
 6 | .icon {
 7 |   display: inline-block;
 8 |   fill: currentColor;
 9 |   height: $icon-dimensions;
10 |   stroke-width: 0;
11 |   vertical-align: middle;
12 |   width: $icon-dimensions;
13 | 
14 |   &.is-stroke {
15 |     fill: none;
16 |     stroke: currentColor;
17 |   }
18 | 
19 |   &.is-small {
20 |     height: $icon-dimensions-small !important;
21 |     width: $icon-dimensions-small !important;
22 |   }
23 | 
24 |   &.is-medium {
25 |     height: $icon-dimensions-medium;
26 |     width: $icon-dimensions-medium;
27 |   }
28 | }
29 | 


--------------------------------------------------------------------------------
/src/css/elements/table.css:
--------------------------------------------------------------------------------
 1 | table {
 2 |   @apply text-left font-sans text-sm overflow-x-auto w-auto block max-w-full;
 3 | }
 4 | 
 5 | table th {
 6 |   @apply font-semibold border-b pr-4 py-3 border-slate-300;
 7 | }
 8 | 
 9 | table td {
10 |   @apply py-3 pr-4 whitespace-nowrap border-b border-slate-200;
11 | }
12 | 
13 | table tr:last-child td {
14 |   @apply border-b-slate-300;
15 | }
16 | 
17 | 


--------------------------------------------------------------------------------
/src/css/layout/footer.css:
--------------------------------------------------------------------------------
 1 | /* Footer Form for Subscribe
 2 | /* ---------------------------------------------------------- */
 3 | 
 4 | .footer {
 5 |   .input {
 6 |     border: 2px solid #262626;
 7 |     border-radius: 25px 0 0 25px;
 8 |     height: 3.125rem;
 9 |   }
10 | 
11 |   .button {
12 |     border-radius: 0 25px 25px 0;
13 |     height: 3.125rem;
14 |   }
15 | }
16 | 
17 | 
18 | /* Footer Social Media
19 | /* ---------------------------------------------------------- */
20 | 
21 | .footer .social-media {
22 |   color: #fff;
23 |   margin: 70px auto 0;
24 | 
25 |   span {
26 |     display: block;
27 |     color: #adadad;
28 |     margin-top: 5px;
29 |     font-size: 15px;
30 |     letter-spacing: .3px;
31 |   }
32 | }
33 | 
34 | .copyright {
35 |   border-top: 1px solid hsla(0,0%,100%,.1);
36 | }
37 | 


--------------------------------------------------------------------------------
/src/css/layout/header.css:
--------------------------------------------------------------------------------
 1 | /* Navigation
 2 | /* ---------------------------------------------------------- */
 3 | 
 4 | .navbar ul {
 5 |   @apply flex;
 6 | }
 7 | 
 8 | .navbar ul a {
 9 |   @apply px-4 block relative;
10 | }
11 | 
12 | .navbar ul li {
13 |   @apply my-3 text-sm uppercase font-medium leading-none;
14 | }
15 | 
16 | /* stylelint-disable-next-line */
17 | li.nav-current > a,
18 | .nav > li > a:hover,
19 | .footer .social-media a:hover,
20 | .search-toggle:hover,
21 | .menu-toggle:hover,
22 | .social-media a :hover {
23 |   @apply text-primary;
24 | }
25 | 


--------------------------------------------------------------------------------
/src/css/layout/sidenav.css:
--------------------------------------------------------------------------------
 1 | /* Sidenav
 2 | /* ---------------------------------------------------------- */
 3 | .sidenav {
 4 |   backface-visibility: hidden;
 5 |   min-height: 100%;
 6 |   padding: 3% 4%;
 7 |   right: -100%;
 8 |   transition: all .4s ease-in-out;
 9 | }
10 | 
11 | .scroll-transparent::-webkit-scrollbar {
12 |   width: 5px;
13 |   position: fixed;
14 |   right: 0;
15 | }
16 | 
17 | .sidenav-nav ul a {
18 |   @apply py-2 block uppercase font-medium;
19 | }
20 | 
21 | /* secondary menu
22 | /* ---------------------------------------------------------- */
23 | 
24 | .sidenav-menu-secondary ul > li {
25 |   @apply uppercase text-sm font-semibold mx-2 my-1 inline-block;
26 | }
27 | 
28 | /* Sidenav Open
29 | /* ---------------------------------------------------------- */
30 | 
31 | body.has-sidenav {
32 |   .sidenav {
33 |     right: 0;
34 |     visibility: visible;
35 |   }
36 | }
37 | 
38 | /* Media Query
39 | /* ---------------------------------------------------------- */
40 | 
41 | @screen md {
42 |   .sidenav {
43 |     right: -30rem;
44 |     width: 30rem;
45 |   }
46 | }
47 | 


--------------------------------------------------------------------------------
/src/css/main.css:
--------------------------------------------------------------------------------
 1 | /* Variables and Root
 2 | /* ---------------------------------------------------------- */
 3 | @import "./abstracts/variables.css";
 4 | @import "./base/root.css";
 5 | 
 6 | /* base
 7 | /* ---------------------------------------------------------- */
 8 | 
 9 | @import "tailwindcss/base";
10 | @import "./abstracts/extend.css";
11 | @import "./base/base.css";
12 | @import "./base/typography.css";
13 | @import "./base/global.css";
14 | 
15 | @import "./abstracts/constrols.css";
16 | 
17 | /* Components
18 | /* ---------------------------------------------------------- */
19 | 
20 | @import "tailwindcss/components";
21 | 
22 | /* Elements
23 | /* ---------------------------------------------------------- */
24 | 
25 | @import "./elements/form.css";
26 | @import "./elements/buttons.css";
27 | @import "./elements/icon.css";
28 | @import "./elements/table.css";
29 | 
30 | /* Components
31 | /* ---------------------------------------------------------- */
32 | 
33 | @import "./components/story.css";
34 | @import "./components/code.css";
35 | /* @import "./components/modal.css"; */
36 | 
37 | /* Pages
38 | /* ---------------------------------------------------------- */
39 | 
40 | @import "./pages/post.css";
41 | 
42 | /* Cards
43 | /* ---------------------------------------------------------- */
44 | 
45 | @import "./cards/cards.css";
46 | @import "./cards/gallery.css";
47 | @import "./cards/blockquote.css";
48 | @import "./cards/bookmark.css";
49 | 
50 | /* Utilities
51 | /* ---------------------------------------------------------- */
52 | 
53 | @import "tailwindcss/utilities";
54 | 
55 | /* Layout
56 | /* ---------------------------------------------------------- */
57 | 
58 | @import "./layout/header.css";
59 | @import "./layout/footer.css";
60 | @import "./layout/sidenav.css";
61 | 
62 | /* Variants
63 | /* ---------------------------------------------------------- */
64 | /* @import "tailwindcss/variants"; */
65 | 


--------------------------------------------------------------------------------
/src/css/pages/post.css:
--------------------------------------------------------------------------------
  1 | .godo-canvas {
  2 |   display: grid;
  3 |   grid-template-columns: [full-start] minmax(4vmin,auto) [wide-start] minmax(auto,240px) [main-start] min(768px,calc(100% - 8vw)) [main-end] minmax(auto,240px) [wide-end] minmax(4vmin,auto) [full-end];
  4 | 
  5 |   & > * {
  6 |     grid-column: main-start/main-end;
  7 |   }
  8 | }
  9 | 
 10 | .is-canvas-full .godo-canvas > * {
 11 |   grid-column: full-start / full-end;
 12 | }
 13 | 
 14 | .post-body {
 15 |   /*  new */
 16 |   font-size: 1.25rem;
 17 |   line-height: 1.625;
 18 |   padding-top: 6vmin;
 19 | 
 20 |   /* stylelint-disable-next-line */
 21 |   & > * + * {
 22 |     margin-top: 4vmin;
 23 |     margin-bottom: 0;
 24 |   }
 25 | 
 26 |   /* & > [id] {
 27 |     margin: 0;
 28 |     color: var(--color-darkgrey);
 29 |   } */
 30 | 
 31 |   & > [id]:not(:first-child) {
 32 |     margin: 2em 0 0;
 33 |   }
 34 | 
 35 |   & > [id] + * {
 36 |     /* margin-top: 1em !important; */
 37 |     margin-top: 0.86em !important;
 38 |   }
 39 | 
 40 |   a {
 41 |     @apply underline underline-offset-4 break-words;
 42 | 
 43 |     color: var(--color-link);
 44 |     /* text-decoration: underline; */
 45 |     /* word-break: break-word; */
 46 | 
 47 |     &:hover {
 48 |       @apply no-underline opacity-80;
 49 |     }
 50 |   }
 51 | 
 52 |   & > hr,
 53 |   & > blockquote {
 54 |     position: relative;
 55 |     margin-top: 6vmin;
 56 |   }
 57 | 
 58 |   /* stylelint-disable */
 59 |   & > hr + *,
 60 |   & > blockquote + * {
 61 |     margin-top: 6vmin !important;
 62 |   }
 63 |   /* stylelint-enable */
 64 | 
 65 |   h1,
 66 |   h2,
 67 |   h3,
 68 |   h4,
 69 |   h5,
 70 |   h6 {
 71 |     color: var(--title-color);
 72 |     font-family: var(--font-title);
 73 |     scroll-margin-top: calc(4rem + 4vmin);
 74 |   }
 75 | 
 76 |   /* List */
 77 |   li + li {
 78 |     margin-top: .5em;
 79 |   }
 80 | 
 81 |   ul,
 82 |   ol {
 83 |     counter-reset: post;
 84 | 
 85 |     li {
 86 |       margin-left: 2rem;
 87 | 
 88 |       &::before {
 89 |         box-sizing: border-box;
 90 |         display: inline-block;
 91 |         margin-left: -1.25rem;
 92 |         position: absolute;
 93 |         text-align: right;
 94 |       }
 95 |     }
 96 |   }
 97 | 
 98 |   ul > li::before {
 99 |     content: "\2022";
100 |     opacity: .9;
101 |     transform: scale(1.1);
102 |   }
103 | 
104 |   ol > li::before {
105 |     content: counter(post) ".";
106 |     counter-increment: post;
107 |     padding-right: 0.75rem;
108 |   }
109 | }
110 | 
111 | /* Post Meta
112 | /* ---------------------------------------------------------- */
113 | 
114 | .post-author-meta li:not(:last-child):after {
115 |   @apply text-gray-500;
116 | 
117 |   content: "/";
118 |   margin-left: 0.5rem;
119 | }
120 | 
121 | /* tags Link
122 | /* ---------------------------------------------------------- */
123 | .tags-links a:before {
124 |   display: inline;
125 |   content: "\0023";
126 | }
127 | 
128 | /* Post Share
129 | /* ---------------------------------------------------------- */
130 | .post-share-wrap:before, .post-share-wrap:after {
131 |   content: "";
132 |   position: absolute;
133 |   top: 50%;
134 |   border-bottom: 1px solid;
135 |   border-color: #ddd;
136 |   width: 690px;
137 |   margin: 0 20px;
138 | }
139 | 
140 | .post-share-wrap:before {
141 |   right: 100%;
142 | }
143 | 


--------------------------------------------------------------------------------
/src/fonts/paway.eot:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/godofredoninja/Paway/82cf16ecb035047f0a69accab3eceed31106a8f4/src/fonts/paway.eot


--------------------------------------------------------------------------------
/src/fonts/paway.ttf:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/godofredoninja/Paway/82cf16ecb035047f0a69accab3eceed31106a8f4/src/fonts/paway.ttf


--------------------------------------------------------------------------------
/src/fonts/paway.woff:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/godofredoninja/Paway/82cf16ecb035047f0a69accab3eceed31106a8f4/src/fonts/paway.woff


--------------------------------------------------------------------------------
/src/img/avatar.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/godofredoninja/Paway/82cf16ecb035047f0a69accab3eceed31106a8f4/src/img/avatar.png


--------------------------------------------------------------------------------
/src/img/screenshot-desktop.jpg:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/godofredoninja/Paway/82cf16ecb035047f0a69accab3eceed31106a8f4/src/img/screenshot-desktop.jpg


--------------------------------------------------------------------------------
/src/img/screenshot-mobile.jpg:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/godofredoninja/Paway/82cf16ecb035047f0a69accab3eceed31106a8f4/src/img/screenshot-mobile.jpg


--------------------------------------------------------------------------------
/src/js/main.js:
--------------------------------------------------------------------------------
  1 | import 'lazysizes'
  2 | 
  3 | ((window, document) => {
  4 |   /* Load Script and Styles
  5 |   /* ---------------------------------------------------------- */
  6 |   const loadScript = (src, callback) => {
  7 |     const scriptElement = document.createElement('script')
  8 |     scriptElement.src = src
  9 |     callback && scriptElement.addEventListener('load', callback)
 10 |     document.body.appendChild(scriptElement)
 11 |   }
 12 | 
 13 |   const loadStyle = href => {
 14 |     const linkElement = document.createElement('link')
 15 |     linkElement.rel = 'stylesheet'
 16 |     linkElement.href = href
 17 |     document.head.appendChild(linkElement)
 18 |   }
 19 | 
 20 |   /* Toggle Menu
 21 |   /* ---------------------------------------------------------- */
 22 |   document.querySelectorAll('.js-menu-toggle').forEach(item => item.addEventListener('click', function (e) {
 23 |     e.preventDefault()
 24 | 
 25 |     document.body.classList.toggle('has-sidenav')
 26 |   }))
 27 | 
 28 |   /* return if you are not on the post page
 29 |   /* ---------------------------------------------------------- */
 30 | 
 31 |   if(!document.querySelector('.post-body')) return
 32 | 
 33 |   /* All Video Responsive
 34 |   /* ---------------------------------------------------------- */
 35 |   const videoResponsive = () => {
 36 |     const iframeSelectors = [
 37 |       'iframe[src*="player.vimeo.com"]',
 38 |       'iframe[src*="dailymotion.com"]',
 39 |       'iframe[src*="youtube.com"]',
 40 |       'iframe[src*="youtube-nocookie.com"]',
 41 |       'iframe[src*="kickstarter.com"][src*="video.html"]'
 42 |     ]
 43 | 
 44 |     const $iframes = document.querySelectorAll(iframeSelectors.join(','))
 45 | 
 46 |     if (!$iframes.length) return
 47 | 
 48 |     $iframes.forEach(el => {
 49 |       const box = document.createElement('div')
 50 |       box.className = 'video-responsive'
 51 |       el.parentNode.insertBefore(box, el)
 52 |       box.appendChild(el)
 53 |     })
 54 |   }
 55 | 
 56 |   videoResponsive()
 57 | 
 58 |   /* Paway Gallery
 59 |   /* ---------------------------------------------------------- */
 60 |   const pawayGallery = () => {
 61 |     // <img> Set Atribute (data-src - data-sub-html)
 62 |     document.querySelectorAll('.post-body img').forEach(el => {
 63 |       if (el.closest('a')) return
 64 | 
 65 |       el.classList.add('paway-light-gallery')
 66 |       el.setAttribute('data-src', el.src)
 67 | 
 68 |       const nextElement = el.nextSibling
 69 | 
 70 |       if (nextElement !== null && nextElement.nodeName.toLowerCase() === 'figcaption') {
 71 |         el.setAttribute('data-sub-html', nextElement.innerHTML)
 72 |       }
 73 |     })
 74 | 
 75 |     // Lightgallery
 76 |     const lightGallery = document.querySelectorAll('.paway-light-gallery')
 77 | 
 78 |     if (!lightGallery.length) return
 79 | 
 80 |     loadStyle('https://unpkg.com/lightgallery.js/dist/css/lightgallery.min.css')
 81 | 
 82 |     loadScript('https://cdn.jsdelivr.net/npm/lightgallery.js@1.1.3/dist/js/lightgallery.min.js', () => {
 83 |       loadScript('https://unpkg.com/lg-zoom.js@1.0.1/dist/lg-zoom.min.js')
 84 | 
 85 |       window.lightGallery(document.querySelector('.post-body'), { selector: '.paway-light-gallery' })
 86 |     })
 87 |   }
 88 | 
 89 |   pawayGallery()
 90 | 
 91 |   /* Post Share
 92 |   /* ---------------------------------------------------------- */
 93 |   const pawayShare = () => {
 94 |     document.querySelectorAll('.js-share').forEach(item => item.addEventListener('click', e => {
 95 |       const width = 640
 96 |       const height = 400
 97 | 
 98 |       const dualScreenLeft = window.screenLeft !== undefined ? window.screenLeft : window.screenX
 99 |       const dualScreenTop = window.screenTop !== undefined ? window.screenTop : window.screenY
100 | 
101 |       const containerWidth = window.innerWidth ? window.innerWidth : document.documentElement.clientWidth ? document.documentElement.clientWidth : window.screen.width
102 |       const containerHeight = window.innerHeight ? window.innerHeight : document.documentElement.clientHeight ? document.documentElement.clientHeight : window.screen.height
103 | 
104 |       const left = ((containerWidth / 2) - (width / 2)) + dualScreenLeft
105 |       const top = ((containerHeight / 2) - (height / 2)) + dualScreenTop
106 |       const newWindow = window.open(e.currentTarget.href, 'share-window', `scrollbars=yes, width=${width}, height=${height}, top=${top}, left=${left}`)
107 | 
108 |       // Puts focus on the newWindow
109 |       window.focus && newWindow.focus()
110 | 
111 |       e.preventDefault()
112 |     }))
113 |   }
114 | 
115 |   pawayShare()
116 | })(window, document)
117 | 


--------------------------------------------------------------------------------
/src/svg-icon/selection.json:
--------------------------------------------------------------------------------
  1 | {
  2 |   "IcoMoonType": "selection",
  3 |   "icons": [
  4 |     {
  5 |       "icon": {
  6 |         "paths": [
  7 |           "M224 488l288-288 288 288M512 240v584"
  8 |         ],
  9 |         "attrs": [
 10 |           {
 11 |             "fill": "none",
 12 |             "strokeLinejoin": "round",
 13 |             "strokeLinecap": "round",
 14 |             "strokeMiterlimit": "4",
 15 |             "strokeWidth": 96
 16 |           }
 17 |         ],
 18 |         "isMulticolor": false,
 19 |         "isMulticolor2": false,
 20 |         "grid": 0,
 21 |         "tags": [
 22 |           "arrow-up-outline"
 23 |         ]
 24 |       },
 25 |       "attrs": [
 26 |         {
 27 |           "fill": "none",
 28 |           "strokeLinejoin": "round",
 29 |           "strokeLinecap": "round",
 30 |           "strokeMiterlimit": "4",
 31 |           "strokeWidth": 96
 32 |         }
 33 |       ],
 34 |       "properties": {
 35 |         "order": 10,
 36 |         "id": 8,
 37 |         "name": "arrow",
 38 |         "prevSize": 24
 39 |       },
 40 |       "setIdx": 0,
 41 |       "setId": 4,
 42 |       "iconIdx": 0
 43 |     },
 44 |     {
 45 |       "icon": {
 46 |         "paths": [
 47 |           "M736 736l-448-448M736 288l-448 448"
 48 |         ],
 49 |         "attrs": [
 50 |           {
 51 |             "fill": "none",
 52 |             "strokeLinejoin": "round",
 53 |             "strokeLinecap": "round",
 54 |             "strokeMiterlimit": "4",
 55 |             "strokeWidth": 64
 56 |           }
 57 |         ],
 58 |         "isMulticolor": false,
 59 |         "isMulticolor2": false,
 60 |         "grid": 0,
 61 |         "tags": [
 62 |           "close-outline"
 63 |         ]
 64 |       },
 65 |       "attrs": [
 66 |         {
 67 |           "fill": "none",
 68 |           "strokeLinejoin": "round",
 69 |           "strokeLinecap": "round",
 70 |           "strokeMiterlimit": "4",
 71 |           "strokeWidth": 64
 72 |         }
 73 |       ],
 74 |       "properties": {
 75 |         "order": 9,
 76 |         "id": 7,
 77 |         "name": "close",
 78 |         "prevSize": 24
 79 |       },
 80 |       "setIdx": 0,
 81 |       "setId": 4,
 82 |       "iconIdx": 1
 83 |     },
 84 |     {
 85 |       "icon": {
 86 |         "paths": [
 87 |           "M160 320h704M160 512h704M160 704h704"
 88 |         ],
 89 |         "attrs": [
 90 |           {
 91 |             "fill": "none",
 92 |             "strokeLinejoin": "miter",
 93 |             "strokeLinecap": "round",
 94 |             "strokeMiterlimit": "10",
 95 |             "strokeWidth": 64
 96 |           }
 97 |         ],
 98 |         "isMulticolor": false,
 99 |         "isMulticolor2": false,
100 |         "grid": 0,
101 |         "tags": [
102 |           "menu-outline"
103 |         ]
104 |       },
105 |       "attrs": [
106 |         {
107 |           "fill": "none",
108 |           "strokeLinejoin": "miter",
109 |           "strokeLinecap": "round",
110 |           "strokeMiterlimit": "10",
111 |           "strokeWidth": 64
112 |         }
113 |       ],
114 |       "properties": {
115 |         "order": 8,
116 |         "id": 6,
117 |         "name": "menu",
118 |         "prevSize": 24
119 |       },
120 |       "setIdx": 0,
121 |       "setId": 4,
122 |       "iconIdx": 2
123 |     },
124 |     {
125 |       "icon": {
126 |         "paths": [
127 |           "M913.38 842.78l-188.18-188.18c43.5-57.412 69.68-130.039 69.68-208.78 0-0.134-0-0.267-0-0.401l0 0.021c-0-192.68-156.76-349.44-349.44-349.44s-349.44 156.76-349.44 349.44 156.76 349.44 349.44 349.44c0.113 0 0.246 0 0.38 0 78.741 0 151.368-26.18 209.65-70.311l-0.87 0.631 188.18 188.18c8.803 7.895 20.499 12.723 33.323 12.723 27.614 0 50-22.386 50-50 0-12.823-4.827-24.519-12.764-33.37l0.041 0.047zM195.84 445.44c-0-137.85 111.75-249.6 249.6-249.6s249.6 111.75 249.6 249.6c0 137.85-111.75 249.6-249.6 249.6h0c-137.781-0.171-249.429-111.818-249.6-249.583l-0-0.017z"
128 |         ],
129 |         "attrs": [
130 |           {}
131 |         ],
132 |         "isMulticolor": false,
133 |         "isMulticolor2": false,
134 |         "grid": 0,
135 |         "tags": [
136 |           "search"
137 |         ]
138 |       },
139 |       "attrs": [
140 |         {}
141 |       ],
142 |       "properties": {
143 |         "order": 7,
144 |         "id": 5,
145 |         "name": "search",
146 |         "prevSize": 24
147 |       },
148 |       "setIdx": 0,
149 |       "setId": 4,
150 |       "iconIdx": 3
151 |     },
152 |     {
153 |       "icon": {
154 |         "paths": [
155 |           "M888.34 64h-747.78c-40.86 0-76.56 29.4-76.56 69.78v749.44c0 40.6 35.7 76.78 76.56 76.78h747.56c41.080 0 71.88-36.42 71.88-76.78v-749.44c0.24-40.38-30.8-69.78-71.66-69.78zM341.74 810.86h-128.36v-399.1h128.36zM282 351.080h-0.92c-41.080 0-67.68-30.58-67.68-68.86 0-38.98 27.3-68.84 69.3-68.84s67.7 29.64 68.62 68.84c-0.020 38.28-26.62 68.86-69.32 68.86zM810.86 810.86h-128.36v-218.22c0-52.28-18.68-88-65.12-88-35.48 0-56.48 24-65.82 47.38-3.5 8.4-4.44 19.84-4.44 31.52v227.32h-128.36v-399.1h128.36v55.54c18.68-26.6 47.86-64.88 115.76-64.88 84.26 0 148 55.54 148 175.28z"
156 |         ],
157 |         "attrs": [
158 |           {}
159 |         ],
160 |         "isMulticolor": false,
161 |         "isMulticolor2": false,
162 |         "grid": 0,
163 |         "tags": [
164 |           "logo-linkedin"
165 |         ]
166 |       },
167 |       "attrs": [
168 |         {}
169 |       ],
170 |       "properties": {
171 |         "order": 6,
172 |         "id": 4,
173 |         "name": "linkedin",
174 |         "prevSize": 24
175 |       },
176 |       "setIdx": 0,
177 |       "setId": 4,
178 |       "iconIdx": 4
179 |     },
180 |     {
181 |       "icon": {
182 |         "paths": [
183 |           "M1017.28 297.58c0-90-66.2-162.4-148-162.4-110.8-5.18-223.8-7.18-339.28-7.18h-36c-115.2 0-228.4 2-339.2 7.2-81.6 0-147.8 72.8-147.8 162.8-5 71.18-7.12 142.38-7 213.58q-0.3 106.8 6.8 213.8c0 90 66.2 163 147.8 163 116.4 5.4 235.8 7.8 357.2 7.6q182.4 0.6 357.2-7.6c81.8 0 148-73 148-163 4.8-71.4 7-142.6 6.8-214q0.68-106.8-6.52-213.8zM414 707.78v-393l290 196.4z"
184 |         ],
185 |         "attrs": [
186 |           {}
187 |         ],
188 |         "isMulticolor": false,
189 |         "isMulticolor2": false,
190 |         "grid": 0,
191 |         "tags": [
192 |           "logo-youtube"
193 |         ]
194 |       },
195 |       "attrs": [
196 |         {}
197 |       ],
198 |       "properties": {
199 |         "order": 3,
200 |         "id": 3,
201 |         "name": "youtube",
202 |         "prevSize": 24
203 |       },
204 |       "setIdx": 0,
205 |       "setId": 4,
206 |       "iconIdx": 5
207 |     },
208 |     {
209 |       "icon": {
210 |         "paths": [
211 |           "M992 219c-32.932 14.723-71.134 25.492-111.147 30.405l-1.953 0.195c40.61-24.080 71.232-61.36 86.257-105.825l0.403-1.375c-36.038 21.456-77.975 37.776-122.61 46.587l-2.51 0.413c-36.175-37.862-87.065-61.4-143.454-61.4-0.129 0-0.257 0-0.386 0l0.020-0c-108.84 0-196.92 86.8-196.92 193.8-0.002 0.287-0.003 0.627-0.003 0.967 0 15.34 1.853 30.248 5.347 44.511l-0.265-1.278c-163.573-7.9-307.776-84.658-405.266-201.694l-0.734-0.906c-16.786 27.845-26.734 61.456-26.78 97.387l-0 0.013c0 67.2 35.060 126.6 88 161.4-32.98-0.807-63.72-9.678-90.544-24.707l0.984 0.507v2.4c0 94 68 172.2 158 190-15.561 4.316-33.43 6.797-51.879 6.8l-0.001 0c-0.098 0-0.213 0-0.329 0-12.983 0-25.66-1.311-37.905-3.807l1.215 0.207c25.020 77 97.84 133 184.1 134.6-66.657 51.774-151.517 83.001-243.671 83.001-0.341 0-0.681-0-1.022-0.001l0.053 0c-16.591-0.025-32.916-1.042-48.953-2.994l1.953 0.194c84.864 54.941 188.599 87.602 299.963 87.602 0.533 0 1.066-0.001 1.599-0.002l-0.082 0c362.72 0 560.88-295.4 560.88-551.6 0-8.4-0.22-16.8-0.62-25 38.661-27.719 71.254-60.994 97.386-99.052l0.874-1.348z"
212 |         ],
213 |         "attrs": [
214 |           {}
215 |         ],
216 |         "isMulticolor": false,
217 |         "isMulticolor2": false,
218 |         "grid": 0,
219 |         "tags": [
220 |           "logo-twitter"
221 |         ]
222 |       },
223 |       "attrs": [
224 |         {}
225 |       ],
226 |       "properties": {
227 |         "order": 2,
228 |         "id": 2,
229 |         "name": "twitter",
230 |         "prevSize": 24
231 |       },
232 |       "setIdx": 0,
233 |       "setId": 4,
234 |       "iconIdx": 6
235 |     },
236 |     {
237 |       "icon": {
238 |         "paths": [
239 |           "M698.66 138.66c102.973 0.317 186.363 83.707 186.68 186.65l0 0.030v373.32c-0.317 102.973-83.707 186.363-186.65 186.68l-0.030 0h-373.32c-102.973-0.317-186.363-83.707-186.68-186.65l-0-0.030v-373.32c0.317-102.973 83.707-186.363 186.65-186.68l0.030-0h373.32zM698.66 64h-373.32c-143.74 0-261.34 117.6-261.34 261.34v373.32c0 143.74 117.6 261.34 261.34 261.34h373.32c143.74 0 261.34-117.6 261.34-261.34v-373.32c0-143.74-117.6-261.34-261.34-261.34z",
240 |           "M754.66 325.34c-30.928 0-56-25.072-56-56s25.072-56 56-56c30.928 0 56 25.072 56 56v0c0 0.036 0 0.078 0 0.12 0 30.862-25.018 55.88-55.88 55.88-0.042 0-0.084-0-0.127-0l0.006 0zM512 362.66c82.478-0 149.34 66.862 149.34 149.34s-66.862 149.34-149.34 149.34c-82.478 0-149.34-66.862-149.34-149.34h0c0.091-82.442 66.898-149.249 149.331-149.34l0.009-0zM512 288c-123.712 0-224 100.288-224 224s100.288 224 224 224c123.712 0 224-100.288 224-224v0c0-123.712-100.288-224-224-224v0z"
241 |         ],
242 |         "attrs": [
243 |           {},
244 |           {}
245 |         ],
246 |         "isMulticolor": false,
247 |         "isMulticolor2": false,
248 |         "grid": 0,
249 |         "tags": [
250 |           "logo-instagram"
251 |         ]
252 |       },
253 |       "attrs": [
254 |         {},
255 |         {}
256 |       ],
257 |       "properties": {
258 |         "order": 4,
259 |         "id": 1,
260 |         "name": "instagram",
261 |         "prevSize": 24
262 |       },
263 |       "setIdx": 0,
264 |       "setId": 4,
265 |       "iconIdx": 7
266 |     },
267 |     {
268 |       "icon": {
269 |         "paths": [
270 |           "M960 514.7c0-247.4-200.6-448-448-448s-448 200.6-448 448c0 223.6 163.8 408.94 378 442.58v-313.040h-113.78v-129.54h113.78v-98.7c0-112.26 66.9-174.32 169.22-174.32 49.020 0 100.3 8.76 100.3 8.76v110.26h-56.52c-55.62 0-73.020 34.52-73.020 70v84h124.24l-19.84 129.54h-104.38v313.080c214.2-33.62 378-218.96 378-442.62z"
271 |         ],
272 |         "attrs": [
273 |           {}
274 |         ],
275 |         "isMulticolor": false,
276 |         "isMulticolor2": false,
277 |         "grid": 0,
278 |         "tags": [
279 |           "logo-facebook"
280 |         ]
281 |       },
282 |       "attrs": [
283 |         {}
284 |       ],
285 |       "properties": {
286 |         "order": 5,
287 |         "id": 0,
288 |         "name": "facebook",
289 |         "prevSize": 24
290 |       },
291 |       "setIdx": 0,
292 |       "setId": 4,
293 |       "iconIdx": 8
294 |     },
295 |     {
296 |       "icon": {
297 |         "paths": [
298 |           "M1008 6.286c12 8.571 17.714 22.286 15.429 36.571l-146.286 877.714c-1.714 10.857-8.571 20-18.286 25.714-5.143 2.857-11.429 4.571-17.714 4.571-4.571 0-9.143-1.143-13.714-2.857l-258.857-105.714-138.286 168.571c-6.857 8.571-17.143 13.143-28 13.143-4 0-8.571-0.571-12.571-2.286-14.286-5.143-24-18.857-24-34.286v-199.429l493.714-605.143-610.857 528.571-225.714-92.571c-13.143-5.143-21.714-17.143-22.857-31.429-0.571-13.714 6.286-26.857 18.286-33.714l950.857-548.571c5.714-3.429 12-5.143 18.286-5.143 7.429 0 14.857 2.286 20.571 6.286z"
299 |         ],
300 |         "width": 1025.1702857142857,
301 |         "attrs": [],
302 |         "isMulticolor": false,
303 |         "isMulticolor2": false,
304 |         "tags": [
305 |           "paper-plane",
306 |           "send"
307 |         ],
308 |         "defaultCode": 61912,
309 |         "grid": 14
310 |       },
311 |       "attrs": [],
312 |       "properties": {
313 |         "name": "send",
314 |         "id": 5,
315 |         "order": 13,
316 |         "prevSize": 24
317 |       },
318 |       "setIdx": 2,
319 |       "setId": 2,
320 |       "iconIdx": 5
321 |     },
322 |     {
323 |       "icon": {
324 |         "paths": [
325 |           "M1024 483.429c0 44.571-25.143 82.857-62.286 101.714 4.571 17.714 6.857 36 6.857 54.857 0 180.571-204 326.857-455.429 326.857-250.857 0-454.857-146.286-454.857-326.857 0-18.286 2.286-36.571 6.286-53.714-38.286-18.857-64.571-57.714-64.571-102.857 0-62.857 50.857-113.714 113.714-113.714 32.571 0 61.714 13.714 82.857 36 77.143-53.714 180-88.571 294.286-92.571l66.286-297.714c2.286-10.286 13.143-17.143 23.429-14.857l210.857 46.286c13.714-27.429 42.857-46.857 76-46.857 47.429 0 85.714 38.286 85.714 85.143 0 47.429-38.286 85.714-85.714 85.714-46.857 0-85.143-38.286-85.143-85.143l-190.857-42.286-59.429 269.714c114.857 3.429 218.857 37.714 296.571 91.429 20.571-21.714 49.714-34.857 81.714-34.857 62.857 0 113.714 50.857 113.714 113.714zM238.857 597.143c0 47.429 38.286 85.714 85.143 85.714 47.429 0 85.714-38.286 85.714-85.714 0-46.857-38.286-85.143-85.714-85.143-46.857 0-85.143 38.286-85.143 85.143zM701.714 800c8.571-8.571 8.571-21.143 0-29.714-8-8-21.143-8-29.143 0-34.286 34.857-108 46.857-160.571 46.857s-126.286-12-160.571-46.857c-8-8-21.143-8-29.143 0-8.571 8-8.571 21.143 0 29.714 54.286 54.286 158.857 58.286 189.714 58.286s135.429-4 189.714-58.286zM700 682.857c46.857 0 85.143-38.286 85.143-85.714 0-46.857-38.286-85.143-85.143-85.143-47.429 0-85.714 38.286-85.714 85.143 0 47.429 38.286 85.714 85.714 85.714z"
326 |         ],
327 |         "width": 1024,
328 |         "attrs": [],
329 |         "isMulticolor": false,
330 |         "isMulticolor2": false,
331 |         "tags": [
332 |           "reddit-alien"
333 |         ],
334 |         "defaultCode": 62081,
335 |         "grid": 14
336 |       },
337 |       "attrs": [],
338 |       "properties": {
339 |         "name": "reddit",
340 |         "id": 7,
341 |         "order": 11,
342 |         "prevSize": 24
343 |       },
344 |       "setIdx": 2,
345 |       "setId": 2,
346 |       "iconIdx": 7
347 |     }
348 |   ],
349 |   "height": 1024,
350 |   "preferences": {
351 |     "showGlyphs": true,
352 |     "showQuickUse": true,
353 |     "showQuickUse2": true,
354 |     "showSVGs": true,
355 |     "fontPref": {
356 |       "prefix": "icon-",
357 |       "metadata": {
358 |         "fontFamily": "icomoon"
359 |       },
360 |       "metrics": {
361 |         "emSize": 1024,
362 |         "baseline": 6.25,
363 |         "whitespace": 50
364 |       },
365 |       "embed": false
366 |     },
367 |     "imagePref": {
368 |       "prefix": "icon-",
369 |       "png": false,
370 |       "useClassSelector": true,
371 |       "color": 0,
372 |       "bgColor": 16777215,
373 |       "classSelector": ".icon",
374 |       "name": "Paway",
375 |       "height": 32,
376 |       "columns": 16,
377 |       "margin": 16
378 |     },
379 |     "historySize": 50,
380 |     "showCodes": true,
381 |     "gridSize": 16
382 |   }
383 | }


--------------------------------------------------------------------------------
/src/svg-icon/symbol-defs.svg:
--------------------------------------------------------------------------------
 1 | <svg aria-hidden="true" style="position: absolute; width: 0; height: 0; overflow: hidden;" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
 2 | <defs>
 3 | <symbol id="icon-arrow" viewBox="0 0 24 24">
 4 | <path stroke-linejoin="round" stroke-linecap="round" stroke-miterlimit="4" stroke-width="2.25" d="M5.25 11.438l6.75-6.75 6.75 6.75M12 5.625v13.688"></path>
 5 | </symbol>
 6 | <symbol id="icon-close" viewBox="0 0 24 24">
 7 | <path stroke-linejoin="round" stroke-linecap="round" stroke-miterlimit="4" stroke-width="1.5" d="M17.25 17.25l-10.5-10.5M17.25 6.75l-10.5 10.5"></path>
 8 | </symbol>
 9 | <symbol id="icon-menu" viewBox="0 0 24 24">
10 | <path stroke-linejoin="miter" stroke-linecap="round" stroke-miterlimit="10" stroke-width="1.5" d="M3.75 7.5h16.5M3.75 12h16.5M3.75 16.5h16.5"></path>
11 | </symbol>
12 | <symbol id="icon-search" viewBox="0 0 24 24">
13 | <path d="M21.407 19.753l-4.41-4.41c1.020-1.346 1.633-3.048 1.633-4.893 0-0.003 0-0.006 0-0.009v0c0-4.516-3.674-8.19-8.19-8.19s-8.19 3.674-8.19 8.19 3.674 8.19 8.19 8.19c0.003 0 0.006 0 0.009 0 1.845 0 3.548-0.614 4.914-1.648l-0.020 0.015 4.41 4.41c0.206 0.185 0.48 0.298 0.781 0.298 0.647 0 1.172-0.525 1.172-1.172 0-0.301-0.113-0.575-0.299-0.782l0.001 0.001zM4.59 10.44c0-3.231 2.619-5.85 5.85-5.85s5.85 2.619 5.85 5.85c0 3.231-2.619 5.85-5.85 5.85v0c-3.229-0.004-5.846-2.621-5.85-5.85v-0z"></path>
14 | </symbol>
15 | <symbol id="icon-linkedin" viewBox="0 0 24 24">
16 | <path d="M20.82 1.5h-17.526c-0.958 0-1.794 0.689-1.794 1.635v17.565c0 0.952 0.837 1.8 1.794 1.8h17.521c0.963 0 1.685-0.854 1.685-1.8v-17.565c0.006-0.946-0.722-1.635-1.68-1.635zM8.010 19.005h-3.008v-9.354h3.008zM6.609 8.228h-0.022c-0.963 0-1.586-0.717-1.586-1.614 0-0.914 0.64-1.613 1.624-1.613s1.587 0.695 1.608 1.613c-0 0.897-0.624 1.614-1.625 1.614zM19.005 19.005h-3.008v-5.115c0-1.225-0.438-2.063-1.526-2.063-0.832 0-1.324 0.563-1.543 1.11-0.082 0.197-0.104 0.465-0.104 0.739v5.328h-3.008v-9.354h3.008v1.302c0.438-0.623 1.122-1.521 2.713-1.521 1.975 0 3.469 1.302 3.469 4.108z"></path>
17 | </symbol>
18 | <symbol id="icon-youtube" viewBox="0 0 24 24">
19 | <path d="M23.843 6.975c0-2.109-1.552-3.806-3.469-3.806-2.597-0.121-5.245-0.168-7.952-0.168h-0.844c-2.7 0-5.353 0.047-7.95 0.169-1.912 0-3.464 1.706-3.464 3.816-0.117 1.668-0.167 3.337-0.164 5.006q-0.007 2.503 0.159 5.011c0 2.109 1.552 3.82 3.464 3.82 2.728 0.127 5.527 0.183 8.372 0.178q4.275 0.014 8.372-0.178c1.917 0 3.469-1.711 3.469-3.82 0.112-1.673 0.164-3.342 0.159-5.016q0.016-2.503-0.153-5.011zM9.703 16.589v-9.211l6.797 4.603z"></path>
20 | </symbol>
21 | <symbol id="icon-twitter" viewBox="0 0 24 24">
22 | <path d="M23.25 5.133c-0.772 0.345-1.667 0.597-2.605 0.713l-0.046 0.005c0.952-0.564 1.669-1.438 2.022-2.48l0.009-0.032c-0.845 0.503-1.828 0.885-2.874 1.092l-0.059 0.010c-0.848-0.887-2.041-1.439-3.362-1.439-0.003 0-0.006 0-0.009 0h0c-2.551 0-4.615 2.034-4.615 4.542-0 0.007-0 0.015-0 0.023 0 0.36 0.043 0.709 0.125 1.043l-0.006-0.030c-3.834-0.185-7.213-1.984-9.498-4.727l-0.017-0.021c-0.393 0.653-0.627 1.44-0.628 2.283v0c0 1.575 0.822 2.967 2.062 3.783-0.773-0.019-1.493-0.227-2.122-0.579l0.023 0.012v0.056c0 2.203 1.594 4.036 3.703 4.453-0.365 0.101-0.784 0.159-1.216 0.159h-0c-0.002 0-0.005 0-0.008 0-0.304 0-0.601-0.031-0.888-0.089l0.028 0.005c0.586 1.805 2.293 3.117 4.315 3.155-1.562 1.213-3.551 1.945-5.711 1.945-0.008 0-0.016 0-0.024-0h0.001c-0.389-0.001-0.771-0.024-1.147-0.070l0.046 0.005c1.989 1.288 4.42 2.053 7.030 2.053 0.012 0 0.025-0 0.037-0h-0.002c8.501 0 13.146-6.923 13.146-12.928 0-0.197-0.005-0.394-0.015-0.586 0.906-0.65 1.67-1.43 2.282-2.322l0.020-0.032z"></path>
23 | </symbol>
24 | <symbol id="icon-instagram" viewBox="0 0 24 24">
25 | <path d="M16.375 3.25c2.413 0.007 4.368 1.962 4.375 4.375v8.75c-0.007 2.413-1.962 4.368-4.375 4.375h-8.75c-2.413-0.007-4.368-1.962-4.375-4.375v-8.75c0.007-2.413 1.962-4.368 4.375-4.375h8.75zM16.375 1.5h-8.75c-3.369 0-6.125 2.756-6.125 6.125v8.75c0 3.369 2.756 6.125 6.125 6.125h8.75c3.369 0 6.125-2.756 6.125-6.125v-8.75c0-3.369-2.756-6.125-6.125-6.125z"></path>
26 | <path d="M17.687 7.625c-0.725 0-1.313-0.588-1.313-1.313s0.588-1.313 1.313-1.313c0.725 0 1.313 0.588 1.313 1.313v0c0 0.001 0 0.002 0 0.003 0 0.723-0.586 1.31-1.31 1.31-0.001 0-0.002 0-0.003 0h0zM12 8.5c1.933 0 3.5 1.567 3.5 3.5s-1.567 3.5-3.5 3.5c-1.933 0-3.5-1.567-3.5-3.5v0c0.002-1.932 1.568-3.498 3.5-3.5h0zM12 6.75c-2.899 0-5.25 2.351-5.25 5.25s2.351 5.25 5.25 5.25c2.899 0 5.25-2.351 5.25-5.25v0c0-2.899-2.351-5.25-5.25-5.25v0z"></path>
27 | </symbol>
28 | <symbol id="icon-facebook" viewBox="0 0 24 24">
29 | <path d="M22.5 12.063c0-5.798-4.702-10.5-10.5-10.5s-10.5 4.702-10.5 10.5c0 5.241 3.839 9.585 8.859 10.373v-7.337h-2.667v-3.036h2.667v-2.313c0-2.631 1.568-4.086 3.966-4.086 1.149 0 2.351 0.205 2.351 0.205v2.584h-1.325c-1.304 0-1.711 0.809-1.711 1.641v1.969h2.912l-0.465 3.036h-2.446v7.338c5.020-0.788 8.859-5.132 8.859-10.374z"></path>
30 | </symbol>
31 | <symbol id="icon-send" viewBox="0 0 24 24">
32 | <path d="M23.625 0.147c0.281 0.201 0.415 0.522 0.362 0.857l-3.429 20.571c-0.040 0.254-0.201 0.469-0.429 0.603-0.121 0.067-0.268 0.107-0.415 0.107-0.107 0-0.214-0.027-0.321-0.067l-6.067-2.478-3.241 3.951c-0.161 0.201-0.402 0.308-0.656 0.308-0.094 0-0.201-0.013-0.295-0.054-0.335-0.121-0.563-0.442-0.563-0.804v-4.674l11.571-14.183-14.317 12.388-5.29-2.17c-0.308-0.121-0.509-0.402-0.536-0.737-0.013-0.321 0.147-0.629 0.429-0.79l22.286-12.857c0.134-0.080 0.281-0.121 0.429-0.121 0.174 0 0.348 0.054 0.482 0.147z"></path>
33 | </symbol>
34 | <symbol id="icon-reddit" viewBox="0 0 24 24">
35 | <path d="M24 11.33c0 1.045-0.589 1.942-1.46 2.384 0.107 0.415 0.161 0.844 0.161 1.286 0 4.232-4.781 7.661-10.674 7.661-5.879 0-10.661-3.429-10.661-7.661 0-0.429 0.054-0.857 0.147-1.259-0.897-0.442-1.513-1.353-1.513-2.411 0-1.473 1.192-2.665 2.665-2.665 0.763 0 1.446 0.321 1.942 0.844 1.808-1.259 4.219-2.076 6.897-2.17l1.554-6.978c0.054-0.241 0.308-0.402 0.549-0.348l4.942 1.085c0.321-0.643 1.004-1.098 1.781-1.098 1.112 0 2.009 0.897 2.009 1.996 0 1.112-0.897 2.009-2.009 2.009-1.098 0-1.996-0.897-1.996-1.996l-4.473-0.991-1.393 6.321c2.692 0.080 5.129 0.884 6.951 2.143 0.482-0.509 1.165-0.817 1.915-0.817 1.473 0 2.665 1.192 2.665 2.665zM5.598 13.996c0 1.112 0.897 2.009 1.996 2.009 1.112 0 2.009-0.897 2.009-2.009 0-1.098-0.897-1.996-2.009-1.996-1.098 0-1.996 0.897-1.996 1.996zM16.446 18.75c0.201-0.201 0.201-0.496 0-0.696-0.188-0.188-0.496-0.188-0.683 0-0.804 0.817-2.531 1.098-3.763 1.098s-2.96-0.281-3.763-1.098c-0.188-0.188-0.496-0.188-0.683 0-0.201 0.188-0.201 0.496 0 0.696 1.272 1.272 3.723 1.366 4.446 1.366s3.174-0.094 4.446-1.366zM16.406 16.004c1.098 0 1.996-0.897 1.996-2.009 0-1.098-0.897-1.996-1.996-1.996-1.112 0-2.009 0.897-2.009 1.996 0 1.112 0.897 2.009 2.009 2.009z"></path>
36 | </symbol>
37 | </defs>
38 | </svg>
39 | 


--------------------------------------------------------------------------------
/tag.hbs:
--------------------------------------------------------------------------------
 1 | {{!< default}}
 2 | {{!-- The tag above means: insert everything in this file
 3 | into the {body} of the default.hbs template --}}
 4 | 
 5 | {{#tag}}
 6 | <header class="py-vw6 text-center max-w-2xl mx-auto px-4">
 7 |     <div class="text-gray-500 text-sm uppercase tracking-wider mb-3">{{plural ../pagination.total empty=(t "posts") singular=(t "% post") plural=(t "% posts")}} {{t "in"}}</div>
 8 |     <h1 class="text-title text-4xl leading-none md:text-5xl">{{name}}</h1>
 9 |     {{#if description}}<p class="font-serif text-xl text-gray-500 italic mt-6">{{description}}</p>{{/if}}
10 | </header>
11 | {{/tag}}
12 | 
13 | {{!-- All Story - partials/loop.hbs --}}
14 | {{> "loop"}}
15 | 
16 | {{!-- Pagination --}}
17 | {{"pagination"}}


--------------------------------------------------------------------------------
/tailwind.config.js:
--------------------------------------------------------------------------------
  1 | const defaultTheme = require('tailwindcss/defaultTheme')
  2 | const colors = require('tailwindcss/colors')
  3 | 
  4 | module.exports = {
  5 |   // darkMode: 'class',
  6 |   theme: {
  7 |     fontFamily: {
  8 |       sans: [...defaultTheme.fontFamily.sans],
  9 |       serif: ['Lora', ...defaultTheme.fontFamily.serif],
 10 |       title: 'var(--font-title)'
 11 |     },
 12 |     colors: {
 13 |       transparent: 'transparent',
 14 |       current: 'currentColor',
 15 |       black: '#000',
 16 |       blank: 'var(--blank)',
 17 |       dark: '#110f16',
 18 |       global: 'var(--text-global)',
 19 |       mark: 'var(--color-mark)',
 20 |       orange: '#f42',
 21 |       white: '#fff',
 22 |       'dark-blue-500': '#102b7b',
 23 | 
 24 |       // Logo & Header
 25 |       logo: 'var(--header-text-link)',
 26 |       'header-link': 'var(--header-text-link)',
 27 | 
 28 |       // Primary
 29 |       primary: 'var(--ghost-accent-color)',
 30 |       secondary: '#102b7b',
 31 |       // 'primary-dark': 'var(--color-primary-dark)',
 32 | 
 33 |       // Modal
 34 |       modal: 'rgba(0,0,0,.9)',
 35 | 
 36 |       // post
 37 |       title: 'var(--title-color)',
 38 | 
 39 |       // Notes
 40 |       success: '#48c774',
 41 |       warning: '#ffdd57',
 42 |       danger: '#f14668',
 43 |       amber: colors.amber,
 44 |       red: colors.red,
 45 |       slate: colors.slate,
 46 | 
 47 |       // color Gray
 48 |       gray: colors.gray,
 49 |       // gray: {
 50 |       //   100: 'var(--gray-100)',
 51 |       //   150: 'var(--gray-150)',
 52 |       //   200: 'var(--gray-200)',
 53 |       //   300: 'var(--gray-300)',
 54 |       //   400: 'var(--gray-400)',
 55 |       //   500: 'var(--gray-500)',
 56 |       //   600: 'var(--gray-600)',
 57 |       //   700: 'var(--gray-700)',
 58 |       //   800: 'var(--gray-800)',
 59 |       //   900: 'var(--gray-900)'
 60 |       // },
 61 | 
 62 |       // Social Media
 63 |       facebook: '#4267B2',
 64 |       twitter: '#55acee',
 65 |       youtube: '#FF0000',
 66 |       linkedin: '#007bb6',
 67 |       instagram: '#bf32a8',
 68 |       whatsapp: '#64d448'
 69 |     },
 70 |     screens: {
 71 |       sm: '640px', // 640px
 72 |       md: '768px', // 768px
 73 |       lg: '1000px', // 1000px
 74 |       xl: '1232px' // 1232px
 75 |     },
 76 |     container: {
 77 |       padding: '1rem'
 78 |     },
 79 |     zIndex: {
 80 |       0: 0,
 81 |       1: 1,
 82 |       2: 2,
 83 |       3: 3,
 84 |       4: 4,
 85 |       10: 10,
 86 |       20: 20,
 87 |       50: 50
 88 |     },
 89 |     extend: {
 90 |       fontSize: {
 91 |         xs: '0.75rem',
 92 |         sm: '0.875rem',
 93 |         base: '1rem',
 94 |         lg: '1.125rem',
 95 |         xl: '1.25rem',
 96 |         '2xl': '1.5rem',
 97 |         '3xl': '1.875rem',
 98 |         '4xl': '2.25rem',
 99 |         '5xl': '3rem',
100 |         '6xl': '4rem',
101 |         '7xl': '4.5rem',
102 |         '8xl': '6rem',
103 |         //
104 |         22: '1.375rem',
105 |         32: '2rem',
106 |         40: '2.5rem',
107 |         44: '44px'
108 |       },
109 |       backgroundOpacity: {
110 |         40: '0.4',
111 |         60: '0.6'
112 |       },
113 |       opacity: {
114 |         15: '0.15',
115 |         40: '0.4',
116 |         80: '0.8',
117 |         90: '0.9',
118 |         92: '0.92'
119 |       },
120 |       maxWidth: {
121 |         1100: '68.75rem',
122 |         extreme: '81.25rem'
123 |       },
124 |       minHeight: {
125 |         96: '24rem',
126 |         lg: '32rem'
127 |       },
128 |       maxHeight: {
129 |         128: '32rem',
130 |         '(screen-16)': 'calc(100vh - 4rem)'
131 |       },
132 |       height: {
133 |         128: '32rem',
134 |         88: '22rem'
135 |         // 90: '24rem',
136 |         // 96: '24rem'
137 |         // 98: '32rem'
138 |       },
139 |       padding: {
140 |         vw8: '8vw',
141 |         vw4: '4vw',
142 |         vw6: '6vw',
143 |         vmin8: '8vmin'
144 |       },
145 |       boxShadow: {
146 |         '3xl': '0 36px 64px 0 rgba(0,0,0,.2)'
147 |       },
148 |       inset: {
149 |         32: '8rem',
150 |         24: '6rem',
151 |         16: '4rem'
152 |       },
153 |       borderWidth: {
154 |         3: '0.1875rem'
155 |       },
156 |       gridTemplateColumns: {
157 |         sidebar: '1fr 22.5rem',
158 |         kusi2: 'calc(12.5rem + 4vmin) 1fr',
159 |         kusi3: 'calc(12.5rem + 4vmin) 1fr calc(13.75rem + 2vmin)'
160 |       }
161 |     }
162 |   },
163 |   variants: {},
164 |   plugins: [
165 |     require('@tailwindcss/typography'),
166 |     require('@tailwindcss/line-clamp')
167 |   ],
168 |   content: [
169 |     './*.hbs',
170 |     './partials/**/*.hbs',
171 |     './src/js/**/*.js'
172 |   ]
173 |   // safelist: [
174 |   //   'hover:text-youtube',
175 |   //   'hover:text-instagram'
176 |   // ]
177 | }
178 | 


--------------------------------------------------------------------------------