1
0
mirror of https://github.com/kognise/water.css.git synced 2025-08-14 09:04:45 +02:00

feat: use ESM version of favicon-mode-switcher

This commit is contained in:
Jonas Kuske
2019-06-09 15:27:36 +02:00
parent e7cddd06fc
commit 78221f471c
7 changed files with 25 additions and 25 deletions

View File

@@ -1,6 +1,7 @@
{
"name": "Water.css",
"short_name": "Water.css",
"start_url": "./",
"icons": [
{
"src": "./android-chrome-192x192.png",

11
dist/docs/index.html vendored

File diff suppressed because one or more lines are too long

2
dist/docs/script.js vendored
View File

@@ -1,2 +1,2 @@
"use strict";var e=window,t=new URLSearchParams(e.location.search),n="undefined"!=typeof CSS&&CSS.supports("color","var(--clr)"),i="https://cdn.jsdelivr.net/gh/kognise/water.css/dist/",r={"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},s=function(e){var t=e.theme,n=e.isLegacy?"-legacy":"",i=e.isStandalone?".standalone":"";return"".concat(t).concat(n).concat(i,".min.css")},o=function(e){var t=e.theme,n=e.isLegacy,r=e.isStandalone,o=s({theme:t,isLegacy:n,isStandalone:r}),a='<link rel="stylesheet" href="'.concat(i).concat(o,'">');return!n||r?a:(function(e){var t=e.theme,n=e.isLegacy,r=e.isStandalone,o="dark"===t?"light":"dark",a=s({theme:o,isLegacy:n,isStandalone:r});return'\n\x3c!-- Preload the required stylesheets (optional) --\x3e\n<link rel="preload" as="style" href="'.concat(i).concat(s({theme:t,isLegacy:n,isStandalone:r}),'">\n<link rel="preload" as="style" href="').concat(i).concat(a,'" media="(prefers-color-scheme: ').concat(o,')">')}({theme:t,isLegacy:n,isStandalone:!0})+"\n\n"+a).trim()},a={_productHunt:document.querySelector("#js-producthunt"),_stylesheet:document.querySelector("#js-stylesheet"),_removeStartupStylesheet:function(){var e=document.head.querySelector("#js-startup-stylesheet");e&&document.head.removeChild(e);var t=a;t._stylesheet.removeEventListener("load",t._removeStartupStylesheet)},_updateProductHunt:function(e){this._productHunt.src=this._productHunt.src.replace(/dark|light/,e)},_updateStylesheet:function(e){this._stylesheet.href="../"+e},init:function(e,t){this._stylesheet.addEventListener("load",this._removeStartupStylesheet),this.update(e,t)},update:function(e,t){var n=e.isStandalone?e.theme:t||e.theme;this._updateStylesheet(s(e)),this._updateProductHunt(n)}},c=function(t,n){var i=e.matchMedia("(prefers-color-scheme: ".concat(t,")"));i.addListener(function(e){return n(e.matches)}),n(i.matches)},l=t.get("theme"),h={theme:"dark"===l||"light"===l?l:"dark",isLegacy:t.has("legacy")||!n,isStandalone:t.has("standalone")};new e.Vue({el:"#installation",filters:{capitalize:function(e){return e.charAt(0).toUpperCase()+e.slice(1)}},data:{versionOptions:h,preferedColorScheme:null,copyStatus:null},computed:{isOverwritten:function(){var e=this.versionOptions,t=e.isStandalone,n=e.theme;return!(t||!this.preferedColorScheme)&&n!==this.preferedColorScheme},selectedVersion:function(){return{fileName:s(this.versionOptions),fileSize:(e=this.versionOptions,r[s(e)]||0).toFixed(2),fileSnippet:o(this.versionOptions)};var e}},created:function(){var e=this;c("dark",function(t){return t&&(e.preferedColorScheme="dark")}),c("light",function(t){return t&&(e.preferedColorScheme="light")}),a.init(this.versionOptions,this.preferedColorScheme)},methods:{getTooltipMessage:function(e){return this.versionOptions.theme===e&&this.isOverwritten?"Your theme selection is currently overwritten by the theme setting on your device.":"Selected theme can be overwritten by theme setting on user's device."},copyToClipboard:function(){var t=this;Promise.resolve().then(function(){return e.clipboard.writeText(t.selectedVersion.fileSnippet)}).then(function(){return t.copyStatus="success"}).catch(function(){return t.copyStatus="failed"}),setTimeout(function(){return t.copyStatus=null},1e3)}},watch:{preferedColorScheme:function(e){a.update(this.versionOptions,e)},versionOptions:{deep:!0,handler:function(e){a.update(e,this.preferedColorScheme)}}}}),(0,e.faviconModeSwitcher.default)([{element:'link[rel="shortcut icon"]',href:{dark:"./icons/light-favicon.ico"}},{element:'link[rel="icon"][sizes="16x16"]',href:{dark:"./icons/light-favicon-16x16.png"}},{element:'link[rel="icon"][sizes="32x32"]',href:{dark:"./icons/light-favicon-32x32.png"}}]);
"use strict";var e=window,t=new URLSearchParams(e.location.search),n="undefined"!=typeof CSS&&CSS.supports("color","var(--clr)"),s="https://cdn.jsdelivr.net/gh/kognise/water.css/dist/",r={"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},i=function(e){var t=e.theme,n=e.isLegacy?"-legacy":"",s=e.isStandalone?".standalone":"";return"".concat(t).concat(n).concat(s,".min.css")},o=function(e){var t=e.theme,n=e.isLegacy,r=e.isStandalone,o=i({theme:t,isLegacy:n,isStandalone:r}),a='<link rel="stylesheet" href="'.concat(s).concat(o,'">');return!n||r?a:(function(e){var t=e.theme,n=e.isLegacy,r=e.isStandalone,o="dark"===t?"light":"dark",a=i({theme:o,isLegacy:n,isStandalone:r});return'\n\x3c!-- Preload the required stylesheets (optional) --\x3e\n<link rel="preload" as="style" href="'.concat(s).concat(i({theme:t,isLegacy:n,isStandalone:r}),'">\n<link rel="preload" as="style" href="').concat(s).concat(a,'" media="(prefers-color-scheme: ').concat(o,')">')}({theme:t,isLegacy:n,isStandalone:!0})+"\n\n"+a).trim()},a={_productHunt:document.querySelector("#js-producthunt"),_stylesheet:document.querySelector("#js-stylesheet"),_removeStartupStylesheet:function(){var e=document.head.querySelector("#js-startup-stylesheet");e&&document.head.removeChild(e);var t=a;t._stylesheet.removeEventListener("load",t._removeStartupStylesheet)},_updateProductHunt:function(e){this._productHunt.src=this._productHunt.src.replace(/dark|light/,e)},_updateStylesheet:function(e){this._stylesheet.href="../"+e},init:function(e,t){this._stylesheet.addEventListener("load",this._removeStartupStylesheet),this.update(e,t)},update:function(e,t){var n=e.isStandalone?e.theme:t||e.theme;this._updateStylesheet(i(e)),this._updateProductHunt(n)}},c=function(t,n){var s=e.matchMedia("(prefers-color-scheme: ".concat(t,")"));s.addListener(function(e){return n(e.matches)}),n(s.matches)},l=t.get("theme"),h={theme:"dark"===l||"light"===l?l:"dark",isLegacy:t.has("legacy")||!n,isStandalone:t.has("standalone")};new e.Vue({el:"#installation",filters:{capitalize:function(e){return e.charAt(0).toUpperCase()+e.slice(1)}},data:{versionOptions:h,preferedColorScheme:null,copyStatus:null},computed:{isOverwritten:function(){var e=this.versionOptions,t=e.isStandalone,n=e.theme;return!(t||!this.preferedColorScheme)&&n!==this.preferedColorScheme},selectedVersion:function(){return{fileName:i(this.versionOptions),fileSize:(e=this.versionOptions,r[i(e)]||0).toFixed(2),fileSnippet:o(this.versionOptions)};var e}},created:function(){var e=this;c("dark",function(t){return t&&(e.preferedColorScheme="dark")}),c("light",function(t){return t&&(e.preferedColorScheme="light")}),a.init(this.versionOptions,this.preferedColorScheme)},methods:{getTooltipMessage:function(e){return this.versionOptions.theme===e&&this.isOverwritten?"Your theme selection is currently overwritten by the theme setting on your device.":"Selected theme can be overwritten by theme setting on user's device."},copyToClipboard:function(){var t=this;Promise.resolve().then(function(){return e.clipboard.writeText(t.selectedVersion.fileSnippet)}).then(function(){return t.copyStatus="success"}).catch(function(){return t.copyStatus="failed"}),setTimeout(function(){return t.copyStatus=null},1e3)}},watch:{preferedColorScheme:function(e){a.update(this.versionOptions,e)},versionOptions:{deep:!0,handler:function(e){a.update(e,this.preferedColorScheme)}}}});
//# sourceMappingURL=script.js.map

File diff suppressed because one or more lines are too long

View File

@@ -1,6 +1,7 @@
{
"name": "Water.css",
"short_name": "Water.css",
"start_url": "./",
"icons": [
{
"src": "./android-chrome-192x192.png",

View File

@@ -6,16 +6,25 @@
<!-- Icons generated with https://realfavicongenerator.net -->
<link rel="apple-touch-icon" sizes="180x180" href="./icons/apple-touch-icon.png" />
<link rel="icon" type="image/png" sizes="32x32" href="./icons/favicon-32x32.png" />
<link rel="icon" type="image/png" sizes="16x16" href="./icons/favicon-16x16.png" />
<link rel="icon" id="icon-16" type="image/png" sizes="16x16" href="./icons/favicon-16x16.png" />
<link rel="icon" id="icon-32" type="image/png" sizes="32x32" href="./icons/favicon-32x32.png" />
<link rel="manifest" href="./icons/site.webmanifest" />
<link rel="mask-icon" href="./icons/safari-pinned-tab.svg" color="#5bbad5" />
<link rel="shortcut icon" href="./icons/favicon.ico" />
<link rel="shortcut icon" id="icon-ico" href="./icons/favicon.ico" />
<meta name="apple-mobile-web-app-title" content="Water.css" />
<meta name="application-name" content="Water.css" />
<meta name="msapplication-TileColor" content="#00aba9" />
<meta name="msapplication-config" content="./icons/browserconfig.xml" />
<meta name="theme-color" content="#ffffff" />
<!-- Use bright favicons when the browser is in dark mode. -->
<script type="module">
import faviconSwitcher from 'https://unpkg.com/favicon-mode-switcher@1.0.4/dist/index.min.mjs'
faviconSwitcher([
{ element: '#icon-ico', href: { dark: './icons/light-favicon.ico' } },
{ element: '#icon-16', href: { dark: './icons/light-favicon-16x16.png' } },
{ element: '#icon-32', href: { dark: './icons/light-favicon-32x32.png' } },
])
</script>
<!-- Startup styles of water.css, so styles don't have to wait until JS is loaded -->
<link rel="preload" as="style" href="../dark-legacy.standalone.min.css" />
@@ -240,7 +249,6 @@
></script>
<script src="https://unpkg.com/@ungap/url-search-params@0.1.2/min.js" defer></script>
<script src="https://unpkg.com/vue@2.6.10/dist/vue.min.js" defer></script>
<script src="https://unpkg.com/favicon-mode-switcher@^1.0.0" defer></script>
<script src="script.js" defer></script>
</body>
</html>

View File

@@ -186,20 +186,3 @@ new w.Vue({
},
},
})
const iconModeSwitcher = w.faviconModeSwitcher.default
/* Use bright favicons when the browser is in dark mode. */
iconModeSwitcher([
{
element: 'link[rel="shortcut icon"]',
href: { dark: './icons/light-favicon.ico' },
},
{
element: 'link[rel="icon"][sizes="16x16"]',
href: { dark: './icons/light-favicon-16x16.png' },
},
{
element: 'link[rel="icon"][sizes="32x32"]',
href: { dark: './icons/light-favicon-32x32.png' },
},
])