feat(sidebar): decrease horizontal padding when sidebar is not expanded

Set the horizontal padding of the unexpanded sidebar to 1em.

.env

@@ -1,16 +0,0 @@
-# Copyright 2026 Seekra
-
-# Licensed under the Apache License, Version 2.0 (the "License");
-# you may not use this file except in compliance with the License.
-# You may obtain a copy of the License at
-
-#     http://www.apache.org/licenses/LICENSE-2.0
-
-# Unless required by applicable law or agreed to in writing, software
-# distributed under the License is distributed on an "AS IS" BASIS,
-# WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
-# See the License for the specific language governing permissions and
-# limitations under the License.
-
-VITE_ASSETS_BUILD_ID=2026-08-04-76a067e
-VITE_ASSETS_BASE_URL=https://assets.seekra.jcloud-services.ddns.net

src/config/env.js

@@ -1,22 +0,0 @@
-/*
-Copyright 2026 Seekra
-
-Licensed under the Apache License, Version 2.0 (the "License");
-you may not use this file except in compliance with the License.
-You may obtain a copy of the License at
-
-    http://www.apache.org/licenses/LICENSE-2.0
-
-Unless required by applicable law or agreed to in writing, software
-distributed under the License is distributed on an "AS IS" BASIS,
-WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
-See the License for the specific language governing permissions and
-limitations under the License.
-*/
-
-export const getAssetsUrl = function getAssetsUrl () {
-    return new URL(
-        `${import.meta.env.VITE_ASSETS_BUILD_ID}/`,
-        import.meta.env.VITE_ASSETS_BASE_URL
-    ).href;
-};

src/features/settings/composables/__tests__/useSettings.test.js

@@ -1,94 +0,0 @@
-/*
-Copyright 2026 Seekra
-
-Licensed under the Apache License, Version 2.0 (the "License");
-you may not use this file except in compliance with the License.
-You may obtain a copy of the License at
-
-    http://www.apache.org/licenses/LICENSE-2.0
-
-Unless required by applicable law or agreed to in writing, software
-distributed under the License is distributed on an "AS IS" BASIS,
-WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
-See the License for the specific language governing permissions and
-limitations under the License.
-*/
-
-import { useSettingsConfigCacheStore } from '../../stores/settingsConfigCacheStore';
-import { useSettingsStore } from '../../stores/settingsStore';
-import { useSettings } from '../useSettings';
-import { createTestingPinia } from '@pinia/testing';
-import { setActivePinia } from 'pinia';
-import { beforeEach, describe, expect, test, vi } from 'vitest';
-
-const settingDefaultValue = 42;
-const settingPath = ['test', 'number'];
-
-describe('useSettings', () => {
-    describe('getSetting', () => {
-        test('returns stored value', () => {
-            const { getSetting } = useSettings();
-            const settings = useSettingsStore();
-
-            const key = 'setting';
-            const value = 42;
-
-            settings.set(key, value);
-
-            expect(getSetting(key)).toBe(value);
-        });
-
-        test('returns default value', () => {
-            const { getSetting } = useSettings();
-            expect(getSetting(settingPath)).toBe(settingDefaultValue);
-        });
-
-        test('returns stored value instead of default value', () => {
-            const { getSetting } = useSettings();
-            const settings = useSettingsStore();
-
-            const value = 43;
-
-            expect(getSetting(settingPath)).toBe(settingDefaultValue);
-
-            settings.set(settingPath, value);
-            expect(getSetting(settingPath)).toBe(value);
-        });
-
-        test('returns undefined if there is no value', () => {
-            const { getSetting } = useSettings();
-            expect(getSetting(['test', 'bool'])).toBeUndefined();
-        });
-    });
-});
-
-beforeEach(() => {
-    setActivePinia(
-        createTestingPinia({
-            createSpy: vi.fn,
-            stubActions: false
-        })
-    );
-    const settingsConfigCache = useSettingsConfigCacheStore();
-    settingsConfigCache.set({
-        contents: [
-            {
-                name: 'test',
-                i18n: '',
-                content: [
-                    {
-                        type: 'number',
-                        i18n: '',
-                        name: 'number',
-                        default: settingDefaultValue
-                    },
-                    {
-                        type: 'bool',
-                        i18n: '',
-                        name: 'bool'
-                    }
-                ]
-            }
-        ]
-    });
-});

src/features/settings/composables/useSettings.js

