- commit
- 1879d3a
- parent
- e52dbb6
- author
- CheddarCrisp
- date
- 2024-04-12 18:17:52 +0200 CEST
remove html-loader and add static font link
6 files changed,
+42,
-47
+10,
-1
1@@ -5,7 +5,16 @@
2 <meta name="viewport" content="width=device-width, initial-scale=1.0">
3 <meta name="description" content="Web app for keeping track of anything you want to count.">
4 <title>NCounter</title>
5- ${require('./icon/html_code.html')}
6+ <link href="https://fonts.googleapis.com/css2?family=Material+Symbols+Outlined" rel="stylesheet" />
7+ <link rel="apple-touch-icon" sizes="180x180" href="icons/apple-touch-icon.png">
8+ <link rel="icon" type="image/png" sizes="32x32" href="icons/favicon-32x32.png">
9+ <link rel="icon" type="image/png" sizes="16x16" href="icons/favicon-16x16.png">
10+ <link rel="manifest" href="icons/site.webmanifest">
11+ <link rel="mask-icon" href="icons/safari-pinned-tab.svg" color="#3a86b7">
12+ <link rel="shortcut icon" href="icons/favicon.ico">
13+ <meta name="msapplication-TileColor" content="#dce6ef">
14+ <meta name="msapplication-config" content="icons/browserconfig.xml">
15+ <meta name="theme-color" content="#dce6ef">
16 </head>
17 <body>
18 <noscript>
+1,
-1
1@@ -1,5 +1,5 @@
2 <div class="about">
3- <button class="close" on:click={ () => { dispatch('close'); } }><i class="material-icons">close</i></button>
4+ <button class="close" on:click={ () => { dispatch('close'); } }><span class="material-symbols-outlined">close</span></button>
5 <header>
6 <h1>NCounter</h1>
7 <h2>Release |BUILD_DATE|</h2>
+2,
-2
1@@ -10,10 +10,10 @@
2 </div>
3 {/if}
4 <div class="tool-bar">
5- <button class="add" on:click="{ showAdd }"><i class="material-icons">add</i></button>
6+ <button class="add" on:click="{ showAdd }"><span class="material-symbols-outlined">add</span></button>
7 {#if updateAvailable}<button class="update"
8 class:animate="{!ignoreUpdate}"
9- on:click={() => { ignoreUpdate = true; showUpdateMessage = !showUpdateMessage; }}><i class="material-icons">arrow_upward</i></button>{/if}
10+ on:click={() => { ignoreUpdate = true; showUpdateMessage = !showUpdateMessage; }}><span class="material-symbols-outlined">arrow_upward</span></button>{/if}
11 <button class="about" on:click="{ () => { showAbout = true; } }">?</button>
12 </div>
13 </div>
+6,
-11
1@@ -5,14 +5,14 @@
2 <MyProgress value={ counter.value } max={ counter.max }></MyProgress>
3 {/if}
4 <div class="controls">
5- <button on:click={ () => { showIncrement = true; } }><i class="material-icons">add</i></button>
6- <button on:click={ () => { showSet = true; } }><i class="material-icons">edit</i></button>
7- <button class="reset" on:click={ reset }><i class="material-icons">replay</i></button>
8+ <button on:click={ () => { showIncrement = true; } }><span class="material-symbols-outlined">add</span></button>
9+ <button on:click={ () => { showSet = true; } }><span class="material-symbols-outlined">edit</span></button>
10+ <button class="reset" on:click={ reset }><span class="material-symbols-outlined">replay</span></button>
11 {#if counter.saveHistory}
12- <button class="history" on:click={ () => { showHistory = true; } }><i class="material-icons">show_chart</i></button>
13+ <button class="history" on:click={ () => { showHistory = true; } }><span class="material-symbols-outlined">show_chart</span></button>
14 {/if}
15- <button on:click={ startEdit }><i class="material-icons">settings</i></button>
16- <button on:click={ remove }><i class="material-icons">delete</i></button>
17+ <button on:click={ startEdit }><span class="material-symbols-outlined">settings</span></button>
18+ <button on:click={ remove }><span class="material-symbols-outlined">delete</span></button>
19 </div>
20 {#if showValueDialog}
21 <div class="dialog">
22@@ -40,14 +40,9 @@
23 </form>
24 </div>
25 {/if}
26- {#if showHistory}
27- <History { counterId } on:close={ () => { showHistory = false; } }></History>
28- {/if}
29 </div>
30 <script>
31 import MyProgress from './MyProgress.svelte';
32-import History from './History.svelte';
33-import { tick } from 'svelte';
34 import { counters } from './db.js';
35
36 export let counterId;
+1,
-1
1@@ -1,7 +1,7 @@
2 <div class="history-container">
3 <header>
4 <h1>{ counter.title }</h1>
5- <button class="close" on:click={ close }><i class="material-icons">close</i></button>
6+ <button class="close" on:click={ close }><span class="material-symbols-outlined">close</span></button>
7 </header>
8 <canvas class="chart-container" bind:this={ chartEl } width="{ window.outerWidth }" height="250">
9 </canvas>
+22,
-31
1@@ -1,6 +1,5 @@
2 const path = require('path');
3 const HtmlWebpackPlugin = require('html-webpack-plugin');
4-const GoogleFontsPlugin = require('@beyonk/google-fonts-webpack-plugin');
5 const { CleanWebpackPlugin } = require('clean-webpack-plugin');
6 const LicensePlugin = require('webpack-license-plugin');
7 const CopyWebpackPlugin = require('copy-webpack-plugin');
8@@ -20,30 +19,26 @@ module.exports = {
9 excludeChunks: ['sw'],
10 template: 'src/index.html'
11 }),
12- new GoogleFontsPlugin({
13- fonts: [
14- { family: "Material Icons" }
15- ],
16- local: false
17- }),
18 new LicensePlugin(),
19- new CopyWebpackPlugin([
20- {
21- from: 'src/icon/*.png', to: 'icons', flatten: true
22- },
23- {
24- from: 'src/icon/safari-pinned-tab.svg', to: 'icons'
25- },
26- {
27- from: 'src/icon/favicon.ico', to: 'icons'
28- },
29- {
30- from: 'src/icon/site.webmanifest', to: 'icons'
31- },
32- {
33- from: 'src/icon/browserconfig.xml', to: 'icons'
34- }
35- ])
36+ new CopyWebpackPlugin({
37+ patterns: [
38+ {
39+ from: 'src/icon/*.png', to: path.resolve(__dirname, 'dist', 'icons', '[name][ext]')
40+ },
41+ {
42+ from: 'src/icon/safari-pinned-tab.svg', to: 'icons'
43+ },
44+ {
45+ from: 'src/icon/favicon.ico', to: 'icons'
46+ },
47+ {
48+ from: 'src/icon/site.webmanifest', to: 'icons'
49+ },
50+ {
51+ from: 'src/icon/browserconfig.xml', to: 'icons'
52+ }
53+ ]
54+ })
55 ],
56 output: {
57 filename: '[name].js',
58@@ -51,13 +46,6 @@ module.exports = {
59 },
60 module: {
61 rules: [
62- {
63- test: /\.html$/,
64- loader: 'html-loader',
65- options: {
66- interpolate: true
67- }
68- },
69 {
70 test: /\.svelte$/,
71 exclude: /node_modules/,
72@@ -87,4 +75,7 @@ module.exports = {
73 }
74 ]
75 },
76+ resolve: {
77+ conditionNames: ['svelte']
78+ },
79 }