fix(#10923): invalid class names
This commit is contained in:
parent
f839d6c31c
commit
49af9e82cb
|
@ -11,6 +11,7 @@ export function unwindCssModuleClassName(ast: estree.Node): void {
|
|||
if (node.type !== 'VariableDeclaration') return;
|
||||
if (node.declarations.length !== 1) return;
|
||||
if (node.declarations[0].id.type !== 'Identifier') return;
|
||||
const name = node.declarations[0].id.name;
|
||||
if (node.declarations[0].init?.type !== 'CallExpression') return;
|
||||
if (node.declarations[0].init.callee.type !== 'Identifier') return;
|
||||
if (node.declarations[0].init.callee.name !== '_export_sfc') return;
|
||||
|
@ -121,10 +122,10 @@ export function unwindCssModuleClassName(ast: estree.Node): void {
|
|||
if (childNode.object.property.type !== 'Identifier') return;
|
||||
if (childNode.object.property.name !== key) return;
|
||||
if (childNode.property.type !== 'Identifier') return;
|
||||
console.error(`${key}.${childNode.property.name} is not a valid css module class name`);
|
||||
console.error(`Undefined style detected: ${key}.${childNode.property.name} (in ${name})`);
|
||||
this.replace({
|
||||
type: 'Literal',
|
||||
value: null,
|
||||
type: 'Identifier',
|
||||
name: 'undefined',
|
||||
});
|
||||
},
|
||||
});
|
||||
|
@ -152,9 +153,8 @@ export function unwindCssModuleClassName(ast: estree.Node): void {
|
|||
export default function pluginUnwindCssModuleClassName(): Plugin {
|
||||
return {
|
||||
name: 'UnwindCssModuleClassName',
|
||||
renderChunk(code, chunk): { code: string } {
|
||||
renderChunk(code): { code: string } {
|
||||
const ast = this.parse(code) as unknown as estree.Node;
|
||||
console.log(`======= ${chunk.fileName} =======`);
|
||||
unwindCssModuleClassName(ast);
|
||||
return { code: generate(ast) };
|
||||
},
|
||||
|
|
|
@ -10,7 +10,7 @@
|
|||
</li>
|
||||
<li tabindex="-1" :class="$style.item" @click="chooseUser()" @keydown="onKeydown">{{ i18n.ts.selectUser }}</li>
|
||||
</ol>
|
||||
<ol v-else-if="hashtags.length > 0" ref="suggests" :class="[$style.list, $style.hashtags]">
|
||||
<ol v-else-if="hashtags.length > 0" ref="suggests" :class="$style.list">
|
||||
<li v-for="hashtag in hashtags" tabindex="-1" :class="$style.item" @click="complete(type, hashtag)" @keydown="onKeydown">
|
||||
<span class="name">{{ hashtag }}</span>
|
||||
</li>
|
||||
|
|
|
@ -3,7 +3,7 @@
|
|||
<div v-if="game.ready" :class="$style.game">
|
||||
<div :class="$style.cps" class="">{{ number(cps) }}cps</div>
|
||||
<div :class="$style.count" class=""><i class="ti ti-cookie" style="font-size: 70%;"></i> {{ number(cookies) }}</div>
|
||||
<button v-click-anime class="_button" :class="$style.button" @click="onClick">
|
||||
<button v-click-anime class="_button" @click="onClick">
|
||||
<img src="/client-assets/cookie.png" :class="$style.img">
|
||||
</button>
|
||||
</div>
|
||||
|
@ -84,10 +84,6 @@ onUnmounted(() => {
|
|||
margin-bottom: 6px;
|
||||
}
|
||||
|
||||
.button {
|
||||
|
||||
}
|
||||
|
||||
.img {
|
||||
max-width: 90px;
|
||||
}
|
||||
|
|
|
@ -1,5 +1,5 @@
|
|||
<template>
|
||||
<div ref="rootEl" class="_panel" :class="[$style.root, { [$style.naked]: naked, [$style.thin]: thin, [$style.hideHeader]: !showHeader, [$style.scrollable]: scrollable, [$style.closed]: !showBody }]">
|
||||
<div ref="rootEl" class="_panel" :class="[$style.root, { [$style.naked]: naked, [$style.thin]: thin, [$style.scrollable]: scrollable }]">
|
||||
<header v-if="showHeader" ref="headerEl" :class="$style.header">
|
||||
<div :class="$style.title">
|
||||
<span :class="$style.titleIcon"><slot name="icon"></slot></span>
|
||||
|
|
|
@ -5,7 +5,7 @@
|
|||
<div :class="[$style.header, { [$style.opened]: opened }]" class="_button" role="button" data-cy-folder-header @click="toggle">
|
||||
<div :class="$style.headerIcon"><slot name="icon"></slot></div>
|
||||
<div :class="$style.headerText">
|
||||
<div :class="$style.headerTextMain">
|
||||
<div>
|
||||
<MkCondensedLine :minScale="2 / 3"><slot name="label"></slot></MkCondensedLine>
|
||||
</div>
|
||||
<div :class="$style.headerTextSub">
|
||||
|
@ -185,10 +185,6 @@ onMounted(() => {
|
|||
padding-right: 12px;
|
||||
}
|
||||
|
||||
.headerTextMain {
|
||||
|
||||
}
|
||||
|
||||
.headerTextSub {
|
||||
color: var(--fgTransparentWeak);
|
||||
font-size: .85em;
|
||||
|
|
|
@ -2,7 +2,7 @@
|
|||
<MkA v-user-preview="canonical" :class="[$style.root, { [$style.isMe]: isMe }]" :to="url" :style="{ background: bgCss }">
|
||||
<img :class="$style.icon" :src="`/avatar/@${username}@${host}`" alt="">
|
||||
<span>
|
||||
<span :class="$style.username">@{{ username }}</span>
|
||||
<span>@{{ username }}</span>
|
||||
<span v-if="(host != localHost) || defaultStore.state.showFullAcct" :class="$style.host">@{{ toUnicode(host) }}</span>
|
||||
</span>
|
||||
</MkA>
|
||||
|
|
|
@ -49,7 +49,7 @@
|
|||
<span>{{ i18n.ts.none }}</span>
|
||||
</span>
|
||||
</div>
|
||||
<div v-if="childMenu" :class="$style.child">
|
||||
<div v-if="childMenu">
|
||||
<XChild ref="child" :items="childMenu" :targetElement="childTarget" :rootElement="itemsEl" showing @actioned="childActioned"/>
|
||||
</div>
|
||||
</div>
|
||||
|
|
|
@ -44,8 +44,8 @@
|
|||
<div v-if="appearNote.channel" :class="$style.colorBar" :style="{ background: appearNote.channel.color }"></div>
|
||||
<MkAvatar :class="$style.avatar" :user="appearNote.user" link preview/>
|
||||
<div :class="$style.main">
|
||||
<MkNoteHeader :class="$style.header" :note="appearNote" :mini="true"/>
|
||||
<MkInstanceTicker v-if="showTicker" :class="$style.ticker" :instance="appearNote.user.instance"/>
|
||||
<MkNoteHeader :note="appearNote" :mini="true"/>
|
||||
<MkInstanceTicker v-if="showTicker" :instance="appearNote.user.instance"/>
|
||||
<div style="container-type: inline-size;">
|
||||
<p v-if="appearNote.cw != null" :class="$style.cw">
|
||||
<Mfm v-if="appearNote.cw != ''" style="margin-right: 8px;" :text="appearNote.cw" :author="appearNote.user" :i="$i"/>
|
||||
|
@ -58,13 +58,13 @@
|
|||
<Mfm v-if="appearNote.text" :text="appearNote.text" :author="appearNote.user" :i="$i" :emojiUrls="appearNote.emojis"/>
|
||||
<div v-if="translating || translation" :class="$style.translation">
|
||||
<MkLoading v-if="translating" mini/>
|
||||
<div v-else :class="$style.translated">
|
||||
<div v-else>
|
||||
<b>{{ i18n.t('translatedFrom', { x: translation.sourceLang }) }}: </b>
|
||||
<Mfm :text="translation.text" :author="appearNote.user" :i="$i" :emojiUrls="appearNote.emojis"/>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div v-if="appearNote.files.length > 0" :class="$style.files">
|
||||
<div v-if="appearNote.files.length > 0">
|
||||
<MkMediaList :mediaList="appearNote.files"/>
|
||||
</div>
|
||||
<MkPoll v-if="appearNote.poll" :note="appearNote" :class="$style.poll"/>
|
||||
|
|
|
@ -52,7 +52,7 @@
|
|||
</div>
|
||||
</div>
|
||||
<div :class="$style.noteHeaderUsername"><MkAcct :user="appearNote.user"/></div>
|
||||
<MkInstanceTicker v-if="showTicker" :class="$style.ticker" :instance="appearNote.user.instance"/>
|
||||
<MkInstanceTicker v-if="showTicker" :instance="appearNote.user.instance"/>
|
||||
</div>
|
||||
</header>
|
||||
<div :class="$style.noteContent">
|
||||
|
@ -72,7 +72,7 @@
|
|||
<Mfm :text="translation.text" :author="appearNote.user" :i="$i" :emojiUrls="appearNote.emojis"/>
|
||||
</div>
|
||||
</div>
|
||||
<div v-if="appearNote.files.length > 0" :class="$style.files">
|
||||
<div v-if="appearNote.files.length > 0">
|
||||
<MkMediaList :mediaList="appearNote.files"/>
|
||||
</div>
|
||||
<MkPoll v-if="appearNote.poll" ref="pollViewer" :note="appearNote" :class="$style.poll"/>
|
||||
|
|
|
@ -6,7 +6,7 @@
|
|||
<MkUserName :user="$i" :nowrap="true"/>
|
||||
</div>
|
||||
<div>
|
||||
<div :class="$style.content">
|
||||
<div>
|
||||
<Mfm :text="text.trim()" :author="$i" :i="$i"/>
|
||||
</div>
|
||||
</div>
|
||||
|
|
|
@ -46,7 +46,7 @@
|
|||
<span v-else>{{ notification.header }}</span>
|
||||
<MkTime v-if="withTime" :time="notification.createdAt" :class="$style.headerTime"/>
|
||||
</header>
|
||||
<div :class="$style.content">
|
||||
<div>
|
||||
<MkA v-if="notification.type === 'reaction'" :class="$style.text" :to="notePage(notification.note)" :title="getNoteSummary(notification.note)">
|
||||
<i class="ti ti-quote" :class="$style.quote"></i>
|
||||
<Mfm :text="getNoteSummary(notification.note)" :plain="true" :nowrap="true" :author="notification.note.user"/>
|
||||
|
@ -255,9 +255,6 @@ useTooltip(reactionRef, (showing) => {
|
|||
font-size: 0.9em;
|
||||
}
|
||||
|
||||
.content {
|
||||
}
|
||||
|
||||
.text {
|
||||
display: flex;
|
||||
width: 100%;
|
||||
|
|
|
@ -1,7 +1,7 @@
|
|||
<template>
|
||||
<div :class="{ [$style.done]: closed || isVoted }">
|
||||
<ul :class="$style.choices">
|
||||
<li v-for="(choice, i) in note.poll.choices" :key="i" :class="[$style.choice, { [$style.voted]: choice.voted }]" @click="vote(i)">
|
||||
<li v-for="(choice, i) in note.poll.choices" :key="i" :class="$style.choice" @click="vote(i)">
|
||||
<div :class="$style.bg" :style="{ 'width': `${showResult ? (choice.votes / total * 100) : 0}%` }"></div>
|
||||
<span :class="$style.fg">
|
||||
<template v-if="choice.isVoted"><i class="ti ti-check" style="margin-right: 4px; color: var(--accent);"></i></template>
|
||||
|
|
|
@ -27,16 +27,16 @@
|
|||
<span :class="$style.headerRightButtonText">{{ channel.name }}</span>
|
||||
</button>
|
||||
</template>
|
||||
<button v-click-anime v-tooltip="i18n.ts._visibility.disableFederation" class="_button" :class="[$style.headerRightItem, $style.localOnly, { [$style.danger]: localOnly }]" :disabled="channel != null || visibility === 'specified'" @click="toggleLocalOnly">
|
||||
<button v-click-anime v-tooltip="i18n.ts._visibility.disableFederation" class="_button" :class="[$style.headerRightItem, { [$style.danger]: localOnly }]" :disabled="channel != null || visibility === 'specified'" @click="toggleLocalOnly">
|
||||
<span v-if="!localOnly"><i class="ti ti-rocket"></i></span>
|
||||
<span v-else><i class="ti ti-rocket-off"></i></span>
|
||||
</button>
|
||||
<button v-click-anime v-tooltip="i18n.ts.reactionAcceptance" class="_button" :class="[$style.headerRightItem, $style.reactionAcceptance, { [$style.danger]: reactionAcceptance === 'likeOnly' }]" @click="toggleReactionAcceptance">
|
||||
<button v-click-anime v-tooltip="i18n.ts.reactionAcceptance" class="_button" :class="[$style.headerRightItem, { [$style.danger]: reactionAcceptance === 'likeOnly' }]" @click="toggleReactionAcceptance">
|
||||
<span v-if="reactionAcceptance === 'likeOnly'"><i class="ti ti-heart"></i></span>
|
||||
<span v-else-if="reactionAcceptance === 'likeOnlyForRemote'"><i class="ti ti-heart-plus"></i></span>
|
||||
<span v-else><i class="ti ti-icons"></i></span>
|
||||
</button>
|
||||
<button v-click-anime class="_button" :class="[$style.submit, { [$style.submitPosting]: posting }]" :disabled="!canPost" data-cy-open-post-form-submit @click="post">
|
||||
<button v-click-anime class="_button" :class="$style.submit" :disabled="!canPost" data-cy-open-post-form-submit @click="post">
|
||||
<div :class="$style.submitInner">
|
||||
<template v-if="posted"></template>
|
||||
<template v-else-if="posting"><MkEllipsis/></template>
|
||||
|
@ -66,7 +66,7 @@
|
|||
<div v-if="maxTextLength - textLength < 100" :class="['_acrylic', $style.textCount, { [$style.textOver]: textLength > maxTextLength }]">{{ maxTextLength - textLength }}</div>
|
||||
</div>
|
||||
<input v-show="withHashtags" ref="hashtagsInputEl" v-model="hashtags" :class="$style.hashtags" :placeholder="i18n.ts.hashtags" list="hashtags">
|
||||
<XPostFormAttaches v-model="files" :class="$style.attaches" @detach="detachFile" @changeSensitive="updateFileSensitive" @changeName="updateFileName"/>
|
||||
<XPostFormAttaches v-model="files" @detach="detachFile" @changeSensitive="updateFileSensitive" @changeName="updateFileName"/>
|
||||
<MkPollEditor v-if="poll" v-model="poll" @destroyed="poll = null"/>
|
||||
<MkNotePreview v-if="showPreview" :class="$style.preview" :text="text"/>
|
||||
<div v-if="showingOptions" style="padding: 8px 16px;">
|
||||
|
|
|
@ -1,6 +1,6 @@
|
|||
<template>
|
||||
<div :class="[$style.root, { [$style.collapsed]: collapsed }]">
|
||||
<div :class="$style.body">
|
||||
<div>
|
||||
<span v-if="note.isHidden" style="opacity: 0.5">({{ i18n.ts.private }})</span>
|
||||
<span v-if="note.deletedAt" style="opacity: 0.5">({{ i18n.ts.deleted }})</span>
|
||||
<MkA v-if="note.replyId" :class="$style.reply" :to="`/notes/${note.replyId}`"><i class="ti ti-arrow-back-up"></i></MkA>
|
||||
|
@ -76,10 +76,6 @@ const collapsed = $ref(
|
|||
}
|
||||
}
|
||||
|
||||
.body {
|
||||
|
||||
}
|
||||
|
||||
.reply {
|
||||
margin-right: 6px;
|
||||
color: var(--accent);
|
||||
|
|
|
@ -6,7 +6,7 @@
|
|||
ref="inputEl"
|
||||
v-model="v"
|
||||
v-adaptive-border
|
||||
:class="[$style.textarea, { [$style.code]: code, _monospace: code }]"
|
||||
:class="[$style.textarea, { _monospace: code }]"
|
||||
:disabled="disabled"
|
||||
:required="required"
|
||||
:readonly="readonly"
|
||||
|
|
|
@ -22,7 +22,7 @@
|
|||
</div>
|
||||
</template>
|
||||
<template v-else-if="tweetId && tweetExpanded">
|
||||
<div ref="twitter" :class="$style.twitter">
|
||||
<div ref="twitter">
|
||||
<iframe ref="tweet" scrolling="no" frameborder="no" :style="{ position: 'relative', width: '100%', height: `${tweetHeight}px` }" :src="`https://platform.twitter.com/embed/index.html?embedId=${embedId}&hideCard=false&hideThread=false&lang=en&theme=${defaultStore.state.darkMode ? 'dark' : 'light'}&id=${tweetId}`"></iframe>
|
||||
</div>
|
||||
<div :class="$style.action">
|
||||
|
@ -31,7 +31,7 @@
|
|||
</MkButton>
|
||||
</div>
|
||||
</template>
|
||||
<div v-else :class="$style.urlPreview">
|
||||
<div v-else>
|
||||
<component :is="self ? 'MkA' : 'a'" :class="[$style.link, { [$style.compact]: compact }]" :[attr]="self ? url.substr(local.length) : url" rel="nofollow noopener" :target="target" :title="url">
|
||||
<div v-if="thumbnail" :class="$style.thumbnail" :style="`background-image: url('${thumbnail}')`">
|
||||
</div>
|
||||
|
@ -210,13 +210,6 @@ onUnmounted(() => {
|
|||
width: 100%;
|
||||
}
|
||||
|
||||
.twitter {
|
||||
|
||||
}
|
||||
|
||||
.urlPreview {
|
||||
}
|
||||
|
||||
.link {
|
||||
position: relative;
|
||||
display: block;
|
||||
|
|
|
@ -9,7 +9,7 @@
|
|||
@closed="$emit('closed')"
|
||||
>
|
||||
<template #header>{{ i18n.ts.selectUser }}</template>
|
||||
<div :class="$style.root">
|
||||
<div>
|
||||
<div :class="$style.form">
|
||||
<FormSplit :minWidth="170">
|
||||
<MkInput v-model="username" :autofocus="true" @update:modelValue="search">
|
||||
|
@ -126,8 +126,6 @@ onMounted(() => {
|
|||
</script>
|
||||
|
||||
<style lang="scss" module>
|
||||
.root {
|
||||
}
|
||||
|
||||
.form {
|
||||
padding: 0 var(--root-margin);
|
||||
|
|
|
@ -3,9 +3,9 @@
|
|||
<div :class="$style.root">
|
||||
<div v-for="u in users" :key="u.id" :class="$style.user">
|
||||
<MkAvatar :class="$style.avatar" :user="u"/>
|
||||
<MkUserName :class="$style.name" :user="u" :nowrap="true"/>
|
||||
<MkUserName :user="u" :nowrap="true"/>
|
||||
</div>
|
||||
<div v-if="users.length < count" :class="$style.omitted">+{{ count - users.length }}</div>
|
||||
<div v-if="users.length < count">+{{ count - users.length }}</div>
|
||||
</div>
|
||||
</MkTooltip>
|
||||
</template>
|
||||
|
@ -43,14 +43,6 @@ const emit = defineEmits<{
|
|||
}
|
||||
}
|
||||
|
||||
.name {
|
||||
|
||||
}
|
||||
|
||||
.omitted {
|
||||
|
||||
}
|
||||
|
||||
.avatar {
|
||||
width: 24px;
|
||||
height: 24px;
|
||||
|
|
|
@ -39,7 +39,7 @@
|
|||
<MkTimeline src="local"/>
|
||||
</div>
|
||||
</div>
|
||||
<div :class="[$style.activeUsersChart, $style.panel]">
|
||||
<div :class="$style.panel">
|
||||
<XActiveUsersChart/>
|
||||
</div>
|
||||
</div>
|
||||
|
@ -220,8 +220,4 @@ function exploreOtherServers() {
|
|||
height: 350px;
|
||||
overflow: auto;
|
||||
}
|
||||
|
||||
.activeUsersChart {
|
||||
|
||||
}
|
||||
</style>
|
||||
|
|
|
@ -5,7 +5,7 @@
|
|||
<span :class="$style.text"><slot></slot></span>
|
||||
<span :class="$style.suffix">
|
||||
<span :class="$style.suffixText"><slot name="suffix"></slot></span>
|
||||
<i class="ti ti-external-link" :class="$style.suffixIcon"></i>
|
||||
<i class="ti ti-external-link"></i>
|
||||
</span>
|
||||
</a>
|
||||
<MkA v-else :class="[$style.main, { [$style.active]: active }]" class="_button" :to="to" :behavior="behavior">
|
||||
|
@ -13,7 +13,7 @@
|
|||
<span :class="$style.text"><slot></slot></span>
|
||||
<span :class="$style.suffix">
|
||||
<span :class="$style.suffixText"><slot name="suffix"></slot></span>
|
||||
<i class="ti ti-chevron-right" :class="$style.suffixIcon"></i>
|
||||
<i class="ti ti-chevron-right"></i>
|
||||
</span>
|
||||
</MkA>
|
||||
</div>
|
||||
|
|
|
@ -1,7 +1,7 @@
|
|||
<template>
|
||||
<div>
|
||||
<div :class="$style.label" @click="focus"><slot name="label"></slot></div>
|
||||
<div :class="$style.content">
|
||||
<div>
|
||||
<slot></slot>
|
||||
</div>
|
||||
<div :class="$style.caption"><slot name="caption"></slot></div>
|
||||
|
|
|
@ -6,7 +6,7 @@
|
|||
<template v-if="!self">
|
||||
<span :class="$style.schema">{{ schema }}//</span>
|
||||
<span :class="$style.hostname">{{ hostname }}</span>
|
||||
<span v-if="port != ''" :class="$style.port">:{{ port }}</span>
|
||||
<span v-if="port != ''">:{{ port }}</span>
|
||||
</template>
|
||||
<template v-if="pathname === '/' && self">
|
||||
<span :class="$style.self">{{ hostname }}</span>
|
||||
|
|
|
@ -1,5 +1,5 @@
|
|||
<template>
|
||||
<div :class="$style.root" class="_gaps">
|
||||
<div class="_gaps">
|
||||
<div :class="$style.header">
|
||||
<MkSelect v-model="type" :class="$style.typeSelect">
|
||||
<option value="isLocal">{{ i18n.ts._role._condition.isLocal }}</option>
|
||||
|
@ -24,7 +24,7 @@
|
|||
</button>
|
||||
</div>
|
||||
|
||||
<div v-if="type === 'and' || type === 'or'" :class="$style.values" class="_gaps">
|
||||
<div v-if="type === 'and' || type === 'or'" class="_gaps">
|
||||
<Sortable v-model="v.values" tag="div" class="_gaps" itemKey="id" handle=".drag-handle" :group="{ name: 'roleFormula' }" :animation="150" :swapThreshold="0.5">
|
||||
<template #item="{element}">
|
||||
<div :class="$style.item">
|
||||
|
@ -118,10 +118,6 @@ function removeSelf() {
|
|||
</script>
|
||||
|
||||
<style lang="scss" module>
|
||||
.root {
|
||||
|
||||
}
|
||||
|
||||
.header {
|
||||
display: flex;
|
||||
}
|
||||
|
@ -148,8 +144,4 @@ function removeSelf() {
|
|||
border-color: var(--accent);
|
||||
}
|
||||
}
|
||||
|
||||
.values {
|
||||
|
||||
}
|
||||
</style>
|
||||
|
|
|
@ -28,8 +28,8 @@
|
|||
<template #icon><i class="ti ti-alert-triangle"></i></template>
|
||||
<template #label>Errored instances</template>
|
||||
<template #suffix>({{ number(jobs.reduce((a, b) => a + b[1], 0)) }} jobs)</template>
|
||||
|
||||
<div :class="$style.jobs">
|
||||
|
||||
<div>
|
||||
<div v-if="jobs.length > 0">
|
||||
<div v-for="job in jobs" :key="job[0]">
|
||||
<MkA :to="`/instance-info/${job[0]}`" behavior="window">{{ job[0] }}</MkA>
|
||||
|
@ -150,7 +150,4 @@ onUnmounted(() => {
|
|||
font-size: 80%;
|
||||
opacity: 0.6;
|
||||
}
|
||||
|
||||
.jobs {
|
||||
}
|
||||
</style>
|
||||
|
|
|
@ -27,7 +27,7 @@
|
|||
</Sortable>
|
||||
<div :class="$style.commands">
|
||||
<MkButton rounded @click="serverRules.push('')"><i class="ti ti-plus"></i> {{ i18n.ts.add }}</MkButton>
|
||||
<MkButton primary rounded :class="$style.buttonSave" @click="save"><i class="ti ti-check"></i> {{ i18n.ts.save }}</MkButton>
|
||||
<MkButton primary rounded @click="save"><i class="ti ti-check"></i> {{ i18n.ts.save }}</MkButton>
|
||||
</div>
|
||||
</div>
|
||||
</MkSpacer>
|
||||
|
|
|
@ -3,7 +3,7 @@
|
|||
<div :class="$style.avatarAndBanner" :style="{ backgroundImage: $i.bannerUrl ? `url(${ $i.bannerUrl })` : null }">
|
||||
<div :class="$style.avatarContainer">
|
||||
<MkAvatar :class="$style.avatar" :user="$i" @click="changeAvatar"/>
|
||||
<MkButton primary rounded :class="$style.avatarEdit" @click="changeAvatar">{{ i18n.ts._profile.changeAvatar }}</MkButton>
|
||||
<MkButton primary rounded @click="changeAvatar">{{ i18n.ts._profile.changeAvatar }}</MkButton>
|
||||
</div>
|
||||
<MkButton primary rounded :class="$style.bannerEdit" @click="changeBanner">{{ i18n.ts._profile.changeBanner }}</MkButton>
|
||||
</div>
|
||||
|
@ -271,10 +271,6 @@ definePageMetadata({
|
|||
margin: 0 auto 16px auto;
|
||||
}
|
||||
|
||||
.avatarEdit {
|
||||
|
||||
}
|
||||
|
||||
.bannerEdit {
|
||||
position: absolute;
|
||||
top: 16px;
|
||||
|
|
|
@ -1,5 +1,5 @@
|
|||
<template>
|
||||
<div :class="$style.root">
|
||||
<div>
|
||||
<MkAnimBg style="position: fixed; top: 0;"/>
|
||||
<div :class="$style.formContainer">
|
||||
<form :class="$style.form" class="_panel" @submit.prevent="submit()">
|
||||
|
@ -53,9 +53,6 @@ function submit() {
|
|||
</script>
|
||||
|
||||
<style lang="scss" module>
|
||||
.root {
|
||||
}
|
||||
|
||||
.formContainer {
|
||||
min-height: 100svh;
|
||||
padding: 32px 32px 64px 32px;
|
||||
|
|
|
@ -1,5 +1,5 @@
|
|||
<template>
|
||||
<div :class="$style.root">
|
||||
<div>
|
||||
<MkAnimBg style="position: fixed; top: 0;"/>
|
||||
<div :class="$style.formContainer">
|
||||
<form :class="$style.form" class="_panel" @submit.prevent="submit()">
|
||||
|
@ -64,9 +64,6 @@ function submit() {
|
|||
</script>
|
||||
|
||||
<style lang="scss" module>
|
||||
.root {
|
||||
}
|
||||
|
||||
.formContainer {
|
||||
min-height: 100svh;
|
||||
padding: 32px 32px 64px 32px;
|
||||
|
|
|
@ -3,7 +3,7 @@
|
|||
<div ref="scrollEl" :class="[$style.scrollbox, { [$style.scroll]: isScrolling }]">
|
||||
<div v-for="note in notes" :key="note.id" :class="$style.note">
|
||||
<div class="_panel" :class="$style.content">
|
||||
<div :class="$style.body">
|
||||
<div>
|
||||
<MkA v-if="note.replyId" class="reply" :to="`/notes/${note.replyId}`"><i class="ti ti-arrow-back-up"></i></MkA>
|
||||
<Mfm v-if="note.text" :text="note.text" :author="note.user" :i="$i"/>
|
||||
<MkA v-if="note.renoteId" class="rp" :to="`/notes/${note.renoteId}`">RN: ...</MkA>
|
||||
|
|
|
@ -14,7 +14,7 @@
|
|||
<MkA :to="`/instance-info/${instance.host}`" :class="$style.host" class="_monospace">
|
||||
{{ instance.host }}
|
||||
</MkA>
|
||||
<span :class="$style.divider"></span>
|
||||
<span></span>
|
||||
</span>
|
||||
</MarqueeText>
|
||||
</Transition>
|
||||
|
|
|
@ -4,7 +4,6 @@
|
|||
v-for="x in defaultStore.reactiveState.statusbars.value" :key="x.id" :class="[$style.item, { [$style.black]: x.black,
|
||||
[$style.verySmall]: x.size === 'verySmall',
|
||||
[$style.small]: x.size === 'small',
|
||||
[$style.medium]: x.size === 'medium',
|
||||
[$style.large]: x.size === 'large',
|
||||
[$style.veryLarge]: x.size === 'veryLarge',
|
||||
}]"
|
||||
|
|
|
@ -2,8 +2,8 @@
|
|||
<div v-if="hasDisconnected && defaultStore.state.serverDisconnectedBehavior === 'quiet'" :class="$style.root" class="_panel _shadow" @click="resetDisconnected">
|
||||
<div><i class="ti ti-alert-triangle"></i> {{ i18n.ts.disconnectedFromServer }}</div>
|
||||
<div :class="$style.command" class="_buttons">
|
||||
<MkButton :class="$style.commandButton" small primary @click="reload">{{ i18n.ts.reload }}</MkButton>
|
||||
<MkButton :class="$style.commandButton" small>{{ i18n.ts.doNothing }}</MkButton>
|
||||
<MkButton small primary @click="reload">{{ i18n.ts.reload }}</MkButton>
|
||||
<MkButton small>{{ i18n.ts.doNothing }}</MkButton>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
@ -54,7 +54,4 @@ onUnmounted(() => {
|
|||
.command {
|
||||
margin-top: 8px;
|
||||
}
|
||||
|
||||
.commandButton {
|
||||
}
|
||||
</style>
|
||||
|
|
|
@ -1,6 +1,6 @@
|
|||
<template>
|
||||
<div
|
||||
:class="[$style.root, { [$style.paged]: isMainColumn, [$style.naked]: naked, [$style.active]: active, [$style.isStacked]: isStacked, [$style.draghover]: draghover, [$style.dragging]: dragging, [$style.dropready]: dropready }]"
|
||||
:class="[$style.root, { [$style.paged]: isMainColumn, [$style.naked]: naked, [$style.active]: active, [$style.draghover]: draghover, [$style.dragging]: dragging, [$style.dropready]: dropready }]"
|
||||
@dragover.prevent.stop="onDragover"
|
||||
@dragleave="onDragleave"
|
||||
@drop.prevent.stop="onDrop"
|
||||
|
|
|
@ -5,7 +5,7 @@
|
|||
<MkStickyContainer :class="$style.contents">
|
||||
<template #header><XStatusBars :class="$style.statusbars"/></template>
|
||||
<main style="min-width: 0;" @contextmenu.stop="onContextmenu">
|
||||
<div :class="$style.content" style="container-type: inline-size;">
|
||||
<div style="container-type: inline-size;">
|
||||
<RouterView/>
|
||||
</div>
|
||||
<div :class="$style.spacer"></div>
|
||||
|
|
|
@ -1,6 +1,6 @@
|
|||
<template>
|
||||
<div :class="$style.root">
|
||||
<XWidgets :class="$style.widgets" :edit="editMode" :widgets="widgets" @addWidget="addWidget" @removeWidget="removeWidget" @updateWidget="updateWidget" @updateWidgets="updateWidgets" @exit="editMode = false"/>
|
||||
<div>
|
||||
<XWidgets :edit="editMode" :widgets="widgets" @addWidget="addWidget" @removeWidget="removeWidget" @updateWidget="updateWidget" @updateWidgets="updateWidgets" @exit="editMode = false"/>
|
||||
|
||||
<button v-if="editMode" class="_textButton" style="font-size: 0.9em;" @click="editMode = false"><i class="ti ti-check"></i> {{ i18n.ts.editWidgetsExit }}</button>
|
||||
<button v-else class="_textButton" data-cy-widget-edit :class="$style.edit" style="font-size: 0.9em;" @click="editMode = true"><i class="ti ti-pencil"></i> {{ i18n.ts.editWidgets }}</button>
|
||||
|
@ -70,9 +70,6 @@ function updateWidgets(thisWidgets) {
|
|||
</script>
|
||||
|
||||
<style lang="scss" module>
|
||||
.root {
|
||||
}
|
||||
|
||||
.edit {
|
||||
width: 100%;
|
||||
}
|
||||
|
|
|
@ -12,7 +12,7 @@
|
|||
<Transition :name="$style.change" mode="default" appear>
|
||||
<MarqueeText :key="key" :duration="widgetProps.duration" :reverse="widgetProps.reverse">
|
||||
<span v-for="item in items" :key="item.link" :class="$style.item">
|
||||
<a :class="$style.link" :href="item.link" rel="nofollow noopener" target="_blank" :title="item.title">{{ item.title }}</a><span :class="$style.divider"></span>
|
||||
<a :href="item.link" rel="nofollow noopener" target="_blank" :title="item.title">{{ item.title }}</a><span :class="$style.divider"></span>
|
||||
</span>
|
||||
</MarqueeText>
|
||||
</Transition>
|
||||
|
|
Loading…
Reference in a new issue