chore: formatting

This commit is contained in:
ThatOneCalculator 2023-04-22 17:22:53 -07:00
parent 9f4a000361
commit 8790303669
6 changed files with 45 additions and 43 deletions

View file

@ -1,6 +1,6 @@
{
"name": "calckey",
"version": "13.2.0-dev35",
"version": "13.2.0-dev36",
"codename": "aqua",
"repository": {
"type": "git",

View file

@ -1,14 +1,14 @@
<template>
<button
class="_button"
:class="{showLess: modelValue, fade: !modelValue}"
:class="{ showLess: modelValue, fade: !modelValue }"
@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>
</button>
</template>
<script lang="ts" setup>
@ -51,14 +51,14 @@ const toggle = () => {
> span {
background: var(--cwBg) !important;
color: var(--cwFg);
transition: background .2s, color .2s;
transition: background 0.2s, color 0.2s;
> span {
font-weight: 500;
&::before {
content: "("
content: "(";
}
&::after {
content: ")"
content: ")";
}
}
}

View file

@ -85,10 +85,7 @@
:parentId="appearNote.parentId"
@push="(e) => router.push(notePage(e))"
></MkSubNoteContent>
<div
v-if="translating || translation"
class="translation"
>
<div v-if="translating || translation" class="translation">
<MkLoading v-if="translating" mini />
<div v-else class="translated">
<b
@ -117,10 +114,7 @@
</div>
<div v-if="detailedView" class="info">
<MkA class="created-at" :to="notePage(appearNote)">
<MkTime
:time="appearNote.createdAt"
mode="absolute"
/>
<MkTime :time="appearNote.createdAt" mode="absolute" />
</MkA>
</div>
<footer ref="el" class="footer" @click.stop>
@ -670,7 +664,7 @@ function readPromo() {
display: flex;
flex-wrap: wrap;
pointer-events: none; // Allow clicking anything w/out pointer-events: all; to open post
margin-top: .4em;
margin-top: 0.4em;
> .button {
margin: 0;
padding: 8px;

View file

@ -20,7 +20,7 @@
:note="appearNote.reply"
class="reply-to"
/>
<div ref="noteEl" class="article" tabindex="-1">
<MkNote
@contextmenu.stop="onContextmenu"

View file

@ -30,10 +30,11 @@
:custom-emojis="note.emojis"
/>
</p>
<div
class="wrmlmaau"
>
<div class="content" :class="{ collapsed, isLong, showContent: note.cw && !showContent }">
<div class="wrmlmaau">
<div
class="content"
:class="{ collapsed, isLong, showContent: note.cw && !showContent }"
>
<div class="body">
<span v-if="note.deletedAt" style="opacity: 0.5"
>({{ i18n.ts.deleted }})</span
@ -68,13 +69,16 @@
:i="$i"
: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
>
<div v-if="note.files.length > 0" class="files">
<XMediaList :media-list="note.files" />
</div>
<XPoll v-if="note.poll" :note="note" class="poll"/>
<XPoll v-if="note.poll" :note="note" class="poll" />
<template v-if="detailed">
<MkUrlPreview
v-for="url in urls"
@ -84,8 +88,12 @@
:detail="false"
class="url-preview"
/>
<div v-if="note.renote" class="renote" @click.stop="emit('push', note.renote)">
<XNoteSimple :note="note.renote"/>
<div
v-if="note.renote"
class="renote"
@click.stop="emit('push', note.renote)"
>
<XNoteSimple :note="note.renote" />
</div>
</template>
</div>
@ -132,19 +140,17 @@ const emit = defineEmits<{
(ev: "push", v): void;
}>();
const isLong = !props.detailedView && (
props.note.cw == null &&
props.note.text != null &&
(props.note.text.split("\n").length > 9 || props.note.text.length > 500)
);
const isLong =
!props.detailedView &&
props.note.cw == null &&
props.note.text != null &&
(props.note.text.split("\n").length > 9 || props.note.text.length > 500);
const collapsed = $ref(props.note.cw == null && isLong);
const urls = props.note.text
? extractUrlFromMfm(mfm.parse(props.note.text)).slice(0, 5)
: null;
let showContent = $ref(false);
let showContent = $ref(false);
</script>
<style lang="scss" scoped>
@ -155,7 +161,8 @@ let showContent = $ref(false);
margin-right: 0.2em;
color: var(--accent);
transition: background 0.2s;
&:hover, &:focus {
&:hover,
&:focus {
background: var(--buttonHoverBg);
}
}
@ -174,7 +181,7 @@ let showContent = $ref(false);
.content {
overflow-wrap: break-word;
> .body {
transition: filter .1s;
transition: filter 0.1s;
> .rp {
margin-left: 4px;
font-style: oblique;
@ -199,7 +206,7 @@ let showContent = $ref(false);
> .url-preview {
margin-top: 8px;
}
> .poll {
font-size: 80%;
}
@ -217,18 +224,19 @@ let showContent = $ref(false);
}
}
}
}
&.collapsed, &.showContent {
&.collapsed,
&.showContent {
position: relative;
max-height: calc(9em + 50px);
> .body {
max-height: inherit;
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;
margin-inline: -50px;
margin-top: -50px;
@ -262,7 +270,7 @@ let showContent = $ref(false);
> span {
display: inline-block;
background: var(--panel);
padding: .4em 1em;
padding: 0.4em 1em;
font-size: 0.8em;
border-radius: 999px;
box-shadow: 0 2px 6px rgb(0 0 0 / 20%);

View file

@ -96,7 +96,7 @@ export function uploadFile(
if (xhr.status === 413) {
alert({
type: 'error',
type: "error",
title: i18n.ts.failedToUpload,
text: i18n.ts.cannotUploadBecauseExceedsFileSizeLimit,
});