diff --git a/res/static/style/layout.css b/res/static/style/layout.css index 6614aaf..2d8f4d4 100644 --- a/res/static/style/layout.css +++ b/res/static/style/layout.css @@ -500,7 +500,7 @@ input[type="color"]:active { /* Selected buttons get the accent colour on a shade of it. The outline shows hover and keyboard focus, so it would be confusing to use it for this too */ .button_highlight { - color: var(--accent_color) !important; + color: var(--link_color) !important; background: var(--accent_shade) !important; } diff --git a/res/template/wrap.html b/res/template/wrap.html index 44f2347..a832537 100644 --- a/res/template/wrap.html +++ b/res/template/wrap.html @@ -36,7 +36,7 @@ {{with .Node}}window.initial_node = {{.}};{{end}} - + diff --git a/svelte/src/filesystem/Filesystem.svelte b/svelte/src/filesystem/Filesystem.svelte index 9aa311b..aff3706 100644 --- a/svelte/src/filesystem/Filesystem.svelte +++ b/svelte/src/filesystem/Filesystem.svelte @@ -42,10 +42,10 @@ onMount(() => { return } - // Custom CSS rules for the whole viewer. The MainMenu applies its - // styles to the element. So we apply to the element, our - // styles take precedence since they're lower level, and we can clean it - // up afterwards without overwriting global style + // Custom CSS rules for the whole viewer. App.svelte applies its styles + // to the element. So we apply to the element, our styles + // take precedence since they're lower level, and we can clean it up + // afterwards without overwriting global style document.body.style = css_from_path(nav.path) update_favicon() }) diff --git a/svelte/src/filesystem/edit_window/Branding.ts b/svelte/src/filesystem/edit_window/Branding.ts index 3e19a93..5a2a90b 100644 --- a/svelte/src/filesystem/edit_window/Branding.ts +++ b/svelte/src/filesystem/edit_window/Branding.ts @@ -239,9 +239,9 @@ const generate_link_color = (link_color: string, body_color: string) => { // If the body and link colours are both dark we lighten the link, and the // other way around too if (body[2] < 50 && link[2] < 50) { - link[2] = link[2] + 40 // Dark color, add lightness + link[2] = link[2] + 30 // Dark color, add lightness } else if (body[2] > 50 && link[2] > 50) { - link[2] = link[2] - 40 // Light color, remove lightness + link[2] = link[2] - 30 // Light color, remove lightness } return rgb2hex(hsl2rgb(link)) // Convert back to hex } diff --git a/svelte/src/filesystem/viewers/Audio.svelte b/svelte/src/filesystem/viewers/Audio.svelte index 3219dd5..6782cc2 100644 --- a/svelte/src/filesystem/viewers/Audio.svelte +++ b/svelte/src/filesystem/viewers/Audio.svelte @@ -144,7 +144,7 @@ onMount(() => {

Tracklist

{#each siblings as sibling (sibling.id)} {#if !sibling.is_hidden()} - + {#if sibling.path === $nav.base.path} play_arrow {:else} @@ -185,7 +185,4 @@ onMount(() => { .play_arrow { margin: 4px; } -.playing { - color: var(--accent_color); -} diff --git a/svelte/src/layout/ToggleButton.svelte b/svelte/src/layout/ToggleButton.svelte index b77608b..76abc9b 100644 --- a/svelte/src/layout/ToggleButton.svelte +++ b/svelte/src/layout/ToggleButton.svelte @@ -54,7 +54,7 @@ const click = (e: MouseEvent) => { flex: 0 0 content; } .on { - color: var(--accent_color); + color: var(--link_color); } .off { color: var(--red_color); diff --git a/svelte/src/layout/checkout/PickAmount.svelte b/svelte/src/layout/checkout/PickAmount.svelte index f7073c2..f36694a 100644 --- a/svelte/src/layout/checkout/PickAmount.svelte +++ b/svelte/src/layout/checkout/PickAmount.svelte @@ -280,7 +280,7 @@ const submit = async (e: SubmitEvent) => { diff --git a/svelte/src/wrap.js b/svelte/src/wrap.js deleted file mode 100644 index 5edfaea..0000000 --- a/svelte/src/wrap.js +++ /dev/null @@ -1,9 +0,0 @@ -import App from './wrap/MainMenu.svelte'; -import { mount } from "svelte"; - -const app = mount(App, { - target: document.body, - props: {} -}); - -export default app; diff --git a/svelte/src/wrap/MainMenu.svelte b/svelte/src/wrap/App.svelte similarity index 100% rename from svelte/src/wrap/MainMenu.svelte rename to svelte/src/wrap/App.svelte diff --git a/svelte/vite.config.ts b/svelte/vite.config.ts index 539a446..7175f1a 100644 --- a/svelte/vite.config.ts +++ b/svelte/vite.config.ts @@ -20,10 +20,10 @@ export default defineConfig({ // Compile newer syntax down to what browsers from September 2021 support target: ["chrome94", "edge94", "firefox91", "safari15"], rollupOptions: { - input: "src/wrap.js", + input: "src/main.ts", // The entrypoint keeps its name so the HTML template can find it, // the chunks it imports get a hash in their names - output: { entryFileNames: "wrap.js" }, + output: { entryFileNames: "main.js" }, }, }, plugins: [ diff --git a/webcontroller/web_controller.go b/webcontroller/web_controller.go index aba86a7..146aa0f 100644 --- a/webcontroller/web_controller.go +++ b/webcontroller/web_controller.go @@ -62,7 +62,7 @@ func New(r *httprouter.Router, conf Config) (wc *WebController) { var resourceHandler = func(w http.ResponseWriter, r *http.Request, p httprouter.Params) { // Cache resources for a year. Except the Svelte entrypoint, it keeps its // name when it changes. The chunks it imports have a hash in their name - if p.ByName("filepath") == "/svelte/wrap.js" { + if p.ByName("filepath") == "/svelte/main.js" { w.Header().Set("Cache-Control", "no-cache") } else { w.Header().Set("Cache-Control", "public, max-age=31536000")