generated from Seekra/repository-template
Compare commits
3
Commits
main
..
e7745a9bd3
| Author | SHA1 | Date | |
|---|---|---|---|
|
|
e7745a9bd3
|
||
|
|
32edb6d55f
|
||
|
|
876e661a73
|
@@ -1,16 +1,2 @@
|
|||||||
# 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_BUILD_ID=2026-08-04-76a067e
|
||||||
VITE_ASSETS_BASE_URL=https://assets.seekra.jcloud-services.ddns.net
|
VITE_ASSETS_BASE_URL=https://assets.seekra.jcloud-services.ddns.net
|
||||||
|
|||||||
@@ -61,10 +61,6 @@ onMounted(async () => {
|
|||||||
});
|
});
|
||||||
settingsLoaded.value = true;
|
settingsLoaded.value = true;
|
||||||
});
|
});
|
||||||
|
|
||||||
const toggleSidebarIfSmallScreen = function toggleSidebarIfSmallScreen (toggleSidebarFunction) {
|
|
||||||
if (matchMedia('(max-width: 48rem)').matches) toggleSidebarFunction();
|
|
||||||
};
|
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<template>
|
<template>
|
||||||
@@ -75,14 +71,13 @@ const toggleSidebarIfSmallScreen = function toggleSidebarIfSmallScreen (toggleSi
|
|||||||
</h1>
|
</h1>
|
||||||
</header>
|
</header>
|
||||||
<LeftSidebarLayout class="layout">
|
<LeftSidebarLayout class="layout">
|
||||||
<template #sidebar="{ toggleSidebar }">
|
<template #sidebar>
|
||||||
<ul class="sidebar-sections-list">
|
<ul class="sidebar-sections-list">
|
||||||
<li v-for="section in settings">
|
<li v-for="section in settings">
|
||||||
<RouterLink
|
<RouterLink
|
||||||
:to="`/settings/${section.name}`"
|
:to="`/settings/${section.name}`"
|
||||||
class="button button-link link sidebar-section"
|
class="button button-link link sidebar-section"
|
||||||
:class="{ active: activeSection === section.name }"
|
:class="{ active: activeSection === section.name }"
|
||||||
@click="toggleSidebarIfSmallScreen(toggleSidebar)"
|
|
||||||
>
|
>
|
||||||
{{ t(section.i18n) }}
|
{{ t(section.i18n) }}
|
||||||
</RouterLink>
|
</RouterLink>
|
||||||
|
|||||||
@@ -29,7 +29,7 @@ const props = defineProps({
|
|||||||
|
|
||||||
const expanded = ref(props.expanded);
|
const expanded = ref(props.expanded);
|
||||||
|
|
||||||
const toggleSidebar = function toggleSidebar () {
|
const toggleExpanded = function toggleExpanded () {
|
||||||
expanded.value = !expanded.value;
|
expanded.value = !expanded.value;
|
||||||
};
|
};
|
||||||
</script>
|
</script>
|
||||||
@@ -37,13 +37,13 @@ const toggleSidebar = function toggleSidebar () {
|
|||||||
<template>
|
<template>
|
||||||
<div class="layout-container" :class="{ expanded }">
|
<div class="layout-container" :class="{ expanded }">
|
||||||
<div class="sidebar-expand-button-container">
|
<div class="sidebar-expand-button-container">
|
||||||
<SidebarExpandButton class="sidebar-expand-button" @click="toggleSidebar" />
|
<SidebarExpandButton class="sidebar-expand-button" @click="toggleExpanded" />
|
||||||
</div>
|
</div>
|
||||||
<Sidebar @toggle-expanded="toggleSidebar" :expanded="expanded" class="sidebar">
|
<Sidebar @toggle-expanded="toggleExpanded" :expanded="expanded" class="sidebar">
|
||||||
<slot name="sidebar" :toggleSidebar="toggleSidebar" />
|
<slot name="sidebar" />
|
||||||
</Sidebar>
|
</Sidebar>
|
||||||
<main class="main-content">
|
<main class="main-content">
|
||||||
<slot :toggleSidebar="toggleSidebar" />
|
<slot />
|
||||||
</main>
|
</main>
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
|
|||||||
@@ -86,9 +86,4 @@ input {
|
|||||||
|
|
||||||
.button:hover {
|
.button:hover {
|
||||||
background-color: var(--light-hover);
|
background-color: var(--light-hover);
|
||||||
}
|
|
||||||
|
|
||||||
/* Temporary until a custom tap highlight is implemented. */
|
|
||||||
* {
|
|
||||||
-webkit-tap-highlight-color: transparent;
|
|
||||||
}
|
}
|
||||||
Reference in New Issue
Block a user