@@ -1,44 +0,0 @@
-/*
-Copyright 2026 Seekra
-
-Licensed under the Apache License, Version 2.0 (the "License");
-you may not use this file except in compliance with the License.
-You may obtain a copy of the License at
-
-    http://www.apache.org/licenses/LICENSE-2.0
-
-Unless required by applicable law or agreed to in writing, software
-distributed under the License is distributed on an "AS IS" BASIS,
-WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
-See the License for the specific language governing permissions and
-limitations under the License.
-*/
-
-import { useSettingsConfigCacheStore } from '../stores/settingsConfigCacheStore';
-import { useSettingsStore } from '../stores/settingsStore';
-import { getSettingRecursively } from '../utils/getSetting';
-import { loadSettingsConfig } from '../utils/settingsParser';
-
-/**
- * Provides access to the stored settings.
- */
-export const useSettings = function useSettings () {
-    /**
-     * Returns the value of a specific setting.
-     * @param {string[]} key - The settings key.
-     * @return The value of the setting.
-     */
-    const getSetting = function getSetting (key) {
-        const settingsStore = useSettingsStore();
-
-        const settings = useSettingsConfigCacheStore().get();
-        return (
-            settingsStore.get(key) ??
-            getSettingRecursively(
-                key, settings.contents ?? []
-            )?.default
-        );
-    };
-
-    return { getSetting };
-};

src/features/settings/stores/settingsConfigCacheStore.js

@@ -1,31 +0,0 @@
-/*
-Copyright 2026 Seekra
-
-Licensed under the Apache License, Version 2.0 (the "License");
-you may not use this file except in compliance with the License.
-You may obtain a copy of the License at
-
-    http://www.apache.org/licenses/LICENSE-2.0
-
-Unless required by applicable law or agreed to in writing, software
-distributed under the License is distributed on an "AS IS" BASIS,
-WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
-See the License for the specific language governing permissions and
-limitations under the License.
-*/
-
-import { defineStore } from 'pinia';
-
-export const useSettingsConfigCacheStore = defineStore('settingsConfigCache', () => {
-    let settingsConfig = undefined;
-
-    const set = function set (value) {
-        settingsConfig = value;
-    };
-
-    const get = function get () {
-        return settingsConfig;
-    };
-
-    return { set, get };
-});

src/features/settings/utils/__tests__/settingsValidator.test.js

@@ -557,30 +557,6 @@ describe('settingsValidator', () => {
                 { name: 'maybe', i18n: 'selectSomething.options.maybe' }
             ] }],
 
-            [{ name: 'selectMultiple', type: 'selection', i18n: 'selectMultiple.title', default: ['1', '2', '3'], allowMultiple: true, options: [
-                { name: '1', i18n: 'selectMultiple.options.1' },
-                { name: '2', i18n: 'selectMultiple.options.2' },
-                { name: '3', i18n: 'selectMultiple.options.3' }
-            ] }],
-
-            [{ name: 'selectMultiple', type: 'selection', i18n: 'selectMultiple.title', default: ['2', '3'], allowMultiple: true, options: [
-                { name: '1', i18n: 'selectMultiple.options.1' },
-                { name: '2', i18n: 'selectMultiple.options.2' },
-                { name: '3', i18n: 'selectMultiple.options.3' }
-            ] }],
-
-            [{ name: 'selectMultiple', type: 'selection', i18n: 'selectMultiple.title', default: ['2'], allowMultiple: true, options: [
-                { name: '1', i18n: 'selectMultiple.options.1' },
-                { name: '2', i18n: 'selectMultiple.options.2' },
-                { name: '3', i18n: 'selectMultiple.options.3' }
-            ] }],
-
-            [{ name: 'selectMultiple', type: 'selection', i18n: 'selectMultiple.title', default: [], allowMultiple: true, options: [
-                { name: '1', i18n: 'selectMultiple.options.1' },
-                { name: '2', i18n: 'selectMultiple.options.2' },
-                { name: '3', i18n: 'selectMultiple.options.3' }
-            ] }],
-
             [{ name: 'aSection', type: 'section', i18n: 'sections.aSection.title', content: [] }],
             [{ name: 'aSection', type: 'section', i18n: 'sections.aSection.title', content: [
                 { name: 'enableFeature42', type: 'bool', i18n: 'feature.42.enable', default: true }
@@ -640,34 +616,6 @@ describe('settingsValidator', () => {
 
             [{ name: 'selectSomething', type: 'selection', i18n: 'selectSomething.title', default: 'a', options: true }],
             [{ name: 'selectSomething', type: 'selection', i18n: 'selectSomething.title', default: 'a', options: [] }],
-            [{ name: 'selectSomething', type: 'selection', i18n: 'selectSomething.title', default: ['a'], options: [
-                { name: 'a', i18n: 'a' },
-                { name: 'b', i18n: 'b' }
-            ] }],
-            [{ name: 'selectSomething', type: 'selection', i18n: 'selectSomething.title', default: ['a', 'b'], options: [
-                { name: 'a', i18n: 'a' },
-                { name: 'b', i18n: 'b' }
-            ] }],
-            [{ name: 'selectSomething', type: 'selection', i18n: 'selectSomething.title', allowMultiple: true, default: 'a', options: [
-                { name: 'a', i18n: 'a' },
-                { name: 'b', i18n: 'b' }
-            ] }],
-            [{ name: 'selectSomething', type: 'selection', i18n: 'selectSomething.title', allowMultiple: true, default: 'a', options: [
-                { name: 'a', i18n: 'a' },
-                { name: 'b', i18n: 'b' }
-            ] }],
-            [{ name: 'selectSomething', type: 'selection', i18n: 'selectSomething.title', allowMultiple: true, default: ['c'], options: [
-                { name: 'a', i18n: 'a' },
-                { name: 'b', i18n: 'b' }
-            ] }],
-            [{ name: 'selectSomething', type: 'selection', i18n: 'selectSomething.title', allowMultiple: true, default: [1], options: [
-                { name: 'a', i18n: 'a' },
-                { name: 'b', i18n: 'b' }
-            ] }],
-            [{ name: 'selectSomething', type: 'selection', i18n: 'selectSomething.title', allowMultiple: true, default: ['a', 1], options: [
-                { name: 'a', i18n: 'a' },
-                { name: 'b', i18n: 'b' }
-            ] }],
             [{ name: 'selectSomething', type: 'selection', i18n: 'selectSomething.title', default: 'c', options: [
                 { name: 'a', i18n: 'a' },
                 { name: 'b', i18n: 'b' }

src/features/settings/utils/settingsParser.js

@@ -14,7 +14,6 @@ See the License for the specific language governing permissions and
 limitations under the License.
 */
 
-import { useSettingsConfigCacheStore } from '../stores/settingsConfigCacheStore';
 import { validateSettingsConfig } from './settingsValidator.js';
 
 /**
@@ -22,12 +21,10 @@ import { validateSettingsConfig } from './settingsValidator.js';
  * @returns {Promise<import('../types/settingsConfig').SettingsConfig>}
  */
 export async function loadSettingsConfig() {
-    const settingsConfigCache = useSettingsConfigCacheStore();
     let raw;
 
     try {
         raw = (await import('../settings.json')).default;
-        settingsConfigCache.set(raw);
     } catch (e) {
         throw new Error(`[settings] Failed to load settings.json: ${e.message}`);
     }

src/features/settings/utils/settingsValidator.js

@@ -73,27 +73,12 @@ export const validateEntry = function validateEntry (entry, path) {
             throw new Error(`[settings] "${path}.default" must be a string`);
         }
         if (entry.type === 'selection') {
-            if (entry.allowMultiple) {
-                if (!Array.isArray(entry.default)) {
-                    throw new Error(`[settings] "${path}.default" must be an array`);
-                }
-                const allOptions = entry.options.map((option) => option.name);
-                entry.default.forEach((defaultValue, index) => {
-                    if (typeof defaultValue !== 'string') {
-                        throw new Error(`[settings] "${path}.default[${index}]" must be a string`);
-                    }
-                    if (!allOptions.includes(defaultValue)) {
-                        throw new Error(`[settings] option "${path}.default[${index}]" does not exist`);
-                    }
-                });
-            } else {
-                if (typeof entry.default !== 'string') {
-                    throw new Error(`[settings] "${path}.default" must be a string`);
-                };
-                if (!entry.options.map((option) => option.name).includes(entry.default)) {
-                    throw new Error(`[settings] option "${path}.default" does not exist`);
-                };
-            }
+            if (typeof entry.default !== 'string') {
+                throw new Error(`[settings] "${path}.default" must be a string`);
+            };
+            if (!entry.options.map((option) => option.name).includes(entry.default)) {
+                throw new Error(`[settings] option "${path}.default" does not exist`);
+            };
         };
     }
 }

src/features/settings/views/SettingsView.vue

@@ -61,10 +61,6 @@ onMounted(async () => {
     });
     settingsLoaded.value = true;
 });
-
-const toggleSidebarIfSmallScreen = function toggleSidebarIfSmallScreen (toggleSidebarFunction) {
-    if (matchMedia('(max-width: 48rem)').matches) toggleSidebarFunction();
-};
 </script>
 
 <template>
@@ -75,14 +71,13 @@ const toggleSidebarIfSmallScreen = function toggleSidebarIfSmallScreen (toggleSi
             </h1>
         </header>
         <LeftSidebarLayout class="layout">
-            <template #sidebar="{ toggleSidebar }">
+            <template #sidebar>
                 <ul class="sidebar-sections-list">
                     <li v-for="section in settings">
                         <RouterLink
                             :to="`/settings/${section.name}`"
                             class="button button-link link sidebar-section"
                             :class="{ active: activeSection === section.name }"
-                            @click="toggleSidebarIfSmallScreen(toggleSidebar)"
                         >
                             {{ t(section.i18n) }}
                         </RouterLink>

src/layouts/LeftSidebarLayout.vue

@@ -29,7 +29,7 @@ const props = defineProps({
 
 const expanded = ref(props.expanded);
 
-const toggleSidebar = function toggleSidebar () {
+const toggleExpanded = function toggleExpanded () {
     expanded.value = !expanded.value;
 };
 </script>
@@ -37,13 +37,13 @@ const toggleSidebar = function toggleSidebar () {
 <template>
     <div class="layout-container" :class="{ expanded }">
         <div class="sidebar-expand-button-container">
-            <SidebarExpandButton class="sidebar-expand-button" @click="toggleSidebar" />
+            <SidebarExpandButton class="sidebar-expand-button" @click="toggleExpanded" />
         </div>
-        <Sidebar @toggle-expanded="toggleSidebar" :expanded="expanded" class="sidebar">
-            <slot name="sidebar" :toggleSidebar="toggleSidebar" />
+        <Sidebar @toggle-expanded="toggleExpanded" :expanded="expanded" class="sidebar">
+            <slot name="sidebar" />
         </Sidebar>
         <main class="main-content">
-            <slot :toggleSidebar="toggleSidebar" />
+            <slot />
         </main>
     </div>
 </template>

src/main.js

@@ -14,7 +14,6 @@ See the License for the specific language governing permissions and
 limitations under the License.
 */
 
-import { getAssetsUrl } from './config/env';
 import { createApp } from 'vue'
 import { createPinia } from 'pinia';
 import piniaPluginPersistedstate from 'pinia-plugin-persistedstate';
@@ -26,29 +25,10 @@ import './styles/common.css'
 import './styles/variables/colors.css'
 import './styles/variables/dimensions.css';
 
-import rawFonts from './styles/fonts.json';
 import './styles/common.css';
 import './styles/variables/colors.css';
 
 (async () => {
-    const fonts = rawFonts.map((font) => new FontFace(
-        font.family ?? '',
-        Array.isArray(font.source)
-            ? font.source.map(
-                (source) => `url('${source.url
-                    ? new URL(source.url, getAssetsUrl()).href
-                    : ''
-                }') format('${source.format ?? ''}')`
-            ).join(',')
-            : '',
-        {
-            weight: font.weight ?? undefined,
-            style: font.style ?? undefined
-        }
-    ));
-    await Promise.all(fonts.map((font) => font.load()));
-    fonts.forEach((font) => document.fonts.add(font));
-
     await loadLanguage(fallbackLocale);
     await loadLanguage(getCurrentLanguage());
     

src/styles/common.css

@@ -19,7 +19,6 @@ body {
     color: var(--dark);
     margin: 0;
     font-size: 16px;
-    font-family: 'Inter', system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif;
 }
 
 .link {
@@ -86,9 +85,4 @@ input {
 
 .button:hover {
     background-color: var(--light-hover);
-}
-
-/* Temporary until a custom tap highlight is implemented. */
-* {
-    -webkit-tap-highlight-color: transparent;
 }

src/styles/fonts.json

@@ -1,32 +0,0 @@
-[
-    {
-        "family": "Inter",
-        "weight": "100 900",
-        "style": "normal",
-        "source": [
-            {
-                "url": "fonts/Inter/Inter-Variable.woff2",
-                "format": "woff2"
-            },
-            {
-                "url": "fonts/Inter/Inter-Variable.ttf",
-                "format": "truetype"
-            }
-        ]
-    },
-    {
-        "family": "Inter",
-        "weight": "100 900",
-        "style": "italic",
-        "source": [
-            {
-                "url": "fonts/Inter/Inter-Italic-Variable.woff2",
-                "format": "woff2"
-            },
-            {
-                "url": "fonts/Inter/Inter-Italic-Variable.ttf",
-                "format": "truetype"
-            }
-        ]
-    }
-]