mirror of
https://iceshrimp.dev/limepotato/jormungandr-bite.git
synced 2024-11-21 17:37:29 -07:00
parent
ad6d0f0a43
commit
5252a3d7c7
124 changed files with 292 additions and 216 deletions
|
@ -6,3 +6,56 @@
|
|||
* 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% //
|
||||
}
|
||||
*/
|
||||
|
|
|
@ -32,7 +32,7 @@ html {
|
|||
}
|
||||
main {
|
||||
background: #1f1d2e;
|
||||
border-radius: 10px;
|
||||
border-radius: var(--radius);
|
||||
}
|
||||
#tl > div {
|
||||
padding: 16px;
|
||||
|
@ -58,7 +58,7 @@ html {
|
|||
text-align: center;
|
||||
}
|
||||
button {
|
||||
border-radius: 999px;
|
||||
border-radius: var(--radius-ellipse);
|
||||
padding: 0px 12px 0px 12px;
|
||||
border: none;
|
||||
cursor: pointer;
|
||||
|
@ -71,7 +71,7 @@ button {
|
|||
padding: 12px;
|
||||
}
|
||||
button {
|
||||
border-radius: 999px;
|
||||
border-radius: var(--radius-ellipse);
|
||||
padding: 0px 12px 0px 12px;
|
||||
border: none;
|
||||
cursor: pointer;
|
||||
|
@ -118,7 +118,7 @@ code {
|
|||
textarea {
|
||||
background-color: #444;
|
||||
border: solid #aaa;
|
||||
border-radius: 10px;
|
||||
border-radius: var(--radius-ellipse);
|
||||
color: #e0def4;
|
||||
margin-top: 1rem;
|
||||
margin-bottom: 1rem;
|
||||
|
@ -133,7 +133,7 @@ textarea:focus {
|
|||
input {
|
||||
background-color: #666;
|
||||
border: solid #aaa;
|
||||
border-radius: 10px;
|
||||
border-radius: var(--radius-ellipse);
|
||||
color: #e0def4;
|
||||
margin-top: 1rem;
|
||||
margin-bottom: 1rem;
|
||||
|
|
|
@ -201,7 +201,7 @@
|
|||
}
|
||||
|
||||
button {
|
||||
border-radius: 999px;
|
||||
border-radius: var(--radius-ellipse);
|
||||
padding: 0px 12px 0px 12px;
|
||||
border: none;
|
||||
cursor: pointer;
|
||||
|
@ -273,7 +273,7 @@
|
|||
margin-bottom: 2rem;
|
||||
padding: 0.5rem 1rem;
|
||||
width: 40rem;
|
||||
border-radius: 10px;
|
||||
border-radius: var(--radius);
|
||||
justify-content: center;
|
||||
margin: auto;
|
||||
}
|
||||
|
|
|
@ -3,11 +3,11 @@ html {
|
|||
}
|
||||
main {
|
||||
background: #1f1d2e;
|
||||
border-radius: 10px;
|
||||
border-radius: var(--radius);
|
||||
}
|
||||
#tl > div {
|
||||
border: 1px solid #908caa;
|
||||
border-radius: 10px;
|
||||
border-radius: var(--radius);
|
||||
margin: 10px;
|
||||
padding: 10px;
|
||||
width: fit-content;
|
||||
|
@ -18,7 +18,7 @@ main {
|
|||
}
|
||||
|
||||
img {
|
||||
border-radius: 10px;
|
||||
border-radius: var(--radius);
|
||||
margin-right: 10px;
|
||||
}
|
||||
|
||||
|
@ -40,7 +40,7 @@ html {
|
|||
padding: 10px;
|
||||
}
|
||||
button {
|
||||
border-radius:999px;
|
||||
border-radius:var(--radius-ellipse);
|
||||
padding:0 40px;
|
||||
margin-top: 1rem;
|
||||
border:none;
|
||||
|
@ -73,7 +73,7 @@ code {
|
|||
#text {
|
||||
background-color: #444;
|
||||
border: solid #aaa;
|
||||
border-radius: 10px;
|
||||
border-radius: var(--radius);
|
||||
color: #e0def4;
|
||||
margin-top: 3rem;
|
||||
width: 20rem;
|
||||
|
|
|
@ -45,8 +45,8 @@ export async function sendEmail(
|
|||
<title>${subject}</title>
|
||||
</head>
|
||||
<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;">
|
||||
<header style="padding: 32px; background: #31748f; color: #e0def4; display: flex; 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: var(--radius-lg);">
|
||||
<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>
|
||||
</header>
|
||||
|
|
|
@ -108,7 +108,7 @@ function resolve() {
|
|||
box-sizing: border-box;
|
||||
align-items: center;
|
||||
padding: 14px;
|
||||
border-radius: 8px;
|
||||
border-radius: var(--radius-sm);
|
||||
--c: rgb(255 196 0 / 15%);
|
||||
background-image: linear-gradient(
|
||||
45deg,
|
||||
|
|
|
@ -61,7 +61,7 @@ const gotIt = () => {
|
|||
border-radius: var(--radius);
|
||||
|
||||
> img {
|
||||
border-radius: 10px;
|
||||
border-radius: var(--radius);
|
||||
max-height: 100%;
|
||||
max-width: 100%;
|
||||
}
|
||||
|
|
|
@ -530,7 +530,7 @@ onBeforeUnmount(() => {
|
|||
max-width: 28px;
|
||||
max-height: 28px;
|
||||
margin: 0 8px 0 0;
|
||||
border-radius: 100%;
|
||||
border-radius: var(--radius-full);
|
||||
}
|
||||
|
||||
.name {
|
||||
|
|
|
@ -58,7 +58,7 @@ async function onClick() {
|
|||
font-size: 16px;
|
||||
width: 2em;
|
||||
height: 2em;
|
||||
border-radius: 100px;
|
||||
border-radius: var(--radius-big);
|
||||
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: 32px;
|
||||
border-radius: var(--radius-xl);
|
||||
}
|
||||
}
|
||||
|
||||
|
|
|
@ -121,7 +121,7 @@ function onMousedown(evt: MouseEvent): void {
|
|||
box-shadow: none;
|
||||
text-decoration: none;
|
||||
background: var(--buttonBg);
|
||||
border-radius: 5px;
|
||||
border-radius: var(--radius-x);
|
||||
overflow: clip;
|
||||
box-sizing: border-box;
|
||||
transition: background 0.1s ease;
|
||||
|
@ -141,7 +141,7 @@ function onMousedown(evt: MouseEvent): void {
|
|||
}
|
||||
|
||||
&.rounded {
|
||||
border-radius: 999px;
|
||||
border-radius: var(--radius-ellipse);
|
||||
}
|
||||
|
||||
&.primary {
|
||||
|
@ -196,14 +196,14 @@ function onMousedown(evt: MouseEvent): void {
|
|||
&.mini {
|
||||
padding: 4px 8px;
|
||||
font-size: max(12px, 0.9em);
|
||||
border-radius: 100px;
|
||||
border-radius: var(--radius-big);
|
||||
}
|
||||
|
||||
&.chip {
|
||||
padding: 4px 12px;
|
||||
font-size: max(12px, 0.9em);
|
||||
min-width: unset;
|
||||
border-radius: 100px;
|
||||
border-radius: var(--radius-big);
|
||||
}
|
||||
|
||||
&:disabled {
|
||||
|
@ -227,14 +227,14 @@ function onMousedown(evt: MouseEvent): void {
|
|||
left: 0;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
border-radius: 6px;
|
||||
border-radius: var(--radius-s);
|
||||
overflow: hidden;
|
||||
|
||||
::v-deep(div) {
|
||||
position: absolute;
|
||||
width: 2px;
|
||||
height: 2px;
|
||||
border-radius: 100%;
|
||||
border-radius: var(--radius-full);
|
||||
background: rgba(0, 0, 0, 0.1);
|
||||
opacity: 1;
|
||||
transform: scale(1);
|
||||
|
|
|
@ -74,7 +74,7 @@ async function onClick() {
|
|||
padding: 0;
|
||||
height: 31px;
|
||||
font-size: 16px;
|
||||
border-radius: 32px;
|
||||
border-radius: var(--radius-xl);
|
||||
background: #fff;
|
||||
|
||||
&.full {
|
||||
|
@ -96,7 +96,7 @@ async function onClick() {
|
|||
bottom: -5px;
|
||||
left: -5px;
|
||||
border: 2px solid var(--focus);
|
||||
border-radius: 32px;
|
||||
border-radius: var(--radius-xl);
|
||||
}
|
||||
}
|
||||
|
||||
|
|
|
@ -102,7 +102,7 @@ const bannerStyle = computed(() => {
|
|||
background: rgba(0, 0, 0, 0.2);
|
||||
color: #fff;
|
||||
font-size: 1.2em;
|
||||
border-radius: 999px;
|
||||
border-radius: var(--radius-ellipse);
|
||||
}
|
||||
|
||||
> .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: 6px;
|
||||
border-radius: var(--radius-s);
|
||||
color: #fff;
|
||||
}
|
||||
}
|
||||
|
|
|
@ -145,7 +145,7 @@ function isMe(message): boolean {
|
|||
width: 54px;
|
||||
height: 54px;
|
||||
margin: 0 16px 0 0;
|
||||
border-radius: 8px;
|
||||
border-radius: var(--radius-sm);
|
||||
transition: all 0.1s ease;
|
||||
}
|
||||
|
||||
|
|
|
@ -266,7 +266,7 @@ export default defineComponent({
|
|||
background: var(--panel);
|
||||
padding: 6px 10px;
|
||||
font-size: 0.8em;
|
||||
border-radius: 999px;
|
||||
border-radius: var(--radius-ellipse);
|
||||
box-shadow: 0 2px 6px rgb(0 0 0 / 20%);
|
||||
}
|
||||
|
||||
|
|
|
@ -74,7 +74,7 @@ defineExpose({
|
|||
display: inline-block;
|
||||
padding: 0.5em 0;
|
||||
font-size: 0.8em;
|
||||
border-radius: 999px;
|
||||
border-radius: var(--radius-ellipse);
|
||||
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: 999px;
|
||||
border-radius: var(--radius-ellipse);
|
||||
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: 999px;
|
||||
border-radius: var(--radius-ellipse);
|
||||
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: 2px;
|
||||
border-radius: var(--radius-xxs);
|
||||
|
||||
&:hover {
|
||||
background: var(--cwHoverBg);
|
||||
|
|
|
@ -224,7 +224,7 @@ async function deleteFile() {
|
|||
position: relative;
|
||||
padding: 8px 0 0 0;
|
||||
min-height: 180px;
|
||||
border-radius: 8px;
|
||||
border-radius: var(--radius-sm);
|
||||
|
||||
&,
|
||||
* {
|
||||
|
|
|
@ -291,7 +291,7 @@ function onContextmenu(ev: MouseEvent) {
|
|||
padding: 8px;
|
||||
height: 64px;
|
||||
background: var(--driveFolderBg);
|
||||
border-radius: 4px;
|
||||
border-radius: var(--radius-xs);
|
||||
|
||||
&,
|
||||
* {
|
||||
|
@ -326,7 +326,7 @@ function onContextmenu(ev: MouseEvent) {
|
|||
bottom: -4px;
|
||||
left: -4px;
|
||||
border: 2px dashed var(--focus);
|
||||
border-radius: 4px;
|
||||
border-radius: var(--radius-xs);
|
||||
}
|
||||
}
|
||||
|
||||
|
|
|
@ -86,7 +86,7 @@ const isThumbnailAvailable = computed(() => {
|
|||
position: relative;
|
||||
display: flex;
|
||||
background: var(--panel);
|
||||
border-radius: 8px;
|
||||
border-radius: var(--radius-sm);
|
||||
overflow: clip;
|
||||
border: 0;
|
||||
padding: 0;
|
||||
|
|
|
@ -668,7 +668,7 @@ defineExpose({
|
|||
width: var(--eachSize);
|
||||
height: var(--eachSize);
|
||||
contain: strict;
|
||||
border-radius: 4px;
|
||||
border-radius: var(--radius-xs);
|
||||
font-size: 24px;
|
||||
|
||||
&:focus-visible {
|
||||
|
|
|
@ -82,7 +82,7 @@ function opening() {
|
|||
<style lang="scss" scoped>
|
||||
.ryghynhb {
|
||||
&.drawer {
|
||||
border-radius: 24px;
|
||||
border-radius: var(--radius-lg);
|
||||
border-bottom-right-radius: 0;
|
||||
border-bottom-left-radius: 0;
|
||||
}
|
||||
|
|
|
@ -132,7 +132,7 @@ const props = defineProps<{
|
|||
padding: 2px 4px;
|
||||
background: #ff0000bf;
|
||||
color: #fff;
|
||||
border-radius: 4px;
|
||||
border-radius: var(--radius-xs);
|
||||
font-size: 85%;
|
||||
animation: sensitive-blink 1s infinite;
|
||||
}
|
||||
|
|
|
@ -193,7 +193,7 @@ onBeforeUnmount(() => {
|
|||
font-size: 16px;
|
||||
width: 2em;
|
||||
height: 2em;
|
||||
border-radius: 100px;
|
||||
border-radius: var(--radius-big);
|
||||
background: var(--bg);
|
||||
vertical-align: middle;
|
||||
margin-left: 0.5em;
|
||||
|
@ -227,7 +227,7 @@ onBeforeUnmount(() => {
|
|||
bottom: -5px;
|
||||
left: -5px;
|
||||
border: 2px solid var(--focus);
|
||||
border-radius: 32px;
|
||||
border-radius: var(--radius-xl);
|
||||
}
|
||||
}
|
||||
|
||||
|
|
|
@ -39,9 +39,9 @@ const search = () => {
|
|||
height: 40px;
|
||||
font-size: 16px;
|
||||
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-border-radius: 4px 0 0 4px;
|
||||
-webkit-border-radius: var(--radius-xs) 0 0 var(--radius-xs);
|
||||
}
|
||||
|
||||
> button {
|
||||
|
@ -50,7 +50,7 @@ const search = () => {
|
|||
padding: 0 16px;
|
||||
border: solid 1px var(--divider);
|
||||
border-left: none;
|
||||
border-radius: 0 4px 4px 0;
|
||||
border-radius: 0 var(--radius-xs) var(--radius-xs) 0;
|
||||
|
||||
&:active {
|
||||
box-shadow: 0 2px 4px rgba(#000, 0.15) inset;
|
||||
|
|
|
@ -59,7 +59,7 @@ const modal = $ref<InstanceType<typeof MkModal>>();
|
|||
padding: 6px 9px;
|
||||
font-size: 90%;
|
||||
background: rgba(0, 0, 0, 0.5);
|
||||
border-radius: 6px;
|
||||
border-radius: var(--radius-s);
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
|
|
|
@ -63,14 +63,14 @@ function getInstanceIcon(instance): string {
|
|||
align-items: center;
|
||||
padding: 16px;
|
||||
background: var(--panel);
|
||||
border-radius: 8px;
|
||||
border-radius: var(--radius-sm);
|
||||
|
||||
> :global(.icon) {
|
||||
display: block;
|
||||
width: ($bodyTitleHieght + $bodyInfoHieght);
|
||||
height: ($bodyTitleHieght + $bodyInfoHieght);
|
||||
object-fit: cover;
|
||||
border-radius: 4px;
|
||||
border-radius: var(--radius-xs);
|
||||
margin-right: 10px;
|
||||
}
|
||||
|
||||
|
|
|
@ -66,7 +66,7 @@ function getInstanceIcon(instance): string {
|
|||
height: 1.1em;
|
||||
justify-self: flex-end;
|
||||
padding: 0.2em 0.4em;
|
||||
border-radius: 100px;
|
||||
border-radius: var(--radius-big);
|
||||
font-size: 0.8em;
|
||||
text-shadow: 0 2px 2px var(--shadow);
|
||||
overflow: hidden;
|
||||
|
@ -77,7 +77,7 @@ function getInstanceIcon(instance): string {
|
|||
|
||||
> .icon {
|
||||
height: 100%;
|
||||
border-radius: 0.3rem;
|
||||
border-radius: var(--radius-icon);
|
||||
}
|
||||
|
||||
> .name {
|
||||
|
|
|
@ -123,12 +123,11 @@ function close() {
|
|||
overflow: auto;
|
||||
overscroll-behavior: contain;
|
||||
text-align: left;
|
||||
border-radius: 16px;
|
||||
|
||||
border-radius: var(--radius-md);
|
||||
&.asDrawer {
|
||||
width: 100%;
|
||||
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-left-radius: 0;
|
||||
text-align: center;
|
||||
|
@ -151,7 +150,7 @@ function close() {
|
|||
justify-content: center;
|
||||
vertical-align: bottom;
|
||||
height: 100px;
|
||||
border-radius: 10px;
|
||||
border-radius: var(--radius-m);
|
||||
|
||||
&:hover,
|
||||
&:focus-visible {
|
||||
|
|
|
@ -186,7 +186,7 @@ watch(
|
|||
display: flex;
|
||||
gap: 4px;
|
||||
position: absolute;
|
||||
border-radius: 6px;
|
||||
border-radius: var(--radius-s);
|
||||
overflow: hidden;
|
||||
top: 12px;
|
||||
right: 12px;
|
||||
|
@ -217,7 +217,7 @@ watch(
|
|||
|
||||
> .gif {
|
||||
background-color: var(--fg);
|
||||
border-radius: 6px;
|
||||
border-radius: var(--radius-s);
|
||||
color: var(--accentLighten);
|
||||
display: inline-block;
|
||||
font-size: 14px;
|
||||
|
|
|
@ -85,7 +85,7 @@ onMounted(() => {
|
|||
<style lang="scss" scoped>
|
||||
.mk-media-banner {
|
||||
width: 100%;
|
||||
border-radius: 4px;
|
||||
border-radius: var(--radius-xs);
|
||||
margin-top: 4px;
|
||||
overflow: hidden;
|
||||
--plyr-color-main: var(--accent);
|
||||
|
|
|
@ -294,7 +294,7 @@ export default defineComponent({
|
|||
padding: 6px 9px;
|
||||
font-size: 90%;
|
||||
background: rgba(0, 0, 0, 0.5);
|
||||
border-radius: 6px;
|
||||
border-radius: var(--radius-s);
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
|
|
|
@ -243,7 +243,7 @@ const previewableCount = props.mediaList.filter((media) =>
|
|||
> div,
|
||||
> button {
|
||||
overflow: hidden;
|
||||
border-radius: 6px;
|
||||
border-radius: var(--radius-s);
|
||||
pointer-events: all;
|
||||
min-height: 50px;
|
||||
}
|
||||
|
@ -297,7 +297,7 @@ const previewableCount = props.mediaList.filter((media) =>
|
|||
text-align: center;
|
||||
padding: 10px;
|
||||
background: rgba(0, 0, 0, 0.5);
|
||||
border-radius: 5px;
|
||||
border-radius: var(--radius-x);;
|
||||
|
||||
max-height: 10vh;
|
||||
overflow-x: clip;
|
||||
|
|
|
@ -63,7 +63,7 @@ const isMe =
|
|||
display: inline-block;
|
||||
padding: 2px 8px 2px 2px;
|
||||
margin-block: 2px;
|
||||
border-radius: 999px;
|
||||
border-radius: var(--radius-ellipse);
|
||||
max-width: 100%;
|
||||
white-space: nowrap;
|
||||
text-overflow: ellipsis;
|
||||
|
@ -90,7 +90,7 @@ const isMe =
|
|||
object-fit: cover;
|
||||
margin: 0 0.2em 0 0;
|
||||
vertical-align: bottom;
|
||||
border-radius: 100%;
|
||||
border-radius: var(--radius-full);
|
||||
}
|
||||
|
||||
> .main > .host {
|
||||
|
|
|
@ -376,7 +376,7 @@ onBeforeUnmount(() => {
|
|||
width: calc(100% - 16px);
|
||||
margin-bottom: 0.2rem;
|
||||
height: 100%;
|
||||
border-radius: 6px;
|
||||
border-radius: var(--radius-s);
|
||||
}
|
||||
|
||||
> * {
|
||||
|
@ -516,7 +516,7 @@ onBeforeUnmount(() => {
|
|||
&.asDrawer {
|
||||
padding: 12px 0 calc(env(safe-area-inset-bottom, 0px) + 12px) 0;
|
||||
width: 100%;
|
||||
border-radius: 24px;
|
||||
border-radius: var(--radius-lg);
|
||||
border-bottom-right-radius: 0;
|
||||
border-bottom-left-radius: 0;
|
||||
|
||||
|
@ -526,7 +526,7 @@ onBeforeUnmount(() => {
|
|||
|
||||
&:before {
|
||||
width: calc(100% - 24px);
|
||||
border-radius: 12px;
|
||||
border-radius: var(--radius);
|
||||
}
|
||||
|
||||
> i,
|
||||
|
|
|
@ -769,7 +769,7 @@ defineExpose({
|
|||
.avatar {
|
||||
width: 1.2em;
|
||||
height: 1.2em;
|
||||
border-radius: 2em;
|
||||
border-radius: var(--radius-avatar);
|
||||
overflow: hidden;
|
||||
margin-right: 0.4em;
|
||||
background: var(--panelHighlight);
|
||||
|
@ -843,7 +843,7 @@ defineExpose({
|
|||
> * {
|
||||
padding: 16px;
|
||||
border: solid 1px var(--renote);
|
||||
border-radius: 8px;
|
||||
border-radius: var(--radius-sm);
|
||||
transition: background 0.2s;
|
||||
&:hover,
|
||||
&:focus-within {
|
||||
|
@ -893,12 +893,12 @@ defineExpose({
|
|||
&:first-of-type {
|
||||
margin-left: -0.5em;
|
||||
&::before {
|
||||
border-radius: 100px 0 0 100px;
|
||||
border-radius: var(--radius-big) 0 0 var(--radius-big);
|
||||
}
|
||||
}
|
||||
&:last-of-type {
|
||||
&::before {
|
||||
border-radius: 0 100px 100px 0;
|
||||
border-radius: 0 var(--radius-big) var(--radius-big) 0;
|
||||
}
|
||||
}
|
||||
&:hover {
|
||||
|
|
|
@ -77,7 +77,7 @@ const showTicker =
|
|||
align-items: center;
|
||||
white-space: nowrap;
|
||||
justify-self: flex-end;
|
||||
border-radius: 100px;
|
||||
border-radius: var(--radius-big);
|
||||
font-size: 0.8em;
|
||||
> .avatar {
|
||||
width: 3.7em;
|
||||
|
@ -131,7 +131,7 @@ const showTicker =
|
|||
padding: 1px 6px;
|
||||
font-size: 80%;
|
||||
border: solid 0.5px var(--divider);
|
||||
border-radius: 3px;
|
||||
border-radius: var(--radius-xss);
|
||||
}
|
||||
|
||||
&:hover {
|
||||
|
|
|
@ -58,7 +58,7 @@ const props = defineProps<{
|
|||
margin: 0 10px 0 0;
|
||||
width: 40px;
|
||||
height: 40px;
|
||||
border-radius: 8px;
|
||||
border-radius: var(--radius-sm);
|
||||
pointer-events: none;
|
||||
}
|
||||
|
||||
|
|
|
@ -52,7 +52,7 @@ const props = defineProps<{
|
|||
margin: 0 10px 0 0;
|
||||
width: 40px;
|
||||
height: 40px;
|
||||
border-radius: 8px;
|
||||
border-radius: var(--radius-sm);
|
||||
}
|
||||
|
||||
> .main {
|
||||
|
|
|
@ -440,7 +440,7 @@ function noteClick(e) {
|
|||
display: block;
|
||||
width: 38px;
|
||||
height: 38px;
|
||||
border-radius: 8px;
|
||||
border-radius: var(--radius-sm);
|
||||
}
|
||||
}
|
||||
|
||||
|
@ -500,12 +500,12 @@ function noteClick(e) {
|
|||
&:first-of-type {
|
||||
margin-left: -0.5em;
|
||||
&::before {
|
||||
border-radius: 100px 0 0 100px;
|
||||
border-radius: var(--radius-big) 0 0 var(--radius-big);
|
||||
}
|
||||
}
|
||||
&:last-of-type {
|
||||
&::before {
|
||||
border-radius: 0 100px 100px 0;
|
||||
border-radius: 0 var(--radius-big) var(--radius-big) 0;
|
||||
}
|
||||
}
|
||||
&:hover {
|
||||
|
|
|
@ -429,7 +429,7 @@ useTooltip(reactionRef, (showing) => {
|
|||
display: block;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
border-radius: 6px;
|
||||
border-radius: var(--radius-s);
|
||||
}
|
||||
|
||||
> .sub-icon {
|
||||
|
@ -440,7 +440,7 @@ useTooltip(reactionRef, (showing) => {
|
|||
width: 20px;
|
||||
height: 20px;
|
||||
box-sizing: border-box;
|
||||
border-radius: 100%;
|
||||
border-radius: var(--radius-full);
|
||||
background: var(--panel);
|
||||
box-shadow: 0 0 0 3px var(--panel);
|
||||
font-size: 12px;
|
||||
|
|
|
@ -72,7 +72,7 @@ onMounted(() => {
|
|||
> .notification {
|
||||
height: 100%;
|
||||
box-shadow: 0 4px 16px rgba(0, 0, 0, 0.3);
|
||||
border-radius: 8px;
|
||||
border-radius: var(--radius-sm);
|
||||
overflow: hidden;
|
||||
}
|
||||
}
|
||||
|
|
|
@ -159,7 +159,7 @@ const vote = async (id) => {
|
|||
padding: 4px;
|
||||
//border: solid 0.5px var(--divider);
|
||||
background: var(--accentedBg);
|
||||
border-radius: 4px;
|
||||
border-radius: var(--radius-xs);
|
||||
overflow: hidden;
|
||||
cursor: pointer;
|
||||
|
||||
|
@ -182,7 +182,7 @@ const vote = async (id) => {
|
|||
display: inline-block;
|
||||
padding: 3px 5px;
|
||||
background: var(--panel);
|
||||
border-radius: 3px;
|
||||
border-radius: var(--radius-xss);
|
||||
|
||||
> i {
|
||||
margin-right: 4px;
|
||||
|
|
|
@ -48,7 +48,7 @@ let modal = $ref<InstanceType<typeof MkModal>>();
|
|||
<style lang="scss" scoped>
|
||||
.sfhdhdhq {
|
||||
&.drawer {
|
||||
border-radius: 24px;
|
||||
border-radius: var(--radius-lg);
|
||||
border-bottom-right-radius: 0;
|
||||
border-bottom-left-radius: 0;
|
||||
}
|
||||
|
|
|
@ -1110,7 +1110,7 @@ onMounted(() => {
|
|||
font-size: inherit !important;
|
||||
width: 34px;
|
||||
height: 34px;
|
||||
border-radius: 6px;
|
||||
border-radius: var(--radius-s);
|
||||
|
||||
&:hover {
|
||||
background: var(--X5);
|
||||
|
@ -1129,7 +1129,7 @@ onMounted(() => {
|
|||
line-height: 34px;
|
||||
font-weight: bold;
|
||||
vertical-align: bottom;
|
||||
border-radius: 4px;
|
||||
border-radius: var(--radius-xs);
|
||||
font-size: 0.9em;
|
||||
|
||||
&:disabled {
|
||||
|
@ -1184,7 +1184,7 @@ onMounted(() => {
|
|||
|
||||
> button {
|
||||
padding: 2px;
|
||||
border-radius: 8px;
|
||||
border-radius: var(--radius-sm);
|
||||
|
||||
> i {
|
||||
transform: translateX(2px);
|
||||
|
@ -1194,7 +1194,7 @@ onMounted(() => {
|
|||
> span {
|
||||
margin: 0.3rem;
|
||||
padding: 4px 0 4px 4px;
|
||||
border-radius: 999px;
|
||||
border-radius: var(--radius-ellipse);
|
||||
background: var(--interactiveElementHovered);
|
||||
|
||||
> button {
|
||||
|
@ -1265,7 +1265,7 @@ onMounted(() => {
|
|||
font-size: 16px;
|
||||
width: 40px;
|
||||
height: 40px;
|
||||
border-radius: 6px;
|
||||
border-radius: var(--radius-s);
|
||||
|
||||
&:hover {
|
||||
background: var(--postFormButtonHoverBg);
|
||||
|
|
|
@ -173,7 +173,7 @@ function showFileMenu(file, ev: MouseEvent) {
|
|||
width: 64px;
|
||||
height: 64px;
|
||||
margin-right: 4px;
|
||||
border-radius: 4px;
|
||||
border-radius: var(--radius-xs);
|
||||
cursor: move;
|
||||
|
||||
&:hover > .remove {
|
||||
|
|
|
@ -41,7 +41,7 @@ function quote(): void {
|
|||
height: 32px;
|
||||
margin: 2px;
|
||||
padding: 0 6px;
|
||||
border-radius: 4px;
|
||||
border-radius: var(--radius-xs);
|
||||
|
||||
&.renoted {
|
||||
background: var(--accent);
|
||||
|
|
|
@ -82,7 +82,7 @@ onMounted(() => {
|
|||
.tab {
|
||||
padding: 4px 6px;
|
||||
border: solid 1px var(--divider);
|
||||
border-radius: 6px;
|
||||
border-radius: var(--radius-s);
|
||||
}
|
||||
|
||||
.tabActive {
|
||||
|
|
|
@ -111,7 +111,7 @@ useTooltip(
|
|||
content: "";
|
||||
position: absolute;
|
||||
inset: 0 2px;
|
||||
border-radius: 4px;
|
||||
border-radius: var(--radius-xs);
|
||||
z-index: -1;
|
||||
}
|
||||
&.newlyAdded {
|
||||
|
|
|
@ -50,7 +50,7 @@ defineExpose({
|
|||
background: var(--panel);
|
||||
padding: 0.5em 0;
|
||||
font-size: 0.8em;
|
||||
border-radius: 999px;
|
||||
border-radius: var(--radius-ellipse);
|
||||
box-shadow: 0 2px 6px rgb(0 0 0 / 20%);
|
||||
width: 100%;
|
||||
}
|
||||
|
|
|
@ -384,7 +384,7 @@ function showSuspendedDialog() {
|
|||
background: var(--accentedBg);
|
||||
background-position: center;
|
||||
background-size: cover;
|
||||
border-radius: 100%;
|
||||
border-radius: var(--radius-full);
|
||||
transition: background-image 0.2s ease-in;
|
||||
}
|
||||
}
|
||||
|
|
|
@ -303,7 +303,7 @@ function focusFooter(ev) {
|
|||
}
|
||||
.reply-icon {
|
||||
display: inline-block;
|
||||
border-radius: 6px;
|
||||
border-radius: var(--radius-s);
|
||||
padding: 0.2em 0.2em;
|
||||
margin-right: 0.2em;
|
||||
color: var(--accent);
|
||||
|
@ -357,7 +357,7 @@ function focusFooter(ev) {
|
|||
}
|
||||
.reply-icon {
|
||||
display: inline-block;
|
||||
border-radius: 6px;
|
||||
border-radius: var(--radius-s);
|
||||
padding: 0.2em 0.2em;
|
||||
margin-right: 0.2em;
|
||||
color: var(--accent);
|
||||
|
@ -384,7 +384,7 @@ function focusFooter(ev) {
|
|||
> * {
|
||||
padding: 16px;
|
||||
border: solid 1px var(--renote);
|
||||
border-radius: 8px;
|
||||
border-radius: var(--radius-sm);
|
||||
transition: background 0.2s;
|
||||
&:hover,
|
||||
&:focus-within {
|
||||
|
|
|
@ -155,7 +155,7 @@ export default defineComponent({
|
|||
flex-direction: column;
|
||||
padding: 18px 16px 16px 16px;
|
||||
background: var(--panel);
|
||||
border-radius: 8px;
|
||||
border-radius: var(--radius-sm);
|
||||
text-align: center;
|
||||
|
||||
> .icon {
|
||||
|
|
|
@ -118,7 +118,7 @@ export default defineComponent({
|
|||
margin: 0;
|
||||
margin-right: 8px;
|
||||
padding: 0.5em 1em;
|
||||
border-radius: 100px;
|
||||
border-radius: var(--radius-big);
|
||||
background: var(--buttonBg);
|
||||
> i {
|
||||
margin-top: -0.1em;
|
||||
|
|
|
@ -314,7 +314,7 @@ const newPostsGlowOpacity = computed(
|
|||
position: absolute;
|
||||
top: 120%;
|
||||
margin-inline: auto;
|
||||
border-radius: 2em;
|
||||
border-radius: var(--radius-avatar);
|
||||
padding: 0.5em 1.2em;
|
||||
background: var(--accentedBg);
|
||||
border: 0;
|
||||
|
|
|
@ -64,7 +64,7 @@ onMounted(() => {
|
|||
max-width: calc(100% - 32px);
|
||||
width: min-content;
|
||||
box-shadow: 0 4px 16px rgba(0, 0, 0, 0.3);
|
||||
border-radius: 8px;
|
||||
border-radius: var(--radius-sm);
|
||||
overflow: clip;
|
||||
text-align: center;
|
||||
pointer-events: none;
|
||||
|
|
|
@ -107,7 +107,7 @@ onUnmounted(() => {
|
|||
padding: 8px 12px;
|
||||
box-sizing: border-box;
|
||||
text-align: center;
|
||||
border-radius: 4px;
|
||||
border-radius: var(--radius-xs);
|
||||
border: solid 0.5px var(--divider);
|
||||
pointer-events: none;
|
||||
transform-origin: center center;
|
||||
|
|
|
@ -84,7 +84,7 @@ console.log(data);
|
|||
|
||||
.releaseNotes {
|
||||
> img {
|
||||
border-radius: 10px;
|
||||
border-radius: var(--radius-m);
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
|
|
@ -270,7 +270,7 @@ onUnmounted(() => {
|
|||
width: 1.2em;
|
||||
height: 1.2em;
|
||||
vertical-align: middle;
|
||||
border-radius: 4px;
|
||||
border-radius: var(--radius-xs);
|
||||
}
|
||||
&:hover,
|
||||
&:focus,
|
||||
|
|
|
@ -63,7 +63,7 @@ if (props.withChart) {
|
|||
align-items: center;
|
||||
padding: 16px;
|
||||
background: var(--panel);
|
||||
border-radius: 8px;
|
||||
border-radius: var(--radius-sm);
|
||||
transition: background 0.2s;
|
||||
|
||||
> :global(.avatar) {
|
||||
|
|
|
@ -140,7 +140,7 @@ let collapsed = $ref(isLong);
|
|||
color: #fff;
|
||||
background: rgba(0, 0, 0, 0.7);
|
||||
font-size: 0.7em;
|
||||
border-radius: 6px;
|
||||
border-radius: var(--radius-s);
|
||||
}
|
||||
&.detailed::after {
|
||||
content: "";
|
||||
|
@ -238,7 +238,7 @@ let collapsed = $ref(isLong);
|
|||
background: var(--panel);
|
||||
padding: 0.4em 1em;
|
||||
font-size: 0.8em;
|
||||
border-radius: 999px;
|
||||
border-radius: var(--radius-ellipse);
|
||||
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: 999px;
|
||||
border-radius: var(--radius-ellipse);
|
||||
box-shadow: 0 0 7px 7px var(--bg);
|
||||
}
|
||||
}
|
||||
|
|
|
@ -28,7 +28,7 @@ const text = $computed(() => {
|
|||
<style lang="scss" scoped>
|
||||
.fzgwjkgc {
|
||||
box-shadow: 0 0 0 3px var(--panel);
|
||||
border-radius: 120%; // Blinkのバグか知らんけど、100%ぴったりにすると何故か若干楕円でレンダリングされる
|
||||
border-radius: var(--radius-online); // Blinkのバグか知らんけど、100%ぴったりにすると何故か若干楕円でレンダリングされる
|
||||
|
||||
&.online {
|
||||
background: #9ccfd8;
|
||||
|
|
|
@ -173,7 +173,7 @@ function choose(visibility: (typeof misskey.noteVisibilities)[number]): void {
|
|||
&.asDrawer {
|
||||
padding: 12px 0 calc(env(safe-area-inset-bottom, 0px) + 12px) 0;
|
||||
width: 100%;
|
||||
border-radius: 24px;
|
||||
border-radius: var(--radius-lg);
|
||||
border-bottom-right-radius: 0;
|
||||
border-bottom-left-radius: 0;
|
||||
.icon {
|
||||
|
|
|
@ -202,7 +202,7 @@ function onContextmenu(widget: Widget, ev: MouseEvent) {
|
|||
height: 32px;
|
||||
color: #fff;
|
||||
background: rgba(#000, 0.7);
|
||||
border-radius: 4px;
|
||||
border-radius: var(--radius-xs);
|
||||
}
|
||||
|
||||
> .config {
|
||||
|
|
|
@ -82,7 +82,7 @@ const toggle = () => {
|
|||
outline: none;
|
||||
background: var(--panel);
|
||||
border: solid 1px var(--panel);
|
||||
border-radius: 4px;
|
||||
border-radius: var(--radius-xs);
|
||||
cursor: pointer;
|
||||
transition: inherit;
|
||||
|
||||
|
|
|
@ -27,7 +27,7 @@ defineProps<{
|
|||
.dwzlatin {
|
||||
display: block;
|
||||
overflow: clip;
|
||||
border-radius: 6px;
|
||||
border-radius: var(--radius-sm);
|
||||
|
||||
> .header {
|
||||
display: flex;
|
||||
|
@ -82,7 +82,7 @@ defineProps<{
|
|||
|
||||
> .body {
|
||||
background: var(--panel);
|
||||
border-radius: 0 0 6px 6px;
|
||||
border-radius: 0 0 var(--radius-s) var(--radius-s);
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
|
|
@ -226,7 +226,7 @@ defineExpose({
|
|||
color: var(--fg);
|
||||
background: var(--panel);
|
||||
border: solid 1px var(--panel);
|
||||
border-radius: 6px;
|
||||
border-radius: var(--radius-sm);
|
||||
outline: none;
|
||||
box-shadow: none;
|
||||
box-sizing: border-box;
|
||||
|
|
|
@ -52,7 +52,7 @@ const props = defineProps<{
|
|||
box-sizing: border-box;
|
||||
padding: 10px 14px;
|
||||
background: var(--buttonBg);
|
||||
border-radius: 6px;
|
||||
border-radius: var(--radius-sm);
|
||||
font-size: 0.9em;
|
||||
|
||||
&:hover {
|
||||
|
|
|
@ -45,7 +45,7 @@ function toggle(x) {
|
|||
background-color: var(--panel);
|
||||
background-clip: padding-box !important;
|
||||
border: solid 1px var(--panel);
|
||||
border-radius: 6px;
|
||||
border-radius: var(--radius-sm);
|
||||
transition: all 0.2s;
|
||||
|
||||
> * {
|
||||
|
@ -103,7 +103,7 @@ function toggle(x) {
|
|||
height: 14px;
|
||||
background: none;
|
||||
border: solid 2px var(--inputBorder);
|
||||
border-radius: 100%;
|
||||
border-radius: var(--radius-full);
|
||||
transition: inherit;
|
||||
pointer-events: none;
|
||||
|
||||
|
@ -115,7 +115,7 @@ function toggle(x) {
|
|||
right: 3px;
|
||||
bottom: 3px;
|
||||
left: 3px;
|
||||
border-radius: 100%;
|
||||
border-radius: var(--radius-full);
|
||||
opacity: 0;
|
||||
transform: scale(0);
|
||||
transition: 0.4s cubic-bezier(0.25, 0.8, 0.25, 1);
|
||||
|
|
|
@ -131,7 +131,7 @@ function tooltipHide() {
|
|||
padding: 10px 12px;
|
||||
background: var(--panel);
|
||||
border: solid 1px var(--panel);
|
||||
border-radius: 6px;
|
||||
border-radius: var(--radius-sm);
|
||||
|
||||
> .container {
|
||||
position: relative;
|
||||
|
@ -140,7 +140,7 @@ function tooltipHide() {
|
|||
@mixin track {
|
||||
height: 3px;
|
||||
background: rgba(0, 0, 0, 0.1);
|
||||
border-radius: 999px;
|
||||
border-radius: var(--radius-ellipse);
|
||||
}
|
||||
|
||||
@mixin fill {
|
||||
|
@ -151,7 +151,7 @@ function tooltipHide() {
|
|||
width: $thumbWidth;
|
||||
height: $thumbHeight;
|
||||
background: var(--accent);
|
||||
border-radius: 999px;
|
||||
border-radius: var(--radius-ellipse);
|
||||
|
||||
&:hover {
|
||||
background: var(--accentLighten);
|
||||
|
|
|
@ -245,7 +245,7 @@ function show(ev: MouseEvent) {
|
|||
color: var(--fg);
|
||||
background: var(--panel);
|
||||
border: solid 1px var(--panel);
|
||||
border-radius: 6px;
|
||||
border-radius: var(--radius-s);
|
||||
outline: none;
|
||||
box-shadow: none;
|
||||
box-sizing: border-box;
|
||||
|
|
|
@ -65,7 +65,7 @@ function toggle(x) {
|
|||
background: var(--swutchOffBg);
|
||||
background-clip: content-box;
|
||||
border: solid 1px var(--swutchOffBg);
|
||||
border-radius: 999px;
|
||||
border-radius: var(--radius-ellipse);
|
||||
transition: inherit;
|
||||
user-select: none;
|
||||
pointer-events: none;
|
||||
|
@ -78,7 +78,7 @@ function toggle(x) {
|
|||
width: 15px;
|
||||
height: 15px;
|
||||
background: var(--swutchOffFg);
|
||||
border-radius: 999px;
|
||||
border-radius: var(--radius-ellipse);
|
||||
transition: all 0.2s ease;
|
||||
}
|
||||
}
|
||||
|
|
|
@ -233,7 +233,7 @@ export default defineComponent({
|
|||
color: var(--fg);
|
||||
background: var(--panel);
|
||||
border: solid 1px var(--panel);
|
||||
border-radius: 6px;
|
||||
border-radius: var(--radius-s);
|
||||
outline: none;
|
||||
box-shadow: none;
|
||||
box-sizing: border-box;
|
||||
|
|
|
@ -129,7 +129,7 @@ watch(
|
|||
display: inline-block;
|
||||
vertical-align: bottom;
|
||||
flex-shrink: 0;
|
||||
border-radius: 100%;
|
||||
border-radius: var(--radius-full);
|
||||
line-height: 16px;
|
||||
|
||||
> .inner {
|
||||
|
@ -138,7 +138,7 @@ watch(
|
|||
left: 0;
|
||||
right: 0;
|
||||
top: 0;
|
||||
border-radius: 100%;
|
||||
border-radius: var(--radius-full);
|
||||
z-index: 1;
|
||||
overflow: hidden;
|
||||
object-fit: cover;
|
||||
|
@ -156,10 +156,10 @@ watch(
|
|||
}
|
||||
|
||||
&.square {
|
||||
border-radius: 20%;
|
||||
border-radius: var(--radius-avatar-2);
|
||||
|
||||
> .inner {
|
||||
border-radius: 20%;
|
||||
border-radius: var(--radius-avatar-2);
|
||||
}
|
||||
}
|
||||
|
||||
|
@ -176,12 +176,12 @@ watch(
|
|||
}
|
||||
|
||||
&:before {
|
||||
border-radius: 0 75% 75%;
|
||||
border-radius: 0 var(--radius-avatar3) var(--radius-avatar3);
|
||||
transform: rotate(37.5deg) skew(30deg);
|
||||
}
|
||||
|
||||
&: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);
|
||||
}
|
||||
|
||||
|
|
|
@ -40,7 +40,7 @@ import { instance } from "@/instance";
|
|||
vertical-align: bottom;
|
||||
height: 128px;
|
||||
margin-bottom: 16px;
|
||||
border-radius: 16px;
|
||||
border-radius: var(--radius-md);
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
|
|
@ -564,7 +564,7 @@ onUnmounted(() => {
|
|||
left: 0;
|
||||
height: 3px;
|
||||
background: var(--accent);
|
||||
border-radius: 999px;
|
||||
border-radius: var(--radius-ellipse);
|
||||
transition:
|
||||
width 0.2s,
|
||||
transform 0.2s;
|
||||
|
|
|
@ -102,7 +102,7 @@ export default defineComponent({
|
|||
.ngbfujlo {
|
||||
position: relative;
|
||||
padding: 32px;
|
||||
border-radius: 6px;
|
||||
border-radius: var(--radius-s);
|
||||
box-shadow: 0 2px 8px var(--shadow);
|
||||
z-index: 1;
|
||||
|
||||
|
|
|
@ -103,7 +103,7 @@ definePageMetadata({
|
|||
vertical-align: bottom;
|
||||
height: 128px;
|
||||
margin-bottom: 24px;
|
||||
border-radius: 16px;
|
||||
border-radius: var(--radius-md);
|
||||
}
|
||||
|
||||
> .error {
|
||||
|
|
|
@ -212,7 +212,7 @@ definePageMetadata({
|
|||
display: block;
|
||||
width: 250px;
|
||||
margin: 0 auto;
|
||||
border-radius: 5px;
|
||||
border-radius: var(--radius-x);
|
||||
}
|
||||
|
||||
> .misskey {
|
||||
|
|
|
@ -146,7 +146,7 @@ export default defineComponent({
|
|||
padding: 4px 8px;
|
||||
font-size: 0.9em;
|
||||
background: var(--accentedBg);
|
||||
border-radius: 5px;
|
||||
border-radius: var(--radius-x);
|
||||
|
||||
&.active {
|
||||
background: var(--accent);
|
||||
|
|
|
@ -429,7 +429,7 @@ function syncSlide(index) {
|
|||
|
||||
.fwhjspax {
|
||||
text-align: center;
|
||||
border-radius: 10px;
|
||||
border-radius: var(--radius-m);
|
||||
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: 8px;
|
||||
border-radius: var(--radius-sm);
|
||||
|
||||
&.noAnimation {
|
||||
animation: none;
|
||||
|
|
|
@ -226,7 +226,7 @@ onUnmounted(() => {
|
|||
width: calc(var(--height) - (var(--margin) * 2));
|
||||
box-sizing: border-box;
|
||||
position: relative;
|
||||
border-radius: 5px;
|
||||
border-radius: var(--radius-x);
|
||||
|
||||
&:hover {
|
||||
background: rgba(0, 0, 0, 0.05);
|
||||
|
@ -329,7 +329,7 @@ onUnmounted(() => {
|
|||
bottom: 0;
|
||||
height: 3px;
|
||||
background: var(--accent);
|
||||
border-radius: 999px;
|
||||
border-radius: var(--radius-ellipse);
|
||||
transition: all 0.2s ease;
|
||||
pointer-events: none;
|
||||
}
|
||||
|
|
|
@ -437,7 +437,7 @@ defineExpose({
|
|||
display: block;
|
||||
margin: auto;
|
||||
height: 42px;
|
||||
border-radius: 8px;
|
||||
border-radius: var(--radius-sm);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
|
@ -175,7 +175,7 @@ onMounted(async () => {
|
|||
margin-right: 12px;
|
||||
background: var(--accentedBg);
|
||||
color: var(--accent);
|
||||
border-radius: 10px;
|
||||
border-radius: var(--radius-m);
|
||||
}
|
||||
|
||||
&.sub {
|
||||
|
|
|
@ -155,7 +155,7 @@ onMounted(async () => {
|
|||
margin-right: 12px;
|
||||
background: var(--accentedBg);
|
||||
color: var(--accent);
|
||||
border-radius: 10px;
|
||||
border-radius: var(--radius-m);
|
||||
}
|
||||
|
||||
&.users {
|
||||
|
|
|
@ -90,7 +90,7 @@ definePageMetadata({
|
|||
display: block;
|
||||
max-height: 300px;
|
||||
max-width: 100%;
|
||||
border-radius: 10px;
|
||||
border-radius: var(--radius-m);
|
||||
margin-top: 1rem;
|
||||
}
|
||||
}
|
||||
|
|
|
@ -182,7 +182,7 @@ definePageMetadata(
|
|||
height: 48px;
|
||||
color: #fff;
|
||||
background: rgba(0, 0, 0, 0.5);
|
||||
border-radius: 100%;
|
||||
border-radius: var(--radius-full);
|
||||
|
||||
> i {
|
||||
vertical-align: middle;
|
||||
|
@ -212,7 +212,7 @@ definePageMetadata(
|
|||
padding: 8px 12px;
|
||||
font-size: 80%;
|
||||
background: rgba(0, 0, 0, 0.7);
|
||||
border-radius: 6px;
|
||||
border-radius: var(--radius-s);
|
||||
color: #fff;
|
||||
}
|
||||
}
|
||||
|
|
|
@ -60,7 +60,7 @@ function menu(ev) {
|
|||
padding: 12px;
|
||||
text-align: left;
|
||||
background: var(--panel);
|
||||
border-radius: 8px;
|
||||
border-radius: var(--radius-sm);
|
||||
|
||||
&:hover {
|
||||
border-color: var(--accent);
|
||||
|
|
|
@ -136,7 +136,7 @@ definePageMetadata(
|
|||
margin: 0 12px 0 0;
|
||||
width: 42px;
|
||||
height: 42px;
|
||||
border-radius: 8px;
|
||||
border-radius: var(--radius-sm);
|
||||
}
|
||||
|
||||
> .body {
|
||||
|
|
|
@ -265,7 +265,7 @@ definePageMetadata(
|
|||
max-width: 100%;
|
||||
max-height: 500px;
|
||||
margin: 0 auto;
|
||||
border-radius: 10px;
|
||||
border-radius: var(--radius-m);
|
||||
}
|
||||
|
||||
& + .file {
|
||||
|
|
|
@ -534,7 +534,7 @@ function syncSlide(index) {
|
|||
display: block;
|
||||
margin: 0 16px 0 0;
|
||||
height: 64px;
|
||||
border-radius: 8px;
|
||||
border-radius: var(--radius-sm);
|
||||
}
|
||||
|
||||
> .name {
|
||||
|
|
|
@ -110,7 +110,7 @@ definePageMetadata({
|
|||
padding: 13px;
|
||||
margin-right: 10px;
|
||||
border: solid 1px var(--divider);
|
||||
border-radius: 6px;
|
||||
border-radius: var(--radius-s);
|
||||
|
||||
&:hover {
|
||||
border: solid 1px var(--accent);
|
||||
|
@ -123,7 +123,7 @@ definePageMetadata({
|
|||
padding: 16px;
|
||||
margin-bottom: 8px;
|
||||
border: solid 1px var(--divider);
|
||||
border-radius: 6px;
|
||||
border-radius: var(--radius-s);
|
||||
|
||||
&:hover {
|
||||
border: solid 1px var(--accent);
|
||||
|
|
|
@ -99,7 +99,7 @@ definePageMetadata({
|
|||
display: block;
|
||||
padding: 16px;
|
||||
border: solid 1px var(--divider);
|
||||
border-radius: 6px;
|
||||
border-radius: var(--radius-s);
|
||||
|
||||
&:hover {
|
||||
border: solid 1px var(--accent);
|
||||
|
|
|
@ -32,7 +32,7 @@ import {instance} from "@/instance";
|
|||
vertical-align: bottom;
|
||||
height: 128px;
|
||||
margin-bottom: 16px;
|
||||
border-radius: 16px;
|
||||
border-radius: var(--radius-md);
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
|
|
@ -169,7 +169,7 @@ definePageMetadata(
|
|||
> .load {
|
||||
min-width: 0;
|
||||
margin: 0 auto;
|
||||
border-radius: 999px;
|
||||
border-radius: var(--radius-ellipse);
|
||||
|
||||
&.next {
|
||||
margin-bottom: var(--margin);
|
||||
|
|
|
@ -94,7 +94,7 @@ export default defineComponent({
|
|||
overflow: hidden;
|
||||
background: var(--panel);
|
||||
border: solid 2px var(--divider);
|
||||
border-radius: 6px;
|
||||
border-radius: var(--radius-s);
|
||||
|
||||
&:hover {
|
||||
border: solid 2px var(--dividerHovered);
|
||||
|
|
|
@ -364,7 +364,7 @@ definePageMetadata(
|
|||
backdrop-filter: var(--blur, blur(8px));
|
||||
background: rgba(0, 0, 0, 0.2);
|
||||
padding: 8px;
|
||||
border-radius: 24px;
|
||||
border-radius: var(--radius-lg);
|
||||
width: fit-content;
|
||||
position: relative;
|
||||
top: -10px;
|
||||
|
|
|
@ -94,7 +94,7 @@ const ok = () => {
|
|||
.qr {
|
||||
width: 20em;
|
||||
max-width: 100%;
|
||||
border-radius: 10px;
|
||||
border-radius: var(--radius-m);
|
||||
border: 3px solid var(--accent);
|
||||
}
|
||||
</style>
|
||||
|
|
|
@ -99,7 +99,7 @@ definePageMetadata({
|
|||
margin: 0 12px 0 0;
|
||||
width: 50px;
|
||||
height: 50px;
|
||||
border-radius: 8px;
|
||||
border-radius: var(--radius-sm);
|
||||
}
|
||||
|
||||
> .body {
|
||||
|
|
|
@ -311,7 +311,7 @@ definePageMetadata({
|
|||
background-size: cover;
|
||||
background-position: center;
|
||||
border: solid 1px var(--divider);
|
||||
border-radius: 10px;
|
||||
border-radius: var(--radius-m);
|
||||
overflow: clip;
|
||||
|
||||
> .avatar {
|
||||
|
|
|
@ -283,7 +283,7 @@ definePageMetadata({
|
|||
|
||||
<style lang="scss" scoped>
|
||||
.rfqxtzch {
|
||||
border-radius: 6px;
|
||||
border-radius: var(--radius-s);
|
||||
|
||||
> .toggle {
|
||||
position: relative;
|
||||
|
@ -363,7 +363,7 @@ definePageMetadata({
|
|||
background-color: #e8cda5;
|
||||
opacity: 0;
|
||||
transition: opacity 200ms ease-in-out !important;
|
||||
border-radius: 100%;
|
||||
border-radius: var(--radius-full);
|
||||
}
|
||||
|
||||
.crater--1 {
|
||||
|
@ -392,7 +392,7 @@ definePageMetadata({
|
|||
position: absolute;
|
||||
background-color: #ffffff;
|
||||
transition: all 300ms cubic-bezier(0.445, 0.05, 0.55, 0.95) !important;
|
||||
border-radius: 50%;
|
||||
border-radius: var(--radius-common);
|
||||
}
|
||||
|
||||
.star--1 {
|
||||
|
|
|
@ -366,7 +366,7 @@ definePageMetadata({
|
|||
position: relative;
|
||||
width: 64px;
|
||||
height: 64px;
|
||||
border-radius: 8px;
|
||||
border-radius: var(--radius-sm);
|
||||
|
||||
> .preview {
|
||||
position: absolute;
|
||||
|
@ -377,7 +377,7 @@ definePageMetadata({
|
|||
margin: auto;
|
||||
width: 42px;
|
||||
height: 42px;
|
||||
border-radius: 4px;
|
||||
border-radius: var(--radius-xs);
|
||||
box-shadow: 0 2px 4px rgb(0 0 0 / 30%);
|
||||
transition: transform 0.15s ease;
|
||||
}
|
||||
|
@ -393,10 +393,10 @@ definePageMetadata({
|
|||
}
|
||||
|
||||
&.rounded {
|
||||
border-radius: 999px;
|
||||
border-radius: var(--radius-ellipse);
|
||||
|
||||
> .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
Loading…
Reference in a new issue