revert revert 01c649b8f1

revert more square
This commit is contained in:
limepotato 2024-07-07 06:58:56 +02:00 committed by Iceshrimp development
parent dfa02780f8
commit 14ef380923
No known key found for this signature in database
GPG key ID: 7249C94AE229BEAF
124 changed files with 292 additions and 216 deletions

View file

@ -6,3 +6,56 @@
* This may eventuallly be replaced with a function in the admin panel. * 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% //
}
*/

View file

@ -32,7 +32,7 @@ html {
} }
main { main {
background: #1f1d2e; background: #1f1d2e;
border-radius: 10px; border-radius: var(--radius);
} }
#tl > div { #tl > div {
padding: 16px; padding: 16px;
@ -58,7 +58,7 @@ html {
text-align: center; text-align: center;
} }
button { button {
border-radius: 999px; border-radius: var(--radius-ellipse);
padding: 0px 12px 0px 12px; padding: 0px 12px 0px 12px;
border: none; border: none;
cursor: pointer; cursor: pointer;
@ -71,7 +71,7 @@ button {
padding: 12px; padding: 12px;
} }
button { button {
border-radius: 999px; border-radius: var(--radius-ellipse);
padding: 0px 12px 0px 12px; padding: 0px 12px 0px 12px;
border: none; border: none;
cursor: pointer; cursor: pointer;
@ -118,7 +118,7 @@ code {
textarea { textarea {
background-color: #444; background-color: #444;
border: solid #aaa; border: solid #aaa;
border-radius: 10px; border-radius: var(--radius-ellipse);
color: #e0def4; color: #e0def4;
margin-top: 1rem; margin-top: 1rem;
margin-bottom: 1rem; margin-bottom: 1rem;
@ -133,7 +133,7 @@ textarea:focus {
input { input {
background-color: #666; background-color: #666;
border: solid #aaa; border: solid #aaa;
border-radius: 10px; border-radius: var(--radius-ellipse);
color: #e0def4; color: #e0def4;
margin-top: 1rem; margin-top: 1rem;
margin-bottom: 1rem; margin-bottom: 1rem;

View file

@ -201,7 +201,7 @@
} }
button { button {
border-radius: 999px; border-radius: var(--radius-ellipse);
padding: 0px 12px 0px 12px; padding: 0px 12px 0px 12px;
border: none; border: none;
cursor: pointer; cursor: pointer;
@ -273,7 +273,7 @@
margin-bottom: 2rem; margin-bottom: 2rem;
padding: 0.5rem 1rem; padding: 0.5rem 1rem;
width: 40rem; width: 40rem;
border-radius: 10px; border-radius: var(--radius);
justify-content: center; justify-content: center;
margin: auto; margin: auto;
} }

View file

@ -3,11 +3,11 @@ html {
} }
main { main {
background: #1f1d2e; background: #1f1d2e;
border-radius: 10px; border-radius: var(--radius);
} }
#tl > div { #tl > div {
border: 1px solid #908caa; border: 1px solid #908caa;
border-radius: 10px; border-radius: var(--radius);
margin: 10px; margin: 10px;
padding: 10px; padding: 10px;
width: fit-content; width: fit-content;
@ -18,7 +18,7 @@ main {
} }
img { img {
border-radius: 10px; border-radius: var(--radius);
margin-right: 10px; margin-right: 10px;
} }
@ -40,7 +40,7 @@ html {
padding: 10px; padding: 10px;
} }
button { button {
border-radius:999px; border-radius:var(--radius-ellipse);
padding:0 40px; padding:0 40px;
margin-top: 1rem; margin-top: 1rem;
border:none; border:none;
@ -73,7 +73,7 @@ code {
#text { #text {
background-color: #444; background-color: #444;
border: solid #aaa; border: solid #aaa;
border-radius: 10px; border-radius: var(--radius);
color: #e0def4; color: #e0def4;
margin-top: 3rem; margin-top: 3rem;
width: 20rem; width: 20rem;

View file

@ -45,8 +45,8 @@ export async function sendEmail(
<title>${subject}</title> <title>${subject}</title>
</head> </head>
<body style="background: #191724; padding: 16px; margin: 0; font-family: sans-serif; font-size: 14px;"> <body style="background: #191724; padding: 16px; margin: 0; font-family: sans-serif; font-size: 14px;">
<main style="max-width: 500px; margin: 0 auto; background: #1f1d2e; color: #e0def4; border-radius: 20px;"> <main style="max-width: 500px; margin: 0 auto; background: #1f1d2e; color: #e0def4; border-radius: var(--radius-lg);">
<header style="padding: 32px; background: #31748f; color: #e0def4; display: flex; border-radius: 20px;"> <header style="padding: 32px; background: #31748f; color: #e0def4; display: flex; border-radius: var(--radius-lg);">
<img src="${meta.logoImageUrl || meta.iconUrl || iconUrl}" style="max-width: 128px; max-height: 72px; vertical-align: bottom; margin-right: 16px;"/> <img src="${meta.logoImageUrl || meta.iconUrl || iconUrl}" style="max-width: 128px; max-height: 72px; vertical-align: bottom; margin-right: 16px;"/>
<h1 style="margin: 0 0 1em 0;">${meta.name}</h1> <h1 style="margin: 0 0 1em 0;">${meta.name}</h1>
</header> </header>

View file

@ -108,7 +108,7 @@ function resolve() {
box-sizing: border-box; box-sizing: border-box;
align-items: center; align-items: center;
padding: 14px; padding: 14px;
border-radius: 8px; border-radius: var(--radius-sm);
--c: rgb(255 196 0 / 15%); --c: rgb(255 196 0 / 15%);
background-image: linear-gradient( background-image: linear-gradient(
45deg, 45deg,

View file

@ -61,7 +61,7 @@ const gotIt = () => {
border-radius: var(--radius); border-radius: var(--radius);
> img { > img {
border-radius: 10px; border-radius: var(--radius);
max-height: 100%; max-height: 100%;
max-width: 100%; max-width: 100%;
} }

View file

@ -530,7 +530,7 @@ onBeforeUnmount(() => {
max-width: 28px; max-width: 28px;
max-height: 28px; max-height: 28px;
margin: 0 8px 0 0; margin: 0 8px 0 0;
border-radius: 100%; border-radius: var(--radius-full);
} }
.name { .name {

View file

@ -58,7 +58,7 @@ async function onClick() {
font-size: 16px; font-size: 16px;
width: 2em; width: 2em;
height: 2em; height: 2em;
border-radius: 100px; border-radius: var(--radius-big);
background: var(--bg); background: var(--bg);
vertical-align: middle; vertical-align: middle;
margin-left: 0.5em; margin-left: 0.5em;
@ -93,7 +93,7 @@ async function onClick() {
bottom: -5px; bottom: -5px;
left: -5px; left: -5px;
border: 2px solid var(--focus); border: 2px solid var(--focus);
border-radius: 32px; border-radius: var(--radius-xl);
} }
} }

View file

@ -121,7 +121,7 @@ function onMousedown(evt: MouseEvent): void {
box-shadow: none; box-shadow: none;
text-decoration: none; text-decoration: none;
background: var(--buttonBg); background: var(--buttonBg);
border-radius: 5px; border-radius: var(--radius-x);
overflow: clip; overflow: clip;
box-sizing: border-box; box-sizing: border-box;
transition: background 0.1s ease; transition: background 0.1s ease;
@ -141,7 +141,7 @@ function onMousedown(evt: MouseEvent): void {
} }
&.rounded { &.rounded {
border-radius: 999px; border-radius: var(--radius-ellipse);
} }
&.primary { &.primary {
@ -196,14 +196,14 @@ function onMousedown(evt: MouseEvent): void {
&.mini { &.mini {
padding: 4px 8px; padding: 4px 8px;
font-size: max(12px, 0.9em); font-size: max(12px, 0.9em);
border-radius: 100px; border-radius: var(--radius-big);
} }
&.chip { &.chip {
padding: 4px 12px; padding: 4px 12px;
font-size: max(12px, 0.9em); font-size: max(12px, 0.9em);
min-width: unset; min-width: unset;
border-radius: 100px; border-radius: var(--radius-big);
} }
&:disabled { &:disabled {
@ -227,14 +227,14 @@ function onMousedown(evt: MouseEvent): void {
left: 0; left: 0;
width: 100%; width: 100%;
height: 100%; height: 100%;
border-radius: 6px; border-radius: var(--radius-s);
overflow: hidden; overflow: hidden;
::v-deep(div) { ::v-deep(div) {
position: absolute; position: absolute;
width: 2px; width: 2px;
height: 2px; height: 2px;
border-radius: 100%; border-radius: var(--radius-full);
background: rgba(0, 0, 0, 0.1); background: rgba(0, 0, 0, 0.1);
opacity: 1; opacity: 1;
transform: scale(1); transform: scale(1);

View file

@ -74,7 +74,7 @@ async function onClick() {
padding: 0; padding: 0;
height: 31px; height: 31px;
font-size: 16px; font-size: 16px;
border-radius: 32px; border-radius: var(--radius-xl);
background: #fff; background: #fff;
&.full { &.full {
@ -96,7 +96,7 @@ async function onClick() {
bottom: -5px; bottom: -5px;
left: -5px; left: -5px;
border: 2px solid var(--focus); border: 2px solid var(--focus);
border-radius: 32px; border-radius: var(--radius-xl);
} }
} }

View file

@ -102,7 +102,7 @@ const bannerStyle = computed(() => {
background: rgba(0, 0, 0, 0.2); background: rgba(0, 0, 0, 0.2);
color: #fff; color: #fff;
font-size: 1.2em; font-size: 1.2em;
border-radius: 999px; border-radius: var(--radius-ellipse);
} }
> .status { > .status {
@ -115,7 +115,7 @@ const bannerStyle = computed(() => {
-webkit-backdrop-filter: var(--blur, blur(8px)); -webkit-backdrop-filter: var(--blur, blur(8px));
backdrop-filter: var(--blur, blur(8px)); backdrop-filter: var(--blur, blur(8px));
background: rgba(0, 0, 0, 0.2); background: rgba(0, 0, 0, 0.2);
border-radius: 6px; border-radius: var(--radius-s);
color: #fff; color: #fff;
} }
} }

View file

@ -145,7 +145,7 @@ function isMe(message): boolean {
width: 54px; width: 54px;
height: 54px; height: 54px;
margin: 0 16px 0 0; margin: 0 16px 0 0;
border-radius: 8px; border-radius: var(--radius-sm);
transition: all 0.1s ease; transition: all 0.1s ease;
} }

View file

@ -266,7 +266,7 @@ export default defineComponent({
background: var(--panel); background: var(--panel);
padding: 6px 10px; padding: 6px 10px;
font-size: 0.8em; font-size: 0.8em;
border-radius: 999px; border-radius: var(--radius-ellipse);
box-shadow: 0 2px 6px rgb(0 0 0 / 20%); box-shadow: 0 2px 6px rgb(0 0 0 / 20%);
} }

View file

@ -74,7 +74,7 @@ defineExpose({
display: inline-block; display: inline-block;
padding: 0.5em 0; padding: 0.5em 0;
font-size: 0.8em; font-size: 0.8em;
border-radius: 999px; border-radius: var(--radius-ellipse);
box-shadow: 0 2px 6px rgb(0 0 0 / 20%); box-shadow: 0 2px 6px rgb(0 0 0 / 20%);
width: 100%; width: 100%;
background: var(--cwBg); background: var(--cwBg);
@ -136,7 +136,7 @@ defineExpose({
background: var(--panel); background: var(--panel);
padding: 0.4em 1em; padding: 0.4em 1em;
font-size: 0.8em; font-size: 0.8em;
border-radius: 999px; border-radius: var(--radius-ellipse);
box-shadow: 0 2px 6px rgb(0 0 0 / 20%); box-shadow: 0 2px 6px rgb(0 0 0 / 20%);
} }
&:hover { &:hover {
@ -156,7 +156,7 @@ defineExpose({
background: var(--panel); background: var(--panel);
padding: 6px 10px; padding: 6px 10px;
font-size: 0.8em; font-size: 0.8em;
border-radius: 999px; border-radius: var(--radius-ellipse);
box-shadow: 0 0 7px 7px var(--bg); box-shadow: 0 0 7px 7px var(--bg);
} }
} }
@ -168,7 +168,7 @@ defineExpose({
font-size: 0.7em; font-size: 0.7em;
color: var(--cwFg); color: var(--cwFg);
background: var(--cwBg); background: var(--cwBg);
border-radius: 2px; border-radius: var(--radius-xxs);
&:hover { &:hover {
background: var(--cwHoverBg); background: var(--cwHoverBg);

View file

@ -224,7 +224,7 @@ async function deleteFile() {
position: relative; position: relative;
padding: 8px 0 0 0; padding: 8px 0 0 0;
min-height: 180px; min-height: 180px;
border-radius: 8px; border-radius: var(--radius-sm);
&, &,
* { * {

View file

@ -291,7 +291,7 @@ function onContextmenu(ev: MouseEvent) {
padding: 8px; padding: 8px;
height: 64px; height: 64px;
background: var(--driveFolderBg); background: var(--driveFolderBg);
border-radius: 4px; border-radius: var(--radius-xs);
&, &,
* { * {
@ -326,7 +326,7 @@ function onContextmenu(ev: MouseEvent) {
bottom: -4px; bottom: -4px;
left: -4px; left: -4px;
border: 2px dashed var(--focus); border: 2px dashed var(--focus);
border-radius: 4px; border-radius: var(--radius-xs);
} }
} }

View file

@ -86,7 +86,7 @@ const isThumbnailAvailable = computed(() => {
position: relative; position: relative;
display: flex; display: flex;
background: var(--panel); background: var(--panel);
border-radius: 8px; border-radius: var(--radius-sm);
overflow: clip; overflow: clip;
border: 0; border: 0;
padding: 0; padding: 0;

View file

@ -668,7 +668,7 @@ defineExpose({
width: var(--eachSize); width: var(--eachSize);
height: var(--eachSize); height: var(--eachSize);
contain: strict; contain: strict;
border-radius: 4px; border-radius: var(--radius-xs);
font-size: 24px; font-size: 24px;
&:focus-visible { &:focus-visible {

View file

@ -82,7 +82,7 @@ function opening() {
<style lang="scss" scoped> <style lang="scss" scoped>
.ryghynhb { .ryghynhb {
&.drawer { &.drawer {
border-radius: 24px; border-radius: var(--radius-lg);
border-bottom-right-radius: 0; border-bottom-right-radius: 0;
border-bottom-left-radius: 0; border-bottom-left-radius: 0;
} }

View file

@ -132,7 +132,7 @@ const props = defineProps<{
padding: 2px 4px; padding: 2px 4px;
background: #ff0000bf; background: #ff0000bf;
color: #fff; color: #fff;
border-radius: 4px; border-radius: var(--radius-xs);
font-size: 85%; font-size: 85%;
animation: sensitive-blink 1s infinite; animation: sensitive-blink 1s infinite;
} }

View file

@ -193,7 +193,7 @@ onBeforeUnmount(() => {
font-size: 16px; font-size: 16px;
width: 2em; width: 2em;
height: 2em; height: 2em;
border-radius: 100px; border-radius: var(--radius-big);
background: var(--bg); background: var(--bg);
vertical-align: middle; vertical-align: middle;
margin-left: 0.5em; margin-left: 0.5em;
@ -227,7 +227,7 @@ onBeforeUnmount(() => {
bottom: -5px; bottom: -5px;
left: -5px; left: -5px;
border: 2px solid var(--focus); border: 2px solid var(--focus);
border-radius: 32px; border-radius: var(--radius-xl);
} }
} }

View file

@ -39,9 +39,9 @@ const search = () => {
height: 40px; height: 40px;
font-size: 16px; font-size: 16px;
border: solid 1px var(--divider); border: solid 1px var(--divider);
border-radius: 4px 0 0 4px; border-radius: var(--radius-xs) 0 0 var(--radius-xs);
-webkit-appearance: none; -webkit-appearance: none;
-webkit-border-radius: 4px 0 0 4px; -webkit-border-radius: var(--radius-xs) 0 0 var(--radius-xs);
} }
> button { > button {
@ -50,7 +50,7 @@ const search = () => {
padding: 0 16px; padding: 0 16px;
border: solid 1px var(--divider); border: solid 1px var(--divider);
border-left: none; border-left: none;
border-radius: 0 4px 4px 0; border-radius: 0 var(--radius-xs) var(--radius-xs) 0;
&:active { &:active {
box-shadow: 0 2px 4px rgba(#000, 0.15) inset; box-shadow: 0 2px 4px rgba(#000, 0.15) inset;

View file

@ -59,7 +59,7 @@ const modal = $ref<InstanceType<typeof MkModal>>();
padding: 6px 9px; padding: 6px 9px;
font-size: 90%; font-size: 90%;
background: rgba(0, 0, 0, 0.5); background: rgba(0, 0, 0, 0.5);
border-radius: 6px; border-radius: var(--radius-s);
color: #fff; color: #fff;
} }

View file

@ -63,14 +63,14 @@ function getInstanceIcon(instance): string {
align-items: center; align-items: center;
padding: 16px; padding: 16px;
background: var(--panel); background: var(--panel);
border-radius: 8px; border-radius: var(--radius-sm);
> :global(.icon) { > :global(.icon) {
display: block; display: block;
width: ($bodyTitleHieght + $bodyInfoHieght); width: ($bodyTitleHieght + $bodyInfoHieght);
height: ($bodyTitleHieght + $bodyInfoHieght); height: ($bodyTitleHieght + $bodyInfoHieght);
object-fit: cover; object-fit: cover;
border-radius: 4px; border-radius: var(--radius-xs);
margin-right: 10px; margin-right: 10px;
} }

View file

@ -66,7 +66,7 @@ function getInstanceIcon(instance): string {
height: 1.1em; height: 1.1em;
justify-self: flex-end; justify-self: flex-end;
padding: 0.2em 0.4em; padding: 0.2em 0.4em;
border-radius: 100px; border-radius: var(--radius-big);
font-size: 0.8em; font-size: 0.8em;
text-shadow: 0 2px 2px var(--shadow); text-shadow: 0 2px 2px var(--shadow);
overflow: hidden; overflow: hidden;
@ -77,7 +77,7 @@ function getInstanceIcon(instance): string {
> .icon { > .icon {
height: 100%; height: 100%;
border-radius: 0.3rem; border-radius: var(--radius-icon);
} }
> .name { > .name {

View file

@ -123,12 +123,11 @@ function close() {
overflow: auto; overflow: auto;
overscroll-behavior: contain; overscroll-behavior: contain;
text-align: left; text-align: left;
border-radius: 16px; border-radius: var(--radius-md);
&.asDrawer { &.asDrawer {
width: 100%; width: 100%;
padding: 16px 16px calc(env(safe-area-inset-bottom, 0px) + 16px) 16px; padding: 16px 16px calc(env(safe-area-inset-bottom, 0px) + 16px) 16px;
border-radius: 24px; border-radius: var(--radius-lg);
border-bottom-right-radius: 0; border-bottom-right-radius: 0;
border-bottom-left-radius: 0; border-bottom-left-radius: 0;
text-align: center; text-align: center;
@ -151,7 +150,7 @@ function close() {
justify-content: center; justify-content: center;
vertical-align: bottom; vertical-align: bottom;
height: 100px; height: 100px;
border-radius: 10px; border-radius: var(--radius-m);
&:hover, &:hover,
&:focus-visible { &:focus-visible {

View file

@ -186,7 +186,7 @@ watch(
display: flex; display: flex;
gap: 4px; gap: 4px;
position: absolute; position: absolute;
border-radius: 6px; border-radius: var(--radius-s);
overflow: hidden; overflow: hidden;
top: 12px; top: 12px;
right: 12px; right: 12px;
@ -217,7 +217,7 @@ watch(
> .gif { > .gif {
background-color: var(--fg); background-color: var(--fg);
border-radius: 6px; border-radius: var(--radius-s);
color: var(--accentLighten); color: var(--accentLighten);
display: inline-block; display: inline-block;
font-size: 14px; font-size: 14px;

View file

@ -85,7 +85,7 @@ onMounted(() => {
<style lang="scss" scoped> <style lang="scss" scoped>
.mk-media-banner { .mk-media-banner {
width: 100%; width: 100%;
border-radius: 4px; border-radius: var(--radius-xs);
margin-top: 4px; margin-top: 4px;
overflow: hidden; overflow: hidden;
--plyr-color-main: var(--accent); --plyr-color-main: var(--accent);

View file

@ -294,7 +294,7 @@ export default defineComponent({
padding: 6px 9px; padding: 6px 9px;
font-size: 90%; font-size: 90%;
background: rgba(0, 0, 0, 0.5); background: rgba(0, 0, 0, 0.5);
border-radius: 6px; border-radius: var(--radius-s);
color: #fff; color: #fff;
} }

View file

@ -243,7 +243,7 @@ const previewableCount = props.mediaList.filter((media) =>
> div, > div,
> button { > button {
overflow: hidden; overflow: hidden;
border-radius: 6px; border-radius: var(--radius-s);
pointer-events: all; pointer-events: all;
min-height: 50px; min-height: 50px;
} }
@ -297,7 +297,7 @@ const previewableCount = props.mediaList.filter((media) =>
text-align: center; text-align: center;
padding: 10px; padding: 10px;
background: rgba(0, 0, 0, 0.5); background: rgba(0, 0, 0, 0.5);
border-radius: 5px; border-radius: var(--radius-x);;
max-height: 10vh; max-height: 10vh;
overflow-x: clip; overflow-x: clip;

View file

@ -63,7 +63,7 @@ const isMe =
display: inline-block; display: inline-block;
padding: 2px 8px 2px 2px; padding: 2px 8px 2px 2px;
margin-block: 2px; margin-block: 2px;
border-radius: 999px; border-radius: var(--radius-ellipse);
max-width: 100%; max-width: 100%;
white-space: nowrap; white-space: nowrap;
text-overflow: ellipsis; text-overflow: ellipsis;
@ -90,7 +90,7 @@ const isMe =
object-fit: cover; object-fit: cover;
margin: 0 0.2em 0 0; margin: 0 0.2em 0 0;
vertical-align: bottom; vertical-align: bottom;
border-radius: 100%; border-radius: var(--radius-full);
} }
> .main > .host { > .main > .host {

View file

@ -376,7 +376,7 @@ onBeforeUnmount(() => {
width: calc(100% - 16px); width: calc(100% - 16px);
margin-bottom: 0.2rem; margin-bottom: 0.2rem;
height: 100%; height: 100%;
border-radius: 6px; border-radius: var(--radius-s);
} }
> * { > * {
@ -516,7 +516,7 @@ onBeforeUnmount(() => {
&.asDrawer { &.asDrawer {
padding: 12px 0 calc(env(safe-area-inset-bottom, 0px) + 12px) 0; padding: 12px 0 calc(env(safe-area-inset-bottom, 0px) + 12px) 0;
width: 100%; width: 100%;
border-radius: 24px; border-radius: var(--radius-lg);
border-bottom-right-radius: 0; border-bottom-right-radius: 0;
border-bottom-left-radius: 0; border-bottom-left-radius: 0;
@ -526,7 +526,7 @@ onBeforeUnmount(() => {
&:before { &:before {
width: calc(100% - 24px); width: calc(100% - 24px);
border-radius: 12px; border-radius: var(--radius);
} }
> i, > i,

View file

@ -769,7 +769,7 @@ defineExpose({
.avatar { .avatar {
width: 1.2em; width: 1.2em;
height: 1.2em; height: 1.2em;
border-radius: 2em; border-radius: var(--radius-avatar);
overflow: hidden; overflow: hidden;
margin-right: 0.4em; margin-right: 0.4em;
background: var(--panelHighlight); background: var(--panelHighlight);
@ -843,7 +843,7 @@ defineExpose({
> * { > * {
padding: 16px; padding: 16px;
border: solid 1px var(--renote); border: solid 1px var(--renote);
border-radius: 8px; border-radius: var(--radius-sm);
transition: background 0.2s; transition: background 0.2s;
&:hover, &:hover,
&:focus-within { &:focus-within {
@ -893,12 +893,12 @@ defineExpose({
&:first-of-type { &:first-of-type {
margin-left: -0.5em; margin-left: -0.5em;
&::before { &::before {
border-radius: 100px 0 0 100px; border-radius: var(--radius-big) 0 0 var(--radius-big);
} }
} }
&:last-of-type { &:last-of-type {
&::before { &::before {
border-radius: 0 100px 100px 0; border-radius: 0 var(--radius-big) var(--radius-big) 0;
} }
} }
&:hover { &:hover {

View file

@ -77,7 +77,7 @@ const showTicker =
align-items: center; align-items: center;
white-space: nowrap; white-space: nowrap;
justify-self: flex-end; justify-self: flex-end;
border-radius: 100px; border-radius: var(--radius-big);
font-size: 0.8em; font-size: 0.8em;
> .avatar { > .avatar {
width: 3.7em; width: 3.7em;
@ -131,7 +131,7 @@ const showTicker =
padding: 1px 6px; padding: 1px 6px;
font-size: 80%; font-size: 80%;
border: solid 0.5px var(--divider); border: solid 0.5px var(--divider);
border-radius: 3px; border-radius: var(--radius-xss);
} }
&:hover { &:hover {

View file

@ -58,7 +58,7 @@ const props = defineProps<{
margin: 0 10px 0 0; margin: 0 10px 0 0;
width: 40px; width: 40px;
height: 40px; height: 40px;
border-radius: 8px; border-radius: var(--radius-sm);
pointer-events: none; pointer-events: none;
} }

View file

@ -52,7 +52,7 @@ const props = defineProps<{
margin: 0 10px 0 0; margin: 0 10px 0 0;
width: 40px; width: 40px;
height: 40px; height: 40px;
border-radius: 8px; border-radius: var(--radius-sm);
} }
> .main { > .main {

View file

@ -440,7 +440,7 @@ function noteClick(e) {
display: block; display: block;
width: 38px; width: 38px;
height: 38px; height: 38px;
border-radius: 8px; border-radius: var(--radius-sm);
} }
} }
@ -500,12 +500,12 @@ function noteClick(e) {
&:first-of-type { &:first-of-type {
margin-left: -0.5em; margin-left: -0.5em;
&::before { &::before {
border-radius: 100px 0 0 100px; border-radius: var(--radius-big) 0 0 var(--radius-big);
} }
} }
&:last-of-type { &:last-of-type {
&::before { &::before {
border-radius: 0 100px 100px 0; border-radius: 0 var(--radius-big) var(--radius-big) 0;
} }
} }
&:hover { &:hover {

View file

@ -429,7 +429,7 @@ useTooltip(reactionRef, (showing) => {
display: block; display: block;
width: 100%; width: 100%;
height: 100%; height: 100%;
border-radius: 6px; border-radius: var(--radius-s);
} }
> .sub-icon { > .sub-icon {
@ -440,7 +440,7 @@ useTooltip(reactionRef, (showing) => {
width: 20px; width: 20px;
height: 20px; height: 20px;
box-sizing: border-box; box-sizing: border-box;
border-radius: 100%; border-radius: var(--radius-full);
background: var(--panel); background: var(--panel);
box-shadow: 0 0 0 3px var(--panel); box-shadow: 0 0 0 3px var(--panel);
font-size: 12px; font-size: 12px;

View file

@ -72,7 +72,7 @@ onMounted(() => {
> .notification { > .notification {
height: 100%; height: 100%;
box-shadow: 0 4px 16px rgba(0, 0, 0, 0.3); box-shadow: 0 4px 16px rgba(0, 0, 0, 0.3);
border-radius: 8px; border-radius: var(--radius-sm);
overflow: hidden; overflow: hidden;
} }
} }

View file

@ -159,7 +159,7 @@ const vote = async (id) => {
padding: 4px; padding: 4px;
//border: solid 0.5px var(--divider); //border: solid 0.5px var(--divider);
background: var(--accentedBg); background: var(--accentedBg);
border-radius: 4px; border-radius: var(--radius-xs);
overflow: hidden; overflow: hidden;
cursor: pointer; cursor: pointer;
@ -182,7 +182,7 @@ const vote = async (id) => {
display: inline-block; display: inline-block;
padding: 3px 5px; padding: 3px 5px;
background: var(--panel); background: var(--panel);
border-radius: 3px; border-radius: var(--radius-xss);
> i { > i {
margin-right: 4px; margin-right: 4px;

View file

@ -48,7 +48,7 @@ let modal = $ref<InstanceType<typeof MkModal>>();
<style lang="scss" scoped> <style lang="scss" scoped>
.sfhdhdhq { .sfhdhdhq {
&.drawer { &.drawer {
border-radius: 24px; border-radius: var(--radius-lg);
border-bottom-right-radius: 0; border-bottom-right-radius: 0;
border-bottom-left-radius: 0; border-bottom-left-radius: 0;
} }

View file

@ -1110,7 +1110,7 @@ onMounted(() => {
font-size: inherit !important; font-size: inherit !important;
width: 34px; width: 34px;
height: 34px; height: 34px;
border-radius: 6px; border-radius: var(--radius-s);
&:hover { &:hover {
background: var(--X5); background: var(--X5);
@ -1129,7 +1129,7 @@ onMounted(() => {
line-height: 34px; line-height: 34px;
font-weight: bold; font-weight: bold;
vertical-align: bottom; vertical-align: bottom;
border-radius: 4px; border-radius: var(--radius-xs);
font-size: 0.9em; font-size: 0.9em;
&:disabled { &:disabled {
@ -1184,7 +1184,7 @@ onMounted(() => {
> button { > button {
padding: 2px; padding: 2px;
border-radius: 8px; border-radius: var(--radius-sm);
> i { > i {
transform: translateX(2px); transform: translateX(2px);
@ -1194,7 +1194,7 @@ onMounted(() => {
> span { > span {
margin: 0.3rem; margin: 0.3rem;
padding: 4px 0 4px 4px; padding: 4px 0 4px 4px;
border-radius: 999px; border-radius: var(--radius-ellipse);
background: var(--interactiveElementHovered); background: var(--interactiveElementHovered);
> button { > button {
@ -1265,7 +1265,7 @@ onMounted(() => {
font-size: 16px; font-size: 16px;
width: 40px; width: 40px;
height: 40px; height: 40px;
border-radius: 6px; border-radius: var(--radius-s);
&:hover { &:hover {
background: var(--postFormButtonHoverBg); background: var(--postFormButtonHoverBg);

View file

@ -173,7 +173,7 @@ function showFileMenu(file, ev: MouseEvent) {
width: 64px; width: 64px;
height: 64px; height: 64px;
margin-right: 4px; margin-right: 4px;
border-radius: 4px; border-radius: var(--radius-xs);
cursor: move; cursor: move;
&:hover > .remove { &:hover > .remove {

View file

@ -41,7 +41,7 @@ function quote(): void {
height: 32px; height: 32px;
margin: 2px; margin: 2px;
padding: 0 6px; padding: 0 6px;
border-radius: 4px; border-radius: var(--radius-xs);
&.renoted { &.renoted {
background: var(--accent); background: var(--accent);

View file

@ -82,7 +82,7 @@ onMounted(() => {
.tab { .tab {
padding: 4px 6px; padding: 4px 6px;
border: solid 1px var(--divider); border: solid 1px var(--divider);
border-radius: 6px; border-radius: var(--radius-s);
} }
.tabActive { .tabActive {

View file

@ -111,7 +111,7 @@ useTooltip(
content: ""; content: "";
position: absolute; position: absolute;
inset: 0 2px; inset: 0 2px;
border-radius: 4px; border-radius: var(--radius-xs);
z-index: -1; z-index: -1;
} }
&.newlyAdded { &.newlyAdded {

View file

@ -50,7 +50,7 @@ defineExpose({
background: var(--panel); background: var(--panel);
padding: 0.5em 0; padding: 0.5em 0;
font-size: 0.8em; font-size: 0.8em;
border-radius: 999px; border-radius: var(--radius-ellipse);
box-shadow: 0 2px 6px rgb(0 0 0 / 20%); box-shadow: 0 2px 6px rgb(0 0 0 / 20%);
width: 100%; width: 100%;
} }

View file

@ -384,7 +384,7 @@ function showSuspendedDialog() {
background: var(--accentedBg); background: var(--accentedBg);
background-position: center; background-position: center;
background-size: cover; background-size: cover;
border-radius: 100%; border-radius: var(--radius-full);
transition: background-image 0.2s ease-in; transition: background-image 0.2s ease-in;
} }
} }

View file

@ -303,7 +303,7 @@ function focusFooter(ev) {
} }
.reply-icon { .reply-icon {
display: inline-block; display: inline-block;
border-radius: 6px; border-radius: var(--radius-s);
padding: 0.2em 0.2em; padding: 0.2em 0.2em;
margin-right: 0.2em; margin-right: 0.2em;
color: var(--accent); color: var(--accent);
@ -357,7 +357,7 @@ function focusFooter(ev) {
} }
.reply-icon { .reply-icon {
display: inline-block; display: inline-block;
border-radius: 6px; border-radius: var(--radius-s);
padding: 0.2em 0.2em; padding: 0.2em 0.2em;
margin-right: 0.2em; margin-right: 0.2em;
color: var(--accent); color: var(--accent);
@ -384,7 +384,7 @@ function focusFooter(ev) {
> * { > * {
padding: 16px; padding: 16px;
border: solid 1px var(--renote); border: solid 1px var(--renote);
border-radius: 8px; border-radius: var(--radius-sm);
transition: background 0.2s; transition: background 0.2s;
&:hover, &:hover,
&:focus-within { &:focus-within {

View file

@ -155,7 +155,7 @@ export default defineComponent({
flex-direction: column; flex-direction: column;
padding: 18px 16px 16px 16px; padding: 18px 16px 16px 16px;
background: var(--panel); background: var(--panel);
border-radius: 8px; border-radius: var(--radius-sm);
text-align: center; text-align: center;
> .icon { > .icon {

View file

@ -118,7 +118,7 @@ export default defineComponent({
margin: 0; margin: 0;
margin-right: 8px; margin-right: 8px;
padding: 0.5em 1em; padding: 0.5em 1em;
border-radius: 100px; border-radius: var(--radius-big);
background: var(--buttonBg); background: var(--buttonBg);
> i { > i {
margin-top: -0.1em; margin-top: -0.1em;

View file

@ -314,7 +314,7 @@ const newPostsGlowOpacity = computed(
position: absolute; position: absolute;
top: 120%; top: 120%;
margin-inline: auto; margin-inline: auto;
border-radius: 2em; border-radius: var(--radius-avatar);
padding: 0.5em 1.2em; padding: 0.5em 1.2em;
background: var(--accentedBg); background: var(--accentedBg);
border: 0; border: 0;

View file

@ -64,7 +64,7 @@ onMounted(() => {
max-width: calc(100% - 32px); max-width: calc(100% - 32px);
width: min-content; width: min-content;
box-shadow: 0 4px 16px rgba(0, 0, 0, 0.3); box-shadow: 0 4px 16px rgba(0, 0, 0, 0.3);
border-radius: 8px; border-radius: var(--radius-sm);
overflow: clip; overflow: clip;
text-align: center; text-align: center;
pointer-events: none; pointer-events: none;

View file

@ -107,7 +107,7 @@ onUnmounted(() => {
padding: 8px 12px; padding: 8px 12px;
box-sizing: border-box; box-sizing: border-box;
text-align: center; text-align: center;
border-radius: 4px; border-radius: var(--radius-xs);
border: solid 0.5px var(--divider); border: solid 0.5px var(--divider);
pointer-events: none; pointer-events: none;
transform-origin: center center; transform-origin: center center;

View file

@ -84,7 +84,7 @@ console.log(data);
.releaseNotes { .releaseNotes {
> img { > img {
border-radius: 10px; border-radius: var(--radius-m);
} }
} }
</style> </style>

View file

@ -270,7 +270,7 @@ onUnmounted(() => {
width: 1.2em; width: 1.2em;
height: 1.2em; height: 1.2em;
vertical-align: middle; vertical-align: middle;
border-radius: 4px; border-radius: var(--radius-xs);
} }
&:hover, &:hover,
&:focus, &:focus,

View file

@ -63,7 +63,7 @@ if (props.withChart) {
align-items: center; align-items: center;
padding: 16px; padding: 16px;
background: var(--panel); background: var(--panel);
border-radius: 8px; border-radius: var(--radius-sm);
transition: background 0.2s; transition: background 0.2s;
> :global(.avatar) { > :global(.avatar) {

View file

@ -140,7 +140,7 @@ let collapsed = $ref(isLong);
color: #fff; color: #fff;
background: rgba(0, 0, 0, 0.7); background: rgba(0, 0, 0, 0.7);
font-size: 0.7em; font-size: 0.7em;
border-radius: 6px; border-radius: var(--radius-s);
} }
&.detailed::after { &.detailed::after {
content: ""; content: "";
@ -238,7 +238,7 @@ let collapsed = $ref(isLong);
background: var(--panel); background: var(--panel);
padding: 0.4em 1em; padding: 0.4em 1em;
font-size: 0.8em; font-size: 0.8em;
border-radius: 999px; border-radius: var(--radius-ellipse);
box-shadow: 0 2px 6px rgb(0 0 0 / 20%); box-shadow: 0 2px 6px rgb(0 0 0 / 20%);
} }
&:hover { &:hover {
@ -257,7 +257,7 @@ let collapsed = $ref(isLong);
background: var(--panel); background: var(--panel);
padding: 6px 10px; padding: 6px 10px;
font-size: 0.8em; font-size: 0.8em;
border-radius: 999px; border-radius: var(--radius-ellipse);
box-shadow: 0 0 7px 7px var(--bg); box-shadow: 0 0 7px 7px var(--bg);
} }
} }

View file

@ -28,7 +28,7 @@ const text = $computed(() => {
<style lang="scss" scoped> <style lang="scss" scoped>
.fzgwjkgc { .fzgwjkgc {
box-shadow: 0 0 0 3px var(--panel); box-shadow: 0 0 0 3px var(--panel);
border-radius: 120%; // Blink100% border-radius: var(--radius-online); // Blink100%
&.online { &.online {
background: #9ccfd8; background: #9ccfd8;

View file

@ -173,7 +173,7 @@ function choose(visibility: (typeof misskey.noteVisibilities)[number]): void {
&.asDrawer { &.asDrawer {
padding: 12px 0 calc(env(safe-area-inset-bottom, 0px) + 12px) 0; padding: 12px 0 calc(env(safe-area-inset-bottom, 0px) + 12px) 0;
width: 100%; width: 100%;
border-radius: 24px; border-radius: var(--radius-lg);
border-bottom-right-radius: 0; border-bottom-right-radius: 0;
border-bottom-left-radius: 0; border-bottom-left-radius: 0;
.icon { .icon {

View file

@ -202,7 +202,7 @@ function onContextmenu(widget: Widget, ev: MouseEvent) {
height: 32px; height: 32px;
color: #fff; color: #fff;
background: rgba(#000, 0.7); background: rgba(#000, 0.7);
border-radius: 4px; border-radius: var(--radius-xs);
} }
> .config { > .config {

View file

@ -82,7 +82,7 @@ const toggle = () => {
outline: none; outline: none;
background: var(--panel); background: var(--panel);
border: solid 1px var(--panel); border: solid 1px var(--panel);
border-radius: 4px; border-radius: var(--radius-xs);
cursor: pointer; cursor: pointer;
transition: inherit; transition: inherit;

View file

@ -27,7 +27,7 @@ defineProps<{
.dwzlatin { .dwzlatin {
display: block; display: block;
overflow: clip; overflow: clip;
border-radius: 6px; border-radius: var(--radius-sm);
> .header { > .header {
display: flex; display: flex;
@ -82,7 +82,7 @@ defineProps<{
> .body { > .body {
background: var(--panel); background: var(--panel);
border-radius: 0 0 6px 6px; border-radius: 0 0 var(--radius-s) var(--radius-s);
} }
} }
</style> </style>

View file

@ -226,7 +226,7 @@ defineExpose({
color: var(--fg); color: var(--fg);
background: var(--panel); background: var(--panel);
border: solid 1px var(--panel); border: solid 1px var(--panel);
border-radius: 6px; border-radius: var(--radius-sm);
outline: none; outline: none;
box-shadow: none; box-shadow: none;
box-sizing: border-box; box-sizing: border-box;

View file

@ -52,7 +52,7 @@ const props = defineProps<{
box-sizing: border-box; box-sizing: border-box;
padding: 10px 14px; padding: 10px 14px;
background: var(--buttonBg); background: var(--buttonBg);
border-radius: 6px; border-radius: var(--radius-sm);
font-size: 0.9em; font-size: 0.9em;
&:hover { &:hover {

View file

@ -45,7 +45,7 @@ function toggle(x) {
background-color: var(--panel); background-color: var(--panel);
background-clip: padding-box !important; background-clip: padding-box !important;
border: solid 1px var(--panel); border: solid 1px var(--panel);
border-radius: 6px; border-radius: var(--radius-sm);
transition: all 0.2s; transition: all 0.2s;
> * { > * {
@ -103,7 +103,7 @@ function toggle(x) {
height: 14px; height: 14px;
background: none; background: none;
border: solid 2px var(--inputBorder); border: solid 2px var(--inputBorder);
border-radius: 100%; border-radius: var(--radius-full);
transition: inherit; transition: inherit;
pointer-events: none; pointer-events: none;
@ -115,7 +115,7 @@ function toggle(x) {
right: 3px; right: 3px;
bottom: 3px; bottom: 3px;
left: 3px; left: 3px;
border-radius: 100%; border-radius: var(--radius-full);
opacity: 0; opacity: 0;
transform: scale(0); transform: scale(0);
transition: 0.4s cubic-bezier(0.25, 0.8, 0.25, 1); transition: 0.4s cubic-bezier(0.25, 0.8, 0.25, 1);

View file

@ -131,7 +131,7 @@ function tooltipHide() {
padding: 10px 12px; padding: 10px 12px;
background: var(--panel); background: var(--panel);
border: solid 1px var(--panel); border: solid 1px var(--panel);
border-radius: 6px; border-radius: var(--radius-sm);
> .container { > .container {
position: relative; position: relative;
@ -140,7 +140,7 @@ function tooltipHide() {
@mixin track { @mixin track {
height: 3px; height: 3px;
background: rgba(0, 0, 0, 0.1); background: rgba(0, 0, 0, 0.1);
border-radius: 999px; border-radius: var(--radius-ellipse);
} }
@mixin fill { @mixin fill {
@ -151,7 +151,7 @@ function tooltipHide() {
width: $thumbWidth; width: $thumbWidth;
height: $thumbHeight; height: $thumbHeight;
background: var(--accent); background: var(--accent);
border-radius: 999px; border-radius: var(--radius-ellipse);
&:hover { &:hover {
background: var(--accentLighten); background: var(--accentLighten);

View file

@ -245,7 +245,7 @@ function show(ev: MouseEvent) {
color: var(--fg); color: var(--fg);
background: var(--panel); background: var(--panel);
border: solid 1px var(--panel); border: solid 1px var(--panel);
border-radius: 6px; border-radius: var(--radius-s);
outline: none; outline: none;
box-shadow: none; box-shadow: none;
box-sizing: border-box; box-sizing: border-box;

View file

@ -65,7 +65,7 @@ function toggle(x) {
background: var(--swutchOffBg); background: var(--swutchOffBg);
background-clip: content-box; background-clip: content-box;
border: solid 1px var(--swutchOffBg); border: solid 1px var(--swutchOffBg);
border-radius: 999px; border-radius: var(--radius-ellipse);
transition: inherit; transition: inherit;
user-select: none; user-select: none;
pointer-events: none; pointer-events: none;
@ -78,7 +78,7 @@ function toggle(x) {
width: 15px; width: 15px;
height: 15px; height: 15px;
background: var(--swutchOffFg); background: var(--swutchOffFg);
border-radius: 999px; border-radius: var(--radius-ellipse);
transition: all 0.2s ease; transition: all 0.2s ease;
} }
} }

View file

@ -233,7 +233,7 @@ export default defineComponent({
color: var(--fg); color: var(--fg);
background: var(--panel); background: var(--panel);
border: solid 1px var(--panel); border: solid 1px var(--panel);
border-radius: 6px; border-radius: var(--radius-s);
outline: none; outline: none;
box-shadow: none; box-shadow: none;
box-sizing: border-box; box-sizing: border-box;

View file

@ -129,7 +129,7 @@ watch(
display: inline-block; display: inline-block;
vertical-align: bottom; vertical-align: bottom;
flex-shrink: 0; flex-shrink: 0;
border-radius: 100%; border-radius: var(--radius-full);
line-height: 16px; line-height: 16px;
> .inner { > .inner {
@ -138,7 +138,7 @@ watch(
left: 0; left: 0;
right: 0; right: 0;
top: 0; top: 0;
border-radius: 100%; border-radius: var(--radius-full);
z-index: 1; z-index: 1;
overflow: hidden; overflow: hidden;
object-fit: cover; object-fit: cover;
@ -156,10 +156,10 @@ watch(
} }
&.square { &.square {
border-radius: 20%; border-radius: var(--radius-avatar-2);
> .inner { > .inner {
border-radius: 20%; border-radius: var(--radius-avatar-2);
} }
} }
@ -176,12 +176,12 @@ watch(
} }
&:before { &:before {
border-radius: 0 75% 75%; border-radius: 0 var(--radius-avatar3) var(--radius-avatar3);
transform: rotate(37.5deg) skew(30deg); transform: rotate(37.5deg) skew(30deg);
} }
&:after { &:after {
border-radius: 75% 0 75% 75%; border-radius: var(--radius-avatar3) 0 var(--radius-avatar3) var(--radius-avatar3);
transform: rotate(-37.5deg) skew(-30deg); transform: rotate(-37.5deg) skew(-30deg);
} }

View file

@ -40,7 +40,7 @@ import { instance } from "@/instance";
vertical-align: bottom; vertical-align: bottom;
height: 128px; height: 128px;
margin-bottom: 16px; margin-bottom: 16px;
border-radius: 16px; border-radius: var(--radius-md);
} }
} }
</style> </style>

View file

@ -564,7 +564,7 @@ onUnmounted(() => {
left: 0; left: 0;
height: 3px; height: 3px;
background: var(--accent); background: var(--accent);
border-radius: 999px; border-radius: var(--radius-ellipse);
transition: transition:
width 0.2s, width 0.2s,
transform 0.2s; transform 0.2s;

View file

@ -102,7 +102,7 @@ export default defineComponent({
.ngbfujlo { .ngbfujlo {
position: relative; position: relative;
padding: 32px; padding: 32px;
border-radius: 6px; border-radius: var(--radius-s);
box-shadow: 0 2px 8px var(--shadow); box-shadow: 0 2px 8px var(--shadow);
z-index: 1; z-index: 1;

View file

@ -103,7 +103,7 @@ definePageMetadata({
vertical-align: bottom; vertical-align: bottom;
height: 128px; height: 128px;
margin-bottom: 24px; margin-bottom: 24px;
border-radius: 16px; border-radius: var(--radius-md);
} }
> .error { > .error {

View file

@ -212,7 +212,7 @@ definePageMetadata({
display: block; display: block;
width: 250px; width: 250px;
margin: 0 auto; margin: 0 auto;
border-radius: 5px; border-radius: var(--radius-x);
} }
> .misskey { > .misskey {

View file

@ -146,7 +146,7 @@ export default defineComponent({
padding: 4px 8px; padding: 4px 8px;
font-size: 0.9em; font-size: 0.9em;
background: var(--accentedBg); background: var(--accentedBg);
border-radius: 5px; border-radius: var(--radius-x);
&.active { &.active {
background: var(--accent); background: var(--accent);

View file

@ -429,7 +429,7 @@ function syncSlide(index) {
.fwhjspax { .fwhjspax {
text-align: center; text-align: center;
border-radius: 10px; border-radius: var(--radius-m);
overflow: clip; overflow: clip;
background-size: cover; background-size: cover;
background-position: center center; background-position: center center;
@ -441,7 +441,7 @@ function syncSlide(index) {
display: block; display: block;
margin: 16px auto 0 auto; margin: 16px auto 0 auto;
height: 64px; height: 64px;
border-radius: 8px; border-radius: var(--radius-sm);
&.noAnimation { &.noAnimation {
animation: none; animation: none;

View file

@ -226,7 +226,7 @@ onUnmounted(() => {
width: calc(var(--height) - (var(--margin) * 2)); width: calc(var(--height) - (var(--margin) * 2));
box-sizing: border-box; box-sizing: border-box;
position: relative; position: relative;
border-radius: 5px; border-radius: var(--radius-x);
&:hover { &:hover {
background: rgba(0, 0, 0, 0.05); background: rgba(0, 0, 0, 0.05);
@ -329,7 +329,7 @@ onUnmounted(() => {
bottom: 0; bottom: 0;
height: 3px; height: 3px;
background: var(--accent); background: var(--accent);
border-radius: 999px; border-radius: var(--radius-ellipse);
transition: all 0.2s ease; transition: all 0.2s ease;
pointer-events: none; pointer-events: none;
} }

View file

@ -437,7 +437,7 @@ defineExpose({
display: block; display: block;
margin: auto; margin: auto;
height: 42px; height: 42px;
border-radius: 8px; border-radius: var(--radius-sm);
} }
} }
} }

View file

@ -175,7 +175,7 @@ onMounted(async () => {
margin-right: 12px; margin-right: 12px;
background: var(--accentedBg); background: var(--accentedBg);
color: var(--accent); color: var(--accent);
border-radius: 10px; border-radius: var(--radius-m);
} }
&.sub { &.sub {

View file

@ -155,7 +155,7 @@ onMounted(async () => {
margin-right: 12px; margin-right: 12px;
background: var(--accentedBg); background: var(--accentedBg);
color: var(--accent); color: var(--accent);
border-radius: 10px; border-radius: var(--radius-m);
} }
&.users { &.users {

View file

@ -90,7 +90,7 @@ definePageMetadata({
display: block; display: block;
max-height: 300px; max-height: 300px;
max-width: 100%; max-width: 100%;
border-radius: 10px; border-radius: var(--radius-m);
margin-top: 1rem; margin-top: 1rem;
} }
} }

View file

@ -182,7 +182,7 @@ definePageMetadata(
height: 48px; height: 48px;
color: #fff; color: #fff;
background: rgba(0, 0, 0, 0.5); background: rgba(0, 0, 0, 0.5);
border-radius: 100%; border-radius: var(--radius-full);
> i { > i {
vertical-align: middle; vertical-align: middle;
@ -212,7 +212,7 @@ definePageMetadata(
padding: 8px 12px; padding: 8px 12px;
font-size: 80%; font-size: 80%;
background: rgba(0, 0, 0, 0.7); background: rgba(0, 0, 0, 0.7);
border-radius: 6px; border-radius: var(--radius-s);
color: #fff; color: #fff;
} }
} }

View file

@ -60,7 +60,7 @@ function menu(ev) {
padding: 12px; padding: 12px;
text-align: left; text-align: left;
background: var(--panel); background: var(--panel);
border-radius: 8px; border-radius: var(--radius-sm);
&:hover { &:hover {
border-color: var(--accent); border-color: var(--accent);

View file

@ -136,7 +136,7 @@ definePageMetadata(
margin: 0 12px 0 0; margin: 0 12px 0 0;
width: 42px; width: 42px;
height: 42px; height: 42px;
border-radius: 8px; border-radius: var(--radius-sm);
} }
> .body { > .body {

View file

@ -265,7 +265,7 @@ definePageMetadata(
max-width: 100%; max-width: 100%;
max-height: 500px; max-height: 500px;
margin: 0 auto; margin: 0 auto;
border-radius: 10px; border-radius: var(--radius-m);
} }
& + .file { & + .file {

View file

@ -534,7 +534,7 @@ function syncSlide(index) {
display: block; display: block;
margin: 0 16px 0 0; margin: 0 16px 0 0;
height: 64px; height: 64px;
border-radius: 8px; border-radius: var(--radius-sm);
} }
> .name { > .name {

View file

@ -110,7 +110,7 @@ definePageMetadata({
padding: 13px; padding: 13px;
margin-right: 10px; margin-right: 10px;
border: solid 1px var(--divider); border: solid 1px var(--divider);
border-radius: 6px; border-radius: var(--radius-s);
&:hover { &:hover {
border: solid 1px var(--accent); border: solid 1px var(--accent);
@ -123,7 +123,7 @@ definePageMetadata({
padding: 16px; padding: 16px;
margin-bottom: 8px; margin-bottom: 8px;
border: solid 1px var(--divider); border: solid 1px var(--divider);
border-radius: 6px; border-radius: var(--radius-s);
&:hover { &:hover {
border: solid 1px var(--accent); border: solid 1px var(--accent);

View file

@ -99,7 +99,7 @@ definePageMetadata({
display: block; display: block;
padding: 16px; padding: 16px;
border: solid 1px var(--divider); border: solid 1px var(--divider);
border-radius: 6px; border-radius: var(--radius-s);
&:hover { &:hover {
border: solid 1px var(--accent); border: solid 1px var(--accent);

View file

@ -32,7 +32,7 @@ import {instance} from "@/instance";
vertical-align: bottom; vertical-align: bottom;
height: 128px; height: 128px;
margin-bottom: 16px; margin-bottom: 16px;
border-radius: 16px; border-radius: var(--radius-md);
} }
} }
</style> </style>

View file

@ -169,7 +169,7 @@ definePageMetadata(
> .load { > .load {
min-width: 0; min-width: 0;
margin: 0 auto; margin: 0 auto;
border-radius: 999px; border-radius: var(--radius-ellipse);
&.next { &.next {
margin-bottom: var(--margin); margin-bottom: var(--margin);

View file

@ -94,7 +94,7 @@ export default defineComponent({
overflow: hidden; overflow: hidden;
background: var(--panel); background: var(--panel);
border: solid 2px var(--divider); border: solid 2px var(--divider);
border-radius: 6px; border-radius: var(--radius-s);
&:hover { &:hover {
border: solid 2px var(--dividerHovered); border: solid 2px var(--dividerHovered);

View file

@ -364,7 +364,7 @@ definePageMetadata(
backdrop-filter: var(--blur, blur(8px)); backdrop-filter: var(--blur, blur(8px));
background: rgba(0, 0, 0, 0.2); background: rgba(0, 0, 0, 0.2);
padding: 8px; padding: 8px;
border-radius: 24px; border-radius: var(--radius-lg);
width: fit-content; width: fit-content;
position: relative; position: relative;
top: -10px; top: -10px;

View file

@ -94,7 +94,7 @@ const ok = () => {
.qr { .qr {
width: 20em; width: 20em;
max-width: 100%; max-width: 100%;
border-radius: 10px; border-radius: var(--radius-m);
border: 3px solid var(--accent); border: 3px solid var(--accent);
} }
</style> </style>

View file

@ -99,7 +99,7 @@ definePageMetadata({
margin: 0 12px 0 0; margin: 0 12px 0 0;
width: 50px; width: 50px;
height: 50px; height: 50px;
border-radius: 8px; border-radius: var(--radius-sm);
} }
> .body { > .body {

View file

@ -311,7 +311,7 @@ definePageMetadata({
background-size: cover; background-size: cover;
background-position: center; background-position: center;
border: solid 1px var(--divider); border: solid 1px var(--divider);
border-radius: 10px; border-radius: var(--radius-m);
overflow: clip; overflow: clip;
> .avatar { > .avatar {

View file

@ -283,7 +283,7 @@ definePageMetadata({
<style lang="scss" scoped> <style lang="scss" scoped>
.rfqxtzch { .rfqxtzch {
border-radius: 6px; border-radius: var(--radius-s);
> .toggle { > .toggle {
position: relative; position: relative;
@ -363,7 +363,7 @@ definePageMetadata({
background-color: #e8cda5; background-color: #e8cda5;
opacity: 0; opacity: 0;
transition: opacity 200ms ease-in-out !important; transition: opacity 200ms ease-in-out !important;
border-radius: 100%; border-radius: var(--radius-full);
} }
.crater--1 { .crater--1 {
@ -392,7 +392,7 @@ definePageMetadata({
position: absolute; position: absolute;
background-color: #ffffff; background-color: #ffffff;
transition: all 300ms cubic-bezier(0.445, 0.05, 0.55, 0.95) !important; transition: all 300ms cubic-bezier(0.445, 0.05, 0.55, 0.95) !important;
border-radius: 50%; border-radius: var(--radius-common);
} }
.star--1 { .star--1 {

View file

@ -366,7 +366,7 @@ definePageMetadata({
position: relative; position: relative;
width: 64px; width: 64px;
height: 64px; height: 64px;
border-radius: 8px; border-radius: var(--radius-sm);
> .preview { > .preview {
position: absolute; position: absolute;
@ -377,7 +377,7 @@ definePageMetadata({
margin: auto; margin: auto;
width: 42px; width: 42px;
height: 42px; height: 42px;
border-radius: 4px; border-radius: var(--radius-xs);
box-shadow: 0 2px 4px rgb(0 0 0 / 30%); box-shadow: 0 2px 4px rgb(0 0 0 / 30%);
transition: transform 0.15s ease; transition: transform 0.15s ease;
} }
@ -393,10 +393,10 @@ definePageMetadata({
} }
&.rounded { &.rounded {
border-radius: 999px; border-radius: var(--radius-ellipse);
> .preview { > .preview {
border-radius: 999px; border-radius: var(--radius-ellipse);
} }
} }

Some files were not shown because too many files have changed in this diff Show more