parent
e1844db11b
commit
72204d9294
93 changed files with 143 additions and 142 deletions
|
@ -233,7 +233,7 @@
|
||||||
}
|
}
|
||||||
|
|
||||||
button {
|
button {
|
||||||
border-radius: 4px;
|
border-radius: 999px;
|
||||||
padding: 0px 12px 0px 12px;
|
padding: 0px 12px 0px 12px;
|
||||||
border: none;
|
border: none;
|
||||||
cursor: pointer;
|
cursor: pointer;
|
||||||
|
@ -301,7 +301,7 @@
|
||||||
margin-bottom: 2rem;
|
margin-bottom: 2rem;
|
||||||
padding: 0.5rem 1rem;
|
padding: 0.5rem 1rem;
|
||||||
width: 40rem;
|
width: 40rem;
|
||||||
border-radius: 5px;
|
border-radius: 10px;
|
||||||
justify-content: center;
|
justify-content: center;
|
||||||
margin: auto;
|
margin: auto;
|
||||||
}
|
}
|
||||||
|
|
|
@ -24,7 +24,7 @@ html {
|
||||||
}
|
}
|
||||||
|
|
||||||
button {
|
button {
|
||||||
border-radius: 4px;
|
border-radius: 999px;
|
||||||
padding: 0px 12px 0px 12px;
|
padding: 0px 12px 0px 12px;
|
||||||
border: none;
|
border: none;
|
||||||
cursor: pointer;
|
cursor: pointer;
|
||||||
|
@ -93,7 +93,7 @@ code {
|
||||||
background: #333;
|
background: #333;
|
||||||
padding: 0.5rem 1rem;
|
padding: 0.5rem 1rem;
|
||||||
max-width: 40rem;
|
max-width: 40rem;
|
||||||
border-radius: 5px;
|
border-radius: 10px;
|
||||||
justify-content: center;
|
justify-content: center;
|
||||||
margin: auto;
|
margin: auto;
|
||||||
white-space: pre-wrap;
|
white-space: pre-wrap;
|
||||||
|
|
|
@ -84,7 +84,7 @@ function resolve() {
|
||||||
box-sizing: border-box;
|
box-sizing: border-box;
|
||||||
align-items: center;
|
align-items: center;
|
||||||
padding: 14px;
|
padding: 14px;
|
||||||
border-radius: 5px;
|
border-radius: 8px;
|
||||||
--c: rgb(255 196 0 / 15%);
|
--c: rgb(255 196 0 / 15%);
|
||||||
background-image: linear-gradient(45deg, var(--c) 16.67%, transparent 16.67%, transparent 50%, var(--c) 50%, var(--c) 66.67%, transparent 66.67%, transparent 100%);
|
background-image: linear-gradient(45deg, var(--c) 16.67%, transparent 16.67%, transparent 50%, var(--c) 50%, var(--c) 66.67%, transparent 66.67%, transparent 100%);
|
||||||
background-size: 16px 16px;
|
background-size: 16px 16px;
|
||||||
|
|
|
@ -125,6 +125,6 @@ function openPostForm() {
|
||||||
|
|
||||||
.postForm {
|
.postForm {
|
||||||
background: var(--bg);
|
background: var(--bg);
|
||||||
border-radius: 5px;
|
border-radius: 8px;
|
||||||
}
|
}
|
||||||
</style>
|
</style>
|
||||||
|
|
|
@ -154,7 +154,7 @@ function onMousedown(evt: MouseEvent): void {
|
||||||
}
|
}
|
||||||
|
|
||||||
&.rounded {
|
&.rounded {
|
||||||
border-radius: 4px;
|
border-radius: 999px;
|
||||||
}
|
}
|
||||||
|
|
||||||
&.primary {
|
&.primary {
|
||||||
|
@ -264,7 +264,7 @@ function onMousedown(evt: MouseEvent): void {
|
||||||
left: 0;
|
left: 0;
|
||||||
width: 100%;
|
width: 100%;
|
||||||
height: 100%;
|
height: 100%;
|
||||||
border-radius: 5px;
|
border-radius: 6px;
|
||||||
overflow: clip;
|
overflow: clip;
|
||||||
pointer-events: none;
|
pointer-events: none;
|
||||||
}
|
}
|
||||||
|
|
|
@ -100,7 +100,7 @@ const bannerStyle = computed(() => {
|
||||||
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: 5px;
|
border-radius: 6px;
|
||||||
color: #fff;
|
color: #fff;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@ -111,7 +111,7 @@ const bannerStyle = computed(() => {
|
||||||
left: 16px;
|
left: 16px;
|
||||||
background: rgba(0, 0, 0, 0.7);
|
background: rgba(0, 0, 0, 0.7);
|
||||||
color: var(--warn);
|
color: var(--warn);
|
||||||
border-radius: 5px;
|
border-radius: 6px;
|
||||||
font-weight: bold;
|
font-weight: bold;
|
||||||
font-size: 1em;
|
font-size: 1em;
|
||||||
padding: 4px 7px;
|
padding: 4px 7px;
|
||||||
|
|
|
@ -55,7 +55,7 @@ defineExpose({
|
||||||
font-size: 85%;
|
font-size: 85%;
|
||||||
padding: 4px 12px 4px 8px;
|
padding: 4px 12px 4px 8px;
|
||||||
border: solid 1px var(--divider);
|
border: solid 1px var(--divider);
|
||||||
border-radius: 4px;
|
border-radius: 999px;
|
||||||
|
|
||||||
&:hover {
|
&:hover {
|
||||||
border-color: var(--inputBorderHover);
|
border-color: var(--inputBorderHover);
|
||||||
|
|
|
@ -102,7 +102,7 @@ const onInput = (ev: KeyboardEvent) => {
|
||||||
color: var(--fg);
|
color: var(--fg);
|
||||||
background: var(--panel);
|
background: var(--panel);
|
||||||
border: solid 1px var(--panel);
|
border: solid 1px var(--panel);
|
||||||
border-radius: 5px;
|
border-radius: 6px;
|
||||||
outline: none;
|
outline: none;
|
||||||
box-shadow: none;
|
box-shadow: none;
|
||||||
box-sizing: border-box;
|
box-sizing: border-box;
|
||||||
|
|
|
@ -223,7 +223,7 @@ onUnmounted(() => {
|
||||||
background: var(--panel);
|
background: var(--panel);
|
||||||
padding: 6px 10px;
|
padding: 6px 10px;
|
||||||
font-size: 0.8em;
|
font-size: 0.8em;
|
||||||
border-radius: 4px;
|
border-radius: 999px;
|
||||||
box-shadow: 0 2px 6px rgb(0 0 0 / 20%);
|
box-shadow: 0 2px 6px rgb(0 0 0 / 20%);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
|
@ -197,7 +197,7 @@ onBeforeUnmount(() => {
|
||||||
box-sizing: border-box;
|
box-sizing: border-box;
|
||||||
text-align: center;
|
text-align: center;
|
||||||
background: var(--panel);
|
background: var(--panel);
|
||||||
border-radius: 4px;
|
border-radius: 16px;
|
||||||
}
|
}
|
||||||
|
|
||||||
.icon {
|
.icon {
|
||||||
|
|
|
@ -107,7 +107,7 @@ function onDragend() {
|
||||||
position: relative;
|
position: relative;
|
||||||
padding: 8px 0 0 0;
|
padding: 8px 0 0 0;
|
||||||
min-height: 180px;
|
min-height: 180px;
|
||||||
border-radius: 5px;
|
border-radius: 8px;
|
||||||
cursor: pointer;
|
cursor: pointer;
|
||||||
|
|
||||||
&:hover {
|
&:hover {
|
||||||
|
|
|
@ -63,7 +63,7 @@ const isThumbnailAvailable = computed(() => {
|
||||||
position: relative;
|
position: relative;
|
||||||
display: flex;
|
display: flex;
|
||||||
background: var(--panel);
|
background: var(--panel);
|
||||||
border-radius: 5px;
|
border-radius: 8px;
|
||||||
overflow: clip;
|
overflow: clip;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
|
@ -139,7 +139,7 @@ onMounted(() => {
|
||||||
background: var(--buttonBg);
|
background: var(--buttonBg);
|
||||||
-webkit-backdrop-filter: var(--blur, blur(15px));
|
-webkit-backdrop-filter: var(--blur, blur(15px));
|
||||||
backdrop-filter: var(--blur, blur(15px));
|
backdrop-filter: var(--blur, blur(15px));
|
||||||
border-radius: 5px;
|
border-radius: 6px;
|
||||||
transition: border-radius 0.3s;
|
transition: border-radius 0.3s;
|
||||||
|
|
||||||
&:hover {
|
&:hover {
|
||||||
|
|
|
@ -227,7 +227,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: 5px;
|
border-radius: 6px;
|
||||||
outline: none;
|
outline: none;
|
||||||
box-shadow: none;
|
box-shadow: none;
|
||||||
box-sizing: border-box;
|
box-sizing: border-box;
|
||||||
|
|
|
@ -46,7 +46,7 @@ function getInstanceIcon(instance): string {
|
||||||
align-items: center;
|
align-items: center;
|
||||||
padding: 16px;
|
padding: 16px;
|
||||||
background: var(--panel);
|
background: var(--panel);
|
||||||
border-radius: 5px;
|
border-radius: 8px;
|
||||||
|
|
||||||
> :global(.icon) {
|
> :global(.icon) {
|
||||||
display: block;
|
display: block;
|
||||||
|
|
|
@ -77,7 +77,7 @@ function close() {
|
||||||
overflow: auto;
|
overflow: auto;
|
||||||
overscroll-behavior: contain;
|
overscroll-behavior: contain;
|
||||||
text-align: left;
|
text-align: left;
|
||||||
border-radius: 4px;
|
border-radius: 16px;
|
||||||
|
|
||||||
&.asDrawer {
|
&.asDrawer {
|
||||||
width: 100%;
|
width: 100%;
|
||||||
|
@ -100,7 +100,7 @@ function close() {
|
||||||
justify-content: center;
|
justify-content: center;
|
||||||
vertical-align: bottom;
|
vertical-align: bottom;
|
||||||
height: 100px;
|
height: 100px;
|
||||||
border-radius: 5px;
|
border-radius: 10px;
|
||||||
|
|
||||||
&:hover {
|
&:hover {
|
||||||
color: var(--accent);
|
color: var(--accent);
|
||||||
|
|
|
@ -79,7 +79,7 @@ watch(audioEl, () => {
|
||||||
}
|
}
|
||||||
|
|
||||||
.audio {
|
.audio {
|
||||||
border-radius: 5px;
|
border-radius: 8px;
|
||||||
overflow: clip;
|
overflow: clip;
|
||||||
}
|
}
|
||||||
</style>
|
</style>
|
||||||
|
|
|
@ -157,7 +157,7 @@ function showMenu(ev: MouseEvent) {
|
||||||
.hide {
|
.hide {
|
||||||
display: block;
|
display: block;
|
||||||
position: absolute;
|
position: absolute;
|
||||||
border-radius: 5px;
|
border-radius: 6px;
|
||||||
background-color: black;
|
background-color: black;
|
||||||
color: var(--accentLighten);
|
color: var(--accentLighten);
|
||||||
font-size: 12px;
|
font-size: 12px;
|
||||||
|
@ -187,7 +187,7 @@ function showMenu(ev: MouseEvent) {
|
||||||
.menu {
|
.menu {
|
||||||
display: block;
|
display: block;
|
||||||
position: absolute;
|
position: absolute;
|
||||||
border-radius: 4px;
|
border-radius: 999px;
|
||||||
background-color: rgba(0, 0, 0, 0.3);
|
background-color: rgba(0, 0, 0, 0.3);
|
||||||
-webkit-backdrop-filter: var(--blur, blur(15px));
|
-webkit-backdrop-filter: var(--blur, blur(15px));
|
||||||
backdrop-filter: var(--blur, blur(15px));
|
backdrop-filter: var(--blur, blur(15px));
|
||||||
|
@ -223,7 +223,7 @@ function showMenu(ev: MouseEvent) {
|
||||||
.indicator {
|
.indicator {
|
||||||
/* Hardcode to black because either --bg or --fg makes it hard to read in dark/light mode */
|
/* Hardcode to black because either --bg or --fg makes it hard to read in dark/light mode */
|
||||||
background-color: black;
|
background-color: black;
|
||||||
border-radius: 5px;
|
border-radius: 6px;
|
||||||
color: var(--accentLighten);
|
color: var(--accentLighten);
|
||||||
display: inline-block;
|
display: inline-block;
|
||||||
font-weight: bold;
|
font-weight: bold;
|
||||||
|
|
|
@ -341,7 +341,7 @@ const previewable = (file: Misskey.entities.DriveFile): boolean => {
|
||||||
|
|
||||||
.media {
|
.media {
|
||||||
overflow: hidden; // clipにするとバグる
|
overflow: hidden; // clipにするとバグる
|
||||||
border-radius: 5px;
|
border-radius: 8px;
|
||||||
}
|
}
|
||||||
|
|
||||||
:global(.pswp) {
|
:global(.pswp) {
|
||||||
|
|
|
@ -77,7 +77,7 @@ watch(videoEl, () => {
|
||||||
.hide {
|
.hide {
|
||||||
display: block;
|
display: block;
|
||||||
position: absolute;
|
position: absolute;
|
||||||
border-radius: 5px;
|
border-radius: 6px;
|
||||||
background-color: black;
|
background-color: black;
|
||||||
color: var(--accentLighten);
|
color: var(--accentLighten);
|
||||||
font-size: 14px;
|
font-size: 14px;
|
||||||
|
@ -127,7 +127,7 @@ watch(videoEl, () => {
|
||||||
.indicator {
|
.indicator {
|
||||||
/* Hardcode to black because either --bg or --fg makes it hard to read in dark/light mode */
|
/* Hardcode to black because either --bg or --fg makes it hard to read in dark/light mode */
|
||||||
background-color: black;
|
background-color: black;
|
||||||
border-radius: 5px;
|
border-radius: 6px;
|
||||||
color: var(--accentLighten);
|
color: var(--accentLighten);
|
||||||
display: inline-block;
|
display: inline-block;
|
||||||
font-weight: bold;
|
font-weight: bold;
|
||||||
|
|
|
@ -49,7 +49,7 @@ const avatarUrl = computed(() => defaultStore.state.disableShowingAnimatedImages
|
||||||
.root {
|
.root {
|
||||||
display: inline-block;
|
display: inline-block;
|
||||||
padding: 4px 8px 4px 4px;
|
padding: 4px 8px 4px 4px;
|
||||||
border-radius: 4px;
|
border-radius: 999px;
|
||||||
color: var(--mention);
|
color: var(--mention);
|
||||||
|
|
||||||
&.isMe {
|
&.isMe {
|
||||||
|
|
|
@ -290,7 +290,7 @@ onBeforeUnmount(() => {
|
||||||
margin: auto;
|
margin: auto;
|
||||||
width: calc(100% - 16px);
|
width: calc(100% - 16px);
|
||||||
height: 100%;
|
height: 100%;
|
||||||
border-radius: 5px;
|
border-radius: 6px;
|
||||||
}
|
}
|
||||||
|
|
||||||
&:not(:disabled):hover {
|
&:not(:disabled):hover {
|
||||||
|
|
|
@ -699,7 +699,7 @@ function readPromo() {
|
||||||
padding: 0 4px;
|
padding: 0 4px;
|
||||||
margin-bottom: 0 !important;
|
margin-bottom: 0 !important;
|
||||||
background: var(--popup);
|
background: var(--popup);
|
||||||
border-radius: 5px;
|
border-radius: 8px;
|
||||||
box-shadow: 0px 4px 32px var(--shadow);
|
box-shadow: 0px 4px 32px var(--shadow);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@ -831,7 +831,7 @@ function readPromo() {
|
||||||
left: 8px;
|
left: 8px;
|
||||||
width: 5px;
|
width: 5px;
|
||||||
height: calc(100% - 16px);
|
height: calc(100% - 16px);
|
||||||
border-radius: 4px;
|
border-radius: 999px;
|
||||||
pointer-events: none;
|
pointer-events: none;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@ -871,7 +871,7 @@ function readPromo() {
|
||||||
background: var(--popup);
|
background: var(--popup);
|
||||||
padding: 6px 10px;
|
padding: 6px 10px;
|
||||||
font-size: 0.8em;
|
font-size: 0.8em;
|
||||||
border-radius: 4px;
|
border-radius: 999px;
|
||||||
box-shadow: 0 2px 6px rgb(0 0 0 / 20%);
|
box-shadow: 0 2px 6px rgb(0 0 0 / 20%);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@ -901,7 +901,7 @@ function readPromo() {
|
||||||
background: var(--panel);
|
background: var(--panel);
|
||||||
padding: 6px 10px;
|
padding: 6px 10px;
|
||||||
font-size: 0.8em;
|
font-size: 0.8em;
|
||||||
border-radius: 4px;
|
border-radius: 999px;
|
||||||
box-shadow: 0 2px 6px rgb(0 0 0 / 20%);
|
box-shadow: 0 2px 6px rgb(0 0 0 / 20%);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@ -937,7 +937,7 @@ function readPromo() {
|
||||||
.quoteNote {
|
.quoteNote {
|
||||||
padding: 16px;
|
padding: 16px;
|
||||||
border: dashed 1px var(--renote);
|
border: dashed 1px var(--renote);
|
||||||
border-radius: 5px;
|
border-radius: 8px;
|
||||||
overflow: clip;
|
overflow: clip;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
|
@ -739,7 +739,7 @@ if (appearNote.reply && appearNote.reply.replyId && defaultStore.state.autoloadC
|
||||||
width: 28px;
|
width: 28px;
|
||||||
height: 28px;
|
height: 28px;
|
||||||
margin: 0 8px 0 0;
|
margin: 0 8px 0 0;
|
||||||
border-radius: 5px;
|
border-radius: 6px;
|
||||||
}
|
}
|
||||||
|
|
||||||
.renoteText {
|
.renoteText {
|
||||||
|
@ -869,7 +869,7 @@ if (appearNote.reply && appearNote.reply.replyId && defaultStore.state.autoloadC
|
||||||
.quoteNote {
|
.quoteNote {
|
||||||
padding: 16px;
|
padding: 16px;
|
||||||
border: dashed 1px var(--renote);
|
border: dashed 1px var(--renote);
|
||||||
border-radius: 5px;
|
border-radius: 8px;
|
||||||
overflow: clip;
|
overflow: clip;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@ -947,7 +947,7 @@ if (appearNote.reply && appearNote.reply.replyId && defaultStore.state.autoloadC
|
||||||
.reactionTab {
|
.reactionTab {
|
||||||
padding: 4px 6px;
|
padding: 4px 6px;
|
||||||
border: solid 1px var(--divider);
|
border: solid 1px var(--divider);
|
||||||
border-radius: 5px;
|
border-radius: 6px;
|
||||||
}
|
}
|
||||||
|
|
||||||
.reactionTabActive {
|
.reactionTabActive {
|
||||||
|
|
|
@ -56,7 +56,7 @@ watch(() => props.expandAllCws, (expandAllCws) => {
|
||||||
margin: 0 10px 0 0;
|
margin: 0 10px 0 0;
|
||||||
width: 34px;
|
width: 34px;
|
||||||
height: 34px;
|
height: 34px;
|
||||||
border-radius: 5px;
|
border-radius: 8px;
|
||||||
position: sticky !important;
|
position: sticky !important;
|
||||||
top: calc(16px + var(--stickyTop, 0px));
|
top: calc(16px + var(--stickyTop, 0px));
|
||||||
left: 0;
|
left: 0;
|
||||||
|
|
|
@ -418,7 +418,7 @@ if (props.detail) {
|
||||||
left: 8px;
|
left: 8px;
|
||||||
width: 5px;
|
width: 5px;
|
||||||
height: calc(100% - 8px);
|
height: calc(100% - 8px);
|
||||||
border-radius: 4px;
|
border-radius: 999px;
|
||||||
pointer-events: none;
|
pointer-events: none;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@ -428,7 +428,7 @@ if (props.detail) {
|
||||||
margin: 0 8px 0 0;
|
margin: 0 8px 0 0;
|
||||||
width: 38px;
|
width: 38px;
|
||||||
height: 38px;
|
height: 38px;
|
||||||
border-radius: 5px;
|
border-radius: 8px;
|
||||||
}
|
}
|
||||||
|
|
||||||
.body {
|
.body {
|
||||||
|
@ -514,6 +514,6 @@ if (props.detail) {
|
||||||
padding: 8px !important;
|
padding: 8px !important;
|
||||||
border: 1px solid var(--divider);
|
border: 1px solid var(--divider);
|
||||||
margin: 8px 8px 0 8px;
|
margin: 8px 8px 0 8px;
|
||||||
border-radius: 5px;
|
border-radius: 8px;
|
||||||
}
|
}
|
||||||
</style>
|
</style>
|
||||||
|
|
|
@ -181,7 +181,7 @@ useTooltip(reactionRef, (showing) => {
|
||||||
display: block;
|
display: block;
|
||||||
width: 100%;
|
width: 100%;
|
||||||
height: 100%;
|
height: 100%;
|
||||||
border-radius: 5px;
|
border-radius: 6px;
|
||||||
}
|
}
|
||||||
|
|
||||||
.subIcon {
|
.subIcon {
|
||||||
|
|
|
@ -69,7 +69,7 @@ onUnmounted(() => {
|
||||||
background: var(--panel);
|
background: var(--panel);
|
||||||
padding: 6px 10px;
|
padding: 6px 10px;
|
||||||
font-size: 0.8em;
|
font-size: 0.8em;
|
||||||
border-radius: 4px;
|
border-radius: 999px;
|
||||||
box-shadow: 0 2px 6px rgb(0 0 0 / 20%);
|
box-shadow: 0 2px 6px rgb(0 0 0 / 20%);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
|
@ -61,7 +61,7 @@ SPDX-License-Identifier: AGPL-3.0-only
|
||||||
<MkAcct :user="u"/>
|
<MkAcct :user="u"/>
|
||||||
<button class="_button" style="padding: 4px 8px;" @click="removeVisibleUser(u)"><i class="ph-x ph-bold ph-lg"></i></button>
|
<button class="_button" style="padding: 4px 8px;" @click="removeVisibleUser(u)"><i class="ph-x ph-bold ph-lg"></i></button>
|
||||||
</span>
|
</span>
|
||||||
<button class="_buttonPrimary" style="padding: 4px; border-radius: 5px;" @click="addVisibleUser"><i class="ph-plus ph-bold ph-lg ti-fw"></i></button>
|
<button class="_buttonPrimary" style="padding: 4px; border-radius: 8px;" @click="addVisibleUser"><i class="ph-plus ph-bold ph-lg ti-fw"></i></button>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<MkInfo v-if="hasNotSpecifiedMentions" warn :class="$style.hasNotSpecifiedMentions">{{ i18n.ts.notSpecifiedMentionWarning }} - <button class="_textButton" @click="addMissingMention()">{{ i18n.ts.add }}</button></MkInfo>
|
<MkInfo v-if="hasNotSpecifiedMentions" warn :class="$style.hasNotSpecifiedMentions">{{ i18n.ts.notSpecifiedMentionWarning }} - <button class="_textButton" @click="addMissingMention()">{{ i18n.ts.add }}</button></MkInfo>
|
||||||
|
@ -998,7 +998,7 @@ defineExpose({
|
||||||
padding: 0 12px;
|
padding: 0 12px;
|
||||||
line-height: 34px;
|
line-height: 34px;
|
||||||
font-weight: bold;
|
font-weight: bold;
|
||||||
border-radius: 5px;
|
border-radius: 6px;
|
||||||
min-width: 90px;
|
min-width: 90px;
|
||||||
box-sizing: border-box;
|
box-sizing: border-box;
|
||||||
color: var(--fgOnAccent);
|
color: var(--fgOnAccent);
|
||||||
|
@ -1008,7 +1008,7 @@ defineExpose({
|
||||||
.headerRightItem {
|
.headerRightItem {
|
||||||
margin: 0;
|
margin: 0;
|
||||||
padding: 8px;
|
padding: 8px;
|
||||||
border-radius: 5px;
|
border-radius: 6px;
|
||||||
|
|
||||||
&:hover {
|
&:hover {
|
||||||
background: var(--X5);
|
background: var(--X5);
|
||||||
|
@ -1071,7 +1071,7 @@ defineExpose({
|
||||||
.visibleUser {
|
.visibleUser {
|
||||||
margin-right: 14px;
|
margin-right: 14px;
|
||||||
padding: 8px 0 8px 8px;
|
padding: 8px 0 8px 8px;
|
||||||
border-radius: 5px;
|
border-radius: 8px;
|
||||||
background: var(--X4);
|
background: var(--X4);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@ -1140,7 +1140,7 @@ defineExpose({
|
||||||
padding: 4px 6px;
|
padding: 4px 6px;
|
||||||
font-size: .9em;
|
font-size: .9em;
|
||||||
color: var(--warn);
|
color: var(--warn);
|
||||||
border-radius: 5px;
|
border-radius: 6px;
|
||||||
min-width: 1.6em;
|
min-width: 1.6em;
|
||||||
text-align: center;
|
text-align: center;
|
||||||
|
|
||||||
|
@ -1180,7 +1180,7 @@ defineExpose({
|
||||||
font-size: 1em;
|
font-size: 1em;
|
||||||
width: auto;
|
width: auto;
|
||||||
height: 100%;
|
height: 100%;
|
||||||
border-radius: 5px;
|
border-radius: 6px;
|
||||||
|
|
||||||
&:hover {
|
&:hover {
|
||||||
background: var(--X5);
|
background: var(--X5);
|
||||||
|
|
|
@ -55,7 +55,7 @@ function toggle(): void {
|
||||||
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: 5px;
|
border-radius: 6px;
|
||||||
font-size: 90%;
|
font-size: 90%;
|
||||||
transition: all 0.2s;
|
transition: all 0.2s;
|
||||||
user-select: none;
|
user-select: none;
|
||||||
|
|
|
@ -186,7 +186,7 @@ const onMousedown = (ev: MouseEvent | TouchEvent) => {
|
||||||
padding: 7px 12px;
|
padding: 7px 12px;
|
||||||
background: var(--panel);
|
background: var(--panel);
|
||||||
border: solid 1px var(--panel);
|
border: solid 1px var(--panel);
|
||||||
border-radius: 5px;
|
border-radius: 6px;
|
||||||
|
|
||||||
> .container {
|
> .container {
|
||||||
position: relative;
|
position: relative;
|
||||||
|
@ -202,7 +202,7 @@ const onMousedown = (ev: MouseEvent | TouchEvent) => {
|
||||||
width: calc(100% - #{$thumbWidth});
|
width: calc(100% - #{$thumbWidth});
|
||||||
height: 3px;
|
height: 3px;
|
||||||
background: rgba(0, 0, 0, 0.1);
|
background: rgba(0, 0, 0, 0.1);
|
||||||
border-radius: 4px;
|
border-radius: 999px;
|
||||||
overflow: clip;
|
overflow: clip;
|
||||||
|
|
||||||
> .highlight {
|
> .highlight {
|
||||||
|
@ -233,7 +233,7 @@ const onMousedown = (ev: MouseEvent | TouchEvent) => {
|
||||||
height: 3px;
|
height: 3px;
|
||||||
margin-left: - math.div($tickWidth, 2);
|
margin-left: - math.div($tickWidth, 2);
|
||||||
background: var(--divider);
|
background: var(--divider);
|
||||||
border-radius: 4px;
|
border-radius: 999px;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@ -243,7 +243,7 @@ const onMousedown = (ev: MouseEvent | TouchEvent) => {
|
||||||
height: $thumbHeight;
|
height: $thumbHeight;
|
||||||
cursor: grab;
|
cursor: grab;
|
||||||
background: var(--accent);
|
background: var(--accent);
|
||||||
border-radius: 4px;
|
border-radius: 999px;
|
||||||
|
|
||||||
&:hover {
|
&:hover {
|
||||||
background: var(--accentLighten);
|
background: var(--accentLighten);
|
||||||
|
|
|
@ -119,7 +119,7 @@ useTooltip(buttonEl, async (showing) => {
|
||||||
margin: 2px;
|
margin: 2px;
|
||||||
padding: 0 6px;
|
padding: 0 6px;
|
||||||
font-size: 1.5em;
|
font-size: 1.5em;
|
||||||
border-radius: 5px;
|
border-radius: 6px;
|
||||||
|
|
||||||
&.canToggle {
|
&.canToggle {
|
||||||
background: var(--buttonBg);
|
background: var(--buttonBg);
|
||||||
|
@ -147,7 +147,7 @@ useTooltip(buttonEl, async (showing) => {
|
||||||
&.large {
|
&.large {
|
||||||
height: 52px;
|
height: 52px;
|
||||||
font-size: 2em;
|
font-size: 2em;
|
||||||
border-radius: 5px;
|
border-radius: 8px;
|
||||||
|
|
||||||
> .count {
|
> .count {
|
||||||
font-size: 0.6em;
|
font-size: 0.6em;
|
||||||
|
|
|
@ -241,7 +241,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: 5px;
|
border-radius: 6px;
|
||||||
outline: none;
|
outline: none;
|
||||||
box-shadow: none;
|
box-shadow: none;
|
||||||
box-sizing: border-box;
|
box-sizing: border-box;
|
||||||
|
|
|
@ -182,7 +182,7 @@ async function updateAgreeNote(v: boolean) {
|
||||||
font-weight: bold;
|
font-weight: bold;
|
||||||
align-items: center;
|
align-items: center;
|
||||||
justify-content: center;
|
justify-content: center;
|
||||||
border-radius: 4px;
|
border-radius: 999px;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
|
@ -88,7 +88,7 @@ const 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: 4px;
|
border-radius: 999px;
|
||||||
box-shadow: 0 2px 6px rgb(0 0 0 / 20%);
|
box-shadow: 0 2px 6px rgb(0 0 0 / 20%);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@ -131,7 +131,7 @@ const collapsed = $ref(isLong);
|
||||||
background: var(--popup);
|
background: var(--popup);
|
||||||
padding: 6px 10px;
|
padding: 6px 10px;
|
||||||
font-size: 0.8em;
|
font-size: 0.8em;
|
||||||
border-radius: 4px;
|
border-radius: 999px;
|
||||||
box-shadow: 0 2px 6px rgb(0 0 0 / 20%);
|
box-shadow: 0 2px 6px rgb(0 0 0 / 20%);
|
||||||
}
|
}
|
||||||
</style>
|
</style>
|
||||||
|
|
|
@ -59,7 +59,7 @@ defineProps<{
|
||||||
width: 100%;
|
width: 100%;
|
||||||
box-sizing: border-box;
|
box-sizing: border-box;
|
||||||
padding: 9px 16px 9px 8px;
|
padding: 9px 16px 9px 8px;
|
||||||
border-radius: 5px;
|
border-radius: 9px;
|
||||||
font-size: 0.9em;
|
font-size: 0.9em;
|
||||||
|
|
||||||
&:hover {
|
&:hover {
|
||||||
|
|
|
@ -52,7 +52,7 @@ const toggle = () => {
|
||||||
background: var(--switchOffBg);
|
background: var(--switchOffBg);
|
||||||
background-clip: content-box;
|
background-clip: content-box;
|
||||||
border: solid 1px var(--switchOffBg);
|
border: solid 1px var(--switchOffBg);
|
||||||
border-radius: 4px;
|
border-radius: 999px;
|
||||||
cursor: pointer;
|
cursor: pointer;
|
||||||
transition: inherit;
|
transition: inherit;
|
||||||
user-select: none;
|
user-select: none;
|
||||||
|
@ -72,7 +72,7 @@ const toggle = () => {
|
||||||
top: 3px;
|
top: 3px;
|
||||||
width: 15px;
|
width: 15px;
|
||||||
height: 15px;
|
height: 15px;
|
||||||
border-radius: 4px;
|
border-radius: 999px;
|
||||||
transition: all 0.2s ease;
|
transition: all 0.2s ease;
|
||||||
|
|
||||||
&:not(.knobChecked) {
|
&:not(.knobChecked) {
|
||||||
|
|
|
@ -39,7 +39,7 @@ export default defineComponent({
|
||||||
> button {
|
> button {
|
||||||
flex: 1;
|
flex: 1;
|
||||||
padding: 10px 8px;
|
padding: 10px 8px;
|
||||||
border-radius: 4px;
|
border-radius: 999px;
|
||||||
|
|
||||||
&:disabled {
|
&:disabled {
|
||||||
opacity: 1 !important;
|
opacity: 1 !important;
|
||||||
|
|
|
@ -153,7 +153,7 @@ onMounted(() => {
|
||||||
color: var(--fg);
|
color: var(--fg);
|
||||||
background: var(--panel);
|
background: var(--panel);
|
||||||
border: solid 1px var(--panel);
|
border: solid 1px var(--panel);
|
||||||
border-radius: 5px;
|
border-radius: 6px;
|
||||||
outline: none;
|
outline: none;
|
||||||
box-shadow: none;
|
box-shadow: none;
|
||||||
box-sizing: border-box;
|
box-sizing: border-box;
|
||||||
|
|
|
@ -66,7 +66,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: 5px;
|
border-radius: 8px;
|
||||||
overflow: clip;
|
overflow: clip;
|
||||||
text-align: center;
|
text-align: center;
|
||||||
pointer-events: none;
|
pointer-events: none;
|
||||||
|
|
|
@ -231,7 +231,7 @@ onUnmounted(() => {
|
||||||
display: block;
|
display: block;
|
||||||
font-size: 14px;
|
font-size: 14px;
|
||||||
box-shadow: 0 0 0 1px var(--divider);
|
box-shadow: 0 0 0 1px var(--divider);
|
||||||
border-radius: 5px;
|
border-radius: 8px;
|
||||||
overflow: clip;
|
overflow: clip;
|
||||||
|
|
||||||
&:hover {
|
&:hover {
|
||||||
|
|
|
@ -50,7 +50,7 @@ onMounted(() => {
|
||||||
align-items: center;
|
align-items: center;
|
||||||
padding: 16px;
|
padding: 16px;
|
||||||
background: var(--panel);
|
background: var(--panel);
|
||||||
border-radius: 5px;
|
border-radius: 8px;
|
||||||
|
|
||||||
> :global(.avatar) {
|
> :global(.avatar) {
|
||||||
display: block;
|
display: block;
|
||||||
|
|
|
@ -100,7 +100,7 @@ defineProps<{
|
||||||
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: 5px;
|
border-radius: 6px;
|
||||||
}
|
}
|
||||||
|
|
||||||
.description {
|
.description {
|
||||||
|
|
|
@ -146,7 +146,7 @@ onMounted(() => {
|
||||||
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: 5px;
|
border-radius: 6px;
|
||||||
}
|
}
|
||||||
|
|
||||||
.locked:first-child {
|
.locked:first-child {
|
||||||
|
@ -249,7 +249,7 @@ onMounted(() => {
|
||||||
right: 44px;
|
right: 44px;
|
||||||
padding: 6px;
|
padding: 6px;
|
||||||
background: var(--panel);
|
background: var(--panel);
|
||||||
border-radius: 4px;
|
border-radius: 999px;
|
||||||
}
|
}
|
||||||
|
|
||||||
.follow {
|
.follow {
|
||||||
|
|
|
@ -172,7 +172,7 @@ function exploreOtherServers() {
|
||||||
right: 16px;
|
right: 16px;
|
||||||
width: 32px;
|
width: 32px;
|
||||||
height: 32px;
|
height: 32px;
|
||||||
border-radius: 5px;
|
border-radius: 8px;
|
||||||
font-size: 18px;
|
font-size: 18px;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
|
@ -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: 5px;
|
border-radius: 6px;
|
||||||
font-size: 0.9em;
|
font-size: 0.9em;
|
||||||
|
|
||||||
&:hover {
|
&:hover {
|
||||||
|
|
|
@ -187,10 +187,10 @@ watch(() => props.user.avatarBlurhash, () => {
|
||||||
}
|
}
|
||||||
|
|
||||||
.square {
|
.square {
|
||||||
border-radius: 5px;
|
border-radius: 20%;
|
||||||
|
|
||||||
> .inner {
|
> .inner {
|
||||||
border-radius: 5px;
|
border-radius: 20%;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
|
@ -44,6 +44,6 @@ const emit = defineEmits<{
|
||||||
width: 128px;
|
width: 128px;
|
||||||
height: 128px;
|
height: 128px;
|
||||||
margin-bottom: 16px;
|
margin-bottom: 16px;
|
||||||
border-radius: 4px;
|
border-radius: 16px;
|
||||||
}
|
}
|
||||||
</style>
|
</style>
|
||||||
|
|
|
@ -245,7 +245,7 @@ onUnmounted(() => {
|
||||||
bottom: 0;
|
bottom: 0;
|
||||||
height: 3px;
|
height: 3px;
|
||||||
background: var(--accent);
|
background: var(--accent);
|
||||||
border-radius: 4px;
|
border-radius: 999px;
|
||||||
transition: none;
|
transition: none;
|
||||||
pointer-events: none;
|
pointer-events: none;
|
||||||
|
|
||||||
|
|
|
@ -82,6 +82,6 @@ definePageMetadata({
|
||||||
vertical-align: bottom;
|
vertical-align: bottom;
|
||||||
height: 128px;
|
height: 128px;
|
||||||
margin-bottom: 24px;
|
margin-bottom: 24px;
|
||||||
border-radius: 4px;
|
border-radius: 16px;
|
||||||
}
|
}
|
||||||
</style>
|
</style>
|
||||||
|
|
|
@ -220,7 +220,7 @@ definePageMetadata({
|
||||||
display: block;
|
display: block;
|
||||||
width: 80px;
|
width: 80px;
|
||||||
margin: 0 auto;
|
margin: 0 auto;
|
||||||
border-radius: 4px;
|
border-radius: 16px;
|
||||||
position: relative;
|
position: relative;
|
||||||
z-index: 1;
|
z-index: 1;
|
||||||
transform: translateX(-10%);
|
transform: translateX(-10%);
|
||||||
|
@ -271,7 +271,7 @@ definePageMetadata({
|
||||||
align-items: center;
|
align-items: center;
|
||||||
padding: 12px;
|
padding: 12px;
|
||||||
background: var(--buttonBg);
|
background: var(--buttonBg);
|
||||||
border-radius: 5px;
|
border-radius: 6px;
|
||||||
|
|
||||||
&:hover {
|
&:hover {
|
||||||
text-decoration: none;
|
text-decoration: none;
|
||||||
|
@ -304,7 +304,7 @@ definePageMetadata({
|
||||||
align-items: center;
|
align-items: center;
|
||||||
padding: 12px;
|
padding: 12px;
|
||||||
background: var(--buttonBg);
|
background: var(--buttonBg);
|
||||||
border-radius: 5px;
|
border-radius: 6px;
|
||||||
}
|
}
|
||||||
|
|
||||||
.patronIcon {
|
.patronIcon {
|
||||||
|
|
|
@ -168,7 +168,7 @@ definePageMetadata(computed(() => ({
|
||||||
<style lang="scss" module>
|
<style lang="scss" module>
|
||||||
.banner {
|
.banner {
|
||||||
text-align: center;
|
text-align: center;
|
||||||
border-radius: 5px;
|
border-radius: 10px;
|
||||||
overflow: clip;
|
overflow: clip;
|
||||||
background-size: cover;
|
background-size: cover;
|
||||||
background-position: center center;
|
background-position: center center;
|
||||||
|
@ -178,7 +178,7 @@ definePageMetadata(computed(() => ({
|
||||||
display: block;
|
display: block;
|
||||||
margin: 16px auto 0 auto;
|
margin: 16px auto 0 auto;
|
||||||
height: 64px;
|
height: 64px;
|
||||||
border-radius: 5px;
|
border-radius: 8px;
|
||||||
}
|
}
|
||||||
|
|
||||||
.bannerName {
|
.bannerName {
|
||||||
|
@ -217,7 +217,7 @@ definePageMetadata(computed(() => ({
|
||||||
font-weight: bold;
|
font-weight: bold;
|
||||||
align-items: center;
|
align-items: center;
|
||||||
justify-content: center;
|
justify-content: center;
|
||||||
border-radius: 4px;
|
border-radius: 999px;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
|
@ -546,7 +546,7 @@ definePageMetadata(computed(() => ({
|
||||||
> .suspended, > .silenced, > .moderator {
|
> .suspended, > .silenced, > .moderator {
|
||||||
display: inline-block;
|
display: inline-block;
|
||||||
border: solid 1px;
|
border: solid 1px;
|
||||||
border-radius: 5px;
|
border-radius: 6px;
|
||||||
padding: 2px 6px;
|
padding: 2px 6px;
|
||||||
font-size: 85%;
|
font-size: 85%;
|
||||||
}
|
}
|
||||||
|
@ -638,7 +638,7 @@ definePageMetadata(computed(() => ({
|
||||||
.announcementItem {
|
.announcementItem {
|
||||||
display: flex;
|
display: flex;
|
||||||
padding: 8px 12px;
|
padding: 8px 12px;
|
||||||
border-radius: 5px;
|
border-radius: 6px;
|
||||||
cursor: pointer;
|
cursor: pointer;
|
||||||
}
|
}
|
||||||
</style>
|
</style>
|
||||||
|
|
|
@ -286,7 +286,7 @@ onUnmounted(() => {
|
||||||
bottom: 0;
|
bottom: 0;
|
||||||
height: 3px;
|
height: 3px;
|
||||||
background: var(--accent);
|
background: var(--accent);
|
||||||
border-radius: 4px;
|
border-radius: 999px;
|
||||||
transition: all 0.2s ease;
|
transition: all 0.2s ease;
|
||||||
pointer-events: none;
|
pointer-events: none;
|
||||||
}
|
}
|
||||||
|
|
|
@ -369,7 +369,7 @@ defineExpose({
|
||||||
display: block;
|
display: block;
|
||||||
margin: auto;
|
margin: auto;
|
||||||
height: 42px;
|
height: 42px;
|
||||||
border-radius: 5px;
|
border-radius: 8px;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
|
@ -149,7 +149,7 @@ const props = defineProps<{
|
||||||
.diff {
|
.diff {
|
||||||
background: #fff;
|
background: #fff;
|
||||||
color: #000;
|
color: #000;
|
||||||
border-radius: 5px;
|
border-radius: 6px;
|
||||||
overflow: clip;
|
overflow: clip;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
|
@ -146,7 +146,7 @@ onMounted(async () => {
|
||||||
margin-right: 12px;
|
margin-right: 12px;
|
||||||
background: var(--accentedBg);
|
background: var(--accentedBg);
|
||||||
color: var(--accent);
|
color: var(--accent);
|
||||||
border-radius: 5px;
|
border-radius: 10px;
|
||||||
}
|
}
|
||||||
|
|
||||||
&.sub {
|
&.sub {
|
||||||
|
|
|
@ -115,7 +115,7 @@ onMounted(async () => {
|
||||||
margin-right: 12px;
|
margin-right: 12px;
|
||||||
background: var(--accentedBg);
|
background: var(--accentedBg);
|
||||||
color: var(--accent);
|
color: var(--accent);
|
||||||
border-radius: 5px;
|
border-radius: 10px;
|
||||||
}
|
}
|
||||||
|
|
||||||
&.users {
|
&.users {
|
||||||
|
|
|
@ -104,7 +104,7 @@ definePageMetadata({
|
||||||
height: 28px;
|
height: 28px;
|
||||||
align-items: center;
|
align-items: center;
|
||||||
justify-content: center;
|
justify-content: center;
|
||||||
border-radius: 4px;
|
border-radius: 999px;
|
||||||
margin-right: 8px;
|
margin-right: 8px;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@ -119,7 +119,7 @@ definePageMetadata({
|
||||||
height: 40px;
|
height: 40px;
|
||||||
color: var(--error);
|
color: var(--error);
|
||||||
margin-left: auto;
|
margin-left: auto;
|
||||||
border-radius: 5px;
|
border-radius: 6px;
|
||||||
|
|
||||||
&:hover {
|
&:hover {
|
||||||
background: var(--X5);
|
background: var(--X5);
|
||||||
|
|
|
@ -267,7 +267,7 @@ definePageMetadata(computed(() => channel ? {
|
||||||
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: 5px;
|
border-radius: 6px;
|
||||||
color: #fff;
|
color: #fff;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@ -282,7 +282,7 @@ definePageMetadata(computed(() => channel ? {
|
||||||
left: 16px;
|
left: 16px;
|
||||||
background: rgba(0, 0, 0, 0.7);
|
background: rgba(0, 0, 0, 0.7);
|
||||||
color: var(--warn);
|
color: var(--warn);
|
||||||
border-radius: 5px;
|
border-radius: 6px;
|
||||||
font-weight: bold;
|
font-weight: bold;
|
||||||
font-size: 1em;
|
font-size: 1em;
|
||||||
padding: 4px 7px;
|
padding: 4px 7px;
|
||||||
|
|
|
@ -206,7 +206,7 @@ async function del() {
|
||||||
|
|
||||||
.imgContainer {
|
.imgContainer {
|
||||||
padding: 8px;
|
padding: 8px;
|
||||||
border-radius: 5px;
|
border-radius: 6px;
|
||||||
}
|
}
|
||||||
|
|
||||||
.img {
|
.img {
|
||||||
|
|
|
@ -61,7 +61,7 @@ function menu(ev) {
|
||||||
padding: 12px;
|
padding: 12px;
|
||||||
text-align: left;
|
text-align: left;
|
||||||
background: var(--panel);
|
background: var(--panel);
|
||||||
border-radius: 5px;
|
border-radius: 8px;
|
||||||
|
|
||||||
&:hover {
|
&:hover {
|
||||||
border-color: var(--accent);
|
border-color: var(--accent);
|
||||||
|
|
|
@ -87,7 +87,7 @@ definePageMetadata(computed(() => ({
|
||||||
margin: 0 12px 0 0;
|
margin: 0 12px 0 0;
|
||||||
width: 42px;
|
width: 42px;
|
||||||
height: 42px;
|
height: 42px;
|
||||||
border-radius: 5px;
|
border-radius: 8px;
|
||||||
}
|
}
|
||||||
|
|
||||||
> .body {
|
> .body {
|
||||||
|
|
|
@ -254,7 +254,7 @@ definePageMetadata({
|
||||||
display: block;
|
display: block;
|
||||||
margin: 0 16px 0 0;
|
margin: 0 16px 0 0;
|
||||||
height: 64px;
|
height: 64px;
|
||||||
border-radius: 5px;
|
border-radius: 8px;
|
||||||
}
|
}
|
||||||
|
|
||||||
> .name {
|
> .name {
|
||||||
|
|
|
@ -114,6 +114,6 @@ definePageMetadata({
|
||||||
width: 128px;
|
width: 128px;
|
||||||
height: 128px;
|
height: 128px;
|
||||||
margin-bottom: 16px;
|
margin-bottom: 16px;
|
||||||
border-radius: 4px;
|
border-radius: 16px;
|
||||||
}
|
}
|
||||||
</style>
|
</style>
|
||||||
|
|
|
@ -141,7 +141,7 @@ definePageMetadata(computed(() => list ? {
|
||||||
width: 128px;
|
width: 128px;
|
||||||
height: 128px;
|
height: 128px;
|
||||||
margin-bottom: 16px;
|
margin-bottom: 16px;
|
||||||
border-radius: 4px;
|
border-radius: 16px;
|
||||||
}
|
}
|
||||||
|
|
||||||
.button {
|
.button {
|
||||||
|
|
|
@ -74,7 +74,7 @@ onActivated(() => {
|
||||||
display: block;
|
display: block;
|
||||||
padding: 16px;
|
padding: 16px;
|
||||||
border: solid 1px var(--divider);
|
border: solid 1px var(--divider);
|
||||||
border-radius: 5px;
|
border-radius: 6px;
|
||||||
|
|
||||||
&:hover {
|
&:hover {
|
||||||
border: solid 1px var(--accent);
|
border: solid 1px var(--accent);
|
||||||
|
|
|
@ -84,7 +84,7 @@ onActivated(() => {
|
||||||
display: block;
|
display: block;
|
||||||
padding: 16px;
|
padding: 16px;
|
||||||
border: solid 1px var(--divider);
|
border: solid 1px var(--divider);
|
||||||
border-radius: 5px;
|
border-radius: 6px;
|
||||||
margin-bottom: 8px;
|
margin-bottom: 8px;
|
||||||
|
|
||||||
&:hover {
|
&:hover {
|
||||||
|
|
|
@ -148,7 +148,7 @@ definePageMetadata(computed(() => note ? {
|
||||||
.loadPrev {
|
.loadPrev {
|
||||||
min-width: 0;
|
min-width: 0;
|
||||||
margin: 0 auto;
|
margin: 0 auto;
|
||||||
border-radius: 4px;
|
border-radius: 999px;
|
||||||
}
|
}
|
||||||
|
|
||||||
.loadNext {
|
.loadNext {
|
||||||
|
|
|
@ -63,7 +63,7 @@ function remove() {
|
||||||
overflow: hidden;
|
overflow: hidden;
|
||||||
background: var(--panel);
|
background: var(--panel);
|
||||||
border: solid 2px var(--X12);
|
border: solid 2px var(--X12);
|
||||||
border-radius: 5px;
|
border-radius: 8px;
|
||||||
|
|
||||||
&:hover {
|
&:hover {
|
||||||
border: solid 2px var(--X13);
|
border: solid 2px var(--X13);
|
||||||
|
|
|
@ -104,7 +104,7 @@ definePageMetadata(computed(() => ({
|
||||||
width: 128px;
|
width: 128px;
|
||||||
height: 128px;
|
height: 128px;
|
||||||
margin-bottom: 16px;
|
margin-bottom: 16px;
|
||||||
border-radius: 4px;
|
border-radius: 16px;
|
||||||
}
|
}
|
||||||
</style>
|
</style>
|
||||||
|
|
||||||
|
|
|
@ -93,7 +93,7 @@ definePageMetadata({
|
||||||
margin: 0 12px 0 0;
|
margin: 0 12px 0 0;
|
||||||
width: 50px;
|
width: 50px;
|
||||||
height: 50px;
|
height: 50px;
|
||||||
border-radius: 5px;
|
border-radius: 8px;
|
||||||
}
|
}
|
||||||
|
|
||||||
.appBody {
|
.appBody {
|
||||||
|
|
|
@ -152,7 +152,7 @@ definePageMetadata({
|
||||||
height: 12px;
|
height: 12px;
|
||||||
background: rgba(0, 0, 0, 0.1);
|
background: rgba(0, 0, 0, 0.1);
|
||||||
overflow: clip;
|
overflow: clip;
|
||||||
border-radius: 4px;
|
border-radius: 999px;
|
||||||
}
|
}
|
||||||
|
|
||||||
.meterValue {
|
.meterValue {
|
||||||
|
|
|
@ -148,12 +148,12 @@ definePageMetadata({
|
||||||
.meter {
|
.meter {
|
||||||
height: 10px;
|
height: 10px;
|
||||||
background: rgba(0, 0, 0, 0.1);
|
background: rgba(0, 0, 0, 0.1);
|
||||||
border-radius: 4px;
|
border-radius: 999px;
|
||||||
overflow: clip;
|
overflow: clip;
|
||||||
}
|
}
|
||||||
|
|
||||||
.meterValue {
|
.meterValue {
|
||||||
height: 100%;
|
height: 100%;
|
||||||
border-radius: 4px;
|
border-radius: 999px;
|
||||||
}
|
}
|
||||||
</style>
|
</style>
|
||||||
|
|
|
@ -340,7 +340,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: 5px;
|
border-radius: 10px;
|
||||||
overflow: clip;
|
overflow: clip;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
|
@ -7,7 +7,7 @@ SPDX-License-Identifier: AGPL-3.0-only
|
||||||
<div class="_gaps_m">
|
<div class="_gaps_m">
|
||||||
<FromSlot>
|
<FromSlot>
|
||||||
<template #label>{{ i18n.ts.reactionSettingDescription }}</template>
|
<template #label>{{ i18n.ts.reactionSettingDescription }}</template>
|
||||||
<div v-panel style="border-radius: 5px;">
|
<div v-panel style="border-radius: 6px;">
|
||||||
<Sortable v-model="reactions" :class="$style.reactions" :itemKey="item => item" :animation="150" :delay="100" :delayOnTouchOnly="true">
|
<Sortable v-model="reactions" :class="$style.reactions" :itemKey="item => item" :animation="150" :delay="100" :delayOnTouchOnly="true">
|
||||||
<template #item="{element}">
|
<template #item="{element}">
|
||||||
<button class="_button" :class="$style.reactionsItem" @click="remove(element, $event)">
|
<button class="_button" :class="$style.reactionsItem" @click="remove(element, $event)">
|
||||||
|
|
|
@ -172,7 +172,7 @@ definePageMetadata({
|
||||||
|
|
||||||
<style lang="scss" scoped>
|
<style lang="scss" scoped>
|
||||||
.rfqxtzch {
|
.rfqxtzch {
|
||||||
border-radius: 5px;
|
border-radius: 6px;
|
||||||
|
|
||||||
> .toggle {
|
> .toggle {
|
||||||
position: relative;
|
position: relative;
|
||||||
|
|
|
@ -244,7 +244,7 @@ definePageMetadata({
|
||||||
position: relative;
|
position: relative;
|
||||||
width: 64px;
|
width: 64px;
|
||||||
height: 64px;
|
height: 64px;
|
||||||
border-radius: 5px;
|
border-radius: 8px;
|
||||||
|
|
||||||
> .preview {
|
> .preview {
|
||||||
position: absolute;
|
position: absolute;
|
||||||
|
@ -271,10 +271,10 @@ definePageMetadata({
|
||||||
}
|
}
|
||||||
|
|
||||||
&.rounded {
|
&.rounded {
|
||||||
border-radius: 4px;
|
border-radius: 999px;
|
||||||
|
|
||||||
> .preview {
|
> .preview {
|
||||||
border-radius: 4px;
|
border-radius: 999px;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
|
@ -425,7 +425,7 @@ onUnmounted(() => {
|
||||||
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: 5px;
|
border-radius: 6px;
|
||||||
}
|
}
|
||||||
|
|
||||||
> .actions {
|
> .actions {
|
||||||
|
@ -532,7 +532,7 @@ onUnmounted(() => {
|
||||||
|
|
||||||
> .role {
|
> .role {
|
||||||
border: solid 1px var(--color, var(--divider));
|
border: solid 1px var(--color, var(--divider));
|
||||||
border-radius: 4px;
|
border-radius: 999px;
|
||||||
margin-right: 4px;
|
margin-right: 4px;
|
||||||
padding: 3px 8px;
|
padding: 3px 8px;
|
||||||
}
|
}
|
||||||
|
@ -547,7 +547,7 @@ onUnmounted(() => {
|
||||||
background: transparent;
|
background: transparent;
|
||||||
color: var(--fg);
|
color: var(--fg);
|
||||||
border: 1px solid var(--divider);
|
border: 1px solid var(--divider);
|
||||||
border-radius: 5px;
|
border-radius: 8px;
|
||||||
padding: 8px;
|
padding: 8px;
|
||||||
line-height: 0;
|
line-height: 0;
|
||||||
|
|
||||||
|
@ -755,9 +755,10 @@ onUnmounted(() => {
|
||||||
padding: calc(var(--margin) / 2) 0;
|
padding: calc(var(--margin) / 2) 0;
|
||||||
background: color-mix(in srgb, var(--bg) 65%, transparent);
|
background: color-mix(in srgb, var(--bg) 65%, transparent);
|
||||||
backdrop-filter: var(--blur, blur(15px));
|
backdrop-filter: var(--blur, blur(15px));
|
||||||
border-radius: 5px;
|
border-radius: 8px;
|
||||||
|
|
||||||
> button {
|
> button {
|
||||||
border-radius: 5px;
|
border-radius: 8px;
|
||||||
margin-left: 0.4rem;
|
margin-left: 0.4rem;
|
||||||
margin-right: 0.4rem;
|
margin-right: 0.4rem;
|
||||||
}
|
}
|
||||||
|
|
|
@ -89,7 +89,7 @@ onMounted(() => {
|
||||||
|
|
||||||
.img {
|
.img {
|
||||||
height: 128px;
|
height: 128px;
|
||||||
border-radius: 5px;
|
border-radius: 6px;
|
||||||
overflow: clip;
|
overflow: clip;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
|
@ -45,7 +45,7 @@ const pagination = {
|
||||||
display: block;
|
display: block;
|
||||||
padding: 16px;
|
padding: 16px;
|
||||||
border: solid 1px var(--divider);
|
border: solid 1px var(--divider);
|
||||||
border-radius: 5px;
|
border-radius: 6px;
|
||||||
margin-bottom: 8px;
|
margin-bottom: 8px;
|
||||||
|
|
||||||
&:hover {
|
&:hover {
|
||||||
|
|
|
@ -155,7 +155,7 @@ os.apiGet('federation/instances', {
|
||||||
background: var(--acrylicPanel);
|
background: var(--acrylicPanel);
|
||||||
-webkit-backdrop-filter: var(--blur, blur(15px));
|
-webkit-backdrop-filter: var(--blur, blur(15px));
|
||||||
backdrop-filter: var(--blur, blur(15px));
|
backdrop-filter: var(--blur, blur(15px));
|
||||||
border-radius: 4px;
|
border-radius: 999px;
|
||||||
overflow: clip;
|
overflow: clip;
|
||||||
width: 800px;
|
width: 800px;
|
||||||
padding: 8px 0;
|
padding: 8px 0;
|
||||||
|
@ -175,14 +175,14 @@ os.apiGet('federation/instances', {
|
||||||
padding: 6px 12px 6px 6px;
|
padding: 6px 12px 6px 6px;
|
||||||
margin: 0 10px 0 0;
|
margin: 0 10px 0 0;
|
||||||
background: var(--panel);
|
background: var(--panel);
|
||||||
border-radius: 4px;
|
border-radius: 999px;
|
||||||
|
|
||||||
> :global(.icon) {
|
> :global(.icon) {
|
||||||
display: inline-block;
|
display: inline-block;
|
||||||
width: 20px;
|
width: 20px;
|
||||||
height: 20px;
|
height: 20px;
|
||||||
margin-right: 5px;
|
margin-right: 5px;
|
||||||
border-radius: 4px;
|
border-radius: 999px;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
</style>
|
</style>
|
||||||
|
|
|
@ -88,7 +88,7 @@ onUpdated(() => {
|
||||||
padding: 16px;
|
padding: 16px;
|
||||||
margin: 0 0 0 auto;
|
margin: 0 0 0 auto;
|
||||||
max-width: max-content;
|
max-width: max-content;
|
||||||
border-radius: 4px;
|
border-radius: 16px;
|
||||||
}
|
}
|
||||||
|
|
||||||
.richcontent {
|
.richcontent {
|
||||||
|
|
|
@ -404,7 +404,7 @@ hr {
|
||||||
vertical-align: bottom;
|
vertical-align: bottom;
|
||||||
height: 128px;
|
height: 128px;
|
||||||
margin-bottom: 16px;
|
margin-bottom: 16px;
|
||||||
border-radius: 4px;
|
border-radius: 16px;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
|
@ -149,7 +149,7 @@ function more() {
|
||||||
left: 0;
|
left: 0;
|
||||||
right: 0;
|
right: 0;
|
||||||
bottom: 0;
|
bottom: 0;
|
||||||
border-radius: 4px;
|
border-radius: 999px;
|
||||||
background: linear-gradient(90deg, var(--buttonGradateA), var(--buttonGradateB));
|
background: linear-gradient(90deg, var(--buttonGradateA), var(--buttonGradateB));
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@ -236,7 +236,7 @@ function more() {
|
||||||
left: 0;
|
left: 0;
|
||||||
right: 0;
|
right: 0;
|
||||||
bottom: 0;
|
bottom: 0;
|
||||||
border-radius: 4px;
|
border-radius: 999px;
|
||||||
background: var(--accentedBg);
|
background: var(--accentedBg);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
|
@ -202,7 +202,7 @@ function more(ev: MouseEvent) {
|
||||||
left: 0;
|
left: 0;
|
||||||
right: 0;
|
right: 0;
|
||||||
bottom: 0;
|
bottom: 0;
|
||||||
border-radius: 4px;
|
border-radius: 999px;
|
||||||
background: linear-gradient(90deg, var(--buttonGradateA), var(--buttonGradateB));
|
background: linear-gradient(90deg, var(--buttonGradateA), var(--buttonGradateB));
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@ -296,7 +296,7 @@ function more(ev: MouseEvent) {
|
||||||
left: 0;
|
left: 0;
|
||||||
right: 0;
|
right: 0;
|
||||||
bottom: 0;
|
bottom: 0;
|
||||||
border-radius: 4px;
|
border-radius: 999px;
|
||||||
background: var(--accentedBg);
|
background: var(--accentedBg);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
@ -457,7 +457,7 @@ function more(ev: MouseEvent) {
|
||||||
left: 0;
|
left: 0;
|
||||||
right: 0;
|
right: 0;
|
||||||
bottom: 0;
|
bottom: 0;
|
||||||
border-radius: 4px;
|
border-radius: 999px;
|
||||||
background: var(--accentedBg);
|
background: var(--accentedBg);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
|
@ -22,7 +22,7 @@ defineProps<{
|
||||||
<style lang="scss" module>
|
<style lang="scss" module>
|
||||||
.root {
|
.root {
|
||||||
box-shadow: 0 4px 16px rgba(0, 0, 0, 0.3);
|
box-shadow: 0 4px 16px rgba(0, 0, 0, 0.3);
|
||||||
border-radius: 5px;
|
border-radius: 8px;
|
||||||
overflow: clip;
|
overflow: clip;
|
||||||
contain: content;
|
contain: content;
|
||||||
}
|
}
|
||||||
|
|
|
@ -40,7 +40,7 @@ const zIndex = os.claimZIndex('high');
|
||||||
padding: 16px 20px;
|
padding: 16px 20px;
|
||||||
pointer-events: none;
|
pointer-events: none;
|
||||||
box-shadow: 0 4px 16px rgba(0, 0, 0, 0.3);
|
box-shadow: 0 4px 16px rgba(0, 0, 0, 0.3);
|
||||||
border-radius: 5px;
|
border-radius: 8px;
|
||||||
}
|
}
|
||||||
.mk-uploader:empty {
|
.mk-uploader:empty {
|
||||||
display: none;
|
display: none;
|
||||||
|
|
|
@ -255,7 +255,7 @@ function onDrop(ev) {
|
||||||
height: 100%;
|
height: 100%;
|
||||||
overflow: clip;
|
overflow: clip;
|
||||||
contain: strict;
|
contain: strict;
|
||||||
border-radius: 5px;
|
border-radius: 10px;
|
||||||
|
|
||||||
&.draghover {
|
&.draghover {
|
||||||
&:after {
|
&:after {
|
||||||
|
@ -356,7 +356,7 @@ function onDrop(ev) {
|
||||||
width: 3px;
|
width: 3px;
|
||||||
height: calc(100% - 24px);
|
height: calc(100% - 24px);
|
||||||
background: var(--accent);
|
background: var(--accent);
|
||||||
border-radius: 4px;
|
border-radius: 999px;
|
||||||
}
|
}
|
||||||
|
|
||||||
.tabShape {
|
.tabShape {
|
||||||
|
|
|
@ -276,7 +276,7 @@ defineExpose({
|
||||||
padding: 10px;
|
padding: 10px;
|
||||||
box-sizing: border-box;
|
box-sizing: border-box;
|
||||||
text-align: center;
|
text-align: center;
|
||||||
border-radius: 4px;
|
border-radius: 999px;
|
||||||
|
|
||||||
&._button {
|
&._button {
|
||||||
background: var(--panel);
|
background: var(--panel);
|
||||||
|
|
|
@ -208,7 +208,7 @@ defineExpose<WidgetComponentExpose>({
|
||||||
width: 100%;
|
width: 100%;
|
||||||
overflow: hidden;
|
overflow: hidden;
|
||||||
background: var(--X11);
|
background: var(--X11);
|
||||||
border-radius: 5px;
|
border-radius: 8px;
|
||||||
}
|
}
|
||||||
|
|
||||||
.meterVal {
|
.meterVal {
|
||||||
|
|
|
@ -66,7 +66,7 @@ defineExpose<WidgetComponentExpose>({
|
||||||
display: inline-block;
|
display: inline-block;
|
||||||
width: 60px;
|
width: 60px;
|
||||||
height: 60px;
|
height: 60px;
|
||||||
border-radius: 5px;
|
border-radius: 8px;
|
||||||
box-sizing: border-box;
|
box-sizing: border-box;
|
||||||
border: solid 3px #fff;
|
border: solid 3px #fff;
|
||||||
}
|
}
|
||||||
|
|
|
@ -101,7 +101,7 @@ defineExpose<WidgetComponentExpose>({
|
||||||
|
|
||||||
.img {
|
.img {
|
||||||
border: solid 4px transparent;
|
border: solid 4px transparent;
|
||||||
border-radius: 5px;
|
border-radius: 8px;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
Loading…
Reference in a new issue