Skip to content
Snippets Groups Projects
Commit 32318bbb authored by S Kopper's avatar S Kopper
Browse files

fix: un-hardcode more border radius values

all of these are blind find and replace, no clue if they end up breaking
anything
parent 62a5793e
No related branches found
No related tags found
No related merge requests found
...@@ -198,7 +198,7 @@ const bannerStyle = computed(() => { ...@@ -198,7 +198,7 @@ const bannerStyle = computed(() => {
transform: translate(25%, -25%); transform: translate(25%, -25%);
background-color: var(--accent); background-color: var(--accent);
border: solid var(--bg) 4px; border: solid var(--bg) 4px;
border-radius: 100%; border-radius: var(--radius-full);
width: 1.5rem; width: 1.5rem;
height: 1.5rem; height: 1.5rem;
aspect-ratio: 1 / 1; aspect-ratio: 1 / 1;
......
...@@ -62,7 +62,7 @@ watch(() => props.lang, (to) => { ...@@ -62,7 +62,7 @@ watch(() => props.lang, (to) => {
padding: 1em; padding: 1em;
margin: .5em 0; margin: .5em 0;
overflow: auto; overflow: auto;
border-radius: 8px; border-radius: var(--radius-sm);
& pre, & pre,
& code { & code {
......
...@@ -56,7 +56,7 @@ const XCode = defineAsyncComponent(() => import('@/components/MkCode.core.vue')) ...@@ -56,7 +56,7 @@ const XCode = defineAsyncComponent(() => import('@/components/MkCode.core.vue'))
padding: 1em; padding: 1em;
margin: .5em 0; margin: .5em 0;
overflow: auto; overflow: auto;
border-radius: 8px; border-radius: var(--radius-sm);
} }
.codeBlockFallbackCode { .codeBlockFallbackCode {
...@@ -74,7 +74,7 @@ const XCode = defineAsyncComponent(() => import('@/components/MkCode.core.vue')) ...@@ -74,7 +74,7 @@ const XCode = defineAsyncComponent(() => import('@/components/MkCode.core.vue'))
cursor: pointer; cursor: pointer;
box-sizing: border-box; box-sizing: border-box;
border-radius: 8px; border-radius: var(--radius-sm);
padding: 24px; padding: 24px;
margin-top: 4px; margin-top: 4px;
color: #D4D4D4; color: #D4D4D4;
......
...@@ -161,7 +161,7 @@ watch(v, newValue => { ...@@ -161,7 +161,7 @@ watch(v, newValue => {
overflow-y: hidden; overflow-y: hidden;
box-sizing: border-box; box-sizing: border-box;
margin: 0; margin: 0;
border-radius: 6px; border-radius: var(--radius-sm);
padding: 0; padding: 0;
color: var(--fg); color: var(--fg);
border: solid 1px var(--panel); border: solid 1px var(--panel);
...@@ -202,7 +202,7 @@ watch(v, newValue => { ...@@ -202,7 +202,7 @@ watch(v, newValue => {
caret-color: rgb(225, 228, 232); caret-color: rgb(225, 228, 232);
background-color: transparent; background-color: transparent;
border: 0; border: 0;
border-radius: 6px; border-radius: var(--radius-sm);
outline: 0; outline: 0;
min-width: calc(100% - 24px); min-width: calc(100% - 24px);
height: 100%; height: 100%;
......
...@@ -6,7 +6,7 @@ SPDX-License-Identifier: AGPL-3.0-only ...@@ -6,7 +6,7 @@ SPDX-License-Identifier: AGPL-3.0-only
<template> <template>
<!-- このコンポーネントの要素のclassは親から利用されるのでむやみに弄らないこと --> <!-- このコンポーネントの要素のclassは親から利用されるのでむやみに弄らないこと -->
<!-- フォルダの中にはカスタム絵文字だけ(Unicode絵文字もこっち) --> <!-- フォルダの中にはカスタム絵文字だけ(Unicode絵文字もこっち) -->
<section v-if="!hasChildSection" v-panel style="border-radius: 6px; border-bottom: 0.5px solid var(--divider);"> <section v-if="!hasChildSection" v-panel style="border-radius: var(--radius-sm); border-bottom: 0.5px solid var(--divider);">
<header class="_acrylic" @click="shown = !shown"> <header class="_acrylic" @click="shown = !shown">
<i class="toggle ti-fw" :class="shown ? 'ph-caret-down ph-bold ph-lg' : 'ph-caret-up ph-bold ph-lg'"></i> <slot></slot> (<i class="ph-bold ph-lg"></i>:{{ emojis.length }}) <i class="toggle ti-fw" :class="shown ? 'ph-caret-down ph-bold ph-lg' : 'ph-caret-up ph-bold ph-lg'"></i> <slot></slot> (<i class="ph-bold ph-lg"></i>:{{ emojis.length }})
</header> </header>
...@@ -25,7 +25,7 @@ SPDX-License-Identifier: AGPL-3.0-only ...@@ -25,7 +25,7 @@ SPDX-License-Identifier: AGPL-3.0-only
</div> </div>
</section> </section>
<!-- フォルダの中にはカスタム絵文字やフォルダがある --> <!-- フォルダの中にはカスタム絵文字やフォルダがある -->
<section v-else v-panel style="border-radius: 6px; border-bottom: 0.5px solid var(--divider);"> <section v-else v-panel style="border-radius: var(--radius-sm); border-bottom: 0.5px solid var(--divider);">
<header class="_acrylic" @click="shown = !shown"> <header class="_acrylic" @click="shown = !shown">
<i class="toggle ti-fw" :class="shown ? 'ph-caret-down ph-bold ph-lg' : 'ph-caret-up ph-bold ph-lg'"></i> <slot></slot> (<i class="ph-folder ph-bold ph-lg"></i>:{{ customEmojiTree.length }} <i class="ti ti-icons ti-fw"></i>:{{ emojis.length }}) <i class="toggle ti-fw" :class="shown ? 'ph-caret-down ph-bold ph-lg' : 'ph-caret-up ph-bold ph-lg'"></i> <slot></slot> (<i class="ph-folder ph-bold ph-lg"></i>:{{ customEmojiTree.length }} <i class="ti ti-icons ti-fw"></i>:{{ emojis.length }})
</header> </header>
......
...@@ -1059,7 +1059,7 @@ defineExpose({ ...@@ -1059,7 +1059,7 @@ defineExpose({
left: 12px; left: 12px;
width: 5px; width: 5px;
height: 100% ; height: 100% ;
border-radius: 999px; border-radius: var(--radius-ellipse);
pointer-events: none; pointer-events: none;
} }
......
...@@ -277,7 +277,7 @@ export default function(props: MfmProps) { ...@@ -277,7 +277,7 @@ export default function(props: MfmProps) {
const child = token.children[0]; const child = token.children[0];
const unixtime = parseInt(child.type === 'text' ? child.props.text : ''); const unixtime = parseInt(child.type === 'text' ? child.props.text : '');
return h('span', { return h('span', {
style: 'display: inline-block; font-size: 90%; border: solid 1px var(--divider); border-radius: 999px; padding: 4px 10px 4px 6px;', style: 'display: inline-block; font-size: 90%; border: solid 1px var(--divider); border-radius: var(--radius-ellipse); padding: 4px 10px 4px 6px;',
}, [ }, [
h('i', { h('i', {
class: 'ph-clock ph-bold ph-lg', class: 'ph-clock ph-bold ph-lg',
......
...@@ -42,7 +42,7 @@ const emit = defineEmits<{ ...@@ -42,7 +42,7 @@ const emit = defineEmits<{
cursor: pointer; cursor: pointer;
padding: 16px 16px 28px 16px; padding: 16px 16px 28px 16px;
border: solid 2px var(--divider); border: solid 2px var(--divider);
border-radius: 8px; border-radius: var(--radius-sm);
text-align: center; text-align: center;
font-size: 90%; font-size: 90%;
overflow: clip; overflow: clip;
......
...@@ -12,7 +12,7 @@ SPDX-License-Identifier: AGPL-3.0-only ...@@ -12,7 +12,7 @@ SPDX-License-Identifier: AGPL-3.0-only
<div class="_gaps"> <div class="_gaps">
<div> <div>
<div v-panel style="border-radius: 6px;"> <div v-panel style="border-radius: var(--radius-sm);">
<Sortable <Sortable
v-model="pinnedEmojisForReaction" v-model="pinnedEmojisForReaction"
:class="$style.emojis" :class="$style.emojis"
...@@ -52,7 +52,7 @@ SPDX-License-Identifier: AGPL-3.0-only ...@@ -52,7 +52,7 @@ SPDX-License-Identifier: AGPL-3.0-only
<div class="_gaps"> <div class="_gaps">
<div> <div>
<div v-panel style="border-radius: 6px;"> <div v-panel style="border-radius: var(--radius-sm);">
<Sortable <Sortable
v-model="pinnedEmojis" v-model="pinnedEmojis"
:class="$style.emojis" :class="$style.emojis"
......
...@@ -107,7 +107,7 @@ const suspended = computed(() => props.user.isSuspended ?? false); ...@@ -107,7 +107,7 @@ const suspended = computed(() => props.user.isSuspended ?? false);
> .moderator { > .moderator {
display: inline-block; display: inline-block;
border: solid 1px; border: solid 1px;
border-radius: 6px; border-radius: var(--radius-sm);
padding: 2px 6px; padding: 2px 6px;
font-size: 85%; font-size: 85%;
} }
......
0% Loading or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment