little refactor

This commit is contained in:
Freeplay 2023-05-24 19:33:59 -04:00
parent 54777fc12f
commit b70139f2bb
3 changed files with 20 additions and 35 deletions

View file

@ -31,7 +31,7 @@ html
meta(name='theme-color-orig' content= themeColor || '#31748f')
meta(property='twitter:card' content='summary')
meta(property='og:site_name' content= instanceName || 'Calckey')
meta(name='viewport' content='width=device-width, initial-scale=1')
meta(name='viewport' content='width=device-width, initial-scale=1, minimum-scale=1, maximum-scale=1, user-scalable=no')
link(rel='icon' href= icon || `/favicon.ico?${ timestamp }`)
link(rel='apple-touch-icon' href= icon || `/apple-touch-icon.png?${ timestamp }`)
link(rel='manifest' href='/manifest.json')

View file

@ -104,17 +104,6 @@ import { getAccountFromId } from "@/scripts/get-account-from-id";
});
//#endregion
// If mobile, insert the viewport meta tag
if (["smartphone", "tablet"].includes(deviceKind)) {
const viewport = document.getElementsByName("viewport").item(0);
viewport.setAttribute(
"content",
`${viewport.getAttribute(
"content",
)}, minimum-scale=1, maximum-scale=1, user-scalable=no, viewport-fit=cover`,
);
}
//#region Set lang attr
const html = document.documentElement;
html.setAttribute("lang", lang);
@ -311,12 +300,11 @@ import { getAccountFromId } from "@/scripts/get-account-from-id";
if (ColdDeviceStorage.get("syncDeviceDarkMode")) {
defaultStore.set("darkMode", isDeviceDarkmode());
}
window.matchMedia("(prefers-color-scheme: dark)").addListener((mql) => {
window.matchMedia("(prefers-color-scheme: dark)").onchange = (mql) => {
if (ColdDeviceStorage.get("syncDeviceDarkMode")) {
defaultStore.set("darkMode", mql.matches);
}
});
};
//#endregion
fetchInstanceMetaPromise.then(() => {

View file

@ -15,10 +15,7 @@
:style="{ background: pageMetadata?.value?.bg }"
@contextmenu.stop="onContextmenu"
>
<div :class="$style.content">
<RouterView />
</div>
<div :class="$style.spacer"></div>
</main>
</MkStickyContainer>
@ -173,6 +170,7 @@ import type { PageMetadata } from "@/scripts/page-metadata";
import { instanceName, ui } from "@/config";
import { StickySidebar } from "@/scripts/sticky-sidebar";
import XDrawerMenu from "@/ui/_common_/navbar-for-mobile.vue";
import XSidebar from "@/ui/_common_/navbar.vue";
import * as os from "@/os";
import { defaultStore } from "@/store";
import { navbarItemDef } from "@/navbar";
@ -186,7 +184,6 @@ import {
import { deviceKind } from "@/scripts/device-kind";
const XWidgets = defineAsyncComponent(() => import("./universal.widgets.vue"));
const XSidebar = defineAsyncComponent(() => import("@/ui/_common_/navbar.vue"));
const XStatusBars = defineAsyncComponent(
() => import("@/ui/_common_/statusbars.vue")
);
@ -462,6 +459,11 @@ console.log(mainRouter.currentRoute.value.name);
&.isMobile {
--stickyBottom: 6rem;
}
&:not(.isMobile) {
> .contents {
border-right: .5px solid var(--divider);
}
}
&.wallpaper {
background: var(--wallpaperOverlay);
}
@ -470,6 +472,10 @@ console.log(mainRouter.currentRoute.value.name);
justify-content: center;
&:not(.isMobile) {
--navBg: transparent;
> .contents {
border-inline: .5px solid var(--divider);
margin-inline: -1px;
}
}
> :deep(.sidebar:not(.iconOnly)) {
@ -545,18 +551,19 @@ console.log(mainRouter.currentRoute.value.name);
}
}
> .sidebar {
border-right: solid 0.5px var(--divider);
}
> .contents {
width: 100%;
min-width: 0;
$widgets-hide-threshold: 1090px;
@media (max-width: $widgets-hide-threshold) {
padding-bottom: calc(env(safe-area-inset-bottom, 0px) + 96px);
}
}
> .widgets {
padding: 0 var(--margin);
border-left: solid 0.5px var(--divider);
width: 300px;
box-sizing: content-box;
@media (max-width: $widgets-hide-threshold) {
display: none;
@ -732,14 +739,4 @@ console.log(mainRouter.currentRoute.value.name);
top: 0;
left: 0;
}
.spacer {
$widgets-hide-threshold: 1090px;
height: calc(env(safe-area-inset-bottom, 0px) + 96px);
@media (min-width: ($widgets-hide-threshold + 1px)) {
display: none;
}
}
</style>