Add to the about page

Prevent stray events from highlighting buttons
after closing a dialog
This commit is contained in:
CheddarCrisp 2020-03-12 20:30:20 -04:00
parent 306d0914d5
commit 7922d88bf8
9 changed files with 128 additions and 13 deletions

1
.gitignore vendored
View file

@ -1,2 +1,3 @@
node_modules/
dist/
.DS_Store

75
package-lock.json generated
View file

@ -328,9 +328,9 @@
}
},
"acorn": {
"version": "6.1.1",
"resolved": "https://registry.npmjs.org/acorn/-/acorn-6.1.1.tgz",
"integrity": "sha1-fSWuBbuK0fm2mRCOEJTs14hK3B8=",
"version": "6.4.1",
"resolved": "https://registry.npmjs.org/acorn/-/acorn-6.4.1.tgz",
"integrity": "sha512-ZVA9k326Nwrj3Cj9jlh3wGFutC2ZornPNARZwsNYqQYgN0EsV2d53w5RN/co65Ohn4sUAUtb1rSUAOD6XN9idA==",
"dev": true
},
"acorn-dynamic-import": {
@ -2106,6 +2106,69 @@
"integrity": "sha512-vNKxJHTEKNThjfrdJwHc7brvM6eVevuO5nTj6ez8ZQ1qbXTvGthucRF7S4vf2cr71QVnT70V34v0S1DyQsti0w==",
"dev": true
},
"file-loader": {
"version": "5.1.0",
"resolved": "https://registry.npmjs.org/file-loader/-/file-loader-5.1.0.tgz",
"integrity": "sha512-u/VkLGskw3Ue59nyOwUwXI/6nuBCo7KBkniB/l7ICwr/7cPNGsL1WCXUp3GB0qgOOKU1TiP49bv4DZF/LJqprg==",
"dev": true,
"requires": {
"loader-utils": "^1.4.0",
"schema-utils": "^2.5.0"
},
"dependencies": {
"ajv": {
"version": "6.12.0",
"resolved": "https://registry.npmjs.org/ajv/-/ajv-6.12.0.tgz",
"integrity": "sha512-D6gFiFA0RRLyUbvijN74DWAjXSFxWKaWP7mldxkVhyhAV3+SWA9HEJPHQ2c9soIeTFJqcSdFDGFgdqs1iUU2Hw==",
"dev": true,
"requires": {
"fast-deep-equal": "^3.1.1",
"fast-json-stable-stringify": "^2.0.0",
"json-schema-traverse": "^0.4.1",
"uri-js": "^4.2.2"
}
},
"ajv-keywords": {
"version": "3.4.1",
"resolved": "https://registry.npmjs.org/ajv-keywords/-/ajv-keywords-3.4.1.tgz",
"integrity": "sha512-RO1ibKvd27e6FEShVFfPALuHI3WjSVNeK5FIsmme/LYRNxjKuNj+Dt7bucLa6NdSv3JcVTyMlm9kGR84z1XpaQ==",
"dev": true
},
"emojis-list": {
"version": "3.0.0",
"resolved": "https://registry.npmjs.org/emojis-list/-/emojis-list-3.0.0.tgz",
"integrity": "sha512-/kyM18EfinwXZbno9FyUGeFh87KC8HRQBQGildHZbEuRyWFOmv1U10o9BBp8XVZDVNNuQKyIGIu5ZYAAXJ0V2Q==",
"dev": true
},
"fast-deep-equal": {
"version": "3.1.1",
"resolved": "https://registry.npmjs.org/fast-deep-equal/-/fast-deep-equal-3.1.1.tgz",
"integrity": "sha512-8UEa58QDLauDNfpbrX55Q9jrGHThw2ZMdOky5Gl1CDtVeJDPVrG4Jxx1N8jw2gkWaff5UUuX1KJd+9zGe2B+ZA==",
"dev": true
},
"loader-utils": {
"version": "1.4.0",
"resolved": "https://registry.npmjs.org/loader-utils/-/loader-utils-1.4.0.tgz",
"integrity": "sha512-qH0WSMBtn/oHuwjy/NucEgbx5dbxxnxup9s4PVXJUDHZBQY+s0NWA9rJf53RBnQZxfch7euUui7hpoAPvALZdA==",
"dev": true,
"requires": {
"big.js": "^5.2.2",
"emojis-list": "^3.0.0",
"json5": "^1.0.1"
}
},
"schema-utils": {
"version": "2.6.5",
"resolved": "https://registry.npmjs.org/schema-utils/-/schema-utils-2.6.5.tgz",
"integrity": "sha512-5KXuwKziQrTVHh8j/Uxz+QUbxkaLW9X/86NBlx/gnKgtsZA2GIVMUn17qWhRFwF8jdYb3Dig5hRO/W5mZqy6SQ==",
"dev": true,
"requires": {
"ajv": "^6.12.0",
"ajv-keywords": "^3.4.1"
}
}
}
},
"file-uri-to-path": {
"version": "1.0.0",
"resolved": "https://registry.npmjs.org/file-uri-to-path/-/file-uri-to-path-1.0.0.tgz",
@ -3674,9 +3737,9 @@
"dev": true
},
"kind-of": {
"version": "6.0.2",
"resolved": "https://registry.npmjs.org/kind-of/-/kind-of-6.0.2.tgz",
"integrity": "sha1-ARRrNqYhjmTljzqNZt5df8b20FE=",
"version": "6.0.3",
"resolved": "https://registry.npmjs.org/kind-of/-/kind-of-6.0.3.tgz",
"integrity": "sha512-dcS1ul+9tmeD95T+x28/ehLgd9mENa3LsvDTtzm3vyBEO7RPptvAD+t44WVXaUjTBRcrpFeFlC8WCruUR456hw==",
"dev": true
},
"lcid": {

View file

@ -16,6 +16,7 @@
"clean-webpack-plugin": "^3.0.0",
"copy-webpack-plugin": "^5.1.1",
"css-loader": "^3.4.2",
"file-loader": "^5.1.0",
"google-fonts-webpack-plugin": "^0.4.4",
"html-loader": "^0.5.5",
"html-webpack-plugin": "^3.2.0",

BIN
src/img/GitHub-Mark.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 942 B

View file

@ -5,6 +5,13 @@
<h2>Release |BUILD_DATE|</h2>
<h2>&copy; |BUILD_YEAR|</h2>
</header>
<div class="repo">
<a href="https://github.com/cheddarcrisp/ncounter" rel="noopener external" target="_blank"><img src="{ GitHubIcon }" alt="GitHub">Source Code</a>
<a href="https://github.com/cheddarcrisp/ncounter/issues" rel="noopener external" target="_blank"><img src="{ GitHubIcon }" alt="GitHub">Issues and feedback</a>
</div>
<h3>Privacy Policy</h3>
<p>No cookies. No tracking. All data is stored on your device.
Everything you do with this application is private.</p>
<div class="licenses">
<h2>Open Source License Information</h2>
<Licenses></Licenses>
@ -13,7 +20,10 @@
<script>
import Licenses from './Licenses.svelte';
import { createEventDispatcher } from 'svelte';
import GitHubIcon from '../img/GitHub-Mark.png';
const dispatch = createEventDispatcher();
</script>
<style>
.about {
@ -41,6 +51,36 @@ const dispatch = createEventDispatcher();
text-align: center;
}
.repo {
display: flex;
flex-wrap: wrap;
justify-content: space-around;
margin: 6px 0;
flex: none;
}
.repo > a {
display: inline-flex;
align-items: center;
color: rgba(0, 0, 0, 0.87);
text-decoration: none;
padding: 5px;
background-color: #F0F0F0;
box-shadow: 0 1px 3px rgba(0,0,0,0.12), 0 1px 2px rgba(0,0,0,0.24);
border: 2px solid transparent;
}
.repo > a:hover, .repo > a:focus {
box-shadow: none;
border-color: var(--highlight-color);
}
.repo > a > img {
width: 24px;
height: 24px;
margin-right: 4px;
}
h1 {
font-weight: 600;
font-size: 24px;
@ -50,6 +90,12 @@ h2 {
font-size: 18px;
}
h3 {
font-size: 18px;
font-weight: 600;
margin: 12px 0 6px 0;
}
.licenses h2{
font-weight: 600;
}

View file

@ -17,8 +17,8 @@
<label>Target<input type="text" pattern="(0|([1-9]\d*))(\.\d+)?" inputmode="decimal" bind:value={newCounter.max} /></label>
<label>Save history<input type="checkbox" bind:checked={newCounter.saveHistory} /></label>
<div class="buttons">
<button class="ok" on:click|preventDefault={ add }>OK</button>
<button on:click|preventDefault={ () => { showAddDialog = false; } }>Cancel</button>
<button class="ok" on:click|preventDefault|stopPropagation={ add }>OK</button>
<button on:click|preventDefault|stopPropagation={ () => { showAddDialog = false; } }>Cancel</button>
</div>
</form>
</div>

View file

@ -20,8 +20,8 @@
<h1>{ showIncrement ? "Add" : "Set" }</h1>
<input class="dialog-value" type="text" required pattern="(0|([1-9]\d*))(\.\d+)?" inputmode="decimal" bind:value={ dialogValue } use:focus />
<div class="buttons">
<button class="ok" on:click|preventDefault={ dialogDone }>OK</button>
<button on:click|preventDefault={ dialogCancel }>Cancel</button>
<button class="ok" on:click|preventDefault|stopPropagation={ dialogDone }>OK</button>
<button on:click|preventDefault|stopPropagation={ dialogCancel }>Cancel</button>
</div>
</form>
</div>

View file

@ -29,7 +29,7 @@ registerRoute(
);
registerRoute(
/\.(?:js|css)$/,
/\.(?:js|css|png)$/,
new StaleWhileRevalidate({
cacheName: 'static-resources',
})

View file

@ -37,7 +37,7 @@ module.exports = {
from: 'src/icon/safari-pinned-tab.svg', to: 'icons'
},
{
from: 'src/icon/favicon.ice', to: 'icons'
from: 'src/icon/favicon.ico', to: 'icons'
},
{
from: 'src/icon/site.webmanifest', to: 'icons'
@ -82,6 +82,10 @@ module.exports = {
'style-loader',
'css-loader'
]
},
{
test: /\.png$/,
loader: 'file-loader'
}
]
},