chore: formatting
This commit is contained in:
parent
29818a067b
commit
591e44ccd6
6 changed files with 45 additions and 43 deletions
|
@ -1,6 +1,6 @@
|
||||||
{
|
{
|
||||||
"name": "calckey",
|
"name": "calckey",
|
||||||
"version": "13.2.0-dev35",
|
"version": "13.2.0-dev36",
|
||||||
"codename": "aqua",
|
"codename": "aqua",
|
||||||
"repository": {
|
"repository": {
|
||||||
"type": "git",
|
"type": "git",
|
||||||
|
|
|
@ -1,14 +1,14 @@
|
||||||
<template>
|
<template>
|
||||||
<button
|
<button
|
||||||
class="_button"
|
class="_button"
|
||||||
:class="{showLess: modelValue, fade: !modelValue}"
|
:class="{ showLess: modelValue, fade: !modelValue }"
|
||||||
@click.stop="toggle"
|
@click.stop="toggle"
|
||||||
>
|
>
|
||||||
<span>{{ modelValue ? i18n.ts._cw.hide : i18n.ts._cw.show }}
|
<span
|
||||||
|
>{{ modelValue ? i18n.ts._cw.hide : i18n.ts._cw.show }}
|
||||||
<span v-if="!modelValue">{{ label }}</span>
|
<span v-if="!modelValue">{{ label }}</span>
|
||||||
</span>
|
</span>
|
||||||
</button>
|
</button>
|
||||||
|
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script lang="ts" setup>
|
<script lang="ts" setup>
|
||||||
|
@ -51,14 +51,14 @@ const toggle = () => {
|
||||||
> span {
|
> span {
|
||||||
background: var(--cwBg) !important;
|
background: var(--cwBg) !important;
|
||||||
color: var(--cwFg);
|
color: var(--cwFg);
|
||||||
transition: background .2s, color .2s;
|
transition: background 0.2s, color 0.2s;
|
||||||
> span {
|
> span {
|
||||||
font-weight: 500;
|
font-weight: 500;
|
||||||
&::before {
|
&::before {
|
||||||
content: "("
|
content: "(";
|
||||||
}
|
}
|
||||||
&::after {
|
&::after {
|
||||||
content: ")"
|
content: ")";
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
|
@ -85,10 +85,7 @@
|
||||||
:parentId="appearNote.parentId"
|
:parentId="appearNote.parentId"
|
||||||
@push="(e) => router.push(notePage(e))"
|
@push="(e) => router.push(notePage(e))"
|
||||||
></MkSubNoteContent>
|
></MkSubNoteContent>
|
||||||
<div
|
<div v-if="translating || translation" class="translation">
|
||||||
v-if="translating || translation"
|
|
||||||
class="translation"
|
|
||||||
>
|
|
||||||
<MkLoading v-if="translating" mini />
|
<MkLoading v-if="translating" mini />
|
||||||
<div v-else class="translated">
|
<div v-else class="translated">
|
||||||
<b
|
<b
|
||||||
|
@ -117,10 +114,7 @@
|
||||||
</div>
|
</div>
|
||||||
<div v-if="detailedView" class="info">
|
<div v-if="detailedView" class="info">
|
||||||
<MkA class="created-at" :to="notePage(appearNote)">
|
<MkA class="created-at" :to="notePage(appearNote)">
|
||||||
<MkTime
|
<MkTime :time="appearNote.createdAt" mode="absolute" />
|
||||||
:time="appearNote.createdAt"
|
|
||||||
mode="absolute"
|
|
||||||
/>
|
|
||||||
</MkA>
|
</MkA>
|
||||||
</div>
|
</div>
|
||||||
<footer ref="el" class="footer" @click.stop>
|
<footer ref="el" class="footer" @click.stop>
|
||||||
|
@ -670,7 +664,7 @@ function readPromo() {
|
||||||
display: flex;
|
display: flex;
|
||||||
flex-wrap: wrap;
|
flex-wrap: wrap;
|
||||||
pointer-events: none; // Allow clicking anything w/out pointer-events: all; to open post
|
pointer-events: none; // Allow clicking anything w/out pointer-events: all; to open post
|
||||||
margin-top: .4em;
|
margin-top: 0.4em;
|
||||||
> .button {
|
> .button {
|
||||||
margin: 0;
|
margin: 0;
|
||||||
padding: 8px;
|
padding: 8px;
|
||||||
|
|
|
@ -30,10 +30,11 @@
|
||||||
:custom-emojis="note.emojis"
|
:custom-emojis="note.emojis"
|
||||||
/>
|
/>
|
||||||
</p>
|
</p>
|
||||||
|
<div class="wrmlmaau">
|
||||||
<div
|
<div
|
||||||
class="wrmlmaau"
|
class="content"
|
||||||
|
:class="{ collapsed, isLong, showContent: note.cw && !showContent }"
|
||||||
>
|
>
|
||||||
<div class="content" :class="{ collapsed, isLong, showContent: note.cw && !showContent }">
|
|
||||||
<div class="body">
|
<div class="body">
|
||||||
<span v-if="note.deletedAt" style="opacity: 0.5"
|
<span v-if="note.deletedAt" style="opacity: 0.5"
|
||||||
>({{ i18n.ts.deleted }})</span
|
>({{ i18n.ts.deleted }})</span
|
||||||
|
@ -68,13 +69,16 @@
|
||||||
:i="$i"
|
:i="$i"
|
||||||
:custom-emojis="note.emojis"
|
:custom-emojis="note.emojis"
|
||||||
/>
|
/>
|
||||||
<MkA v-if="!detailed && note.renoteId" class="rp" :to="`/notes/${note.renoteId}`"
|
<MkA
|
||||||
|
v-if="!detailed && note.renoteId"
|
||||||
|
class="rp"
|
||||||
|
:to="`/notes/${note.renoteId}`"
|
||||||
>{{ i18n.ts.quoteAttached }}: ...</MkA
|
>{{ i18n.ts.quoteAttached }}: ...</MkA
|
||||||
>
|
>
|
||||||
<div v-if="note.files.length > 0" class="files">
|
<div v-if="note.files.length > 0" class="files">
|
||||||
<XMediaList :media-list="note.files" />
|
<XMediaList :media-list="note.files" />
|
||||||
</div>
|
</div>
|
||||||
<XPoll v-if="note.poll" :note="note" class="poll"/>
|
<XPoll v-if="note.poll" :note="note" class="poll" />
|
||||||
<template v-if="detailed">
|
<template v-if="detailed">
|
||||||
<MkUrlPreview
|
<MkUrlPreview
|
||||||
v-for="url in urls"
|
v-for="url in urls"
|
||||||
|
@ -84,8 +88,12 @@
|
||||||
:detail="false"
|
:detail="false"
|
||||||
class="url-preview"
|
class="url-preview"
|
||||||
/>
|
/>
|
||||||
<div v-if="note.renote" class="renote" @click.stop="emit('push', note.renote)">
|
<div
|
||||||
<XNoteSimple :note="note.renote"/>
|
v-if="note.renote"
|
||||||
|
class="renote"
|
||||||
|
@click.stop="emit('push', note.renote)"
|
||||||
|
>
|
||||||
|
<XNoteSimple :note="note.renote" />
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
</div>
|
</div>
|
||||||
|
@ -132,19 +140,17 @@ const emit = defineEmits<{
|
||||||
(ev: "push", v): void;
|
(ev: "push", v): void;
|
||||||
}>();
|
}>();
|
||||||
|
|
||||||
|
const isLong =
|
||||||
const isLong = !props.detailedView && (
|
!props.detailedView &&
|
||||||
props.note.cw == null &&
|
props.note.cw == null &&
|
||||||
props.note.text != null &&
|
props.note.text != null &&
|
||||||
(props.note.text.split("\n").length > 9 || props.note.text.length > 500)
|
(props.note.text.split("\n").length > 9 || props.note.text.length > 500);
|
||||||
);
|
|
||||||
const collapsed = $ref(props.note.cw == null && isLong);
|
const collapsed = $ref(props.note.cw == null && isLong);
|
||||||
const urls = props.note.text
|
const urls = props.note.text
|
||||||
? extractUrlFromMfm(mfm.parse(props.note.text)).slice(0, 5)
|
? extractUrlFromMfm(mfm.parse(props.note.text)).slice(0, 5)
|
||||||
: null;
|
: null;
|
||||||
|
|
||||||
let showContent = $ref(false);
|
let showContent = $ref(false);
|
||||||
|
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<style lang="scss" scoped>
|
<style lang="scss" scoped>
|
||||||
|
@ -155,7 +161,8 @@ let showContent = $ref(false);
|
||||||
margin-right: 0.2em;
|
margin-right: 0.2em;
|
||||||
color: var(--accent);
|
color: var(--accent);
|
||||||
transition: background 0.2s;
|
transition: background 0.2s;
|
||||||
&:hover, &:focus {
|
&:hover,
|
||||||
|
&:focus {
|
||||||
background: var(--buttonHoverBg);
|
background: var(--buttonHoverBg);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
@ -174,7 +181,7 @@ let showContent = $ref(false);
|
||||||
.content {
|
.content {
|
||||||
overflow-wrap: break-word;
|
overflow-wrap: break-word;
|
||||||
> .body {
|
> .body {
|
||||||
transition: filter .1s;
|
transition: filter 0.1s;
|
||||||
> .rp {
|
> .rp {
|
||||||
margin-left: 4px;
|
margin-left: 4px;
|
||||||
font-style: oblique;
|
font-style: oblique;
|
||||||
|
@ -217,18 +224,19 @@ let showContent = $ref(false);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
}
|
}
|
||||||
|
|
||||||
|
&.collapsed,
|
||||||
|
&.showContent {
|
||||||
&.collapsed, &.showContent {
|
|
||||||
position: relative;
|
position: relative;
|
||||||
max-height: calc(9em + 50px);
|
max-height: calc(9em + 50px);
|
||||||
> .body {
|
> .body {
|
||||||
max-height: inherit;
|
max-height: inherit;
|
||||||
mask: linear-gradient(black calc(100% - 64px), transparent);
|
mask: linear-gradient(black calc(100% - 64px), transparent);
|
||||||
-webkit-mask: linear-gradient(black calc(100% - 64px), transparent);
|
-webkit-mask: linear-gradient(
|
||||||
|
black calc(100% - 64px),
|
||||||
|
transparent
|
||||||
|
);
|
||||||
padding-inline: 50px;
|
padding-inline: 50px;
|
||||||
margin-inline: -50px;
|
margin-inline: -50px;
|
||||||
margin-top: -50px;
|
margin-top: -50px;
|
||||||
|
@ -262,7 +270,7 @@ let showContent = $ref(false);
|
||||||
> span {
|
> span {
|
||||||
display: inline-block;
|
display: inline-block;
|
||||||
background: var(--panel);
|
background: var(--panel);
|
||||||
padding: .4em 1em;
|
padding: 0.4em 1em;
|
||||||
font-size: 0.8em;
|
font-size: 0.8em;
|
||||||
border-radius: 999px;
|
border-radius: 999px;
|
||||||
box-shadow: 0 2px 6px rgb(0 0 0 / 20%);
|
box-shadow: 0 2px 6px rgb(0 0 0 / 20%);
|
||||||
|
|
|
@ -96,7 +96,7 @@ export function uploadFile(
|
||||||
|
|
||||||
if (xhr.status === 413) {
|
if (xhr.status === 413) {
|
||||||
alert({
|
alert({
|
||||||
type: 'error',
|
type: "error",
|
||||||
title: i18n.ts.failedToUpload,
|
title: i18n.ts.failedToUpload,
|
||||||
text: i18n.ts.cannotUploadBecauseExceedsFileSizeLimit,
|
text: i18n.ts.cannotUploadBecauseExceedsFileSizeLimit,
|
||||||
});
|
});
|
||||||
|
|
Loading…
Reference in a new issue