From e1844db11b7c5db6ee47213f7d553387633ab938 Mon Sep 17 00:00:00 2001 From: ShittyKopper Date: Tue, 31 Oct 2023 21:21:29 +0300 Subject: [PATCH 1/9] upd: add corner roundness setting --- locales/en-US.yml | 1 + locales/index.d.ts | 1 + locales/ja-JP.yml | 1 + packages/backend/src/server/web/boot.js | 5 +++++ packages/frontend/src/local-storage.ts | 1 + packages/frontend/src/pages/settings/general.vue | 16 ++++++++++++++++ .../src/pages/settings/preferences-backups.vue | 9 +++++++++ 7 files changed, 34 insertions(+) diff --git a/locales/en-US.yml b/locales/en-US.yml index e8e3497f87..3bb8739f19 100644 --- a/locales/en-US.yml +++ b/locales/en-US.yml @@ -507,6 +507,7 @@ createAccount: "Create account" existingAccount: "Existing account" regenerate: "Regenerate" fontSize: "Font size" +cornerRadius: "Corner roundness" mediaListWithOneImageAppearance: "Height of media lists with one image only" limitTo: "Limit to {x}" noFollowRequests: "You don't have any pending follow requests" diff --git a/locales/index.d.ts b/locales/index.d.ts index 1c1105cb84..b2dec3e58b 100644 --- a/locales/index.d.ts +++ b/locales/index.d.ts @@ -510,6 +510,7 @@ export interface Locale { "existingAccount": string; "regenerate": string; "fontSize": string; + "cornerRadius": string; "mediaListWithOneImageAppearance": string; "limitTo": string; "noFollowRequests": string; diff --git a/locales/ja-JP.yml b/locales/ja-JP.yml index 68a6ca2daf..c49de02b1a 100644 --- a/locales/ja-JP.yml +++ b/locales/ja-JP.yml @@ -507,6 +507,7 @@ createAccount: "アカウントを作成" existingAccount: "既存のアカウント" regenerate: "再生成" fontSize: "フォントサイズ" +cornerRadius: "コーナーの丸み" mediaListWithOneImageAppearance: "画像が1枚のみのメディアリストの高さ" limitTo: "{x}を上限に" noFollowRequests: "フォロー申請はありません" diff --git a/packages/backend/src/server/web/boot.js b/packages/backend/src/server/web/boot.js index 570b15da03..19c23af32a 100644 --- a/packages/backend/src/server/web/boot.js +++ b/packages/backend/src/server/web/boot.js @@ -132,6 +132,11 @@ document.documentElement.classList.add('f-' + fontSize); } + const cornerRadius = localStorage.getItem('cornerRadius'); + if (cornerRadius) { + document.documentElement.classList.add(`radius-${cornerRadius}`); + } + const useSystemFont = localStorage.getItem('useSystemFont'); if (useSystemFont) { document.documentElement.classList.add('useSystemFont'); diff --git a/packages/frontend/src/local-storage.ts b/packages/frontend/src/local-storage.ts index 0d73885b68..3023471b14 100644 --- a/packages/frontend/src/local-storage.ts +++ b/packages/frontend/src/local-storage.ts @@ -21,6 +21,7 @@ type Keys = 'colorScheme' | 'useSystemFont' | 'fontSize' | + 'cornerRadius' | 'ui' | 'ui_temp' | 'locale' | diff --git a/packages/frontend/src/pages/settings/general.vue b/packages/frontend/src/pages/settings/general.vue index 05ff430915..22c24bec1c 100644 --- a/packages/frontend/src/pages/settings/general.vue +++ b/packages/frontend/src/pages/settings/general.vue @@ -142,6 +142,12 @@ SPDX-License-Identifier: AGPL-3.0-only + + + + + + @@ -212,6 +218,7 @@ import { claimAchievement } from '@/scripts/achievements.js'; const lang = ref(miLocalStorage.getItem('lang')); const fontSize = ref(miLocalStorage.getItem('fontSize')); +const cornerRadius = ref(miLocalStorage.getItem('cornerRadius')); const useSystemFont = ref(miLocalStorage.getItem('useSystemFont') != null); async function reloadAsk() { @@ -277,6 +284,14 @@ watch(fontSize, () => { } }); +watch(cornerRadius, () => { + if (cornerRadius.value == null) { + miLocalStorage.removeItem('cornerRadius'); + } else { + miLocalStorage.setItem('cornerRadius', cornerRadius.value); + } +}); + watch(useSystemFont, () => { if (useSystemFont.value) { miLocalStorage.setItem('useSystemFont', 't'); @@ -288,6 +303,7 @@ watch(useSystemFont, () => { watch([ lang, fontSize, + cornerRadius, useSystemFont, enableInfiniteScroll, squareAvatars, diff --git a/packages/frontend/src/pages/settings/preferences-backups.vue b/packages/frontend/src/pages/settings/preferences-backups.vue index b347d9555e..ecb7c68f73 100644 --- a/packages/frontend/src/pages/settings/preferences-backups.vue +++ b/packages/frontend/src/pages/settings/preferences-backups.vue @@ -114,6 +114,7 @@ type Profile = { hot: Record; cold: Record; fontSize: string | null; + cornerRadius: string | null; useSystemFont: 't' | null; wallpaper: string | null; }; @@ -171,6 +172,7 @@ function getSettings(): Profile['settings'] { hot, cold, fontSize: miLocalStorage.getItem('fontSize'), + cornerRadius: miLocalStorage.getItem('cornerRadius'), useSystemFont: miLocalStorage.getItem('useSystemFont') as 't' | null, wallpaper: miLocalStorage.getItem('wallpaper'), }; @@ -284,6 +286,13 @@ async function applyProfile(id: string): Promise { miLocalStorage.removeItem('fontSize'); } + // cornerRadius + if (settings.cornerRadius) { + miLocalStorage.setItem('cornerRadius', settings.cornerRadius); + } else { + miLocalStorage.removeItem('cornerRadius'); + } + // useSystemFont if (settings.useSystemFont) { miLocalStorage.setItem('useSystemFont', settings.useSystemFont); From 72204d929415d5502791f50024b81de82f4b230d Mon Sep 17 00:00:00 2001 From: ShittyKopper Date: Tue, 31 Oct 2023 21:26:03 +0300 Subject: [PATCH 2/9] Revert "prototype: decreased rounding" This reverts commit 7a51e2d404d82a8fa491ad08bc88112a7173dff7. --- packages/backend/src/server/web/boot.js | 4 ++-- packages/backend/src/server/web/error.css | 4 ++-- packages/frontend/src/components/MkAbuseReport.vue | 2 +- packages/frontend/src/components/MkAsUi.vue | 2 +- packages/frontend/src/components/MkButton.vue | 4 ++-- .../frontend/src/components/MkChannelPreview.vue | 4 ++-- packages/frontend/src/components/MkChartLegend.vue | 2 +- packages/frontend/src/components/MkColorInput.vue | 2 +- packages/frontend/src/components/MkContainer.vue | 2 +- packages/frontend/src/components/MkDialog.vue | 2 +- packages/frontend/src/components/MkDrive.file.vue | 2 +- .../frontend/src/components/MkDriveFileThumbnail.vue | 2 +- packages/frontend/src/components/MkFolder.vue | 2 +- packages/frontend/src/components/MkInput.vue | 2 +- .../frontend/src/components/MkInstanceCardMini.vue | 2 +- packages/frontend/src/components/MkLaunchPad.vue | 4 ++-- packages/frontend/src/components/MkMediaBanner.vue | 2 +- packages/frontend/src/components/MkMediaImage.vue | 6 +++--- packages/frontend/src/components/MkMediaList.vue | 2 +- packages/frontend/src/components/MkMediaVideo.vue | 4 ++-- packages/frontend/src/components/MkMention.vue | 2 +- packages/frontend/src/components/MkMenu.vue | 2 +- packages/frontend/src/components/MkNote.vue | 10 +++++----- packages/frontend/src/components/MkNoteDetailed.vue | 6 +++--- packages/frontend/src/components/MkNoteSimple.vue | 2 +- packages/frontend/src/components/MkNoteSub.vue | 6 +++--- packages/frontend/src/components/MkNotification.vue | 2 +- packages/frontend/src/components/MkOmit.vue | 2 +- packages/frontend/src/components/MkPostForm.vue | 12 ++++++------ packages/frontend/src/components/MkRadio.vue | 2 +- packages/frontend/src/components/MkRange.vue | 8 ++++---- .../src/components/MkReactionsViewer.reaction.vue | 4 ++-- packages/frontend/src/components/MkSelect.vue | 2 +- .../frontend/src/components/MkSignupDialog.rules.vue | 2 +- .../frontend/src/components/MkSubNoteContent.vue | 4 ++-- packages/frontend/src/components/MkSuperMenu.vue | 2 +- packages/frontend/src/components/MkSwitch.button.vue | 4 ++-- packages/frontend/src/components/MkTab.vue | 2 +- packages/frontend/src/components/MkTextarea.vue | 2 +- packages/frontend/src/components/MkToast.vue | 2 +- packages/frontend/src/components/MkUrlPreview.vue | 2 +- packages/frontend/src/components/MkUserCardMini.vue | 2 +- packages/frontend/src/components/MkUserInfo.vue | 2 +- packages/frontend/src/components/MkUserPopup.vue | 4 ++-- .../frontend/src/components/MkVisitorDashboard.vue | 2 +- packages/frontend/src/components/form/link.vue | 2 +- packages/frontend/src/components/global/MkAvatar.vue | 4 ++-- packages/frontend/src/components/global/MkError.vue | 2 +- .../src/components/global/MkPageHeader.tabs.vue | 2 +- packages/frontend/src/pages/_error_.vue | 2 +- packages/frontend/src/pages/about-sharkey.vue | 6 +++--- packages/frontend/src/pages/about.vue | 6 +++--- packages/frontend/src/pages/admin-user.vue | 4 ++-- packages/frontend/src/pages/admin/_header_.vue | 2 +- packages/frontend/src/pages/admin/index.vue | 2 +- packages/frontend/src/pages/admin/modlog.ModLog.vue | 2 +- .../frontend/src/pages/admin/overview.federation.vue | 2 +- packages/frontend/src/pages/admin/overview.stats.vue | 2 +- packages/frontend/src/pages/admin/server-rules.vue | 4 ++-- packages/frontend/src/pages/channel.vue | 4 ++-- packages/frontend/src/pages/emoji-edit-dialog.vue | 2 +- packages/frontend/src/pages/emojis.emoji.vue | 2 +- packages/frontend/src/pages/follow-requests.vue | 2 +- packages/frontend/src/pages/instance-info.vue | 2 +- packages/frontend/src/pages/invite.vue | 2 +- packages/frontend/src/pages/list.vue | 2 +- packages/frontend/src/pages/my-antennas/index.vue | 2 +- packages/frontend/src/pages/my-lists/index.vue | 2 +- packages/frontend/src/pages/note.vue | 2 +- .../src/pages/page-editor/page-editor.container.vue | 2 +- packages/frontend/src/pages/role.vue | 2 +- packages/frontend/src/pages/settings/apps.vue | 2 +- .../frontend/src/pages/settings/drive-cleaner.vue | 2 +- packages/frontend/src/pages/settings/drive.vue | 4 ++-- packages/frontend/src/pages/settings/profile.vue | 2 +- packages/frontend/src/pages/settings/reaction.vue | 2 +- packages/frontend/src/pages/settings/theme.vue | 2 +- packages/frontend/src/pages/theme-editor.vue | 6 +++--- packages/frontend/src/pages/user/home.vue | 11 ++++++----- packages/frontend/src/pages/user/index.files.vue | 2 +- packages/frontend/src/pages/user/lists.vue | 2 +- packages/frontend/src/pages/welcome.entrance.a.vue | 6 +++--- packages/frontend/src/pages/welcome.timeline.vue | 2 +- packages/frontend/src/style.scss | 2 +- .../frontend/src/ui/_common_/navbar-for-mobile.vue | 4 ++-- packages/frontend/src/ui/_common_/navbar.vue | 6 +++--- packages/frontend/src/ui/_common_/notification.vue | 2 +- packages/frontend/src/ui/_common_/upload.vue | 2 +- packages/frontend/src/ui/deck/column.vue | 4 ++-- packages/frontend/src/ui/visitor.vue | 2 +- packages/frontend/src/widgets/WidgetCalendar.vue | 2 +- packages/frontend/src/widgets/WidgetInstanceInfo.vue | 2 +- packages/frontend/src/widgets/WidgetPhotos.vue | 2 +- 93 files changed, 143 insertions(+), 142 deletions(-) diff --git a/packages/backend/src/server/web/boot.js b/packages/backend/src/server/web/boot.js index 19c23af32a..cb0c3d310d 100644 --- a/packages/backend/src/server/web/boot.js +++ b/packages/backend/src/server/web/boot.js @@ -233,7 +233,7 @@ } button { - border-radius: 4px; + border-radius: 999px; padding: 0px 12px 0px 12px; border: none; cursor: pointer; @@ -301,7 +301,7 @@ margin-bottom: 2rem; padding: 0.5rem 1rem; width: 40rem; - border-radius: 5px; + border-radius: 10px; justify-content: center; margin: auto; } diff --git a/packages/backend/src/server/web/error.css b/packages/backend/src/server/web/error.css index 8bad3d843e..ea3056bdaf 100644 --- a/packages/backend/src/server/web/error.css +++ b/packages/backend/src/server/web/error.css @@ -24,7 +24,7 @@ html { } button { - border-radius: 4px; + border-radius: 999px; padding: 0px 12px 0px 12px; border: none; cursor: pointer; @@ -93,7 +93,7 @@ code { background: #333; padding: 0.5rem 1rem; max-width: 40rem; - border-radius: 5px; + border-radius: 10px; justify-content: center; margin: auto; white-space: pre-wrap; diff --git a/packages/frontend/src/components/MkAbuseReport.vue b/packages/frontend/src/components/MkAbuseReport.vue index 1ef8a205e2..66114b8734 100644 --- a/packages/frontend/src/components/MkAbuseReport.vue +++ b/packages/frontend/src/components/MkAbuseReport.vue @@ -84,7 +84,7 @@ function resolve() { box-sizing: border-box; align-items: center; padding: 14px; - border-radius: 5px; + border-radius: 8px; --c: rgb(255 196 0 / 15%); background-image: linear-gradient(45deg, var(--c) 16.67%, transparent 16.67%, transparent 50%, var(--c) 50%, var(--c) 66.67%, transparent 66.67%, transparent 100%); background-size: 16px 16px; diff --git a/packages/frontend/src/components/MkAsUi.vue b/packages/frontend/src/components/MkAsUi.vue index 3eb020c50e..099baf0d72 100644 --- a/packages/frontend/src/components/MkAsUi.vue +++ b/packages/frontend/src/components/MkAsUi.vue @@ -125,6 +125,6 @@ function openPostForm() { .postForm { background: var(--bg); - border-radius: 5px; + border-radius: 8px; } diff --git a/packages/frontend/src/components/MkButton.vue b/packages/frontend/src/components/MkButton.vue index 3801d6b5d4..bcd58ae516 100644 --- a/packages/frontend/src/components/MkButton.vue +++ b/packages/frontend/src/components/MkButton.vue @@ -154,7 +154,7 @@ function onMousedown(evt: MouseEvent): void { } &.rounded { - border-radius: 4px; + border-radius: 999px; } &.primary { @@ -264,7 +264,7 @@ function onMousedown(evt: MouseEvent): void { left: 0; width: 100%; height: 100%; - border-radius: 5px; + border-radius: 6px; overflow: clip; pointer-events: none; } diff --git a/packages/frontend/src/components/MkChannelPreview.vue b/packages/frontend/src/components/MkChannelPreview.vue index 6429258f4a..ab91f793fd 100644 --- a/packages/frontend/src/components/MkChannelPreview.vue +++ b/packages/frontend/src/components/MkChannelPreview.vue @@ -100,7 +100,7 @@ const bannerStyle = computed(() => { padding: 8px 12px; font-size: 80%; background: rgba(0, 0, 0, 0.7); - border-radius: 5px; + border-radius: 6px; color: #fff; } @@ -111,7 +111,7 @@ const bannerStyle = computed(() => { left: 16px; background: rgba(0, 0, 0, 0.7); color: var(--warn); - border-radius: 5px; + border-radius: 6px; font-weight: bold; font-size: 1em; padding: 4px 7px; diff --git a/packages/frontend/src/components/MkChartLegend.vue b/packages/frontend/src/components/MkChartLegend.vue index 2e83d59b59..d321114cba 100644 --- a/packages/frontend/src/components/MkChartLegend.vue +++ b/packages/frontend/src/components/MkChartLegend.vue @@ -55,7 +55,7 @@ defineExpose({ font-size: 85%; padding: 4px 12px 4px 8px; border: solid 1px var(--divider); - border-radius: 4px; + border-radius: 999px; &:hover { border-color: var(--inputBorderHover); diff --git a/packages/frontend/src/components/MkColorInput.vue b/packages/frontend/src/components/MkColorInput.vue index 4ebfec5b51..983a35103c 100644 --- a/packages/frontend/src/components/MkColorInput.vue +++ b/packages/frontend/src/components/MkColorInput.vue @@ -102,7 +102,7 @@ const onInput = (ev: KeyboardEvent) => { color: var(--fg); background: var(--panel); border: solid 1px var(--panel); - border-radius: 5px; + border-radius: 6px; outline: none; box-shadow: none; box-sizing: border-box; diff --git a/packages/frontend/src/components/MkContainer.vue b/packages/frontend/src/components/MkContainer.vue index 3195377d60..c402a37996 100644 --- a/packages/frontend/src/components/MkContainer.vue +++ b/packages/frontend/src/components/MkContainer.vue @@ -223,7 +223,7 @@ onUnmounted(() => { background: var(--panel); padding: 6px 10px; font-size: 0.8em; - border-radius: 4px; + border-radius: 999px; box-shadow: 0 2px 6px rgb(0 0 0 / 20%); } diff --git a/packages/frontend/src/components/MkDialog.vue b/packages/frontend/src/components/MkDialog.vue index b62f4324eb..5f7981c050 100644 --- a/packages/frontend/src/components/MkDialog.vue +++ b/packages/frontend/src/components/MkDialog.vue @@ -197,7 +197,7 @@ onBeforeUnmount(() => { box-sizing: border-box; text-align: center; background: var(--panel); - border-radius: 4px; + border-radius: 16px; } .icon { diff --git a/packages/frontend/src/components/MkDrive.file.vue b/packages/frontend/src/components/MkDrive.file.vue index c8f23286fd..5b67544e7b 100644 --- a/packages/frontend/src/components/MkDrive.file.vue +++ b/packages/frontend/src/components/MkDrive.file.vue @@ -107,7 +107,7 @@ function onDragend() { position: relative; padding: 8px 0 0 0; min-height: 180px; - border-radius: 5px; + border-radius: 8px; cursor: pointer; &:hover { diff --git a/packages/frontend/src/components/MkDriveFileThumbnail.vue b/packages/frontend/src/components/MkDriveFileThumbnail.vue index 66807cf42c..a44c78c249 100644 --- a/packages/frontend/src/components/MkDriveFileThumbnail.vue +++ b/packages/frontend/src/components/MkDriveFileThumbnail.vue @@ -63,7 +63,7 @@ const isThumbnailAvailable = computed(() => { position: relative; display: flex; background: var(--panel); - border-radius: 5px; + border-radius: 8px; overflow: clip; } diff --git a/packages/frontend/src/components/MkFolder.vue b/packages/frontend/src/components/MkFolder.vue index 007c4b329d..8ddb27a19b 100644 --- a/packages/frontend/src/components/MkFolder.vue +++ b/packages/frontend/src/components/MkFolder.vue @@ -139,7 +139,7 @@ onMounted(() => { background: var(--buttonBg); -webkit-backdrop-filter: var(--blur, blur(15px)); backdrop-filter: var(--blur, blur(15px)); - border-radius: 5px; + border-radius: 6px; transition: border-radius 0.3s; &:hover { diff --git a/packages/frontend/src/components/MkInput.vue b/packages/frontend/src/components/MkInput.vue index 6979250c65..66881514e4 100644 --- a/packages/frontend/src/components/MkInput.vue +++ b/packages/frontend/src/components/MkInput.vue @@ -227,7 +227,7 @@ defineExpose({ color: var(--fg); background: var(--panel); border: solid 1px var(--panel); - border-radius: 5px; + border-radius: 6px; outline: none; box-shadow: none; box-sizing: border-box; diff --git a/packages/frontend/src/components/MkInstanceCardMini.vue b/packages/frontend/src/components/MkInstanceCardMini.vue index 4fb36d73c1..e384b7a0bc 100644 --- a/packages/frontend/src/components/MkInstanceCardMini.vue +++ b/packages/frontend/src/components/MkInstanceCardMini.vue @@ -46,7 +46,7 @@ function getInstanceIcon(instance): string { align-items: center; padding: 16px; background: var(--panel); - border-radius: 5px; + border-radius: 8px; > :global(.icon) { display: block; diff --git a/packages/frontend/src/components/MkLaunchPad.vue b/packages/frontend/src/components/MkLaunchPad.vue index 0f951ec0b9..87f15a110f 100644 --- a/packages/frontend/src/components/MkLaunchPad.vue +++ b/packages/frontend/src/components/MkLaunchPad.vue @@ -77,7 +77,7 @@ function close() { overflow: auto; overscroll-behavior: contain; text-align: left; - border-radius: 4px; + border-radius: 16px; &.asDrawer { width: 100%; @@ -100,7 +100,7 @@ function close() { justify-content: center; vertical-align: bottom; height: 100px; - border-radius: 5px; + border-radius: 10px; &:hover { color: var(--accent); diff --git a/packages/frontend/src/components/MkMediaBanner.vue b/packages/frontend/src/components/MkMediaBanner.vue index 672a68ed1f..af222804ce 100644 --- a/packages/frontend/src/components/MkMediaBanner.vue +++ b/packages/frontend/src/components/MkMediaBanner.vue @@ -79,7 +79,7 @@ watch(audioEl, () => { } .audio { - border-radius: 5px; + border-radius: 8px; overflow: clip; } diff --git a/packages/frontend/src/components/MkMediaImage.vue b/packages/frontend/src/components/MkMediaImage.vue index 016a4b020f..bf87aa9ff3 100644 --- a/packages/frontend/src/components/MkMediaImage.vue +++ b/packages/frontend/src/components/MkMediaImage.vue @@ -157,7 +157,7 @@ function showMenu(ev: MouseEvent) { .hide { display: block; position: absolute; - border-radius: 5px; + border-radius: 6px; background-color: black; color: var(--accentLighten); font-size: 12px; @@ -187,7 +187,7 @@ function showMenu(ev: MouseEvent) { .menu { display: block; position: absolute; - border-radius: 4px; + border-radius: 999px; background-color: rgba(0, 0, 0, 0.3); -webkit-backdrop-filter: var(--blur, blur(15px)); backdrop-filter: var(--blur, blur(15px)); @@ -223,7 +223,7 @@ function showMenu(ev: MouseEvent) { .indicator { /* Hardcode to black because either --bg or --fg makes it hard to read in dark/light mode */ background-color: black; - border-radius: 5px; + border-radius: 6px; color: var(--accentLighten); display: inline-block; font-weight: bold; diff --git a/packages/frontend/src/components/MkMediaList.vue b/packages/frontend/src/components/MkMediaList.vue index c9f02dd452..f134f2021d 100644 --- a/packages/frontend/src/components/MkMediaList.vue +++ b/packages/frontend/src/components/MkMediaList.vue @@ -341,7 +341,7 @@ const previewable = (file: Misskey.entities.DriveFile): boolean => { .media { overflow: hidden; // clipにするとバグる - border-radius: 5px; + border-radius: 8px; } :global(.pswp) { diff --git a/packages/frontend/src/components/MkMediaVideo.vue b/packages/frontend/src/components/MkMediaVideo.vue index e1f7b735f0..a334310550 100644 --- a/packages/frontend/src/components/MkMediaVideo.vue +++ b/packages/frontend/src/components/MkMediaVideo.vue @@ -77,7 +77,7 @@ watch(videoEl, () => { .hide { display: block; position: absolute; - border-radius: 5px; + border-radius: 6px; background-color: black; color: var(--accentLighten); font-size: 14px; @@ -127,7 +127,7 @@ watch(videoEl, () => { .indicator { /* Hardcode to black because either --bg or --fg makes it hard to read in dark/light mode */ background-color: black; - border-radius: 5px; + border-radius: 6px; color: var(--accentLighten); display: inline-block; font-weight: bold; diff --git a/packages/frontend/src/components/MkMention.vue b/packages/frontend/src/components/MkMention.vue index 2e8f9e26d3..80426157e6 100644 --- a/packages/frontend/src/components/MkMention.vue +++ b/packages/frontend/src/components/MkMention.vue @@ -49,7 +49,7 @@ const avatarUrl = computed(() => defaultStore.state.disableShowingAnimatedImages .root { display: inline-block; padding: 4px 8px 4px 4px; - border-radius: 4px; + border-radius: 999px; color: var(--mention); &.isMe { diff --git a/packages/frontend/src/components/MkMenu.vue b/packages/frontend/src/components/MkMenu.vue index 1588f924c4..14b21ef96b 100644 --- a/packages/frontend/src/components/MkMenu.vue +++ b/packages/frontend/src/components/MkMenu.vue @@ -290,7 +290,7 @@ onBeforeUnmount(() => { margin: auto; width: calc(100% - 16px); height: 100%; - border-radius: 5px; + border-radius: 6px; } &:not(:disabled):hover { diff --git a/packages/frontend/src/components/MkNote.vue b/packages/frontend/src/components/MkNote.vue index 0b9e4b0d38..4ebd9510cc 100644 --- a/packages/frontend/src/components/MkNote.vue +++ b/packages/frontend/src/components/MkNote.vue @@ -699,7 +699,7 @@ function readPromo() { padding: 0 4px; margin-bottom: 0 !important; background: var(--popup); - border-radius: 5px; + border-radius: 8px; box-shadow: 0px 4px 32px var(--shadow); } @@ -831,7 +831,7 @@ function readPromo() { left: 8px; width: 5px; height: calc(100% - 16px); - border-radius: 4px; + border-radius: 999px; pointer-events: none; } @@ -871,7 +871,7 @@ function readPromo() { background: var(--popup); padding: 6px 10px; font-size: 0.8em; - border-radius: 4px; + border-radius: 999px; box-shadow: 0 2px 6px rgb(0 0 0 / 20%); } @@ -901,7 +901,7 @@ function readPromo() { background: var(--panel); padding: 6px 10px; font-size: 0.8em; - border-radius: 4px; + border-radius: 999px; box-shadow: 0 2px 6px rgb(0 0 0 / 20%); } @@ -937,7 +937,7 @@ function readPromo() { .quoteNote { padding: 16px; border: dashed 1px var(--renote); - border-radius: 5px; + border-radius: 8px; overflow: clip; } diff --git a/packages/frontend/src/components/MkNoteDetailed.vue b/packages/frontend/src/components/MkNoteDetailed.vue index 2633ce2d6b..d11e682ce2 100644 --- a/packages/frontend/src/components/MkNoteDetailed.vue +++ b/packages/frontend/src/components/MkNoteDetailed.vue @@ -739,7 +739,7 @@ if (appearNote.reply && appearNote.reply.replyId && defaultStore.state.autoloadC width: 28px; height: 28px; margin: 0 8px 0 0; - border-radius: 5px; + border-radius: 6px; } .renoteText { @@ -869,7 +869,7 @@ if (appearNote.reply && appearNote.reply.replyId && defaultStore.state.autoloadC .quoteNote { padding: 16px; border: dashed 1px var(--renote); - border-radius: 5px; + border-radius: 8px; overflow: clip; } @@ -947,7 +947,7 @@ if (appearNote.reply && appearNote.reply.replyId && defaultStore.state.autoloadC .reactionTab { padding: 4px 6px; border: solid 1px var(--divider); - border-radius: 5px; + border-radius: 6px; } .reactionTabActive { diff --git a/packages/frontend/src/components/MkNoteSimple.vue b/packages/frontend/src/components/MkNoteSimple.vue index b22e9e016a..fa27cc0294 100644 --- a/packages/frontend/src/components/MkNoteSimple.vue +++ b/packages/frontend/src/components/MkNoteSimple.vue @@ -56,7 +56,7 @@ watch(() => props.expandAllCws, (expandAllCws) => { margin: 0 10px 0 0; width: 34px; height: 34px; - border-radius: 5px; + border-radius: 8px; position: sticky !important; top: calc(16px + var(--stickyTop, 0px)); left: 0; diff --git a/packages/frontend/src/components/MkNoteSub.vue b/packages/frontend/src/components/MkNoteSub.vue index 3c8ba00121..6ff0c41e08 100644 --- a/packages/frontend/src/components/MkNoteSub.vue +++ b/packages/frontend/src/components/MkNoteSub.vue @@ -418,7 +418,7 @@ if (props.detail) { left: 8px; width: 5px; height: calc(100% - 8px); - border-radius: 4px; + border-radius: 999px; pointer-events: none; } @@ -428,7 +428,7 @@ if (props.detail) { margin: 0 8px 0 0; width: 38px; height: 38px; - border-radius: 5px; + border-radius: 8px; } .body { @@ -514,6 +514,6 @@ if (props.detail) { padding: 8px !important; border: 1px solid var(--divider); margin: 8px 8px 0 8px; - border-radius: 5px; + border-radius: 8px; } diff --git a/packages/frontend/src/components/MkNotification.vue b/packages/frontend/src/components/MkNotification.vue index 379dfe806d..1dd60f2473 100644 --- a/packages/frontend/src/components/MkNotification.vue +++ b/packages/frontend/src/components/MkNotification.vue @@ -181,7 +181,7 @@ useTooltip(reactionRef, (showing) => { display: block; width: 100%; height: 100%; - border-radius: 5px; + border-radius: 6px; } .subIcon { diff --git a/packages/frontend/src/components/MkOmit.vue b/packages/frontend/src/components/MkOmit.vue index d353e4d8e6..0184cdd2a2 100644 --- a/packages/frontend/src/components/MkOmit.vue +++ b/packages/frontend/src/components/MkOmit.vue @@ -69,7 +69,7 @@ onUnmounted(() => { background: var(--panel); padding: 6px 10px; font-size: 0.8em; - border-radius: 4px; + border-radius: 999px; box-shadow: 0 2px 6px rgb(0 0 0 / 20%); } diff --git a/packages/frontend/src/components/MkPostForm.vue b/packages/frontend/src/components/MkPostForm.vue index e3fa05d374..42c679914c 100644 --- a/packages/frontend/src/components/MkPostForm.vue +++ b/packages/frontend/src/components/MkPostForm.vue @@ -61,7 +61,7 @@ SPDX-License-Identifier: AGPL-3.0-only - + {{ i18n.ts.notSpecifiedMentionWarning }} - @@ -998,7 +998,7 @@ defineExpose({ padding: 0 12px; line-height: 34px; font-weight: bold; - border-radius: 5px; + border-radius: 6px; min-width: 90px; box-sizing: border-box; color: var(--fgOnAccent); @@ -1008,7 +1008,7 @@ defineExpose({ .headerRightItem { margin: 0; padding: 8px; - border-radius: 5px; + border-radius: 6px; &:hover { background: var(--X5); @@ -1071,7 +1071,7 @@ defineExpose({ .visibleUser { margin-right: 14px; padding: 8px 0 8px 8px; - border-radius: 5px; + border-radius: 8px; background: var(--X4); } @@ -1140,7 +1140,7 @@ defineExpose({ padding: 4px 6px; font-size: .9em; color: var(--warn); - border-radius: 5px; + border-radius: 6px; min-width: 1.6em; text-align: center; @@ -1180,7 +1180,7 @@ defineExpose({ font-size: 1em; width: auto; height: 100%; - border-radius: 5px; + border-radius: 6px; &:hover { background: var(--X5); diff --git a/packages/frontend/src/components/MkRadio.vue b/packages/frontend/src/components/MkRadio.vue index e0eca18ed2..c4df3e991b 100644 --- a/packages/frontend/src/components/MkRadio.vue +++ b/packages/frontend/src/components/MkRadio.vue @@ -55,7 +55,7 @@ function toggle(): void { background-color: var(--panel); background-clip: padding-box !important; border: solid 1px var(--panel); - border-radius: 5px; + border-radius: 6px; font-size: 90%; transition: all 0.2s; user-select: none; diff --git a/packages/frontend/src/components/MkRange.vue b/packages/frontend/src/components/MkRange.vue index 922c3a3a0e..04390c6f0c 100644 --- a/packages/frontend/src/components/MkRange.vue +++ b/packages/frontend/src/components/MkRange.vue @@ -186,7 +186,7 @@ const onMousedown = (ev: MouseEvent | TouchEvent) => { padding: 7px 12px; background: var(--panel); border: solid 1px var(--panel); - border-radius: 5px; + border-radius: 6px; > .container { position: relative; @@ -202,7 +202,7 @@ const onMousedown = (ev: MouseEvent | TouchEvent) => { width: calc(100% - #{$thumbWidth}); height: 3px; background: rgba(0, 0, 0, 0.1); - border-radius: 4px; + border-radius: 999px; overflow: clip; > .highlight { @@ -233,7 +233,7 @@ const onMousedown = (ev: MouseEvent | TouchEvent) => { height: 3px; margin-left: - math.div($tickWidth, 2); background: var(--divider); - border-radius: 4px; + border-radius: 999px; } } @@ -243,7 +243,7 @@ const onMousedown = (ev: MouseEvent | TouchEvent) => { height: $thumbHeight; cursor: grab; background: var(--accent); - border-radius: 4px; + border-radius: 999px; &:hover { background: var(--accentLighten); diff --git a/packages/frontend/src/components/MkReactionsViewer.reaction.vue b/packages/frontend/src/components/MkReactionsViewer.reaction.vue index 03c91e2ba6..d0db515219 100644 --- a/packages/frontend/src/components/MkReactionsViewer.reaction.vue +++ b/packages/frontend/src/components/MkReactionsViewer.reaction.vue @@ -119,7 +119,7 @@ useTooltip(buttonEl, async (showing) => { margin: 2px; padding: 0 6px; font-size: 1.5em; - border-radius: 5px; + border-radius: 6px; &.canToggle { background: var(--buttonBg); @@ -147,7 +147,7 @@ useTooltip(buttonEl, async (showing) => { &.large { height: 52px; font-size: 2em; - border-radius: 5px; + border-radius: 8px; > .count { font-size: 0.6em; diff --git a/packages/frontend/src/components/MkSelect.vue b/packages/frontend/src/components/MkSelect.vue index 83563587e2..f7b9e5828b 100644 --- a/packages/frontend/src/components/MkSelect.vue +++ b/packages/frontend/src/components/MkSelect.vue @@ -241,7 +241,7 @@ function show(ev: MouseEvent) { color: var(--fg); background: var(--panel); border: solid 1px var(--panel); - border-radius: 5px; + border-radius: 6px; outline: none; box-shadow: none; box-sizing: border-box; diff --git a/packages/frontend/src/components/MkSignupDialog.rules.vue b/packages/frontend/src/components/MkSignupDialog.rules.vue index 96072a19c6..647a184714 100644 --- a/packages/frontend/src/components/MkSignupDialog.rules.vue +++ b/packages/frontend/src/components/MkSignupDialog.rules.vue @@ -182,7 +182,7 @@ async function updateAgreeNote(v: boolean) { font-weight: bold; align-items: center; justify-content: center; - border-radius: 4px; + border-radius: 999px; } } diff --git a/packages/frontend/src/components/MkSubNoteContent.vue b/packages/frontend/src/components/MkSubNoteContent.vue index 8f6dc6aee3..ea4028029b 100644 --- a/packages/frontend/src/components/MkSubNoteContent.vue +++ b/packages/frontend/src/components/MkSubNoteContent.vue @@ -88,7 +88,7 @@ const collapsed = $ref(isLong); background: var(--panel); padding: 6px 10px; font-size: 0.8em; - border-radius: 4px; + border-radius: 999px; box-shadow: 0 2px 6px rgb(0 0 0 / 20%); } @@ -131,7 +131,7 @@ const collapsed = $ref(isLong); background: var(--popup); padding: 6px 10px; font-size: 0.8em; - border-radius: 4px; + border-radius: 999px; box-shadow: 0 2px 6px rgb(0 0 0 / 20%); } diff --git a/packages/frontend/src/components/MkSuperMenu.vue b/packages/frontend/src/components/MkSuperMenu.vue index 50bfd64fc8..b780ce3a44 100644 --- a/packages/frontend/src/components/MkSuperMenu.vue +++ b/packages/frontend/src/components/MkSuperMenu.vue @@ -59,7 +59,7 @@ defineProps<{ width: 100%; box-sizing: border-box; padding: 9px 16px 9px 8px; - border-radius: 5px; + border-radius: 9px; font-size: 0.9em; &:hover { diff --git a/packages/frontend/src/components/MkSwitch.button.vue b/packages/frontend/src/components/MkSwitch.button.vue index 9d20103364..a7e91acc39 100644 --- a/packages/frontend/src/components/MkSwitch.button.vue +++ b/packages/frontend/src/components/MkSwitch.button.vue @@ -52,7 +52,7 @@ const toggle = () => { background: var(--switchOffBg); background-clip: content-box; border: solid 1px var(--switchOffBg); - border-radius: 4px; + border-radius: 999px; cursor: pointer; transition: inherit; user-select: none; @@ -72,7 +72,7 @@ const toggle = () => { top: 3px; width: 15px; height: 15px; - border-radius: 4px; + border-radius: 999px; transition: all 0.2s ease; &:not(.knobChecked) { diff --git a/packages/frontend/src/components/MkTab.vue b/packages/frontend/src/components/MkTab.vue index 2b93d2eb4f..9785d89403 100644 --- a/packages/frontend/src/components/MkTab.vue +++ b/packages/frontend/src/components/MkTab.vue @@ -39,7 +39,7 @@ export default defineComponent({ > button { flex: 1; padding: 10px 8px; - border-radius: 4px; + border-radius: 999px; &:disabled { opacity: 1 !important; diff --git a/packages/frontend/src/components/MkTextarea.vue b/packages/frontend/src/components/MkTextarea.vue index 036ad3b9e7..9893c91fb1 100644 --- a/packages/frontend/src/components/MkTextarea.vue +++ b/packages/frontend/src/components/MkTextarea.vue @@ -153,7 +153,7 @@ onMounted(() => { color: var(--fg); background: var(--panel); border: solid 1px var(--panel); - border-radius: 5px; + border-radius: 6px; outline: none; box-shadow: none; box-sizing: border-box; diff --git a/packages/frontend/src/components/MkToast.vue b/packages/frontend/src/components/MkToast.vue index 78eccd0618..48908cf3e6 100644 --- a/packages/frontend/src/components/MkToast.vue +++ b/packages/frontend/src/components/MkToast.vue @@ -66,7 +66,7 @@ onMounted(() => { max-width: calc(100% - 32px); width: min-content; box-shadow: 0 4px 16px rgba(0, 0, 0, 0.3); - border-radius: 5px; + border-radius: 8px; overflow: clip; text-align: center; pointer-events: none; diff --git a/packages/frontend/src/components/MkUrlPreview.vue b/packages/frontend/src/components/MkUrlPreview.vue index 9cec4009c8..f38e914b23 100644 --- a/packages/frontend/src/components/MkUrlPreview.vue +++ b/packages/frontend/src/components/MkUrlPreview.vue @@ -231,7 +231,7 @@ onUnmounted(() => { display: block; font-size: 14px; box-shadow: 0 0 0 1px var(--divider); - border-radius: 5px; + border-radius: 8px; overflow: clip; &:hover { diff --git a/packages/frontend/src/components/MkUserCardMini.vue b/packages/frontend/src/components/MkUserCardMini.vue index 70c2a37b53..49813dddb3 100644 --- a/packages/frontend/src/components/MkUserCardMini.vue +++ b/packages/frontend/src/components/MkUserCardMini.vue @@ -50,7 +50,7 @@ onMounted(() => { align-items: center; padding: 16px; background: var(--panel); - border-radius: 5px; + border-radius: 8px; > :global(.avatar) { display: block; diff --git a/packages/frontend/src/components/MkUserInfo.vue b/packages/frontend/src/components/MkUserInfo.vue index 6bb2fc8957..c13ef60f3b 100644 --- a/packages/frontend/src/components/MkUserInfo.vue +++ b/packages/frontend/src/components/MkUserInfo.vue @@ -100,7 +100,7 @@ defineProps<{ color: #fff; background: rgba(0, 0, 0, 0.7); font-size: 0.7em; - border-radius: 5px; + border-radius: 6px; } .description { diff --git a/packages/frontend/src/components/MkUserPopup.vue b/packages/frontend/src/components/MkUserPopup.vue index 85954d4193..fa2ef05aa8 100644 --- a/packages/frontend/src/components/MkUserPopup.vue +++ b/packages/frontend/src/components/MkUserPopup.vue @@ -146,7 +146,7 @@ onMounted(() => { color: #fff; background: rgba(0, 0, 0, 0.7); font-size: 0.7em; - border-radius: 5px; + border-radius: 6px; } .locked:first-child { @@ -249,7 +249,7 @@ onMounted(() => { right: 44px; padding: 6px; background: var(--panel); - border-radius: 4px; + border-radius: 999px; } .follow { diff --git a/packages/frontend/src/components/MkVisitorDashboard.vue b/packages/frontend/src/components/MkVisitorDashboard.vue index 138d7953a7..6ea68989ef 100644 --- a/packages/frontend/src/components/MkVisitorDashboard.vue +++ b/packages/frontend/src/components/MkVisitorDashboard.vue @@ -172,7 +172,7 @@ function exploreOtherServers() { right: 16px; width: 32px; height: 32px; - border-radius: 5px; + border-radius: 8px; font-size: 18px; } diff --git a/packages/frontend/src/components/form/link.vue b/packages/frontend/src/components/form/link.vue index 365ce6de66..9df41eb00b 100644 --- a/packages/frontend/src/components/form/link.vue +++ b/packages/frontend/src/components/form/link.vue @@ -52,7 +52,7 @@ const props = defineProps<{ box-sizing: border-box; padding: 10px 14px; background: var(--buttonBg); - border-radius: 5px; + border-radius: 6px; font-size: 0.9em; &:hover { diff --git a/packages/frontend/src/components/global/MkAvatar.vue b/packages/frontend/src/components/global/MkAvatar.vue index 8ca0991c0b..e238834872 100644 --- a/packages/frontend/src/components/global/MkAvatar.vue +++ b/packages/frontend/src/components/global/MkAvatar.vue @@ -187,10 +187,10 @@ watch(() => props.user.avatarBlurhash, () => { } .square { - border-radius: 5px; + border-radius: 20%; > .inner { - border-radius: 5px; + border-radius: 20%; } } diff --git a/packages/frontend/src/components/global/MkError.vue b/packages/frontend/src/components/global/MkError.vue index efb7b75fb9..0df8fa3b8f 100644 --- a/packages/frontend/src/components/global/MkError.vue +++ b/packages/frontend/src/components/global/MkError.vue @@ -44,6 +44,6 @@ const emit = defineEmits<{ width: 128px; height: 128px; margin-bottom: 16px; - border-radius: 4px; + border-radius: 16px; } diff --git a/packages/frontend/src/components/global/MkPageHeader.tabs.vue b/packages/frontend/src/components/global/MkPageHeader.tabs.vue index b98750da44..24b92cb83a 100644 --- a/packages/frontend/src/components/global/MkPageHeader.tabs.vue +++ b/packages/frontend/src/components/global/MkPageHeader.tabs.vue @@ -245,7 +245,7 @@ onUnmounted(() => { bottom: 0; height: 3px; background: var(--accent); - border-radius: 4px; + border-radius: 999px; transition: none; pointer-events: none; diff --git a/packages/frontend/src/pages/_error_.vue b/packages/frontend/src/pages/_error_.vue index 037d6c94a8..4977cece40 100644 --- a/packages/frontend/src/pages/_error_.vue +++ b/packages/frontend/src/pages/_error_.vue @@ -82,6 +82,6 @@ definePageMetadata({ vertical-align: bottom; height: 128px; margin-bottom: 24px; - border-radius: 4px; + border-radius: 16px; } diff --git a/packages/frontend/src/pages/about-sharkey.vue b/packages/frontend/src/pages/about-sharkey.vue index 1e235bf70e..ae70c8d9d5 100644 --- a/packages/frontend/src/pages/about-sharkey.vue +++ b/packages/frontend/src/pages/about-sharkey.vue @@ -220,7 +220,7 @@ definePageMetadata({ display: block; width: 80px; margin: 0 auto; - border-radius: 4px; + border-radius: 16px; position: relative; z-index: 1; transform: translateX(-10%); @@ -271,7 +271,7 @@ definePageMetadata({ align-items: center; padding: 12px; background: var(--buttonBg); - border-radius: 5px; + border-radius: 6px; &:hover { text-decoration: none; @@ -304,7 +304,7 @@ definePageMetadata({ align-items: center; padding: 12px; background: var(--buttonBg); - border-radius: 5px; + border-radius: 6px; } .patronIcon { diff --git a/packages/frontend/src/pages/about.vue b/packages/frontend/src/pages/about.vue index 7b1975807b..b6cacdd3c2 100644 --- a/packages/frontend/src/pages/about.vue +++ b/packages/frontend/src/pages/about.vue @@ -168,7 +168,7 @@ definePageMetadata(computed(() => ({ diff --git a/packages/frontend/src/pages/admin/_header_.vue b/packages/frontend/src/pages/admin/_header_.vue index 6b619249da..503fb2af9c 100644 --- a/packages/frontend/src/pages/admin/_header_.vue +++ b/packages/frontend/src/pages/admin/_header_.vue @@ -286,7 +286,7 @@ onUnmounted(() => { bottom: 0; height: 3px; background: var(--accent); - border-radius: 4px; + border-radius: 999px; transition: all 0.2s ease; pointer-events: none; } diff --git a/packages/frontend/src/pages/admin/index.vue b/packages/frontend/src/pages/admin/index.vue index 42c2281971..72d10b341a 100644 --- a/packages/frontend/src/pages/admin/index.vue +++ b/packages/frontend/src/pages/admin/index.vue @@ -369,7 +369,7 @@ defineExpose({ display: block; margin: auto; height: 42px; - border-radius: 5px; + border-radius: 8px; } } } diff --git a/packages/frontend/src/pages/admin/modlog.ModLog.vue b/packages/frontend/src/pages/admin/modlog.ModLog.vue index d41834836c..9b599125ca 100644 --- a/packages/frontend/src/pages/admin/modlog.ModLog.vue +++ b/packages/frontend/src/pages/admin/modlog.ModLog.vue @@ -149,7 +149,7 @@ const props = defineProps<{ .diff { background: #fff; color: #000; - border-radius: 5px; + border-radius: 6px; overflow: clip; } diff --git a/packages/frontend/src/pages/admin/overview.federation.vue b/packages/frontend/src/pages/admin/overview.federation.vue index 16bf6985ea..8705af169c 100644 --- a/packages/frontend/src/pages/admin/overview.federation.vue +++ b/packages/frontend/src/pages/admin/overview.federation.vue @@ -146,7 +146,7 @@ onMounted(async () => { margin-right: 12px; background: var(--accentedBg); color: var(--accent); - border-radius: 5px; + border-radius: 10px; } &.sub { diff --git a/packages/frontend/src/pages/admin/overview.stats.vue b/packages/frontend/src/pages/admin/overview.stats.vue index 580bfb780b..59b5540ea5 100644 --- a/packages/frontend/src/pages/admin/overview.stats.vue +++ b/packages/frontend/src/pages/admin/overview.stats.vue @@ -115,7 +115,7 @@ onMounted(async () => { margin-right: 12px; background: var(--accentedBg); color: var(--accent); - border-radius: 5px; + border-radius: 10px; } &.users { diff --git a/packages/frontend/src/pages/admin/server-rules.vue b/packages/frontend/src/pages/admin/server-rules.vue index af1caa87c1..bf9c6b0f48 100644 --- a/packages/frontend/src/pages/admin/server-rules.vue +++ b/packages/frontend/src/pages/admin/server-rules.vue @@ -104,7 +104,7 @@ definePageMetadata({ height: 28px; align-items: center; justify-content: center; - border-radius: 4px; + border-radius: 999px; margin-right: 8px; } @@ -119,7 +119,7 @@ definePageMetadata({ height: 40px; color: var(--error); margin-left: auto; - border-radius: 5px; + border-radius: 6px; &:hover { background: var(--X5); diff --git a/packages/frontend/src/pages/channel.vue b/packages/frontend/src/pages/channel.vue index 89127bd010..b11c2c3722 100644 --- a/packages/frontend/src/pages/channel.vue +++ b/packages/frontend/src/pages/channel.vue @@ -267,7 +267,7 @@ definePageMetadata(computed(() => channel ? { padding: 8px 12px; font-size: 80%; background: rgba(0, 0, 0, 0.7); - border-radius: 5px; + border-radius: 6px; color: #fff; } @@ -282,7 +282,7 @@ definePageMetadata(computed(() => channel ? { left: 16px; background: rgba(0, 0, 0, 0.7); color: var(--warn); - border-radius: 5px; + border-radius: 6px; font-weight: bold; font-size: 1em; padding: 4px 7px; diff --git a/packages/frontend/src/pages/emoji-edit-dialog.vue b/packages/frontend/src/pages/emoji-edit-dialog.vue index abba31f1ff..8cea29fe6d 100644 --- a/packages/frontend/src/pages/emoji-edit-dialog.vue +++ b/packages/frontend/src/pages/emoji-edit-dialog.vue @@ -206,7 +206,7 @@ async function del() { .imgContainer { padding: 8px; - border-radius: 5px; + border-radius: 6px; } .img { diff --git a/packages/frontend/src/pages/emojis.emoji.vue b/packages/frontend/src/pages/emojis.emoji.vue index 210a0fcf8f..fce652b599 100644 --- a/packages/frontend/src/pages/emojis.emoji.vue +++ b/packages/frontend/src/pages/emojis.emoji.vue @@ -61,7 +61,7 @@ function menu(ev) { padding: 12px; text-align: left; background: var(--panel); - border-radius: 5px; + border-radius: 8px; &:hover { border-color: var(--accent); diff --git a/packages/frontend/src/pages/follow-requests.vue b/packages/frontend/src/pages/follow-requests.vue index 1686718f2c..02487bf0bf 100644 --- a/packages/frontend/src/pages/follow-requests.vue +++ b/packages/frontend/src/pages/follow-requests.vue @@ -87,7 +87,7 @@ definePageMetadata(computed(() => ({ margin: 0 12px 0 0; width: 42px; height: 42px; - border-radius: 5px; + border-radius: 8px; } > .body { diff --git a/packages/frontend/src/pages/instance-info.vue b/packages/frontend/src/pages/instance-info.vue index a3276dba6e..1bf21100f8 100644 --- a/packages/frontend/src/pages/instance-info.vue +++ b/packages/frontend/src/pages/instance-info.vue @@ -254,7 +254,7 @@ definePageMetadata({ display: block; margin: 0 16px 0 0; height: 64px; - border-radius: 5px; + border-radius: 8px; } > .name { diff --git a/packages/frontend/src/pages/invite.vue b/packages/frontend/src/pages/invite.vue index 2c0ed41450..a72cf47b93 100644 --- a/packages/frontend/src/pages/invite.vue +++ b/packages/frontend/src/pages/invite.vue @@ -114,6 +114,6 @@ definePageMetadata({ width: 128px; height: 128px; margin-bottom: 16px; - border-radius: 4px; + border-radius: 16px; } diff --git a/packages/frontend/src/pages/list.vue b/packages/frontend/src/pages/list.vue index 9309ebc08f..38f454de85 100644 --- a/packages/frontend/src/pages/list.vue +++ b/packages/frontend/src/pages/list.vue @@ -141,7 +141,7 @@ definePageMetadata(computed(() => list ? { width: 128px; height: 128px; margin-bottom: 16px; - border-radius: 4px; + border-radius: 16px; } .button { diff --git a/packages/frontend/src/pages/my-antennas/index.vue b/packages/frontend/src/pages/my-antennas/index.vue index b1d92e42e8..74b5961263 100644 --- a/packages/frontend/src/pages/my-antennas/index.vue +++ b/packages/frontend/src/pages/my-antennas/index.vue @@ -74,7 +74,7 @@ onActivated(() => { display: block; padding: 16px; border: solid 1px var(--divider); - border-radius: 5px; + border-radius: 6px; &:hover { border: solid 1px var(--accent); diff --git a/packages/frontend/src/pages/my-lists/index.vue b/packages/frontend/src/pages/my-lists/index.vue index 01cd0d8aa9..c637e1ea25 100644 --- a/packages/frontend/src/pages/my-lists/index.vue +++ b/packages/frontend/src/pages/my-lists/index.vue @@ -84,7 +84,7 @@ onActivated(() => { display: block; padding: 16px; border: solid 1px var(--divider); - border-radius: 5px; + border-radius: 6px; margin-bottom: 8px; &:hover { diff --git a/packages/frontend/src/pages/note.vue b/packages/frontend/src/pages/note.vue index 7880e3361b..46e7e59308 100644 --- a/packages/frontend/src/pages/note.vue +++ b/packages/frontend/src/pages/note.vue @@ -148,7 +148,7 @@ definePageMetadata(computed(() => note ? { .loadPrev { min-width: 0; margin: 0 auto; - border-radius: 4px; + border-radius: 999px; } .loadNext { diff --git a/packages/frontend/src/pages/page-editor/page-editor.container.vue b/packages/frontend/src/pages/page-editor/page-editor.container.vue index cb0af1d548..9ea7d7fd15 100644 --- a/packages/frontend/src/pages/page-editor/page-editor.container.vue +++ b/packages/frontend/src/pages/page-editor/page-editor.container.vue @@ -63,7 +63,7 @@ function remove() { overflow: hidden; background: var(--panel); border: solid 2px var(--X12); - border-radius: 5px; + border-radius: 8px; &:hover { border: solid 2px var(--X13); diff --git a/packages/frontend/src/pages/role.vue b/packages/frontend/src/pages/role.vue index ec58203879..35b5d5af4e 100644 --- a/packages/frontend/src/pages/role.vue +++ b/packages/frontend/src/pages/role.vue @@ -104,7 +104,7 @@ definePageMetadata(computed(() => ({ width: 128px; height: 128px; margin-bottom: 16px; - border-radius: 4px; + border-radius: 16px; } diff --git a/packages/frontend/src/pages/settings/apps.vue b/packages/frontend/src/pages/settings/apps.vue index c06db27245..ad72018961 100644 --- a/packages/frontend/src/pages/settings/apps.vue +++ b/packages/frontend/src/pages/settings/apps.vue @@ -93,7 +93,7 @@ definePageMetadata({ margin: 0 12px 0 0; width: 50px; height: 50px; - border-radius: 5px; + border-radius: 8px; } .appBody { diff --git a/packages/frontend/src/pages/settings/drive-cleaner.vue b/packages/frontend/src/pages/settings/drive-cleaner.vue index 791d76d1b4..d86b664cfe 100644 --- a/packages/frontend/src/pages/settings/drive-cleaner.vue +++ b/packages/frontend/src/pages/settings/drive-cleaner.vue @@ -152,7 +152,7 @@ definePageMetadata({ height: 12px; background: rgba(0, 0, 0, 0.1); overflow: clip; - border-radius: 4px; + border-radius: 999px; } .meterValue { diff --git a/packages/frontend/src/pages/settings/drive.vue b/packages/frontend/src/pages/settings/drive.vue index 0c6effbaa2..95b4406ed1 100644 --- a/packages/frontend/src/pages/settings/drive.vue +++ b/packages/frontend/src/pages/settings/drive.vue @@ -148,12 +148,12 @@ definePageMetadata({ .meter { height: 10px; background: rgba(0, 0, 0, 0.1); - border-radius: 4px; + border-radius: 999px; overflow: clip; } .meterValue { height: 100%; - border-radius: 4px; + border-radius: 999px; } diff --git a/packages/frontend/src/pages/settings/profile.vue b/packages/frontend/src/pages/settings/profile.vue index c79e99cda7..9de33619ea 100644 --- a/packages/frontend/src/pages/settings/profile.vue +++ b/packages/frontend/src/pages/settings/profile.vue @@ -340,7 +340,7 @@ definePageMetadata({ background-size: cover; background-position: center; border: solid 1px var(--divider); - border-radius: 5px; + border-radius: 10px; overflow: clip; } diff --git a/packages/frontend/src/pages/settings/reaction.vue b/packages/frontend/src/pages/settings/reaction.vue index 12d37c9da2..83ed4ab605 100644 --- a/packages/frontend/src/pages/settings/reaction.vue +++ b/packages/frontend/src/pages/settings/reaction.vue @@ -7,7 +7,7 @@ SPDX-License-Identifier: AGPL-3.0-only
-
+