minify html
This commit is contained in:
Tommy Parnell
@@ -11,11 +11,11 @@
|
||||
<link rel="manifest" href="/manifest.json">
|
||||
<meta name="author" content="Tommy "TerribleDev" Parnell" />
|
||||
<link rel="icon" href="/favicon.ico" />
|
||||
{%- css %}{% include "wwwroot/css/site.css" %}{% endcss %}
|
||||
{%- css %}{% include "wwwroot/css/site.mobile.css" %}{% endcss %}
|
||||
{%- css %}{% include "wwwroot/css/site.desktop.css" %}{% endcss %}
|
||||
{%- css %}{% include "../../content/css/site.css" %}{% endcss %}
|
||||
{%- css %}{% include "../../content/css/site.mobile.css" %}{% endcss %}
|
||||
{%- css %}{% include "../../content/css/site.desktop.css" %}{% endcss %}
|
||||
{#- Render the CSS bundle using Inlined CSS (for the fastest site performance in production) #}
|
||||
<style>{% getBundle "css" %}</style>
|
||||
<link rel="stylesheet" href="{% getBundleFileUrl "css" %}" />
|
||||
{% block head %}
|
||||
{% endblock %}
|
||||
|
||||
@@ -33,7 +33,9 @@
|
||||
</main>
|
||||
</div>
|
||||
</div>
|
||||
<script src="/js/swi.js"></script>
|
||||
{# <script src="{{ '../../content/js/swi.js' | url }}"></script> #}
|
||||
{%- js %}{% include "../../content/js/swi.js" %}{% endjs %}
|
||||
<script src="{% getBundleFileUrl "js" %}" async></script>
|
||||
{% block scripts %}
|
||||
{% endblock %}
|
||||
</body>
|
||||
|
||||
@@ -28,15 +28,13 @@ It seems you **must** tell razor about squishIt's assemblies. Well It turns out
|
||||
|
||||
You should end up with a section config that looks like the following:
|
||||
|
||||
```XML
|
||||
```xml
|
||||
<configSections>
|
||||
<sectionGroup name="system.web.webPages.razor" type="System.Web.WebPages.Razor.Configuration.RazorWebSectionGroup, System.Web.WebPages.Razor, Version=2.0.0.0, Culture=neutral>
|
||||
<section name="pages" type="System.Web.WebPages.Razor.Configuration.RazorPagesSection, System.Web.WebPages.Razor, Version=2.0.0.0, Culture=neutral requirePermission="false" />
|
||||
</sectionGroup>
|
||||
<section name="razor" type="Nancy.ViewEngines.Razor.RazorConfigurationSection, Nancy.ViewEngines.Razor"/>
|
||||
</configSections>
|
||||
|
||||
|
||||
```
|
||||
|
||||
Next paste the following XML **after** `</configSections>`
|
||||
|
||||
1
content/css/site.desktop.min.css
vendored
1
content/css/site.desktop.min.css
vendored
@@ -1 +0,0 @@
|
||||
@media screen and (min-width:769px){h1{font-size:3.3rem}h2{font-size:2.6rem}h3{font-size:2.4rem}h4{font-size:2.2rem}h5{font-size:2rem}.rootbox{display:grid;grid-template-areas:"b a" "b c";grid-template-columns:minmax(auto,270px) 1fr;grid-template-rows:3.5rem minmax(calc(100vh - 3.5rem),auto);gap:0}.navBar{height:auto}.navContent{position:sticky;top:20px}.navBar.hide{display:flex}#closeNav{display:none}#menuBtn{display:none}.main-content-wrap{max-width:750px}}
|
||||
1
content/css/site.min.css
vendored
1
content/css/site.min.css
vendored
@@ -1 +0,0 @@
|
||||
:root{--headline:#4a4a4a;--body-text-color:#5d686f;--block-quote-left-border:#d1dced;--code-block-background-color:#f5f5f5;--primary-background:#fff;--link-color:#00558d;--link-visited:var(--link-color);--border-color:#738691;--horizontal-rule:#dfe2e7;--nav-bar-background:var(--headline);--nav-bar-text-color:var(--primary-background)}html{font-family:Arial,Helvetica,sans-serif}h1,h2,h3,h4,h5,h6{color:var(--headline);line-height:1.45;letter-spacing:-.01em;line-height:1.25em}article{margin-top:.5em}body{text-rendering:optimizeLegibility;letter-spacing:-.01em;line-height:1.9rem;background-color:var(--primary-background);color:var(--body-text-color);font-size:1.125rem;margin:0}.main-content-wrap{display:block;padding-right:1.2em;padding-left:1.2em;padding-bottom:1.2em;margin:0 auto;grid-area:c;word-break:break-word}.headerBump{padding-top:3.5rem}.main-content-wrap img{display:block;width:auto;max-width:100%;margin-bottom:1.2rem}.headline{margin-bottom:0;margin-top:0}.headlineSubtext{font-size:.8em}blockquote{border-left:2px solid var(--block-quote-left-border);padding:.4em 1.2em}code,pre{font-size:1rem;font-family:"Courier New",Courier,monospace;font-weight:600;border-radius:3px;background:var(--code-block-background-color);padding:0 .4em;overflow-x:scroll;letter-spacing:.02em}pre>code{padding:0}a{color:var(--link-color);font-weight:400}a:visited{color:var(--link-visited)}.btmRule{border-bottom:1px solid var(--horizontal-rule);padding-bottom:3rem}.navBar{display:flex;flex-direction:column;align-items:center;background:var(--nav-bar-background);color:var(--nav-bar-text-color);padding-top:20px;height:100vh;z-index:40;grid-area:b}.navBar.hide{display:none}.header{display:flex;align-items:center;border-bottom:1px solid var(--horizontal-rule);color:var(--headline);background-color:var(--primary-background);z-index:20;padding:0;margin:0;grid-area:a}.headerCallout{margin:auto}#menuBtn{cursor:pointer;margin-left:1rem;fill:var(--headline)}.sidebarBtns{padding:0;list-style:none}.sidebarBtns>li{margin-bottom:1.5rem;text-align:center}.round{border-radius:50%}.bottomNavButtons{display:flex;flex-direction:row;margin-top:.5rem;width:100%}.spacer{flex-grow:1}.btn{width:auto;height:auto;background:var(--primary-background);border-radius:3px;margin:0;cursor:pointer;color:var(--body-text-color);border:1px solid var(--body-text-color);padding:.3em .2em;text-decoration:none;font-size:1.1rem;text-transform:uppercase}.btn:visited{background:var(--primary-background);color:var(--border-color);border:1px solid var(--border-color)}.btn.block{display:inline-block;margin-bottom:4px;margin-right:4px;font-size:.9rem}a.link-unstyled,div.link-unstyled,span.link-unstyled,svg.link-unstyled{cursor:pointer;color:inherit;text-decoration:none;font-weight:inherit}.navHero{height:227px;display:block}a.skip-main{left:-999px;position:absolute;width:1px;height:1px;overflow:hidden;z-index:-999}a.skip-main:focus,a.skip-main:active{position:relative;left:initial;width:100%;height:auto;padding:5px;border-radius:15px;text-align:center;margin:0 auto;font-size:1.2em;display:inline-block}
|
||||
1
content/css/site.mobile.min.css
vendored
1
content/css/site.mobile.min.css
vendored
@@ -1 +0,0 @@
|
||||
@media screen and (max-width:768px){h1{font-size:2.6rem}h2{font-size:2.4rem}h3{font-size:2.2rem}h4{font-size:2rem}h5{font-size:1.8rem}.rootbox{display:grid;grid-template-areas:"a" "c";grid-template-rows:3.5rem minmax(calc(100vh - 3.5rem),auto);grid-template-columns:auto}.navBar{position:fixed;width:100vw}.main-content-wrap{max-width:calc(100vw - 4rem)}}
|
||||
@@ -3,7 +3,7 @@ if (navigator && navigator.serviceWorker && navigator.serviceWorker.controller)
|
||||
} else if (navigator && navigator.serviceWorker) {
|
||||
|
||||
//Register the ServiceWorker
|
||||
navigator.serviceWorker.register('/sw.js', {
|
||||
navigator.serviceWorker.register('/sw.min.js', {
|
||||
scope: '/'
|
||||
}).then(() => {
|
||||
console.log('SW');
|
||||
|
||||
7
content/testpage.njk
Normal file
7
content/testpage.njk
Normal file
@@ -0,0 +1,7 @@
|
||||
|
||||
---
|
||||
layout: layouts/base.njk
|
||||
---
|
||||
{% block scripts %}
|
||||
<script src="/js/sw.js"></script>
|
||||
{% endblock %}
|
||||
@@ -1,5 +1,6 @@
|
||||
const { DateTime } = require("luxon");
|
||||
const markdownItAnchor = require("markdown-it-anchor");
|
||||
const htmlmin = require("html-minifier");
|
||||
|
||||
const pluginRss = require("@11ty/eleventy-plugin-rss");
|
||||
const pluginSyntaxHighlight = require("@11ty/eleventy-plugin-syntaxhighlight");
|
||||
@@ -99,6 +100,20 @@ module.exports = function(eleventyConfig) {
|
||||
.filter(tag => ["all", "nav", "post", "posts"].indexOf(tag) === -1);
|
||||
});
|
||||
|
||||
eleventyConfig.addTransform("htmlmin", function(content) {
|
||||
// Prior to Eleventy 2.0: use this.outputPath instead
|
||||
if( this.page.outputPath && this.page.outputPath.endsWith(".html") ) {
|
||||
|
||||
let minified = htmlmin.minify(content, {
|
||||
useShortDoctype: true,
|
||||
removeComments: true,
|
||||
collapseWhitespace: true
|
||||
});
|
||||
return minified;
|
||||
}
|
||||
return content;
|
||||
});
|
||||
|
||||
// Customize Markdown library settings:
|
||||
// eleventyConfig.amendLibrary("md", mdLib => {
|
||||
// mdLib.use(markdownItAnchor, {
|
||||
|
||||
99
package-lock.json
generated
99
package-lock.json
generated
@@ -15,6 +15,7 @@
|
||||
"@11ty/eleventy-plugin-bundle": "^1.0.4",
|
||||
"@11ty/eleventy-plugin-rss": "^1.2.0",
|
||||
"@11ty/eleventy-plugin-syntaxhighlight": "^5.0.0",
|
||||
"html-minifier": "^4.0.0",
|
||||
"luxon": "^3.3.0",
|
||||
"markdown-it-anchor": "^8.6.7"
|
||||
},
|
||||
@@ -691,6 +692,16 @@
|
||||
"url": "https://github.com/sponsors/ljharb"
|
||||
}
|
||||
},
|
||||
"node_modules/camel-case": {
|
||||
"version": "3.0.0",
|
||||
"resolved": "https://registry.npmjs.org/camel-case/-/camel-case-3.0.0.tgz",
|
||||
"integrity": "sha512-+MbKztAYHXPr1jNTSKQF52VpcFjwY5RkR7fxksV8Doo4KAYc5Fl4UJRgthBbTmEx8C54DqahhbLJkDwjI3PI/w==",
|
||||
"dev": true,
|
||||
"dependencies": {
|
||||
"no-case": "^2.2.0",
|
||||
"upper-case": "^1.1.1"
|
||||
}
|
||||
},
|
||||
"node_modules/chalk": {
|
||||
"version": "4.1.2",
|
||||
"resolved": "https://registry.npmjs.org/chalk/-/chalk-4.1.2.tgz",
|
||||
@@ -749,6 +760,18 @@
|
||||
"integrity": "sha512-jJ0bqzaylmJtVnNgzTeSOs8DPavpbYgEr/b0YL8/2GO3xJEhInFmhKMUnEJQjZumK7KXGFhUy89PrsJWlakBVg==",
|
||||
"dev": true
|
||||
},
|
||||
"node_modules/clean-css": {
|
||||
"version": "4.2.4",
|
||||
"resolved": "https://registry.npmjs.org/clean-css/-/clean-css-4.2.4.tgz",
|
||||
"integrity": "sha512-EJUDT7nDVFDvaQgAo2G/PJvxmp1o/c6iXLbswsBbUFXi1Nr+AjA2cKmfbKDMjMvzEe75g3P6JkaDDAKk96A85A==",
|
||||
"dev": true,
|
||||
"dependencies": {
|
||||
"source-map": "~0.6.0"
|
||||
},
|
||||
"engines": {
|
||||
"node": ">= 4.0"
|
||||
}
|
||||
},
|
||||
"node_modules/color": {
|
||||
"version": "4.2.3",
|
||||
"resolved": "https://registry.npmjs.org/color/-/color-4.2.3.tgz",
|
||||
@@ -1457,6 +1480,42 @@
|
||||
"node": ">= 0.4"
|
||||
}
|
||||
},
|
||||
"node_modules/he": {
|
||||
"version": "1.2.0",
|
||||
"resolved": "https://registry.npmjs.org/he/-/he-1.2.0.tgz",
|
||||
"integrity": "sha512-F/1DnUGPopORZi0ni+CvrCgHQ5FyEAHRLSApuYWMmrbSwoN2Mn/7k+Gl38gJnR7yyDZk6WLXwiGod1JOWNDKGw==",
|
||||
"dev": true,
|
||||
"bin": {
|
||||
"he": "bin/he"
|
||||
}
|
||||
},
|
||||
"node_modules/html-minifier": {
|
||||
"version": "4.0.0",
|
||||
"resolved": "https://registry.npmjs.org/html-minifier/-/html-minifier-4.0.0.tgz",
|
||||
"integrity": "sha512-aoGxanpFPLg7MkIl/DDFYtb0iWz7jMFGqFhvEDZga6/4QTjneiD8I/NXL1x5aaoCp7FSIT6h/OhykDdPsbtMig==",
|
||||
"dev": true,
|
||||
"dependencies": {
|
||||
"camel-case": "^3.0.0",
|
||||
"clean-css": "^4.2.1",
|
||||
"commander": "^2.19.0",
|
||||
"he": "^1.2.0",
|
||||
"param-case": "^2.1.1",
|
||||
"relateurl": "^0.2.7",
|
||||
"uglify-js": "^3.5.1"
|
||||
},
|
||||
"bin": {
|
||||
"html-minifier": "cli.js"
|
||||
},
|
||||
"engines": {
|
||||
"node": ">=6"
|
||||
}
|
||||
},
|
||||
"node_modules/html-minifier/node_modules/commander": {
|
||||
"version": "2.20.3",
|
||||
"resolved": "https://registry.npmjs.org/commander/-/commander-2.20.3.tgz",
|
||||
"integrity": "sha512-GpVkmM8vF2vQUkj2LvZmD35JxeJOLCwJ9cUkugyk2nuhbv3+mJvpLYYt+0+USMxE+oj+ey/lJEnhZw75x/OMcQ==",
|
||||
"dev": true
|
||||
},
|
||||
"node_modules/htmlparser2": {
|
||||
"version": "7.2.0",
|
||||
"resolved": "https://registry.npmjs.org/htmlparser2/-/htmlparser2-7.2.0.tgz",
|
||||
@@ -1840,6 +1899,12 @@
|
||||
"integrity": "sha512-m/M1U1f3ddMCs6Hq2tAsYThTBDaAKFDX3dwDo97GEYzamXi9SqUpjWi/Rrj/gf3X2n8ktwgZrlP1z6E3v/IExQ==",
|
||||
"dev": true
|
||||
},
|
||||
"node_modules/lower-case": {
|
||||
"version": "1.1.4",
|
||||
"resolved": "https://registry.npmjs.org/lower-case/-/lower-case-1.1.4.tgz",
|
||||
"integrity": "sha512-2Fgx1Ycm599x+WGpIYwJOvsjmXFzTSc34IwDWALRA/8AopUKAVPwfJ+h5+f85BCp0PWmmJcWzEpxOpoXycMpdA==",
|
||||
"dev": true
|
||||
},
|
||||
"node_modules/lru-cache": {
|
||||
"version": "6.0.0",
|
||||
"resolved": "https://registry.npmjs.org/lru-cache/-/lru-cache-6.0.0.tgz",
|
||||
@@ -2111,6 +2176,15 @@
|
||||
"integrity": "sha512-Yd3UES5mWCSqR+qNT93S3UoYUkqAZ9lLg8a7g9rimsWmYGK8cVToA4/sF3RrshdyV3sAGMXVUmpMYOw+dLpOuw==",
|
||||
"dev": true
|
||||
},
|
||||
"node_modules/no-case": {
|
||||
"version": "2.3.2",
|
||||
"resolved": "https://registry.npmjs.org/no-case/-/no-case-2.3.2.tgz",
|
||||
"integrity": "sha512-rmTZ9kz+f3rCvK2TD1Ue/oZlns7OGoIWP4fc3llxxRXlOkHKoWPPWJOfFYpITabSow43QJbRIoHQXtt10VldyQ==",
|
||||
"dev": true,
|
||||
"dependencies": {
|
||||
"lower-case": "^1.1.1"
|
||||
}
|
||||
},
|
||||
"node_modules/node-abi": {
|
||||
"version": "3.51.0",
|
||||
"resolved": "https://registry.npmjs.org/node-abi/-/node-abi-3.51.0.tgz",
|
||||
@@ -2259,6 +2333,15 @@
|
||||
"node": ">=8"
|
||||
}
|
||||
},
|
||||
"node_modules/param-case": {
|
||||
"version": "2.1.1",
|
||||
"resolved": "https://registry.npmjs.org/param-case/-/param-case-2.1.1.tgz",
|
||||
"integrity": "sha512-eQE845L6ot89sk2N8liD8HAuH4ca6Vvr7VWAWwt7+kvvG5aBcPmmphQ68JsEG2qa9n1TykS2DLeMt363AAH8/w==",
|
||||
"dev": true,
|
||||
"dependencies": {
|
||||
"no-case": "^2.2.0"
|
||||
}
|
||||
},
|
||||
"node_modules/parse-srcset": {
|
||||
"version": "1.0.2",
|
||||
"resolved": "https://registry.npmjs.org/parse-srcset/-/parse-srcset-1.0.2.tgz",
|
||||
@@ -2712,6 +2795,15 @@
|
||||
"rimraf": "bin.js"
|
||||
}
|
||||
},
|
||||
"node_modules/relateurl": {
|
||||
"version": "0.2.7",
|
||||
"resolved": "https://registry.npmjs.org/relateurl/-/relateurl-0.2.7.tgz",
|
||||
"integrity": "sha512-G08Dxvm4iDN3MLM0EsP62EDV9IuhXPR6blNz6Utcp7zyV3tr4HVNINt6MpaRWbxoOHT3Q7YN2P+jaHX8vUbgog==",
|
||||
"dev": true,
|
||||
"engines": {
|
||||
"node": ">= 0.10"
|
||||
}
|
||||
},
|
||||
"node_modules/resolve": {
|
||||
"version": "1.22.8",
|
||||
"resolved": "https://registry.npmjs.org/resolve/-/resolve-1.22.8.tgz",
|
||||
@@ -3137,7 +3229,6 @@
|
||||
"resolved": "https://registry.npmjs.org/uglify-js/-/uglify-js-3.17.4.tgz",
|
||||
"integrity": "sha512-T9q82TJI9e/C1TAxYvfb16xO120tMVFZrGA3f9/P4424DNu6ypK103y0GPFVa17yotwSyZW5iYXgjYHkGrJW/g==",
|
||||
"dev": true,
|
||||
"optional": true,
|
||||
"bin": {
|
||||
"uglifyjs": "bin/uglifyjs"
|
||||
},
|
||||
@@ -3154,6 +3245,12 @@
|
||||
"node": ">= 0.8"
|
||||
}
|
||||
},
|
||||
"node_modules/upper-case": {
|
||||
"version": "1.1.3",
|
||||
"resolved": "https://registry.npmjs.org/upper-case/-/upper-case-1.1.3.tgz",
|
||||
"integrity": "sha512-WRbjgmYzgXkCV7zNVpy5YgrHgbBv126rMALQQMrmzOVC4GM2waQ9x7xtm8VU+1yF2kWyPzI9zbZ48n4vSxwfSA==",
|
||||
"dev": true
|
||||
},
|
||||
"node_modules/util-deprecate": {
|
||||
"version": "1.0.2",
|
||||
"resolved": "https://registry.npmjs.org/util-deprecate/-/util-deprecate-1.0.2.tgz",
|
||||
|
||||
@@ -39,6 +39,7 @@
|
||||
"@11ty/eleventy-plugin-bundle": "^1.0.4",
|
||||
"@11ty/eleventy-plugin-rss": "^1.2.0",
|
||||
"@11ty/eleventy-plugin-syntaxhighlight": "^5.0.0",
|
||||
"html-minifier": "^4.0.0",
|
||||
"luxon": "^3.3.0",
|
||||
"markdown-it-anchor": "^8.6.7"
|
||||
}
|
||||
|
||||
@@ -1,13 +0,0 @@
|
||||
@media (prefers-color-scheme: dark) {
|
||||
:root {
|
||||
--headline: #f0f0f0;
|
||||
--body-text-color: #ffffff;
|
||||
--block-quote-left-border: #d1dced;
|
||||
--code-block-background-color: #4a4a4a;
|
||||
--primary-background: #323131;
|
||||
--link-color: #3faff9;
|
||||
/* --link-visited: #d8dbde; */
|
||||
--border-color: #bdcad2;
|
||||
--horizontal-rule: #626468;
|
||||
}
|
||||
}
|
||||
@@ -1 +0,0 @@
|
||||
code[class*=language-],pre[class*=language-]{color:#f8f8f2;background:0 0;text-shadow:0 1px rgba(0,0,0,.3);font-family:Consolas,Monaco,'Andale Mono','Ubuntu Mono',monospace;font-size:1em;text-align:left;white-space:pre;word-spacing:normal;word-break:normal;word-wrap:normal;line-height:1.5;-moz-tab-size:4;-o-tab-size:4;tab-size:4;-webkit-hyphens:none;-moz-hyphens:none;-ms-hyphens:none;hyphens:none}pre[class*=language-]{padding:1em;margin:.5em 0;overflow:auto;border-radius:.3em}:not(pre)>code[class*=language-],pre[class*=language-]{background:#272822}:not(pre)>code[class*=language-]{padding:.1em;border-radius:.3em;white-space:normal}.token.cdata,.token.comment,.token.doctype,.token.prolog{color:#8292a2}.token.punctuation{color:#f8f8f2}.token.namespace{opacity:.7}.token.constant,.token.deleted,.token.property,.token.symbol,.token.tag{color:#f92672}.token.boolean,.token.number{color:#ae81ff}.token.attr-name,.token.builtin,.token.char,.token.inserted,.token.selector,.token.string{color:#a6e22e}.language-css .token.string,.style .token.string,.token.entity,.token.operator,.token.url,.token.variable{color:#f8f8f2}.token.atrule,.token.attr-value,.token.class-name,.token.function{color:#e6db74}.token.keyword{color:#66d9ef}.token.important,.token.regex{color:#fd971f}.token.bold,.token.important{font-weight:700}.token.italic{font-style:italic}.token.entity{cursor:help}
|
||||
@@ -1,234 +0,0 @@
|
||||
:root {
|
||||
--headline: #4a4a4a;
|
||||
--body-text-color: #5d686f;
|
||||
--block-quote-left-border: #d1dced;
|
||||
--code-block-background-color: #f5f5f5;
|
||||
--primary-background: #FFFFFF;
|
||||
--link-color: #00558d;
|
||||
--link-visited: var(--link-color);
|
||||
/* --link-visited: #6c6c6c; */
|
||||
--border-color: #738691;
|
||||
--horizontal-rule: #dfe2e7;
|
||||
--nav-bar-background: var(--headline);
|
||||
--nav-bar-text-color: var(--primary-background);
|
||||
}
|
||||
|
||||
html {
|
||||
font-family: Arial, Helvetica, sans-serif;
|
||||
}
|
||||
|
||||
h1,
|
||||
h2,
|
||||
h3,
|
||||
h4,
|
||||
h5,
|
||||
h6 {
|
||||
color: var(--headline);
|
||||
line-height: 1.45;
|
||||
letter-spacing: -0.01em;
|
||||
line-height: 1.25em;
|
||||
}
|
||||
|
||||
article {
|
||||
margin-top: 0.5em;
|
||||
}
|
||||
|
||||
body {
|
||||
text-rendering: optimizeLegibility;
|
||||
letter-spacing: -0.01em;
|
||||
line-height: 1.9rem;
|
||||
background-color: var(--primary-background);
|
||||
color: var(--body-text-color);
|
||||
font-size: 1.125rem;
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
.main-content-wrap {
|
||||
display: block;
|
||||
padding-right: 1.2em;
|
||||
padding-left: 1.2em;
|
||||
padding-bottom: 1.2em;
|
||||
margin: 0 auto;
|
||||
grid-area: c;
|
||||
word-break: break-word;
|
||||
}
|
||||
.headerBump {
|
||||
padding-top: 3.5rem;
|
||||
}
|
||||
|
||||
.main-content-wrap img {
|
||||
display: block;
|
||||
width: auto;
|
||||
max-width: 100%;
|
||||
margin-bottom: 1.2rem;
|
||||
}
|
||||
|
||||
.headline {
|
||||
margin-bottom: 0;
|
||||
margin-top: 0;
|
||||
}
|
||||
|
||||
.headlineSubtext {
|
||||
font-size: 0.8em;
|
||||
}
|
||||
|
||||
blockquote {
|
||||
border-left: 2px solid var(--block-quote-left-border);
|
||||
padding: 0.4em 1.2em;
|
||||
}
|
||||
|
||||
code,
|
||||
pre {
|
||||
font-size: 1rem;
|
||||
font-family: "Courier New", Courier, monospace;
|
||||
font-weight: 600;
|
||||
border-radius: 3px;
|
||||
background: var(--code-block-background-color);
|
||||
padding: 0 0.4em;
|
||||
overflow-x: scroll;
|
||||
letter-spacing: .02em;
|
||||
}
|
||||
|
||||
/* fix a bug where a code block (not inline) would have extra padding) */
|
||||
pre > code {
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
a {
|
||||
color: var(--link-color);
|
||||
font-weight: 400;
|
||||
}
|
||||
|
||||
a:visited {
|
||||
color: var(--link-visited);
|
||||
}
|
||||
|
||||
.btmRule {
|
||||
border-bottom: 1px solid var(--horizontal-rule);
|
||||
padding-bottom: 3rem;
|
||||
}
|
||||
|
||||
.navBar {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
background: var(--nav-bar-background);
|
||||
color: var(--nav-bar-text-color);
|
||||
padding-top: 20px;
|
||||
height: 100vh;
|
||||
z-index: 40;
|
||||
grid-area: b;
|
||||
}
|
||||
|
||||
.navBar.hide {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.header {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
border-bottom: 1px solid var(--horizontal-rule);
|
||||
color: var(--headline);
|
||||
background-color: var(--primary-background);
|
||||
z-index: 20;
|
||||
padding: 0;
|
||||
margin: 0;
|
||||
grid-area: a;
|
||||
}
|
||||
.headerCallout {
|
||||
margin: auto;
|
||||
}
|
||||
|
||||
#menuBtn {
|
||||
cursor: pointer;
|
||||
margin-left: 1rem;
|
||||
fill: var(--headline);
|
||||
}
|
||||
|
||||
.sidebarBtns {
|
||||
padding: 0;
|
||||
list-style: none;
|
||||
}
|
||||
|
||||
.sidebarBtns > li {
|
||||
margin-bottom: 1.5rem;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.round {
|
||||
border-radius: 50%;
|
||||
}
|
||||
|
||||
.bottomNavButtons {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
margin-top: 0.5rem;
|
||||
width: 100%;
|
||||
}
|
||||
.spacer {
|
||||
flex-grow: 1;
|
||||
}
|
||||
|
||||
.btn {
|
||||
width: auto;
|
||||
height: auto;
|
||||
background: var(--primary-background);
|
||||
border-radius: 3px;
|
||||
margin: 0;
|
||||
cursor: pointer;
|
||||
color: var(--body-text-color);
|
||||
border: 1px solid var(--body-text-color);
|
||||
padding: 0.3em 0.2em;
|
||||
text-decoration: none;
|
||||
font-size: 1.1rem;
|
||||
text-transform: uppercase;
|
||||
}
|
||||
.btn:visited {
|
||||
background: var(--primary-background);
|
||||
color: var(--border-color);
|
||||
border: 1px solid var(--border-color);
|
||||
}
|
||||
|
||||
.btn.block {
|
||||
display: inline-block;
|
||||
margin-bottom: 4px;
|
||||
margin-right: 4px;
|
||||
font-size: 0.9rem;
|
||||
}
|
||||
|
||||
a.link-unstyled,
|
||||
div.link-unstyled,
|
||||
span.link-unstyled,
|
||||
svg.link-unstyled {
|
||||
cursor: pointer;
|
||||
color: inherit;
|
||||
text-decoration: none;
|
||||
font-weight: inherit;
|
||||
}
|
||||
|
||||
.navHero {
|
||||
height: 227px;
|
||||
display: block;
|
||||
}
|
||||
|
||||
|
||||
a.skip-main {
|
||||
left:-999px;
|
||||
position:absolute;
|
||||
width:1px;
|
||||
height:1px;
|
||||
overflow:hidden;
|
||||
z-index:-999;
|
||||
}
|
||||
a.skip-main:focus, a.skip-main:active {
|
||||
position: relative;
|
||||
left: initial;
|
||||
width: 100%;
|
||||
height: auto;
|
||||
padding: 5px;
|
||||
border-radius: 15px;
|
||||
text-align: center;
|
||||
margin: 0 auto;
|
||||
font-size: 1.2em;
|
||||
display: inline-block;
|
||||
}
|
||||
@@ -1,49 +0,0 @@
|
||||
@media screen and (min-width: 769px) {
|
||||
h1 {
|
||||
font-size: 3.3rem;
|
||||
}
|
||||
|
||||
h2 {
|
||||
font-size: 2.6rem;
|
||||
}
|
||||
|
||||
h3 {
|
||||
font-size: 2.4rem;
|
||||
}
|
||||
|
||||
h4 {
|
||||
font-size: 2.2rem;
|
||||
}
|
||||
|
||||
h5 {
|
||||
font-size: 2rem;
|
||||
}
|
||||
.rootbox {
|
||||
display: grid;
|
||||
grid-template-areas:
|
||||
"b a"
|
||||
"b c";
|
||||
grid-template-columns: minmax(auto, 270px) 1fr;
|
||||
grid-template-rows: 3.5rem minmax(calc(100vh - 3.5rem), auto);
|
||||
gap: 0;
|
||||
}
|
||||
.navBar {
|
||||
height: auto;
|
||||
}
|
||||
.navContent {
|
||||
position: sticky;
|
||||
top: 20px;
|
||||
}
|
||||
.navBar.hide {
|
||||
display: flex;
|
||||
}
|
||||
#closeNav {
|
||||
display: none;
|
||||
}
|
||||
#menuBtn {
|
||||
display: none;
|
||||
}
|
||||
.main-content-wrap {
|
||||
max-width: 750px;
|
||||
}
|
||||
}
|
||||
1
wwwroot/css/site.desktop.min.css
vendored
1
wwwroot/css/site.desktop.min.css
vendored
@@ -1 +0,0 @@
|
||||
@media screen and (min-width:769px){h1{font-size:3.3rem}h2{font-size:2.6rem}h3{font-size:2.4rem}h4{font-size:2.2rem}h5{font-size:2rem}.rootbox{display:grid;grid-template-areas:"b a" "b c";grid-template-columns:minmax(auto,270px) 1fr;grid-template-rows:3.5rem minmax(calc(100vh - 3.5rem),auto);gap:0}.navBar{height:auto}.navContent{position:sticky;top:20px}.navBar.hide{display:flex}#closeNav{display:none}#menuBtn{display:none}.main-content-wrap{max-width:750px}}
|
||||
1
wwwroot/css/site.min.css
vendored
1
wwwroot/css/site.min.css
vendored
@@ -1 +0,0 @@
|
||||
:root{--headline:#4a4a4a;--body-text-color:#5d686f;--block-quote-left-border:#d1dced;--code-block-background-color:#f5f5f5;--primary-background:#fff;--link-color:#00558d;--link-visited:var(--link-color);--border-color:#738691;--horizontal-rule:#dfe2e7;--nav-bar-background:var(--headline);--nav-bar-text-color:var(--primary-background)}html{font-family:Arial,Helvetica,sans-serif}h1,h2,h3,h4,h5,h6{color:var(--headline);line-height:1.45;letter-spacing:-.01em;line-height:1.25em}article{margin-top:.5em}body{text-rendering:optimizeLegibility;letter-spacing:-.01em;line-height:1.9rem;background-color:var(--primary-background);color:var(--body-text-color);font-size:1.125rem;margin:0}.main-content-wrap{display:block;padding-right:1.2em;padding-left:1.2em;padding-bottom:1.2em;margin:0 auto;grid-area:c;word-break:break-word}.headerBump{padding-top:3.5rem}.main-content-wrap img{display:block;width:auto;max-width:100%;margin-bottom:1.2rem}.headline{margin-bottom:0;margin-top:0}.headlineSubtext{font-size:.8em}blockquote{border-left:2px solid var(--block-quote-left-border);padding:.4em 1.2em}code,pre{font-size:1rem;font-family:"Courier New",Courier,monospace;font-weight:600;border-radius:3px;background:var(--code-block-background-color);padding:0 .4em;overflow-x:scroll;letter-spacing:.02em}pre>code{padding:0}a{color:var(--link-color);font-weight:400}a:visited{color:var(--link-visited)}.btmRule{border-bottom:1px solid var(--horizontal-rule);padding-bottom:3rem}.navBar{display:flex;flex-direction:column;align-items:center;background:var(--nav-bar-background);color:var(--nav-bar-text-color);padding-top:20px;height:100vh;z-index:40;grid-area:b}.navBar.hide{display:none}.header{display:flex;align-items:center;border-bottom:1px solid var(--horizontal-rule);color:var(--headline);background-color:var(--primary-background);z-index:20;padding:0;margin:0;grid-area:a}.headerCallout{margin:auto}#menuBtn{cursor:pointer;margin-left:1rem;fill:var(--headline)}.sidebarBtns{padding:0;list-style:none}.sidebarBtns>li{margin-bottom:1.5rem;text-align:center}.round{border-radius:50%}.bottomNavButtons{display:flex;flex-direction:row;margin-top:.5rem;width:100%}.spacer{flex-grow:1}.btn{width:auto;height:auto;background:var(--primary-background);border-radius:3px;margin:0;cursor:pointer;color:var(--body-text-color);border:1px solid var(--body-text-color);padding:.3em .2em;text-decoration:none;font-size:1.1rem;text-transform:uppercase}.btn:visited{background:var(--primary-background);color:var(--border-color);border:1px solid var(--border-color)}.btn.block{display:inline-block;margin-bottom:4px;margin-right:4px;font-size:.9rem}a.link-unstyled,div.link-unstyled,span.link-unstyled,svg.link-unstyled{cursor:pointer;color:inherit;text-decoration:none;font-weight:inherit}.navHero{height:227px;display:block}a.skip-main{left:-999px;position:absolute;width:1px;height:1px;overflow:hidden;z-index:-999}a.skip-main:focus,a.skip-main:active{position:relative;left:initial;width:100%;height:auto;padding:5px;border-radius:15px;text-align:center;margin:0 auto;font-size:1.2em;display:inline-block}
|
||||
@@ -1,35 +0,0 @@
|
||||
@media screen and (max-width: 768px) {
|
||||
h1 {
|
||||
font-size: 2.6rem;
|
||||
}
|
||||
|
||||
h2 {
|
||||
font-size: 2.4rem;
|
||||
}
|
||||
|
||||
h3 {
|
||||
font-size: 2.2rem;
|
||||
}
|
||||
|
||||
h4 {
|
||||
font-size: 2rem;
|
||||
}
|
||||
|
||||
h5 {
|
||||
font-size: 1.8rem;
|
||||
}
|
||||
.rootbox {
|
||||
display: grid;
|
||||
grid-template-areas: "a" "c";
|
||||
grid-template-rows: 3.5rem minmax(calc(100vh - 3.5rem), auto);
|
||||
grid-template-columns: auto;
|
||||
}
|
||||
.navBar {
|
||||
position: fixed;
|
||||
width: 100vw;
|
||||
overflow: scroll;
|
||||
}
|
||||
.main-content-wrap {
|
||||
max-width: calc(100vw - 4rem);
|
||||
}
|
||||
}
|
||||
1
wwwroot/css/site.mobile.min.css
vendored
1
wwwroot/css/site.mobile.min.css
vendored
@@ -1 +0,0 @@
|
||||
@media screen and (max-width:768px){h1{font-size:2.6rem}h2{font-size:2.4rem}h3{font-size:2.2rem}h4{font-size:2rem}h5{font-size:1.8rem}.rootbox{display:grid;grid-template-areas:"a" "c";grid-template-rows:3.5rem minmax(calc(100vh - 3.5rem),auto);grid-template-columns:auto}.navBar{position:fixed;width:100vw}.main-content-wrap{max-width:calc(100vw - 4rem)}}
|
||||
@@ -1,59 +0,0 @@
|
||||
//This is the service worker with the combined offline experience (Offline page + Offline copy of pages)
|
||||
|
||||
//Install stage sets up the offline page in the cache and opens a new cache
|
||||
|
||||
self.addEventListener('install', function (event) {
|
||||
setTimeout(function() {
|
||||
event.waitUntil(preLoad());
|
||||
}, 5000);
|
||||
});
|
||||
|
||||
var preLoad = function () {
|
||||
return caches.open('pwabuilder-offline').then(function (cache) {
|
||||
return cache.addAll(['/offline/', '/', '/404.html', '/index.html']);
|
||||
});
|
||||
}
|
||||
|
||||
self.addEventListener('fetch', function (event) {
|
||||
event.respondWith(checkResponse(event.request).catch(function () {
|
||||
return returnFromCache(event.request)
|
||||
}
|
||||
));
|
||||
event.waitUntil(addToCache(event.request));
|
||||
});
|
||||
|
||||
var checkResponse = function (request) {
|
||||
return new Promise(function (fulfill, reject) {
|
||||
fetch(request).then(function (response) {
|
||||
if (response.status !== 404) {
|
||||
fulfill(response)
|
||||
} else {
|
||||
reject()
|
||||
}
|
||||
}, reject)
|
||||
});
|
||||
};
|
||||
|
||||
var addToCache = function (request) {
|
||||
return caches.open('pwabuilder-offline').then(function (cache) {
|
||||
return fetch(request).then(function (response) {
|
||||
return cache.put(request, response);
|
||||
});
|
||||
});
|
||||
};
|
||||
|
||||
var returnFromCache = function (request) {
|
||||
return caches.open('pwabuilder-offline').then(function (cache) {
|
||||
return cache.match(request, {
|
||||
ignoreSearch: true
|
||||
}).then(function (matching) {
|
||||
if (!matching) {
|
||||
return cache.match('/offline/')
|
||||
} else if (matching.status == 404) {
|
||||
return cache.match('/404.html');
|
||||
} else {
|
||||
return matching
|
||||
}
|
||||
});
|
||||
});
|
||||
};
|
||||
@@ -1,25 +0,0 @@
|
||||
//Add this below content to your HTML page, or add the js file to your page at the very top to register sercie worker
|
||||
if (navigator && navigator.serviceWorker && navigator.serviceWorker.controller) {
|
||||
} else if (navigator && navigator.serviceWorker) {
|
||||
|
||||
//Register the ServiceWorker
|
||||
navigator.serviceWorker.register('/sw.min.js', {
|
||||
scope: '/'
|
||||
}).then(() => {
|
||||
console.log('SW');
|
||||
});
|
||||
}
|
||||
|
||||
function toggleNav () {
|
||||
var nav = document.getElementById('navBar');
|
||||
if (!nav) {
|
||||
return;
|
||||
}
|
||||
var hidden = nav.classList.contains('hide');
|
||||
if (hidden) {
|
||||
nav.classList.remove('hide');
|
||||
}
|
||||
else {
|
||||
nav.classList.add('hide');
|
||||
}
|
||||
}
|
||||
Reference in New Issue
Block a user