diff --git a/packages/backend/src/server/web/views/base.pug b/packages/backend/src/server/web/views/base.pug
index b5841883bd..91f4d6606f 100644
--- a/packages/backend/src/server/web/views/base.pug
+++ b/packages/backend/src/server/web/views/base.pug
@@ -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')
diff --git a/packages/client/src/components/MkNote.vue b/packages/client/src/components/MkNote.vue
index 7d7f0e71e3..99c3fe0183 100644
--- a/packages/client/src/components/MkNote.vue
+++ b/packages/client/src/components/MkNote.vue
@@ -401,20 +401,20 @@ function onContextmenu(ev: MouseEvent): void {
os.pageWindow(notePage(appearNote));
},
},
- {
+ notePage(appearNote) != location.pathname ? {
icon: "ph-arrows-out-simple ph-bold ph-lg",
text: i18n.ts.showInPage,
action: () => {
router.push(notePage(appearNote), "forcePage");
},
- },
+ } : undefined,
null,
{
+ type: "a",
icon: "ph-arrow-square-out ph-bold ph-lg",
text: i18n.ts.openInNewTab,
- action: () => {
- window.open(notePage(appearNote), "_blank");
- },
+ href: notePage(appearNote),
+ target: "_blank",
},
{
icon: "ph-link-simple ph-bold ph-lg",
@@ -423,6 +423,13 @@ function onContextmenu(ev: MouseEvent): void {
copyToClipboard(`${url}${notePage(appearNote)}`);
},
},
+ note.user.host != null ? {
+ type: "a",
+ icon: "ph-arrow-square-up-right ph-bold ph-lg",
+ text: i18n.ts.showOnRemote,
+ href: note.url ?? note.uri ?? "",
+ target: "_blank",
+ } : undefined,
],
ev
);
diff --git a/packages/client/src/components/MkNoteDetailed.vue b/packages/client/src/components/MkNoteDetailed.vue
index 774a10fc6c..0e1780b95f 100644
--- a/packages/client/src/components/MkNoteDetailed.vue
+++ b/packages/client/src/components/MkNoteDetailed.vue
@@ -82,7 +82,7 @@
:key="note.id"
:note="note"
class="reply"
- :conversation="directQuotes"
+ :conversation="replies"
:detailedView="true"
/>
@@ -357,6 +357,12 @@ os.api("notes/children", {
limit: 30,
depth: 12,
}).then((res) => {
+ res = res.reduce((acc, note) => {
+ if (note.userId == appearNote.userId) {
+ return [...acc, note];
+ }
+ return [note, ...acc];
+ }, []);
replies.value = res;
directReplies = res
.filter((note) => note.replyId === appearNote.id)
@@ -619,10 +625,7 @@ onUnmounted(() => {
opacity: 1;
}
}
-
- &.max-width_500px {
- font-size: 0.9em;
- }
+
&.max-width_450px {
> .reply-to:first-child {
padding-top: 14px;
diff --git a/packages/client/src/components/MkNoteSub.vue b/packages/client/src/components/MkNoteSub.vue
index 77046dcbad..72f6473e7e 100644
--- a/packages/client/src/components/MkNoteSub.vue
+++ b/packages/client/src/components/MkNoteSub.vue
@@ -337,7 +337,7 @@ function onContextmenu(ev: MouseEvent): void {
} else {
os.contextMenu(
[
- {
+ {
type: "label",
text: notePage(appearNote),
},
@@ -348,20 +348,20 @@ function onContextmenu(ev: MouseEvent): void {
os.pageWindow(notePage(appearNote));
},
},
- {
+ notePage(appearNote) != location.pathname ? {
icon: "ph-arrows-out-simple ph-bold ph-lg",
text: i18n.ts.showInPage,
action: () => {
router.push(notePage(appearNote), "forcePage");
},
- },
+ } : undefined,
null,
{
+ type: "a",
icon: "ph-arrow-square-out ph-bold ph-lg",
text: i18n.ts.openInNewTab,
- action: () => {
- window.open(notePage(appearNote), "_blank");
- },
+ href: notePage(appearNote),
+ target: "_blank",
},
{
icon: "ph-link-simple ph-bold ph-lg",
@@ -370,6 +370,13 @@ function onContextmenu(ev: MouseEvent): void {
copyToClipboard(`${url}${notePage(appearNote)}`);
},
},
+ note.user.host != null ? {
+ type: "a",
+ icon: "ph-arrow-square-up-right ph-bold ph-lg",
+ text: i18n.ts.showOnRemote,
+ href: note.url ?? note.uri ?? "",
+ target: "_blank",
+ } : undefined,
],
ev
);
diff --git a/packages/client/src/components/global/MkPageHeader.vue b/packages/client/src/components/global/MkPageHeader.vue
index 4840607952..67549a6541 100644
--- a/packages/client/src/components/global/MkPageHeader.vue
+++ b/packages/client/src/components/global/MkPageHeader.vue
@@ -305,7 +305,10 @@ onUnmounted(() => {
box-sizing: border-box;
overflow: hidden;
@media (max-width: 500px) {
- padding-inline: 12p;
+ padding-inline: 16px;
+ &.tabs > .buttons > :deep(.follow-button > span) {
+ display: none;
+ }
}
@media (max-width: 700px) {
> .left {
@@ -432,8 +435,6 @@ onUnmounted(() => {
text-align: left;
font-weight: bold;
flex-shrink: 0;
- margin-right: 1rem;
-
> .avatar {
$size: 32px;
display: inline-block;
diff --git a/packages/client/src/init.ts b/packages/client/src/init.ts
index 43a92a3163..7a004688d6 100644
--- a/packages/client/src/init.ts
+++ b/packages/client/src/init.ts
@@ -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(() => {
diff --git a/packages/client/src/pages/note.vue b/packages/client/src/pages/note.vue
index 5b408bdaf7..8e710de471 100644
--- a/packages/client/src/pages/note.vue
+++ b/packages/client/src/pages/note.vue
@@ -162,12 +162,12 @@ definePageMetadata(
computed(() =>
note
? {
- title: i18n.t("noteOf", { user: note.user.name }),
+ title: i18n.t("noteOf", { user: note.user.name || note.user.username }),
subtitle: new Date(note.createdAt).toLocaleString(),
avatar: note.user,
path: `/notes/${note.id}`,
share: {
- title: i18n.t("noteOf", { user: note.user.name }),
+ title: i18n.t("noteOf", { user: note.user.name || note.user.username }),
text: note.text,
},
}
diff --git a/packages/client/src/ui/universal.vue b/packages/client/src/ui/universal.vue
index 5b61c1b2c8..3784ef8af3 100644
--- a/packages/client/src/ui/universal.vue
+++ b/packages/client/src/ui/universal.vue
@@ -15,10 +15,7 @@
:style="{ background: pageMetadata?.value?.bg }"
@contextmenu.stop="onContextmenu"
>
-
-
-
-
+
@@ -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;
- }
-}