diff --git a/custom/assets/instance.css b/custom/assets/instance.css index 6c212e6cb..283584662 100644 --- a/custom/assets/instance.css +++ b/custom/assets/instance.css @@ -6,56 +6,3 @@ * This may eventuallly be replaced with a function in the admin panel. */ -/* -* Change this for border-radius values -*/ - -/* Jormungandr -:root { - --radius-xxs: 10px; - --radius-xss: 3px; // - --radius-xs: 10px; - --radius-x: 10px; - --radius-s: 10px; - --radius-sm: 10px; - --radius-m: 10px; - --radius: 10px; - --radius-md: 10px; - --radius-lg: 10px; - --radius-xl: 10px; - --radius-big: 10px; - --radius-ellipse: 10px; - --radius-full: 10px; - --radius-icon: 0.3rem; // - --radius-avatar: 2em; // - --radius-online: 120%; // - --radius-avatar-2: 20%; // - --radius-avatar-3: 75% // - --radius-common: 50% // -} -*/ - -/* Default Iceshrimp -:root { - --radius-xxs: 2px; - --radius-xss: 3px; // - --radius-xs: 4px; - --radius-x: 5px; - --radius-s: 6px; - --radius-sm: 8px; - --radius-m: 10px; - --radius: 12px; - --radius-md: 16px; - --radius-lg: 24px; - --radius-xl: 32px; - --radius-big: 100px; - --radius-ellipse: 999px; - --radius-full: 100%; - --radius-icon: 0.3rem; // - --radius-avatar: 2em; // - --radius-online: 120%; // - --radius-avatar-2: 20%; // - --radius-avatar-3: 75% // - --radius-common: 50% // -} -*/ diff --git a/packages/backend/src/server/web/bios.css b/packages/backend/src/server/web/bios.css index bbd74fbd5..d927f26ed 100644 --- a/packages/backend/src/server/web/bios.css +++ b/packages/backend/src/server/web/bios.css @@ -32,7 +32,7 @@ html { } main { background: #1f1d2e; - border-radius: var(--radius); + border-radius: 10px; } #tl > div { padding: 16px; @@ -58,7 +58,7 @@ html { text-align: center; } button { - border-radius: var(--radius-ellipse); + border-radius: 999px; padding: 0px 12px 0px 12px; border: none; cursor: pointer; @@ -71,7 +71,7 @@ button { padding: 12px; } button { - border-radius: var(--radius-ellipse); + border-radius: 999px; padding: 0px 12px 0px 12px; border: none; cursor: pointer; @@ -118,7 +118,7 @@ code { textarea { background-color: #444; border: solid #aaa; - border-radius: var(--radius-ellipse); + border-radius: 10px; color: #e0def4; margin-top: 1rem; margin-bottom: 1rem; @@ -133,7 +133,7 @@ textarea:focus { input { background-color: #666; border: solid #aaa; - border-radius: var(--radius-ellipse); + border-radius: 10px; color: #e0def4; margin-top: 1rem; margin-bottom: 1rem; diff --git a/packages/backend/src/server/web/boot.js b/packages/backend/src/server/web/boot.js index f93e664de..bb27f60af 100644 --- a/packages/backend/src/server/web/boot.js +++ b/packages/backend/src/server/web/boot.js @@ -201,7 +201,7 @@ } button { - border-radius: var(--radius-ellipse); + border-radius: 999px; padding: 0px 12px 0px 12px; border: none; cursor: pointer; @@ -273,7 +273,7 @@ margin-bottom: 2rem; padding: 0.5rem 1rem; width: 40rem; - border-radius: var(--radius); + border-radius: 10px; justify-content: center; margin: auto; } @@ -326,4 +326,4 @@ location.reload(); } -})(); +})(); \ No newline at end of file diff --git a/packages/backend/src/server/web/cli.css b/packages/backend/src/server/web/cli.css index e3b553bc7..9407b5f7b 100644 --- a/packages/backend/src/server/web/cli.css +++ b/packages/backend/src/server/web/cli.css @@ -3,11 +3,11 @@ html { } main { background: #1f1d2e; - border-radius: var(--radius); + border-radius: 10px; } #tl > div { border: 1px solid #908caa; - border-radius: var(--radius); + border-radius: 10px; margin: 10px; padding: 10px; width: fit-content; @@ -18,7 +18,7 @@ main { } img { - border-radius: var(--radius); + border-radius: 10px; margin-right: 10px; } @@ -40,7 +40,7 @@ html { padding: 10px; } button { - border-radius:var(--radius-ellipse); + border-radius:999px; padding:0 40px; margin-top: 1rem; border:none; @@ -73,7 +73,7 @@ code { #text { background-color: #444; border: solid #aaa; - border-radius: var(--radius); + border-radius: 10px; color: #e0def4; margin-top: 3rem; width: 20rem; diff --git a/packages/backend/src/services/send-email.ts b/packages/backend/src/services/send-email.ts index 7643de5bc..e2e086a12 100644 --- a/packages/backend/src/services/send-email.ts +++ b/packages/backend/src/services/send-email.ts @@ -45,8 +45,8 @@ export async function sendEmail( ${subject} -
-
+
+

${meta.name}

diff --git a/packages/client/src/components/MkAbuseReport.vue b/packages/client/src/components/MkAbuseReport.vue index c63e05bed..f92d10ba7 100644 --- a/packages/client/src/components/MkAbuseReport.vue +++ b/packages/client/src/components/MkAbuseReport.vue @@ -108,7 +108,7 @@ function resolve() { box-sizing: border-box; align-items: center; padding: 14px; - border-radius: var(--radius-sm); + border-radius: 8px; --c: rgb(255 196 0 / 15%); background-image: linear-gradient( 45deg, diff --git a/packages/client/src/components/MkAnnouncement.vue b/packages/client/src/components/MkAnnouncement.vue index 9f155bbd9..bd1091b7f 100644 --- a/packages/client/src/components/MkAnnouncement.vue +++ b/packages/client/src/components/MkAnnouncement.vue @@ -61,7 +61,7 @@ const gotIt = () => { border-radius: var(--radius); > img { - border-radius: var(--radius); + border-radius: 10px; max-height: 100%; max-width: 100%; } diff --git a/packages/client/src/components/MkAutocomplete.vue b/packages/client/src/components/MkAutocomplete.vue index 5458f7b3f..dd7cd142d 100644 --- a/packages/client/src/components/MkAutocomplete.vue +++ b/packages/client/src/components/MkAutocomplete.vue @@ -530,7 +530,7 @@ onBeforeUnmount(() => { max-width: 28px; max-height: 28px; margin: 0 8px 0 0; - border-radius: var(--radius-full); + border-radius: 100%; } .name { diff --git a/packages/client/src/components/MkBiteButton.vue b/packages/client/src/components/MkBiteButton.vue index d25736eee..6af0969e5 100644 --- a/packages/client/src/components/MkBiteButton.vue +++ b/packages/client/src/components/MkBiteButton.vue @@ -58,7 +58,7 @@ async function onClick() { font-size: 16px; width: 2em; height: 2em; - border-radius: var(--radius-big); + border-radius: 100px; background: var(--bg); vertical-align: middle; margin-left: 0.5em; @@ -93,7 +93,7 @@ async function onClick() { bottom: -5px; left: -5px; border: 2px solid var(--focus); - border-radius: var(--radius-xl); + border-radius: 32px; } } diff --git a/packages/client/src/components/MkButton.vue b/packages/client/src/components/MkButton.vue index a6cfa672f..20142037d 100644 --- a/packages/client/src/components/MkButton.vue +++ b/packages/client/src/components/MkButton.vue @@ -121,7 +121,7 @@ function onMousedown(evt: MouseEvent): void { box-shadow: none; text-decoration: none; background: var(--buttonBg); - border-radius: var(--radius-x); + border-radius: 5px; overflow: clip; box-sizing: border-box; transition: background 0.1s ease; @@ -141,7 +141,7 @@ function onMousedown(evt: MouseEvent): void { } &.rounded { - border-radius: var(--radius-ellipse); + border-radius: 999px; } &.primary { @@ -196,14 +196,14 @@ function onMousedown(evt: MouseEvent): void { &.mini { padding: 4px 8px; font-size: max(12px, 0.9em); - border-radius: var(--radius-big); + border-radius: 100px; } &.chip { padding: 4px 12px; font-size: max(12px, 0.9em); min-width: unset; - border-radius: var(--radius-big); + border-radius: 100px; } &:disabled { @@ -227,14 +227,14 @@ function onMousedown(evt: MouseEvent): void { left: 0; width: 100%; height: 100%; - border-radius: var(--radius-s); + border-radius: 6px; overflow: hidden; ::v-deep(div) { position: absolute; width: 2px; height: 2px; - border-radius: var(--radius-full); + border-radius: 100%; background: rgba(0, 0, 0, 0.1); opacity: 1; transform: scale(1); diff --git a/packages/client/src/components/MkChannelFollowButton.vue b/packages/client/src/components/MkChannelFollowButton.vue index b08979705..77b5f5f49 100644 --- a/packages/client/src/components/MkChannelFollowButton.vue +++ b/packages/client/src/components/MkChannelFollowButton.vue @@ -74,7 +74,7 @@ async function onClick() { padding: 0; height: 31px; font-size: 16px; - border-radius: var(--radius-xl); + border-radius: 32px; background: #fff; &.full { @@ -96,7 +96,7 @@ async function onClick() { bottom: -5px; left: -5px; border: 2px solid var(--focus); - border-radius: var(--radius-xl); + border-radius: 32px; } } diff --git a/packages/client/src/components/MkChannelPreview.vue b/packages/client/src/components/MkChannelPreview.vue index 7ef109520..55b411b50 100644 --- a/packages/client/src/components/MkChannelPreview.vue +++ b/packages/client/src/components/MkChannelPreview.vue @@ -102,7 +102,7 @@ const bannerStyle = computed(() => { background: rgba(0, 0, 0, 0.2); color: #fff; font-size: 1.2em; - border-radius: var(--radius-ellipse); + border-radius: 999px; } > .status { @@ -115,7 +115,7 @@ const bannerStyle = computed(() => { -webkit-backdrop-filter: var(--blur, blur(8px)); backdrop-filter: var(--blur, blur(8px)); background: rgba(0, 0, 0, 0.2); - border-radius: var(--radius-s); + border-radius: 6px; color: #fff; } } diff --git a/packages/client/src/components/MkChatPreview.vue b/packages/client/src/components/MkChatPreview.vue index 4e92aaa20..5d5849c93 100644 --- a/packages/client/src/components/MkChatPreview.vue +++ b/packages/client/src/components/MkChatPreview.vue @@ -145,7 +145,7 @@ function isMe(message): boolean { width: 54px; height: 54px; margin: 0 16px 0 0; - border-radius: var(--radius-sm); + border-radius: 8px; transition: all 0.1s ease; } diff --git a/packages/client/src/components/MkContainer.vue b/packages/client/src/components/MkContainer.vue index 92568934e..be477a8f3 100644 --- a/packages/client/src/components/MkContainer.vue +++ b/packages/client/src/components/MkContainer.vue @@ -266,7 +266,7 @@ export default defineComponent({ background: var(--panel); padding: 6px 10px; font-size: 0.8em; - border-radius: var(--radius-ellipse); + border-radius: 999px; box-shadow: 0 2px 6px rgb(0 0 0 / 20%); } diff --git a/packages/client/src/components/MkCwButton.vue b/packages/client/src/components/MkCwButton.vue index fef7b7401..6b379f5e4 100644 --- a/packages/client/src/components/MkCwButton.vue +++ b/packages/client/src/components/MkCwButton.vue @@ -74,7 +74,7 @@ defineExpose({ display: inline-block; padding: 0.5em 0; font-size: 0.8em; - border-radius: var(--radius-ellipse); + border-radius: 999px; box-shadow: 0 2px 6px rgb(0 0 0 / 20%); width: 100%; background: var(--cwBg); @@ -136,7 +136,7 @@ defineExpose({ background: var(--panel); padding: 0.4em 1em; font-size: 0.8em; - border-radius: var(--radius-ellipse); + border-radius: 999px; box-shadow: 0 2px 6px rgb(0 0 0 / 20%); } &:hover { @@ -156,7 +156,7 @@ defineExpose({ background: var(--panel); padding: 6px 10px; font-size: 0.8em; - border-radius: var(--radius-ellipse); + border-radius: 999px; box-shadow: 0 0 7px 7px var(--bg); } } @@ -168,7 +168,7 @@ defineExpose({ font-size: 0.7em; color: var(--cwFg); background: var(--cwBg); - border-radius: var(--radius-xxs); + border-radius: 2px; &:hover { background: var(--cwHoverBg); diff --git a/packages/client/src/components/MkDrive.file.vue b/packages/client/src/components/MkDrive.file.vue index 6ba594531..9e8f615ae 100644 --- a/packages/client/src/components/MkDrive.file.vue +++ b/packages/client/src/components/MkDrive.file.vue @@ -224,7 +224,7 @@ async function deleteFile() { position: relative; padding: 8px 0 0 0; min-height: 180px; - border-radius: var(--radius-sm); + border-radius: 8px; &, * { diff --git a/packages/client/src/components/MkDrive.folder.vue b/packages/client/src/components/MkDrive.folder.vue index 80f5bfd27..1bcb9aa26 100644 --- a/packages/client/src/components/MkDrive.folder.vue +++ b/packages/client/src/components/MkDrive.folder.vue @@ -291,7 +291,7 @@ function onContextmenu(ev: MouseEvent) { padding: 8px; height: 64px; background: var(--driveFolderBg); - border-radius: var(--radius-xs); + border-radius: 4px; &, * { @@ -326,7 +326,7 @@ function onContextmenu(ev: MouseEvent) { bottom: -4px; left: -4px; border: 2px dashed var(--focus); - border-radius: var(--radius-xs); + border-radius: 4px; } } diff --git a/packages/client/src/components/MkDriveFileThumbnail.vue b/packages/client/src/components/MkDriveFileThumbnail.vue index acd97091c..d3925cdcc 100644 --- a/packages/client/src/components/MkDriveFileThumbnail.vue +++ b/packages/client/src/components/MkDriveFileThumbnail.vue @@ -86,7 +86,7 @@ const isThumbnailAvailable = computed(() => { position: relative; display: flex; background: var(--panel); - border-radius: var(--radius-sm); + border-radius: 8px; overflow: clip; border: 0; padding: 0; diff --git a/packages/client/src/components/MkEmojiPicker.vue b/packages/client/src/components/MkEmojiPicker.vue index fab2a922a..a9dac3cae 100644 --- a/packages/client/src/components/MkEmojiPicker.vue +++ b/packages/client/src/components/MkEmojiPicker.vue @@ -668,7 +668,7 @@ defineExpose({ width: var(--eachSize); height: var(--eachSize); contain: strict; - border-radius: var(--radius-xs); + border-radius: 4px; font-size: 24px; &:focus-visible { diff --git a/packages/client/src/components/MkEmojiPickerDialog.vue b/packages/client/src/components/MkEmojiPickerDialog.vue index f944fd4bd..c3212cd40 100644 --- a/packages/client/src/components/MkEmojiPickerDialog.vue +++ b/packages/client/src/components/MkEmojiPickerDialog.vue @@ -82,7 +82,7 @@ function opening() { diff --git a/packages/client/src/components/MkUrlPreview.vue b/packages/client/src/components/MkUrlPreview.vue index d56f1523d..5b7ff8123 100644 --- a/packages/client/src/components/MkUrlPreview.vue +++ b/packages/client/src/components/MkUrlPreview.vue @@ -270,7 +270,7 @@ onUnmounted(() => { width: 1.2em; height: 1.2em; vertical-align: middle; - border-radius: var(--radius-xs); + border-radius: 4px; } &:hover, &:focus, diff --git a/packages/client/src/components/MkUserCardMini.vue b/packages/client/src/components/MkUserCardMini.vue index c059d727a..4a7036f71 100644 --- a/packages/client/src/components/MkUserCardMini.vue +++ b/packages/client/src/components/MkUserCardMini.vue @@ -63,7 +63,7 @@ if (props.withChart) { align-items: center; padding: 16px; background: var(--panel); - border-radius: var(--radius-sm); + border-radius: 8px; transition: background 0.2s; > :global(.avatar) { diff --git a/packages/client/src/components/MkUserInfo.vue b/packages/client/src/components/MkUserInfo.vue index f1f95c3fc..9d2ab0154 100644 --- a/packages/client/src/components/MkUserInfo.vue +++ b/packages/client/src/components/MkUserInfo.vue @@ -140,7 +140,7 @@ let collapsed = $ref(isLong); color: #fff; background: rgba(0, 0, 0, 0.7); font-size: 0.7em; - border-radius: var(--radius-s); + border-radius: 6px; } &.detailed::after { content: ""; @@ -238,7 +238,7 @@ let collapsed = $ref(isLong); background: var(--panel); padding: 0.4em 1em; font-size: 0.8em; - border-radius: var(--radius-ellipse); + border-radius: 999px; box-shadow: 0 2px 6px rgb(0 0 0 / 20%); } &:hover { @@ -257,7 +257,7 @@ let collapsed = $ref(isLong); background: var(--panel); padding: 6px 10px; font-size: 0.8em; - border-radius: var(--radius-ellipse); + border-radius: 999px; box-shadow: 0 0 7px 7px var(--bg); } } diff --git a/packages/client/src/components/MkUserOnlineIndicator.vue b/packages/client/src/components/MkUserOnlineIndicator.vue index ad97db9cd..8fa49e9c7 100644 --- a/packages/client/src/components/MkUserOnlineIndicator.vue +++ b/packages/client/src/components/MkUserOnlineIndicator.vue @@ -28,7 +28,7 @@ const text = $computed(() => { diff --git a/packages/client/src/components/form/input.vue b/packages/client/src/components/form/input.vue index 2d2edebcc..f54e25fdc 100644 --- a/packages/client/src/components/form/input.vue +++ b/packages/client/src/components/form/input.vue @@ -226,7 +226,7 @@ defineExpose({ color: var(--fg); background: var(--panel); border: solid 1px var(--panel); - border-radius: var(--radius-sm); + border-radius: 6px; outline: none; box-shadow: none; box-sizing: border-box; diff --git a/packages/client/src/components/form/link.vue b/packages/client/src/components/form/link.vue index 286d81d99..01acb2951 100644 --- a/packages/client/src/components/form/link.vue +++ b/packages/client/src/components/form/link.vue @@ -52,7 +52,7 @@ const props = defineProps<{ box-sizing: border-box; padding: 10px 14px; background: var(--buttonBg); - border-radius: var(--radius-sm); + border-radius: 6px; font-size: 0.9em; &:hover { diff --git a/packages/client/src/components/form/radio.vue b/packages/client/src/components/form/radio.vue index 4cd1c4b1c..31316fb85 100644 --- a/packages/client/src/components/form/radio.vue +++ b/packages/client/src/components/form/radio.vue @@ -45,7 +45,7 @@ function toggle(x) { background-color: var(--panel); background-clip: padding-box !important; border: solid 1px var(--panel); - border-radius: var(--radius-sm); + border-radius: 6px; transition: all 0.2s; > * { @@ -103,7 +103,7 @@ function toggle(x) { height: 14px; background: none; border: solid 2px var(--inputBorder); - border-radius: var(--radius-full); + border-radius: 100%; transition: inherit; pointer-events: none; @@ -115,7 +115,7 @@ function toggle(x) { right: 3px; bottom: 3px; left: 3px; - border-radius: var(--radius-full); + border-radius: 100%; opacity: 0; transform: scale(0); transition: 0.4s cubic-bezier(0.25, 0.8, 0.25, 1); diff --git a/packages/client/src/components/form/range.vue b/packages/client/src/components/form/range.vue index 946185aa6..38ebe29e3 100644 --- a/packages/client/src/components/form/range.vue +++ b/packages/client/src/components/form/range.vue @@ -131,7 +131,7 @@ function tooltipHide() { padding: 10px 12px; background: var(--panel); border: solid 1px var(--panel); - border-radius: var(--radius-sm); + border-radius: 6px; > .container { position: relative; @@ -140,7 +140,7 @@ function tooltipHide() { @mixin track { height: 3px; background: rgba(0, 0, 0, 0.1); - border-radius: var(--radius-ellipse); + border-radius: 999px; } @mixin fill { @@ -151,7 +151,7 @@ function tooltipHide() { width: $thumbWidth; height: $thumbHeight; background: var(--accent); - border-radius: var(--radius-ellipse); + border-radius: 999px; &:hover { background: var(--accentLighten); diff --git a/packages/client/src/components/form/select.vue b/packages/client/src/components/form/select.vue index 1f200399c..08f0e47df 100644 --- a/packages/client/src/components/form/select.vue +++ b/packages/client/src/components/form/select.vue @@ -245,7 +245,7 @@ function show(ev: MouseEvent) { color: var(--fg); background: var(--panel); border: solid 1px var(--panel); - border-radius: var(--radius-s); + border-radius: 6px; outline: none; box-shadow: none; box-sizing: border-box; diff --git a/packages/client/src/components/form/switch.vue b/packages/client/src/components/form/switch.vue index 31035bb01..6e2725bfa 100644 --- a/packages/client/src/components/form/switch.vue +++ b/packages/client/src/components/form/switch.vue @@ -65,7 +65,7 @@ function toggle(x) { background: var(--swutchOffBg); background-clip: content-box; border: solid 1px var(--swutchOffBg); - border-radius: var(--radius-ellipse); + border-radius: 999px; transition: inherit; user-select: none; pointer-events: none; @@ -78,7 +78,7 @@ function toggle(x) { width: 15px; height: 15px; background: var(--swutchOffFg); - border-radius: var(--radius-ellipse); + border-radius: 999px; transition: all 0.2s ease; } } diff --git a/packages/client/src/components/form/textarea.vue b/packages/client/src/components/form/textarea.vue index 6ef084e19..9ea38670c 100644 --- a/packages/client/src/components/form/textarea.vue +++ b/packages/client/src/components/form/textarea.vue @@ -233,7 +233,7 @@ export default defineComponent({ color: var(--fg); background: var(--panel); border: solid 1px var(--panel); - border-radius: var(--radius-s); + border-radius: 6px; outline: none; box-shadow: none; box-sizing: border-box; diff --git a/packages/client/src/components/global/MkAvatar.vue b/packages/client/src/components/global/MkAvatar.vue index 4144f976c..77f545e4e 100644 --- a/packages/client/src/components/global/MkAvatar.vue +++ b/packages/client/src/components/global/MkAvatar.vue @@ -129,7 +129,7 @@ watch( display: inline-block; vertical-align: bottom; flex-shrink: 0; - border-radius: var(--radius-full); + border-radius: 100%; line-height: 16px; > .inner { @@ -138,7 +138,7 @@ watch( left: 0; right: 0; top: 0; - border-radius: var(--radius-full); + border-radius: 100%; z-index: 1; overflow: hidden; object-fit: cover; @@ -156,10 +156,10 @@ watch( } &.square { - border-radius: var(--radius-avatar-2); + border-radius: 20%; > .inner { - border-radius: var(--radius-avatar-2); + border-radius: 20%; } } @@ -176,12 +176,12 @@ watch( } &:before { - border-radius: 0 var(--radius-avatar3) var(--radius-avatar3); + border-radius: 0 75% 75%; transform: rotate(37.5deg) skew(30deg); } &:after { - border-radius: var(--radius-avatar3) 0 var(--radius-avatar3) var(--radius-avatar3); + border-radius: 75% 0 75% 75%; transform: rotate(-37.5deg) skew(-30deg); } diff --git a/packages/client/src/components/global/MkError.vue b/packages/client/src/components/global/MkError.vue index fd87af244..77745d017 100644 --- a/packages/client/src/components/global/MkError.vue +++ b/packages/client/src/components/global/MkError.vue @@ -40,7 +40,7 @@ import { instance } from "@/instance"; vertical-align: bottom; height: 128px; margin-bottom: 16px; - border-radius: var(--radius-md); + border-radius: 16px; } } diff --git a/packages/client/src/components/global/MkPageHeader.vue b/packages/client/src/components/global/MkPageHeader.vue index ea2da1a7e..d1165d27a 100644 --- a/packages/client/src/components/global/MkPageHeader.vue +++ b/packages/client/src/components/global/MkPageHeader.vue @@ -564,7 +564,7 @@ onUnmounted(() => { left: 0; height: 3px; background: var(--accent); - border-radius: var(--radius-ellipse); + border-radius: 999px; transition: width 0.2s, transform 0.2s; diff --git a/packages/client/src/components/page/page.post.vue b/packages/client/src/components/page/page.post.vue index 9a9194fd8..2213d3021 100644 --- a/packages/client/src/components/page/page.post.vue +++ b/packages/client/src/components/page/page.post.vue @@ -102,7 +102,7 @@ export default defineComponent({ .ngbfujlo { position: relative; padding: 32px; - border-radius: var(--radius-s); + border-radius: 6px; box-shadow: 0 2px 8px var(--shadow); z-index: 1; diff --git a/packages/client/src/pages/_error_.vue b/packages/client/src/pages/_error_.vue index 42ed33fba..4f536c2b5 100644 --- a/packages/client/src/pages/_error_.vue +++ b/packages/client/src/pages/_error_.vue @@ -103,7 +103,7 @@ definePageMetadata({ vertical-align: bottom; height: 128px; margin-bottom: 24px; - border-radius: var(--radius-md); + border-radius: 16px; } > .error { diff --git a/packages/client/src/pages/about-iceshrimp.vue b/packages/client/src/pages/about-iceshrimp.vue index 9404af7ba..e2789e3a0 100644 --- a/packages/client/src/pages/about-iceshrimp.vue +++ b/packages/client/src/pages/about-iceshrimp.vue @@ -212,7 +212,7 @@ definePageMetadata({ display: block; width: 250px; margin: 0 auto; - border-radius: var(--radius-x); + border-radius: 5px; } > .misskey { diff --git a/packages/client/src/pages/about.emojis.vue b/packages/client/src/pages/about.emojis.vue index db3f86cff..853a2bef2 100644 --- a/packages/client/src/pages/about.emojis.vue +++ b/packages/client/src/pages/about.emojis.vue @@ -146,7 +146,7 @@ export default defineComponent({ padding: 4px 8px; font-size: 0.9em; background: var(--accentedBg); - border-radius: var(--radius-x); + border-radius: 5px; &.active { background: var(--accent); diff --git a/packages/client/src/pages/about.vue b/packages/client/src/pages/about.vue index 44e973c5f..0f4f3c7bc 100644 --- a/packages/client/src/pages/about.vue +++ b/packages/client/src/pages/about.vue @@ -429,7 +429,7 @@ function syncSlide(index) { .fwhjspax { text-align: center; - border-radius: var(--radius-m); + border-radius: 10px; overflow: clip; background-size: cover; background-position: center center; @@ -441,7 +441,7 @@ function syncSlide(index) { display: block; margin: 16px auto 0 auto; height: 64px; - border-radius: var(--radius-sm); + border-radius: 8px; &.noAnimation { animation: none; diff --git a/packages/client/src/pages/admin/_header_.vue b/packages/client/src/pages/admin/_header_.vue index 045957610..ae0e48929 100644 --- a/packages/client/src/pages/admin/_header_.vue +++ b/packages/client/src/pages/admin/_header_.vue @@ -226,7 +226,7 @@ onUnmounted(() => { width: calc(var(--height) - (var(--margin) * 2)); box-sizing: border-box; position: relative; - border-radius: var(--radius-x); + border-radius: 5px; &:hover { background: rgba(0, 0, 0, 0.05); @@ -329,7 +329,7 @@ onUnmounted(() => { bottom: 0; height: 3px; background: var(--accent); - border-radius: var(--radius-ellipse); + border-radius: 999px; transition: all 0.2s ease; pointer-events: none; } diff --git a/packages/client/src/pages/admin/index.vue b/packages/client/src/pages/admin/index.vue index a401b9d08..bfd91d53d 100644 --- a/packages/client/src/pages/admin/index.vue +++ b/packages/client/src/pages/admin/index.vue @@ -437,7 +437,7 @@ defineExpose({ display: block; margin: auto; height: 42px; - border-radius: var(--radius-sm); + border-radius: 8px; } } } diff --git a/packages/client/src/pages/admin/overview.federation.vue b/packages/client/src/pages/admin/overview.federation.vue index 3be3d9f97..ab4dd2c69 100644 --- a/packages/client/src/pages/admin/overview.federation.vue +++ b/packages/client/src/pages/admin/overview.federation.vue @@ -175,7 +175,7 @@ onMounted(async () => { margin-right: 12px; background: var(--accentedBg); color: var(--accent); - border-radius: var(--radius-m); + border-radius: 10px; } &.sub { diff --git a/packages/client/src/pages/admin/overview.stats.vue b/packages/client/src/pages/admin/overview.stats.vue index 520bd3153..172e346e7 100644 --- a/packages/client/src/pages/admin/overview.stats.vue +++ b/packages/client/src/pages/admin/overview.stats.vue @@ -155,7 +155,7 @@ onMounted(async () => { margin-right: 12px; background: var(--accentedBg); color: var(--accent); - border-radius: var(--radius-m); + border-radius: 10px; } &.users { diff --git a/packages/client/src/pages/announcements.vue b/packages/client/src/pages/announcements.vue index 38be02e08..cc62ce0f5 100644 --- a/packages/client/src/pages/announcements.vue +++ b/packages/client/src/pages/announcements.vue @@ -90,7 +90,7 @@ definePageMetadata({ display: block; max-height: 300px; max-width: 100%; - border-radius: var(--radius-m); + border-radius: 10px; margin-top: 1rem; } } diff --git a/packages/client/src/pages/channel.vue b/packages/client/src/pages/channel.vue index e35a63d9a..d54c13d77 100644 --- a/packages/client/src/pages/channel.vue +++ b/packages/client/src/pages/channel.vue @@ -182,7 +182,7 @@ definePageMetadata( height: 48px; color: #fff; background: rgba(0, 0, 0, 0.5); - border-radius: var(--radius-full); + border-radius: 100%; > i { vertical-align: middle; @@ -212,7 +212,7 @@ definePageMetadata( padding: 8px 12px; font-size: 80%; background: rgba(0, 0, 0, 0.7); - border-radius: var(--radius-s); + border-radius: 6px; color: #fff; } } diff --git a/packages/client/src/pages/emojis.emoji.vue b/packages/client/src/pages/emojis.emoji.vue index 840a99c79..dbb82c35d 100644 --- a/packages/client/src/pages/emojis.emoji.vue +++ b/packages/client/src/pages/emojis.emoji.vue @@ -60,7 +60,7 @@ function menu(ev) { padding: 12px; text-align: left; background: var(--panel); - border-radius: var(--radius-sm); + border-radius: 8px; &:hover { border-color: var(--accent); diff --git a/packages/client/src/pages/follow-requests.vue b/packages/client/src/pages/follow-requests.vue index 9f01cdfeb..9ef1ba133 100644 --- a/packages/client/src/pages/follow-requests.vue +++ b/packages/client/src/pages/follow-requests.vue @@ -136,7 +136,7 @@ definePageMetadata( margin: 0 12px 0 0; width: 42px; height: 42px; - border-radius: var(--radius-sm); + border-radius: 8px; } > .body { diff --git a/packages/client/src/pages/gallery/post.vue b/packages/client/src/pages/gallery/post.vue index 096f7bfd7..568d85f94 100644 --- a/packages/client/src/pages/gallery/post.vue +++ b/packages/client/src/pages/gallery/post.vue @@ -265,7 +265,7 @@ definePageMetadata( max-width: 100%; max-height: 500px; margin: 0 auto; - border-radius: var(--radius-m); + border-radius: 10px; } & + .file { diff --git a/packages/client/src/pages/instance-info.vue b/packages/client/src/pages/instance-info.vue index b86b035d9..d83e601d6 100644 --- a/packages/client/src/pages/instance-info.vue +++ b/packages/client/src/pages/instance-info.vue @@ -534,7 +534,7 @@ function syncSlide(index) { display: block; margin: 0 16px 0 0; height: 64px; - border-radius: var(--radius-sm); + border-radius: 8px; } > .name { diff --git a/packages/client/src/pages/my-antennas/index.vue b/packages/client/src/pages/my-antennas/index.vue index aaac574f6..259c6db69 100644 --- a/packages/client/src/pages/my-antennas/index.vue +++ b/packages/client/src/pages/my-antennas/index.vue @@ -110,7 +110,7 @@ definePageMetadata({ padding: 13px; margin-right: 10px; border: solid 1px var(--divider); - border-radius: var(--radius-s); + border-radius: 6px; &:hover { border: solid 1px var(--accent); @@ -123,7 +123,7 @@ definePageMetadata({ padding: 16px; margin-bottom: 8px; border: solid 1px var(--divider); - border-radius: var(--radius-s); + border-radius: 6px; &:hover { border: solid 1px var(--accent); diff --git a/packages/client/src/pages/my-lists/index.vue b/packages/client/src/pages/my-lists/index.vue index 33f40d871..cb3a74f57 100644 --- a/packages/client/src/pages/my-lists/index.vue +++ b/packages/client/src/pages/my-lists/index.vue @@ -99,7 +99,7 @@ definePageMetadata({ display: block; padding: 16px; border: solid 1px var(--divider); - border-radius: var(--radius-s); + border-radius: 6px; &:hover { border: solid 1px var(--accent); diff --git a/packages/client/src/pages/no-graze.vue b/packages/client/src/pages/no-graze.vue index 3a6c44e62..8b4617cfc 100644 --- a/packages/client/src/pages/no-graze.vue +++ b/packages/client/src/pages/no-graze.vue @@ -32,7 +32,7 @@ import {instance} from "@/instance"; vertical-align: bottom; height: 128px; margin-bottom: 16px; - border-radius: var(--radius-md); + border-radius: 16px; } } diff --git a/packages/client/src/pages/note.vue b/packages/client/src/pages/note.vue index 767bffe56..6e46df45b 100644 --- a/packages/client/src/pages/note.vue +++ b/packages/client/src/pages/note.vue @@ -169,7 +169,7 @@ definePageMetadata( > .load { min-width: 0; margin: 0 auto; - border-radius: var(--radius-ellipse); + border-radius: 999px; &.next { margin-bottom: var(--margin); diff --git a/packages/client/src/pages/page-editor/page-editor.container.vue b/packages/client/src/pages/page-editor/page-editor.container.vue index 419291445..ca01111a1 100644 --- a/packages/client/src/pages/page-editor/page-editor.container.vue +++ b/packages/client/src/pages/page-editor/page-editor.container.vue @@ -94,7 +94,7 @@ export default defineComponent({ overflow: hidden; background: var(--panel); border: solid 2px var(--divider); - border-radius: var(--radius-s); + border-radius: 6px; &:hover { border: solid 2px var(--dividerHovered); diff --git a/packages/client/src/pages/page.vue b/packages/client/src/pages/page.vue index a98d85c28..6caaac791 100644 --- a/packages/client/src/pages/page.vue +++ b/packages/client/src/pages/page.vue @@ -364,7 +364,7 @@ definePageMetadata( backdrop-filter: var(--blur, blur(8px)); background: rgba(0, 0, 0, 0.2); padding: 8px; - border-radius: var(--radius-lg); + border-radius: 24px; width: fit-content; position: relative; top: -10px; diff --git a/packages/client/src/pages/settings/2fa.qrdialog.vue b/packages/client/src/pages/settings/2fa.qrdialog.vue index 9d365f512..5f14d069e 100644 --- a/packages/client/src/pages/settings/2fa.qrdialog.vue +++ b/packages/client/src/pages/settings/2fa.qrdialog.vue @@ -94,7 +94,7 @@ const ok = () => { .qr { width: 20em; max-width: 100%; - border-radius: var(--radius-m); + border-radius: 10px; border: 3px solid var(--accent); } diff --git a/packages/client/src/pages/settings/apps.vue b/packages/client/src/pages/settings/apps.vue index 51276847d..7ff99b922 100644 --- a/packages/client/src/pages/settings/apps.vue +++ b/packages/client/src/pages/settings/apps.vue @@ -99,7 +99,7 @@ definePageMetadata({ margin: 0 12px 0 0; width: 50px; height: 50px; - border-radius: var(--radius-sm); + border-radius: 8px; } > .body { diff --git a/packages/client/src/pages/settings/profile.vue b/packages/client/src/pages/settings/profile.vue index f73dc6cdc..3b94a8248 100644 --- a/packages/client/src/pages/settings/profile.vue +++ b/packages/client/src/pages/settings/profile.vue @@ -311,7 +311,7 @@ definePageMetadata({ background-size: cover; background-position: center; border: solid 1px var(--divider); - border-radius: var(--radius-m); + border-radius: 10px; overflow: clip; > .avatar { diff --git a/packages/client/src/pages/settings/theme.vue b/packages/client/src/pages/settings/theme.vue index 2981cec0a..437f73182 100644 --- a/packages/client/src/pages/settings/theme.vue +++ b/packages/client/src/pages/settings/theme.vue @@ -283,7 +283,7 @@ definePageMetadata({ diff --git a/packages/client/src/pages/welcome.entrance.c.vue b/packages/client/src/pages/welcome.entrance.c.vue index 51ba5ac52..461d74157 100644 --- a/packages/client/src/pages/welcome.entrance.c.vue +++ b/packages/client/src/pages/welcome.entrance.c.vue @@ -335,7 +335,7 @@ export default defineComponent({ right: 16px; width: 32px; height: 32px; - border-radius: var(--radius-sm); + border-radius: 8px; } } } diff --git a/packages/client/src/pages/welcome.timeline.vue b/packages/client/src/pages/welcome.timeline.vue index 2845a8041..47505d6f8 100644 --- a/packages/client/src/pages/welcome.timeline.vue +++ b/packages/client/src/pages/welcome.timeline.vue @@ -106,7 +106,7 @@ export default defineComponent({ padding: 16px; margin: 0 0 0 auto; max-width: max-content; - border-radius: var(--radius-md); + border-radius: 16px; > .richcontent { min-width: 250px; diff --git a/packages/client/src/style.scss b/packages/client/src/style.scss index d2c53fe55..66fe2f246 100644 --- a/packages/client/src/style.scss +++ b/packages/client/src/style.scss @@ -1,26 +1,10 @@ @charset "utf-8"; :root { - --radius-xxs: 10px; - --radius-xss: 3px; - --radius-xs: 10px; - --radius-x: 10px; - --radius-s: 10px; - --radius-sm: 10px; - --radius-m: 10px; - --radius: 10px; - --radius-md: 10px; - --radius-lg: 10px; - --radius-xl: 10px; - --radius-big: 10px; - --radius-ellipse: 10px; - --radius-full: 10px; - --radius-icon: 0.3rem; - --radius-avatar: 2em; - --radius-online: 120%; - --radius-avatar-2: 20%; - --radius-avatar-3: 75%; - --radius-common: 50%; + --radius: 12px; + --marginFull: 16px; + --marginHalf: 10px; + --avatarSize: 48px; --margin: var(--marginFull); @@ -41,29 +25,6 @@ //--ad: rgb(255 169 0 / 10%); } -html.radius-iceshrimp { - --radius-xxs: 2px; - --radius-xss: 3px; - --radius-xs: 4px; - --radius-x: 5px; - --radius-s: 6px; - --radius-sm: 8px; - --radius-m: 10px; - --radius: 12px; - --radius-md: 16px; - --radius-lg: 24px; - --radius-xl: 32px; - --radius-big: 100px; - --radius-ellipse: 999px; - --radius-full: 100%; - --radius-icon: 0.3rem; - --radius-avatar: 2em; - --radius-online: 120%; - --radius-avatar-2: 20%; - --radius-avatar-3: 75%; - --radius-common: 50%; -} - ::selection { color: #fff; background-color: var(--accent); @@ -115,7 +76,7 @@ body::-webkit-scrollbar { height: 12px; } body::-webkit-scrollbar-thumb { - border-radius: var(--radius-big); + border-radius: 100px; background-clip: content-box; border: 3px solid transparent; } @@ -311,7 +272,7 @@ hr { height: calc(var(--height) - (var(--margin) * 2)); box-sizing: border-box; position: relative; - border-radius: var(--radius-x); + border-radius: 5px; outline: none; &::before { @@ -625,7 +586,7 @@ hr { padding: 2px 3px; color: var(--accent); border: solid 1px var(--accent); - border-radius: var(--radius-xs); + border-radius: 4px; vertical-align: top; } @@ -665,7 +626,7 @@ hr { vertical-align: bottom; height: 128px; margin-bottom: 16px; - border-radius: var(--radius-md); + border-radius: 16px; } } @@ -930,7 +891,7 @@ hr { // padding: 5px; // margin: 1rem 7px auto; // font-size: 20px; -// border-radius: var(--radius-xs); +// border-radius: 4px; // border: 2px solid var(--accent); // background-color: var(--accentedBg); // color: var(--fg); diff --git a/packages/client/src/ui/_common_/common.vue b/packages/client/src/ui/_common_/common.vue index fdfdbdb31..e87c3c6d6 100644 --- a/packages/client/src/ui/_common_/common.vue +++ b/packages/client/src/ui/_common_/common.vue @@ -104,7 +104,7 @@ if ($i) { border: solid 2px transparent; border-top-color: var(--accent); border-left-color: var(--accent); - border-radius: var(--radius-common); + border-radius: 50%; animation: progress-spinner 400ms linear infinite; } } diff --git a/packages/client/src/ui/_common_/navbar-for-mobile.vue b/packages/client/src/ui/_common_/navbar-for-mobile.vue index ed495968a..d1cec3ade 100644 --- a/packages/client/src/ui/_common_/navbar-for-mobile.vue +++ b/packages/client/src/ui/_common_/navbar-for-mobile.vue @@ -238,7 +238,7 @@ function more() { left: 0; right: 0; bottom: 0; - border-radius: var(--radius-ellipse); + border-radius: 999px; background: linear-gradient( -45deg, var(--buttonGradateA), @@ -368,7 +368,7 @@ function more() { left: 0; right: 0; bottom: 0; - border-radius: var(--radius-ellipse); + border-radius: 999px; background: var(--accentedBg); } } diff --git a/packages/client/src/ui/_common_/navbar.vue b/packages/client/src/ui/_common_/navbar.vue index a4204e1e2..fc8a395af 100644 --- a/packages/client/src/ui/_common_/navbar.vue +++ b/packages/client/src/ui/_common_/navbar.vue @@ -308,7 +308,7 @@ function more(ev: MouseEvent) { left: 0; right: 0; bottom: 0; - border-radius: var(--radius-x); + border-radius: 5px; background: linear-gradient( -45deg, var(--buttonGradateA), @@ -427,7 +427,7 @@ function more(ev: MouseEvent) { left: 0; right: 0; bottom: 0; - border-radius: var(--radius-x); + border-radius: 5px; } } @@ -497,7 +497,7 @@ function more(ev: MouseEvent) { margin: auto; width: 52px; aspect-ratio: 1/1; - border-radius: var(--radius-x); + border-radius: 5px; background: linear-gradient( -45deg, var(--buttonGradateA), @@ -610,7 +610,7 @@ function more(ev: MouseEvent) { left: 0; right: 0; bottom: 0; - border-radius: var(--radius-ellipse); + border-radius: 999px; } > .icon, diff --git a/packages/client/src/ui/_common_/stream-indicator.vue b/packages/client/src/ui/_common_/stream-indicator.vue index 47da7a083..a3d06295c 100644 --- a/packages/client/src/ui/_common_/stream-indicator.vue +++ b/packages/client/src/ui/_common_/stream-indicator.vue @@ -55,7 +55,7 @@ onUnmounted(() => { color: #fff; background: #000; opacity: 0.8; - border-radius: var(--radius-xs); + border-radius: 4px; max-width: 320px; > .command { diff --git a/packages/client/src/ui/_common_/upload.vue b/packages/client/src/ui/_common_/upload.vue index 4729122fa..01b882c2c 100644 --- a/packages/client/src/ui/_common_/upload.vue +++ b/packages/client/src/ui/_common_/upload.vue @@ -73,7 +73,7 @@ const zIndex = os.claimZIndex("high"); padding: 16px 20px; pointer-events: none; box-shadow: 0 4px 16px rgba(0, 0, 0, 0.3); - border-radius: var(--radius-sm); + border-radius: 8px; } .mk-uploader:empty { display: none; @@ -150,7 +150,7 @@ const zIndex = os.claimZIndex("high"); display: block; background: transparent; border: none; - border-radius: var(--radius-xs); + border-radius: 4px; overflow: hidden; grid-column: 2/3; grid-row: 2/3; diff --git a/packages/client/src/ui/deck.vue b/packages/client/src/ui/deck.vue index 80c5505dd..905c6ee36 100644 --- a/packages/client/src/ui/deck.vue +++ b/packages/client/src/ui/deck.vue @@ -512,7 +512,7 @@ async function deleteProfile() { display: flex; align-items: center; justify-content: center; - border-radius: var(--radius-m); + border-radius: 10px; margin: -0.35rem; transform: scale(0.8); } @@ -541,7 +541,7 @@ async function deleteProfile() { padding: 0; margin: auto; height: 64px; - border-radius: var(--radius-sm); + border-radius: 8px; background: var(--panel); color: var(--fg); diff --git a/packages/client/src/ui/universal.vue b/packages/client/src/ui/universal.vue index 357108884..b0e6473fd 100644 --- a/packages/client/src/ui/universal.vue +++ b/packages/client/src/ui/universal.vue @@ -526,7 +526,7 @@ console.log(mainRouter.currentRoute.value.name); position: fixed !important; z-index: 1000; font-size: 16px; - border-radius: var(--radius-m); + border-radius: 10px; box-shadow: var(--shadow) 0px 0px 25px; transition: background 0.6s; transition: transform 0.3s; @@ -563,7 +563,7 @@ console.log(mainRouter.currentRoute.value.name); padding: 0; margin: auto; height: 3.5rem; - border-radius: var(--radius-sm); + border-radius: 8px; background-position: center; transition: background 0.6s; color: var(--fg); @@ -576,7 +576,7 @@ console.log(mainRouter.currentRoute.value.name); &.on { background-color: var(--focus); width: 100%; - border-radius: var(--radius-ellipse); + border-radius: 999px; transition: all 0.4s ease-in-out; } diff --git a/packages/client/src/ui/visitor/a.vue b/packages/client/src/ui/visitor/a.vue index 2b5f2389a..21797c4e2 100644 --- a/packages/client/src/ui/visitor/a.vue +++ b/packages/client/src/ui/visitor/a.vue @@ -218,7 +218,7 @@ export default defineComponent({ padding: 10px 20px; box-sizing: border-box; text-align: center; - border-radius: var(--radius-ellipse); + border-radius: 999px; background: var(--panel); color: var(--fg); diff --git a/packages/client/src/ui/visitor/b.vue b/packages/client/src/ui/visitor/b.vue index 0ede0b2ad..3a34bff4c 100644 --- a/packages/client/src/ui/visitor/b.vue +++ b/packages/client/src/ui/visitor/b.vue @@ -278,7 +278,7 @@ defineExpose({ padding: 10px; box-sizing: border-box; text-align: center; - border-radius: var(--radius-ellipse); + border-radius: 999px; &._button { background: var(--panel); diff --git a/packages/client/src/ui/visitor/header.vue b/packages/client/src/ui/visitor/header.vue index 3826d2f86..961e63533 100644 --- a/packages/client/src/ui/visitor/header.vue +++ b/packages/client/src/ui/visitor/header.vue @@ -246,7 +246,7 @@ export default defineComponent({ > .right { margin-left: auto; > .signup { - border-radius: var(--radius-ellipse); + border-radius: 999px; padding: 0 24px; line-height: $height - 20px; } diff --git a/packages/client/src/ui/visitor/kanban.vue b/packages/client/src/ui/visitor/kanban.vue index 52cde4189..1f672b8be 100644 --- a/packages/client/src/ui/visitor/kanban.vue +++ b/packages/client/src/ui/visitor/kanban.vue @@ -249,7 +249,7 @@ export default defineComponent({ padding: 10px; box-sizing: border-box; text-align: center; - border-radius: var(--radius-ellipse); + border-radius: 999px; &._button { background: var(--panel); diff --git a/packages/client/src/widgets/aiscript.vue b/packages/client/src/widgets/aiscript.vue index 61f4123be..ac1472da1 100644 --- a/packages/client/src/widgets/aiscript.vue +++ b/packages/client/src/widgets/aiscript.vue @@ -178,7 +178,7 @@ defineExpose({ padding: 0 10px; height: 28px; outline: none; - border-radius: var(--radius-xs); + border-radius: 4px; &:disabled { opacity: 0.7; diff --git a/packages/client/src/widgets/calendar.vue b/packages/client/src/widgets/calendar.vue index 79c6b1537..c2ae3cfc2 100644 --- a/packages/client/src/widgets/calendar.vue +++ b/packages/client/src/widgets/calendar.vue @@ -215,7 +215,7 @@ defineExpose({ width: 100%; overflow: hidden; background: var(--calendarInfoMeterBg); - border-radius: var(--radius-sm); + border-radius: 8px; > .val { height: 4px; diff --git a/packages/client/src/widgets/federation.vue b/packages/client/src/widgets/federation.vue index be97bf9d7..a8e121519 100644 --- a/packages/client/src/widgets/federation.vue +++ b/packages/client/src/widgets/federation.vue @@ -158,7 +158,7 @@ defineExpose({ width: ($bodyTitleHieght + $bodyInfoHieght); height: ($bodyTitleHieght + $bodyInfoHieght); object-fit: cover; - border-radius: var(--radius-xs); + border-radius: 4px; margin-right: 8px; } diff --git a/packages/client/src/widgets/memo.vue b/packages/client/src/widgets/memo.vue index 2585585c5..78c5ad5a6 100644 --- a/packages/client/src/widgets/memo.vue +++ b/packages/client/src/widgets/memo.vue @@ -122,7 +122,7 @@ defineExpose({ padding: 0 10px; height: 28px; outline: none; - border-radius: var(--radius-xs); + border-radius: 4px; &:disabled { opacity: 0.7; diff --git a/packages/client/src/widgets/photos.vue b/packages/client/src/widgets/photos.vue index 7edd616c4..3a0130624 100644 --- a/packages/client/src/widgets/photos.vue +++ b/packages/client/src/widgets/photos.vue @@ -115,7 +115,7 @@ defineExpose({ .img { position: relative; border: solid 4px transparent; - border-radius: var(--radius-sm); + border-radius: 8px; } } @@ -135,7 +135,7 @@ defineExpose({ background-size: cover; background-clip: content-box; border: solid 2px transparent; - border-radius: var(--radius-xs); + border-radius: 4px; } } diff --git a/packages/client/src/widgets/server-info.vue b/packages/client/src/widgets/server-info.vue index c42c0931d..7b2b63d2a 100644 --- a/packages/client/src/widgets/server-info.vue +++ b/packages/client/src/widgets/server-info.vue @@ -80,7 +80,7 @@ defineExpose({ display: inline-block; width: 60px; height: 60px; - border-radius: var(--radius-sm); + border-radius: 8px; box-sizing: border-box; border: solid 3px var(--panelBorder); }