diff --git a/dist/docs/index.html b/dist/docs/index.html index e2c7c8c..8cb789c 100644 --- a/dist/docs/index.html +++ b/dist/docs/index.html @@ -344,8 +344,6 @@
Heading 6
diff --git a/dist/docs/script.js b/dist/docs/script.js index 1a6c7b1..9574a48 100644 --- a/dist/docs/script.js +++ b/dist/docs/script.js @@ -1,2 +1,2 @@ -"use strict";var e="https://cdn.jsdelivr.net/gh/kognise/water.css/dist/",t={"dark.min.css":1.4,"dark.standalone.min.css":1.31,"dark-legacy.min.css":2.487,"dark-legacy.standalone.min.css":1.16,"light.min.css":1.4,"light.standalone.min.css":1.3,"light-legacy.min.css":.178+1.16+1.15,"light-legacy.standalone.min.css":1.15},n=function(e){var t=e.theme,n=e.isLegacy,r=e.isStandalone;return"".concat(t).concat(n?"-legacy":"").concat(r?".standalone":"",".min.css")},r=function(t){var r=t.theme,s=t.isLegacy,i=t.isStandalone,a=n({theme:r,isLegacy:s,isStandalone:i}),c='');if(!s||i)return c;var o="dark"===r?"light":"dark";return(function(t,n,r){return'\n\x3c!-- Preload the required stylesheets (optional) --\x3e\n\n')}(n({theme:r,isLegacy:!0,isStandalone:!0}),n({theme:o,isLegacy:!0,isStandalone:!0}),o)+"\n\n"+c).trim()},s={_phImage:document.querySelector("#js-producthunt"),_stylesheet:document.querySelector("#js-stylesheet"),updateStylesheet:function(e){this._stylesheet.href=e},updateProductHunt:function(e){this._phImage.src=this._phImage.src.replace(/dark|light/,e)},update:function(e,t){var r=e.theme,s=e.isStandalone,i="../"+n(e),a=s?r:t||r;this.updateStylesheet(i),this.updateProductHunt(a)}},i=function(e,t){var n=matchMedia("(prefers-color-scheme: ".concat(e,")"));n.addListener(function(e){return t(e.matches)}),t(n.matches)};new Vue({el:"#installation",filters:{capitalize:function(e){return e.charAt(0).toUpperCase()+e.slice(1)}},data:{versionOptions:{theme:"dark",isStandalone:!1,isLegacy:!1},preferedColorScheme:null,copyStatus:null},computed:{selectedVersion:function(){return{fileName:n(this.versionOptions),fileSize:(e=this.versionOptions,t[n(e)]||"...").toFixed(2),fileSnippet:r(this.versionOptions)};var e}},created:function(){var e=this;i("dark",function(t){return t&&(e.preferedColorScheme="dark")}),i("light",function(t){return t&&(e.preferedColorScheme="light")}),this.preferedColorScheme&&s.updateProductHunt(this.preferedColorScheme)},methods:{copyToClipboard:function(){var e=this;Promise.resolve().then(function(){return clipboard.writeText(e.selectedVersion.fileSnippet)}).then(function(){return e.copyStatus="success"}).catch(function(){return e.copyStatus="failed"}),setTimeout(function(){return e.copyStatus=void 0},1e3)}},watch:{preferedColorScheme:function(e){s.update(this.versionOptions,e)},versionOptions:{deep:!0,handler:function(e){s.update(e,this.preferedColorScheme)}}}}); +"use strict";var e="https://cdn.jsdelivr.net/gh/kognise/water.css/dist/",t={"dark.min.css":1.4,"dark.standalone.min.css":1.31,"dark-legacy.min.css":2.487,"dark-legacy.standalone.min.css":1.16,"light.min.css":1.4,"light.standalone.min.css":1.3,"light-legacy.min.css":.178+1.16+1.15,"light-legacy.standalone.min.css":1.15},n=function(e){var t=e.theme,n=e.isLegacy,r=e.isStandalone;return"".concat(t).concat(n?"-legacy":"").concat(r?".standalone":"",".min.css")},r=function(t){var r=t.theme,s=t.isLegacy,i=t.isStandalone,a=n({theme:r,isLegacy:s,isStandalone:i}),c='');if(!s||i)return c;var o="dark"===r?"light":"dark";return(function(t,n,r){return'\n\x3c!-- Preload the required stylesheets (optional) --\x3e\n\n')}(n({theme:r,isLegacy:!0,isStandalone:!0}),n({theme:o,isLegacy:!0,isStandalone:!0}),o)+"\n\n"+c).trim()},s={_phImage:document.querySelector("#js-producthunt"),_stylesheet:document.querySelector("#js-stylesheet"),updateStylesheet:function(e){this._stylesheet.href=e},updateProductHunt:function(e){this._phImage.src=this._phImage.src.replace(/dark|light/,e)},update:function(e,t){var r=e.theme,s=e.isStandalone,i="../"+n(e),a=s?r:t||r;this.updateStylesheet(i),this.updateProductHunt(a)}},i=function(e,t){var n=matchMedia("(prefers-color-scheme: ".concat(e,")"));n.addListener(function(e){return t(e.matches)}),t(n.matches)};new Vue({el:"#installation",filters:{capitalize:function(e){return e.charAt(0).toUpperCase()+e.slice(1)}},data:{versionOptions:{theme:"dark",isStandalone:!1,isLegacy:!1},preferedColorScheme:null,copyStatus:null},computed:{selectedVersion:function(){return{fileName:n(this.versionOptions),fileSize:(e=this.versionOptions,t[n(e)]||0).toFixed(2),fileSnippet:r(this.versionOptions)};var e}},created:function(){var e=this;i("dark",function(t){return t&&(e.preferedColorScheme="dark")}),i("light",function(t){return t&&(e.preferedColorScheme="light")}),this.preferedColorScheme&&s.updateProductHunt(this.preferedColorScheme)},methods:{copyToClipboard:function(){var e=this;Promise.resolve().then(function(){return clipboard.writeText(e.selectedVersion.fileSnippet)}).then(function(){return e.copyStatus="success"}).catch(function(){return e.copyStatus="failed"}),setTimeout(function(){return e.copyStatus=void 0},1e3)}},watch:{preferedColorScheme:function(e){s.update(this.versionOptions,e)},versionOptions:{deep:!0,handler:function(e){s.update(e,this.preferedColorScheme)}}}}); //# sourceMappingURL=script.js.map diff --git a/dist/docs/script.js.map b/dist/docs/script.js.map index bcbfd46..e344f44 100644 --- a/dist/docs/script.js.map +++ b/dist/docs/script.js.map @@ -1 +1 @@ -{"version":3,"sources":["script.js"],"names":["CDN_BASE","FILE_SIZES","dark.min.css","dark.standalone.min.css","dark-legacy.min.css","dark-legacy.standalone.min.css","light.min.css","light.standalone.min.css","light-legacy.min.css","light-legacy.standalone.min.css","getFileName","_ref","theme","isLegacy","isStandalone","concat","getFileSnippet","_ref2","fileName","stylesheetSnippet","altTheme","mainFileName","altFileName","getFilePreloadSnippet","trim","externalElements","_phImage","document","querySelector","_stylesheet","updateStylesheet","href","this","updateProductHunt","src","replace","update","options","preferedColorScheme","visibleTheme","createColorSchemeListener","queryHandler","mediaQuery","matchMedia","addListener","query","matches","Vue","el","filters","capitalize","str","charAt","toUpperCase","slice","data","versionOptions","copyStatus","computed","selectedVersion","fileSize","toFixed","fileSnippet","created","_this","match","methods","copyToClipboard","_this2","Promise","resolve","then","clipboard","writeText","setTimeout","undefined","watch","nextScheme","deep","handler","nextOptions"],"mappings":"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","file":"script.js","sourcesContent":["/**\n * Type definition for the version object used throughout the code\n * @typedef {Object} VersionOptions\n * @prop {'dark' | 'light'} theme\n * @prop {boolean} isLegacy\n * @prop {boolean} isStandalone\n */\n\n/** The base URI from where the docs page loads the CSS files. */\nconst DEV_BASE = '../'\n/** The base URI from where instructions show to load the CSS files. */\nconst CDN_BASE = 'https://cdn.jsdelivr.net/gh/kognise/water.css/dist/'\n\n/** An object mapping the (minified + gzipped) fileSize in KB to a fileName. */\nconst FILE_SIZES = {\n 'dark.min.css': 1.4,\n 'dark.standalone.min.css': 1.31,\n 'dark-legacy.min.css': 0.177 + 1.16 + 1.15,\n 'dark-legacy.standalone.min.css': 1.16,\n 'light.min.css': 1.4,\n 'light.standalone.min.css': 1.3,\n 'light-legacy.min.css': 0.178 + 1.16 + 1.15,\n 'light-legacy.standalone.min.css': 1.15,\n}\n\n/** @param {VersionOptions} options */\nconst getFileName = ({ theme, isLegacy, isStandalone }) => {\n return `${theme}${isLegacy ? '-legacy' : ''}${isStandalone ? '.standalone' : ''}.min.css`\n}\n\n/** @param {VersionOptions} options */\nconst getFileSize = options => {\n return FILE_SIZES[getFileName(options)] || '...'\n}\n\nconst getFilePreloadSnippet = (mainFileName, altFileName, altTheme) => {\n return `\n\n\n`\n}\n\n/** @param {VersionOptions} options */\nconst getFileSnippet = ({ theme, isLegacy, isStandalone }) => {\n const fileName = getFileName({ theme, isLegacy, isStandalone })\n const stylesheetSnippet = ``\n\n if (!isLegacy || isStandalone) return stylesheetSnippet\n\n const altTheme = theme === 'dark' ? 'light' : 'dark'\n const mainStandaloneFile = getFileName({ theme, isLegacy: true, isStandalone: true })\n const altStandaloneFile = getFileName({ theme: altTheme, isLegacy: true, isStandalone: true })\n const preloadSnippet = getFilePreloadSnippet(mainStandaloneFile, altStandaloneFile, altTheme)\n\n return (preloadSnippet + '\\n\\n' + stylesheetSnippet).trim()\n}\n\nconst externalElements = {\n _phImage: document.querySelector('#js-producthunt'),\n _stylesheet: document.querySelector('#js-stylesheet'),\n\n updateStylesheet(href) {\n this._stylesheet.href = href\n },\n updateProductHunt(theme) {\n this._phImage.src = this._phImage.src.replace(/dark|light/, theme)\n },\n /** @param {VersionOptions} options @param {'dark' | 'light'} [preferedColorScheme] */\n update(options, preferedColorScheme) {\n const { theme, isStandalone } = options\n const href = DEV_BASE + getFileName(options)\n const visibleTheme = isStandalone ? theme : preferedColorScheme || theme\n\n this.updateStylesheet(href)\n this.updateProductHunt(visibleTheme)\n },\n}\n\nconst createColorSchemeListener = (theme, queryHandler) => {\n const mediaQuery = matchMedia(`(prefers-color-scheme: ${theme})`)\n mediaQuery.addListener(query => queryHandler(query.matches))\n queryHandler(mediaQuery.matches)\n}\n\nnew Vue({\n el: '#installation',\n filters: { capitalize: str => str.charAt(0).toUpperCase() + str.slice(1) },\n data: {\n versionOptions: { theme: 'dark', isStandalone: false, isLegacy: false },\n preferedColorScheme: null,\n copyStatus: null,\n },\n computed: {\n selectedVersion() {\n return {\n fileName: getFileName(this.versionOptions),\n fileSize: getFileSize(this.versionOptions).toFixed(2),\n fileSnippet: getFileSnippet(this.versionOptions),\n }\n },\n },\n created() {\n createColorSchemeListener('dark', match => match && (this.preferedColorScheme = 'dark'))\n createColorSchemeListener('light', match => match && (this.preferedColorScheme = 'light'))\n\n if (this.preferedColorScheme) externalElements.updateProductHunt(this.preferedColorScheme)\n },\n methods: {\n copyToClipboard() {\n Promise.resolve()\n .then(() => clipboard.writeText(this.selectedVersion.fileSnippet))\n .then(() => (this.copyStatus = 'success'))\n .catch(() => (this.copyStatus = 'failed'))\n setTimeout(() => (this.copyStatus = undefined), 1000)\n },\n },\n watch: {\n preferedColorScheme(nextScheme) {\n externalElements.update(this.versionOptions, nextScheme)\n },\n versionOptions: {\n deep: true,\n handler(nextOptions) {\n externalElements.update(nextOptions, this.preferedColorScheme)\n },\n },\n },\n})\n"]} \ No newline at end of file +{"version":3,"sources":["script.js"],"names":["CDN_BASE","FILE_SIZES","dark.min.css","dark.standalone.min.css","dark-legacy.min.css","dark-legacy.standalone.min.css","light.min.css","light.standalone.min.css","light-legacy.min.css","light-legacy.standalone.min.css","getFileName","_ref","theme","isLegacy","isStandalone","concat","getFileSnippet","_ref2","fileName","stylesheetSnippet","altTheme","mainFileName","altFileName","getFilePreloadSnippet","trim","externalElements","_phImage","document","querySelector","_stylesheet","updateStylesheet","href","this","updateProductHunt","src","replace","update","options","preferedColorScheme","visibleTheme","createColorSchemeListener","queryHandler","mediaQuery","matchMedia","addListener","query","matches","Vue","el","filters","capitalize","str","charAt","toUpperCase","slice","data","versionOptions","copyStatus","computed","selectedVersion","fileSize","toFixed","fileSnippet","created","_this","match","methods","copyToClipboard","_this2","Promise","resolve","then","clipboard","writeText","setTimeout","undefined","watch","nextScheme","deep","handler","nextOptions"],"mappings":"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","file":"script.js","sourcesContent":["/**\n * Type definition for the version object used throughout the code\n * @typedef {Object} VersionOptions\n * @prop {'dark' | 'light'} theme\n * @prop {boolean} isLegacy\n * @prop {boolean} isStandalone\n */\n\n/** The base URI from where the docs page loads the CSS files. */\nconst DEV_BASE = '../'\n/** The base URI from where instructions show to load the CSS files. */\nconst CDN_BASE = 'https://cdn.jsdelivr.net/gh/kognise/water.css/dist/'\n\n/** An object mapping the (minified + gzipped) fileSize in KB to a fileName. */\nconst FILE_SIZES = {\n 'dark.min.css': 1.4,\n 'dark.standalone.min.css': 1.31,\n 'dark-legacy.min.css': 0.177 + 1.16 + 1.15,\n 'dark-legacy.standalone.min.css': 1.16,\n 'light.min.css': 1.4,\n 'light.standalone.min.css': 1.3,\n 'light-legacy.min.css': 0.178 + 1.16 + 1.15,\n 'light-legacy.standalone.min.css': 1.15,\n}\n\n/** @param {VersionOptions} options */\nconst getFileName = ({ theme, isLegacy, isStandalone }) => {\n return `${theme}${isLegacy ? '-legacy' : ''}${isStandalone ? '.standalone' : ''}.min.css`\n}\n\n/** @param {VersionOptions} options */\nconst getFileSize = options => {\n return FILE_SIZES[getFileName(options)] || 0\n}\n\nconst getFilePreloadSnippet = (mainFileName, altFileName, altTheme) => {\n return `\n\n\n`\n}\n\n/** @param {VersionOptions} options */\nconst getFileSnippet = ({ theme, isLegacy, isStandalone }) => {\n const fileName = getFileName({ theme, isLegacy, isStandalone })\n const stylesheetSnippet = ``\n\n if (!isLegacy || isStandalone) return stylesheetSnippet\n\n const altTheme = theme === 'dark' ? 'light' : 'dark'\n const mainStandaloneFile = getFileName({ theme, isLegacy: true, isStandalone: true })\n const altStandaloneFile = getFileName({ theme: altTheme, isLegacy: true, isStandalone: true })\n const preloadSnippet = getFilePreloadSnippet(mainStandaloneFile, altStandaloneFile, altTheme)\n\n return (preloadSnippet + '\\n\\n' + stylesheetSnippet).trim()\n}\n\nconst externalElements = {\n _phImage: document.querySelector('#js-producthunt'),\n _stylesheet: document.querySelector('#js-stylesheet'),\n\n updateStylesheet(href) {\n this._stylesheet.href = href\n },\n updateProductHunt(theme) {\n this._phImage.src = this._phImage.src.replace(/dark|light/, theme)\n },\n /** @param {VersionOptions} options @param {'dark' | 'light'} [preferedColorScheme] */\n update(options, preferedColorScheme) {\n const { theme, isStandalone } = options\n const href = DEV_BASE + getFileName(options)\n const visibleTheme = isStandalone ? theme : preferedColorScheme || theme\n\n this.updateStylesheet(href)\n this.updateProductHunt(visibleTheme)\n },\n}\n\nconst createColorSchemeListener = (theme, queryHandler) => {\n const mediaQuery = matchMedia(`(prefers-color-scheme: ${theme})`)\n mediaQuery.addListener(query => queryHandler(query.matches))\n queryHandler(mediaQuery.matches)\n}\n\nnew Vue({\n el: '#installation',\n filters: { capitalize: str => str.charAt(0).toUpperCase() + str.slice(1) },\n data: {\n versionOptions: { theme: 'dark', isStandalone: false, isLegacy: false },\n preferedColorScheme: null,\n copyStatus: null,\n },\n computed: {\n selectedVersion() {\n return {\n fileName: getFileName(this.versionOptions),\n fileSize: getFileSize(this.versionOptions).toFixed(2),\n fileSnippet: getFileSnippet(this.versionOptions),\n }\n },\n },\n created() {\n createColorSchemeListener('dark', match => match && (this.preferedColorScheme = 'dark'))\n createColorSchemeListener('light', match => match && (this.preferedColorScheme = 'light'))\n\n if (this.preferedColorScheme) externalElements.updateProductHunt(this.preferedColorScheme)\n },\n methods: {\n copyToClipboard() {\n Promise.resolve()\n .then(() => clipboard.writeText(this.selectedVersion.fileSnippet))\n .then(() => (this.copyStatus = 'success'))\n .catch(() => (this.copyStatus = 'failed'))\n setTimeout(() => (this.copyStatus = undefined), 1000)\n },\n },\n watch: {\n preferedColorScheme(nextScheme) {\n externalElements.update(this.versionOptions, nextScheme)\n },\n versionOptions: {\n deep: true,\n handler(nextOptions) {\n externalElements.update(nextOptions, this.preferedColorScheme)\n },\n },\n },\n})\n"]} \ No newline at end of file diff --git a/dist/docs/style.css b/dist/docs/style.css index 4e29b7e..b185cd1 100755 --- a/dist/docs/style.css +++ b/dist/docs/style.css @@ -1,2 +1,2 @@ -html{scroll-behavior:smooth}#js-producthunt{margin-top:1rem}#installation header>h3{margin:1rem 2.5rem 1rem 0}#installation header button{position:relative;margin-left:auto;overflow:visible}#installation header button span{position:absolute;left:-2rem;display:inline-block;transform:scale(1.3)}#installation table{table-layout:fixed}#installation table th{border:none;vertical-align:top;width:35%}body>footer{display:flex;justify-content:flex-end;align-items:flex-end}.row{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between}.emoji{font-family:Segoe UI Emoji,Apple Color Emoji,Noto Color Emoji,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Fira Sans,Droid Sans,Helvetica Neue,sans-serif}.translucent{opacity:.5}.v-enter,.v-leave-to{transform:scale(0)!important}.v-enter-active,.v-leave-active{transition:transform .22s cubic-bezier(.175,.885,.32,1.275)}[v-cloak]>:not(h2){display:none}[v-cloak]:after{content:"Version picker is loading..."} +html{scroll-behavior:smooth}#js-producthunt{margin-top:1rem}#installation header>h3{margin:1rem 2.5rem 1rem 0}#installation header button{position:relative;margin-left:auto;overflow:visible}#installation header button span{position:absolute;left:-2rem;display:inline-block;transform:scale(1.3)}#installation table{table-layout:fixed}#installation table th{border:none;vertical-align:top;width:35%}body>footer{padding-top:2rem;display:flex;justify-content:flex-end;align-items:flex-end}.row{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between}.emoji{font-family:Segoe UI Emoji,Apple Color Emoji,Noto Color Emoji,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Fira Sans,Droid Sans,Helvetica Neue,sans-serif}.translucent{opacity:.5}.v-enter,.v-leave-to{transform:scale(0)!important}.v-enter-active,.v-leave-active{transition:transform .22s cubic-bezier(.175,.885,.32,1.275)}[v-cloak]>:not(h2){display:none}[v-cloak]:after{content:"Version picker is loading..."} /*# sourceMappingURL=style.css.map */ diff --git a/dist/docs/style.css.map b/dist/docs/style.css.map index a540d0c..2311f6b 100644 --- a/dist/docs/style.css.map +++ b/dist/docs/style.css.map @@ -1 +1 @@ -{"version":3,"sources":["style.css"],"names":[],"mappings":"AAAA,KACE,sBACF,CAEA,gBACE,eACF,CAEA,wBACE,yBACF,CAEA,4BACE,iBAAkB,CAClB,gBAAiB,CACjB,gBACF,CACA,iCACE,iBAAkB,CAClB,UAAW,CACX,oBAAqB,CACrB,oBACF,CAEA,oBACE,kBACF,CACA,uBACE,WAAY,CACZ,kBAAmB,CACnB,SACF,CAEA,YACE,YAAa,CACb,wBAAyB,CACzB,oBACF,CAGA,KACE,YAAa,CACb,cAAe,CACf,kBAAmB,CACnB,6BACF,CAGA,OACE,+LAGF,CACA,aACE,UACF,CAGA,qBAEE,4BACF,CACA,gCAEE,2DACF,CACA,mBACE,YACF,CACA,gBACE,sCACF","file":"style.css","sourcesContent":["html {\n scroll-behavior: smooth;\n}\n\n#js-producthunt {\n margin-top: 1rem;\n}\n\n#installation header > h3 {\n margin: 1rem 2.5rem 1rem 0;\n}\n/* Make the ✔ / ❌ Emoji appear next to the button */\n#installation header button {\n position: relative;\n margin-left: auto;\n overflow: visible;\n}\n#installation header button span {\n position: absolute;\n left: -2rem;\n display: inline-block;\n transform: scale(1.3);\n}\n/* Fixed layout so columns don't jump when content changes */\n#installation table {\n table-layout: fixed;\n}\n#installation table th {\n border: none;\n vertical-align: top;\n width: 35%;\n}\n\nbody > footer {\n display: flex;\n justify-content: flex-end;\n align-items: flex-end;\n}\n\n/* Used for (Links / ProductHunt) and (Installation / Copy-Button) rows */\n.row {\n display: flex;\n flex-wrap: wrap;\n align-items: center;\n justify-content: space-between;\n}\n\n/* Use proper Emoji instead of plain Unicode chars */\n.emoji {\n font-family: 'Segoe UI Emoji', 'Apple Color Emoji', 'Noto Color Emoji', system-ui, -apple-system,\n BlinkMacSystemFont, Segoe UI, Roboto, Oxygen, Ubuntu, Cantarell, Fira Sans, Droid Sans,\n Helvetica Neue, sans-serif;\n}\n.translucent {\n opacity: 0.5;\n}\n\n/* For the bounce transitions of code snippet and copy success Emoji */\n.v-enter,\n.v-leave-to {\n transform: scale(0) !important;\n}\n.v-enter-active,\n.v-leave-active {\n transition: transform 220ms cubic-bezier(0.175, 0.885, 0.32, 1.275);\n}\n[v-cloak] > *:not(h2) {\n display: none;\n}\n[v-cloak]::after {\n content: 'Version picker is loading...';\n}\n"]} \ No newline at end of file +{"version":3,"sources":["style.css"],"names":[],"mappings":"AAAA,KACE,sBACF,CAEA,gBACE,eACF,CAEA,wBACE,yBACF,CAEA,4BACE,iBAAkB,CAClB,gBAAiB,CACjB,gBACF,CACA,iCACE,iBAAkB,CAClB,UAAW,CACX,oBAAqB,CACrB,oBACF,CAEA,oBACE,kBACF,CACA,uBACE,WAAY,CACZ,kBAAmB,CACnB,SACF,CAEA,YACE,gBAAiB,CACjB,YAAa,CACb,wBAAyB,CACzB,oBACF,CAGA,KACE,YAAa,CACb,cAAe,CACf,kBAAmB,CACnB,6BACF,CAGA,OACE,+LAGF,CACA,aACE,UACF,CAGA,qBAEE,4BACF,CACA,gCAEE,2DACF,CACA,mBACE,YACF,CACA,gBACE,sCACF","file":"style.css","sourcesContent":["html {\n scroll-behavior: smooth;\n}\n\n#js-producthunt {\n margin-top: 1rem;\n}\n\n#installation header > h3 {\n margin: 1rem 2.5rem 1rem 0;\n}\n/* Make the ✔ / ❌ Emoji appear next to the button */\n#installation header button {\n position: relative;\n margin-left: auto;\n overflow: visible;\n}\n#installation header button span {\n position: absolute;\n left: -2rem;\n display: inline-block;\n transform: scale(1.3);\n}\n/* Fixed layout so columns don't jump when content changes */\n#installation table {\n table-layout: fixed;\n}\n#installation table th {\n border: none;\n vertical-align: top;\n width: 35%;\n}\n\nbody > footer {\n padding-top: 2rem;\n display: flex;\n justify-content: flex-end;\n align-items: flex-end;\n}\n\n/* Used for (Links / ProductHunt) and (Installation / Copy-Button) rows */\n.row {\n display: flex;\n flex-wrap: wrap;\n align-items: center;\n justify-content: space-between;\n}\n\n/* Use proper Emoji instead of plain Unicode chars */\n.emoji {\n font-family: 'Segoe UI Emoji', 'Apple Color Emoji', 'Noto Color Emoji', system-ui, -apple-system,\n BlinkMacSystemFont, Segoe UI, Roboto, Oxygen, Ubuntu, Cantarell, Fira Sans, Droid Sans,\n Helvetica Neue, sans-serif;\n}\n.translucent {\n opacity: 0.5;\n}\n\n/* For the bounce transitions of code snippet and copy success Emoji */\n.v-enter,\n.v-leave-to {\n transform: scale(0) !important;\n}\n.v-enter-active,\n.v-leave-active {\n transition: transform 220ms cubic-bezier(0.175, 0.885, 0.32, 1.275);\n}\n[v-cloak] > *:not(h2) {\n display: none;\n}\n[v-cloak]::after {\n content: 'Version picker is loading...';\n}\n"]} \ No newline at end of file diff --git a/docs/index.html b/docs/index.html index ea5e394..4263163 100644 --- a/docs/index.html +++ b/docs/index.html @@ -356,8 +356,6 @@
Heading 6
diff --git a/docs/script.js b/docs/script.js index 94c94ef..1a1b4b0 100644 --- a/docs/script.js +++ b/docs/script.js @@ -30,7 +30,7 @@ const getFileName = ({ theme, isLegacy, isStandalone }) => { /** @param {VersionOptions} options */ const getFileSize = options => { - return FILE_SIZES[getFileName(options)] || '...' + return FILE_SIZES[getFileName(options)] || 0 } const getFilePreloadSnippet = (mainFileName, altFileName, altTheme) => { diff --git a/docs/style.css b/docs/style.css index 1e449b9..cd7c3c0 100755 --- a/docs/style.css +++ b/docs/style.css @@ -32,6 +32,7 @@ html { } body > footer { + padding-top: 2rem; display: flex; justify-content: flex-end; align-items: flex-end;