massive visual overhaul
This commit is contained in:
Henry Jameson
parent
5a6f4fb466
commit
1642d62b82
63 changed files with 387 additions and 399 deletions
|
|
@ -704,6 +704,7 @@ option {
|
|||
position: relative;
|
||||
display: inline-flex;
|
||||
vertical-align: middle;
|
||||
min-height: 2em;
|
||||
|
||||
.Select select {
|
||||
line-height: 1;
|
||||
|
|
|
|||
|
|
@ -1,9 +1,10 @@
|
|||
<template>
|
||||
<div class="font-control">
|
||||
<div class="setting-item">
|
||||
<Checkbox
|
||||
v-if="typeof fallback !== 'undefined'"
|
||||
:id="name + '-o'"
|
||||
class="font-checkbox"
|
||||
class="font-checkbox setting-control setting-label"
|
||||
:model-value="present"
|
||||
@change="$emit('update:modelValue', typeof modelValue === 'undefined' ? fallback : undefined)"
|
||||
>
|
||||
|
|
@ -12,13 +13,16 @@
|
|||
keypath="settings.style.fonts.override"
|
||||
tag="span"
|
||||
>
|
||||
<span class="label">
|
||||
{{ label }}
|
||||
</span>
|
||||
</i18n-t>
|
||||
</Checkbox>
|
||||
</div>
|
||||
{{ ' ' }}
|
||||
<div
|
||||
v-if="modelValue?.family"
|
||||
class="font-input"
|
||||
class="font-input setting-item"
|
||||
>
|
||||
<label
|
||||
v-if="manualEntry"
|
||||
|
|
@ -132,15 +136,29 @@
|
|||
<script src="./font_control.js"></script>
|
||||
|
||||
<style lang="scss">
|
||||
// Copy-paste of BooleanSetting
|
||||
.font-control {
|
||||
.custom-font {
|
||||
min-width: 20em;
|
||||
max-width: 20em;
|
||||
display: grid;
|
||||
grid-template-columns: subgrid;
|
||||
|
||||
.checkbox {
|
||||
display: grid;
|
||||
grid-template-columns: subgrid;
|
||||
}
|
||||
|
||||
.font-input {
|
||||
margin-left: 2em;
|
||||
margin-top: 0.5em;
|
||||
.label {
|
||||
grid-area: label;
|
||||
text-align: right;
|
||||
}
|
||||
|
||||
.-mobile & {
|
||||
.label {
|
||||
text-align: left;
|
||||
}
|
||||
}
|
||||
|
||||
.checkbox-indicator {
|
||||
grid-area: control;
|
||||
}
|
||||
}
|
||||
|
||||
|
|
|
|||
|
|
@ -3,6 +3,8 @@ import localeService from '../../services/locale/locale.service.js'
|
|||
import Select from '../select/select.vue'
|
||||
import ProfileSettingIndicator from 'src/components/settings_modal/helpers/profile_setting_indicator.vue'
|
||||
|
||||
import { v4 as uuidv4 } from 'uuid';
|
||||
|
||||
export default {
|
||||
components: {
|
||||
Select,
|
||||
|
|
@ -26,7 +28,9 @@ export default {
|
|||
languages () {
|
||||
return localeService.languages
|
||||
},
|
||||
|
||||
uniqueId () {
|
||||
return uuidv4()
|
||||
},
|
||||
controlledLanguage: {
|
||||
get: function () {
|
||||
return Array.isArray(this.modelValue) ? this.modelValue : [this.modelValue]
|
||||
|
|
|
|||
|
|
@ -1,17 +1,20 @@
|
|||
<template>
|
||||
<div class="interface-language-switcher">
|
||||
<label>
|
||||
<slot />
|
||||
<ProfileSettingIndicator :is-profile="profile" />
|
||||
</label>
|
||||
<ul class="setting-list">
|
||||
<ul class="interface-language-switcher setting-list">
|
||||
<li
|
||||
v-for="index of controlledLanguage.keys()"
|
||||
:key="index"
|
||||
class="setting-item"
|
||||
>
|
||||
<label
|
||||
class="setting-label"
|
||||
:for="uniqueId+index"
|
||||
>
|
||||
<label>
|
||||
{{ index === 0 ? $t('settings.primary_language') : $t('settings.fallback_language', { index }, index) }}
|
||||
</label>
|
||||
<span class="setting-control btn-group">
|
||||
<Select
|
||||
:name="uniqueId+index"
|
||||
:id="uniqueId+index"
|
||||
class="language-select"
|
||||
:model-value="controlledLanguage[index]"
|
||||
@update:model-value="val => setLanguageAt(index, val)"
|
||||
|
|
@ -24,7 +27,6 @@
|
|||
{{ lang.name }}
|
||||
</option>
|
||||
</Select>
|
||||
</label>
|
||||
<button
|
||||
v-if="controlledLanguage.length > 1 && index !== 0"
|
||||
class="button-default btn"
|
||||
|
|
@ -32,8 +34,9 @@
|
|||
>
|
||||
{{ $t('settings.remove_language') }}
|
||||
</button>
|
||||
</span>
|
||||
</li>
|
||||
<li>
|
||||
<li class="add-button">
|
||||
<button
|
||||
class="button-default btn"
|
||||
@click="addLanguage"
|
||||
|
|
@ -42,15 +45,27 @@
|
|||
</button>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script src="./interface_language_switcher.js"></script>
|
||||
|
||||
<style lang="scss">
|
||||
.interface-language-switcher {
|
||||
.language-select {
|
||||
margin-right: 1em;
|
||||
.setting-list {
|
||||
.setting-item {
|
||||
display: grid;
|
||||
grid-template-columns: subgrid;
|
||||
}
|
||||
}
|
||||
|
||||
.add-button {
|
||||
display: block;
|
||||
text-align: center;
|
||||
|
||||
.default-button {
|
||||
display: block;
|
||||
width: auto;
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
|
|
|||
|
|
@ -1,6 +1,6 @@
|
|||
<template>
|
||||
<div :label="$t('admin_dash.tabs.job_queues')">
|
||||
<div class="setting-item">
|
||||
<div class="setting-section">
|
||||
<h3>{{ $t('admin_dash.auth.MFA') }}</h3>
|
||||
<ul class="setting-list">
|
||||
<li>
|
||||
|
|
|
|||
|
|
@ -3,7 +3,7 @@
|
|||
class="EmojiTab"
|
||||
:label="$t('admin_dash.tabs.emoji')"
|
||||
>
|
||||
<div class="setting-item">
|
||||
<div class="setting-section">
|
||||
<h3 class="toolbar">
|
||||
<span class="header-text">
|
||||
{{ $t('admin_dash.emoji.emoji_packs') }}
|
||||
|
|
|
|||
|
|
@ -1,6 +1,6 @@
|
|||
<template>
|
||||
<div :label="$t('admin_dash.tabs.federation')">
|
||||
<div class="setting-item">
|
||||
<div class="setting-section">
|
||||
<h3>{{ $t('admin_dash.federation.global') }}</h3>
|
||||
<ul class="setting-list">
|
||||
<li>
|
||||
|
|
|
|||
|
|
@ -3,7 +3,7 @@
|
|||
class="FrontendsTab"
|
||||
:label="$t('admin_dash.tabs.frontends')"
|
||||
>
|
||||
<div class="setting-item">
|
||||
<div class="setting-section">
|
||||
<h3>{{ $t('admin_dash.frontend.title') }}</h3>
|
||||
<p>{{ $t('admin_dash.frontend.wip_notice') }}</p>
|
||||
<ul
|
||||
|
|
|
|||
|
|
@ -3,7 +3,7 @@
|
|||
class="LinksTab"
|
||||
:label="$t('admin_dash.tabs.http')"
|
||||
>
|
||||
<div class="setting-item">
|
||||
<div class="setting-section">
|
||||
<h3>{{ $t('admin_dash.http.outbound') }}</h3>
|
||||
<ul class="setting-list">
|
||||
<li>
|
||||
|
|
@ -30,7 +30,7 @@
|
|||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
<div class="setting-item">
|
||||
<div class="setting-section">
|
||||
<h3>{{ $t('admin_dash.http.incoming') }}</h3>
|
||||
<ul class="setting-list">
|
||||
<h4>{{ $t('admin_dash.http.security') }}</h4>
|
||||
|
|
|
|||
|
|
@ -1,6 +1,6 @@
|
|||
<template>
|
||||
<div :label="$t('admin_dash.tabs.instance')">
|
||||
<div class="setting-item">
|
||||
<div class="setting-section">
|
||||
<h3>{{ $t('admin_dash.instance.instance') }}</h3>
|
||||
<ul class="setting-list">
|
||||
<li>
|
||||
|
|
@ -73,7 +73,7 @@
|
|||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
<div class="setting-item">
|
||||
<div class="setting-section">
|
||||
<h3>{{ $t('admin_dash.instance.access') }}</h3>
|
||||
<ul class="setting-list">
|
||||
<li>
|
||||
|
|
|
|||
|
|
@ -1,6 +1,6 @@
|
|||
<template>
|
||||
<div :label="$t('admin_dash.tabs.job_queues')">
|
||||
<div class="setting-item">
|
||||
<div class="setting-section">
|
||||
<h3>{{ $t('admin_dash.job_queues.Gun.title') }}</h3>
|
||||
<ul class="setting-list">
|
||||
<li>
|
||||
|
|
|
|||
|
|
@ -1,6 +1,6 @@
|
|||
<template>
|
||||
<div :label="$t('admin_dash.tabs.limits')">
|
||||
<div class="setting-item">
|
||||
<div class="setting-section">
|
||||
<h3>{{ $t('admin_dash.limits.arbitrary_limits') }}</h3>
|
||||
<ul class="setting-list">
|
||||
<li>
|
||||
|
|
|
|||
|
|
@ -1,26 +0,0 @@
|
|||
.LinksTab {
|
||||
// awkward "disable = false" backend options
|
||||
.weird-options {
|
||||
.checkbox {
|
||||
margin: 0;
|
||||
}
|
||||
}
|
||||
|
||||
.setting-list.suboptions.weird-suboptions {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 0.5em;
|
||||
margin: 0;
|
||||
|
||||
li {
|
||||
margin: 0;
|
||||
display: flex;
|
||||
}
|
||||
|
||||
.GroupSetting {
|
||||
display: inline-block;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
@ -3,7 +3,7 @@
|
|||
class="LinksTab"
|
||||
:label="$t('admin_dash.tabs.media_proxy')"
|
||||
>
|
||||
<div class="setting-item">
|
||||
<div class="setting-section">
|
||||
<h3>{{ $t('admin_dash.links.link_previews') }}</h3>
|
||||
<ul class="setting-list">
|
||||
<li>
|
||||
|
|
@ -43,5 +43,3 @@
|
|||
</template>
|
||||
|
||||
<script src="./links_tab.js"></script>
|
||||
|
||||
<style lang="scss" src="./links_tab.scss"></style>
|
||||
|
|
|
|||
|
|
@ -1,6 +1,6 @@
|
|||
<template>
|
||||
<div :label="$t('admin_dash.tabs.mailer')">
|
||||
<div class="setting-item">
|
||||
<div class="setting-section">
|
||||
<h3>{{ $t('admin_dash.mailer.adapter') }}</h3>
|
||||
<ul class="setting-list">
|
||||
<li>
|
||||
|
|
|
|||
|
|
@ -1,6 +1,6 @@
|
|||
<template>
|
||||
<div :label="$t('admin_dash.tabs.media_proxy')">
|
||||
<div class="setting-item">
|
||||
<div class="setting-section">
|
||||
<h3>{{ $t('admin_dash.media_proxy.basic') }}</h3>
|
||||
<ul class="setting-list">
|
||||
<li>
|
||||
|
|
|
|||
|
|
@ -1,6 +1,6 @@
|
|||
<template>
|
||||
<div :label="$t('admin_dash.tabs.monitoring')">
|
||||
<div class="setting-item">
|
||||
<div class="setting-section">
|
||||
<h3>{{ $t('admin_dash.monitoring.builtins') }}</h3>
|
||||
<ul class="setting-list">
|
||||
<li>
|
||||
|
|
|
|||
|
|
@ -1,6 +1,6 @@
|
|||
<template>
|
||||
<div :label="$t('admin_dash.tabs.other')">
|
||||
<div class="setting-item">
|
||||
<div class="setting-section">
|
||||
<h3>{{ $t('admin_dash.other.uncategorized') }}</h3>
|
||||
<ul class="setting-list">
|
||||
<li>
|
||||
|
|
|
|||
|
|
@ -1,6 +1,6 @@
|
|||
<template>
|
||||
<div :label="$t('admin_dash.tabs.posts')">
|
||||
<div class="setting-item">
|
||||
<div class="setting-section">
|
||||
<h3>{{ $t('admin_dash.posts.global') }}</h3>
|
||||
<ul class="setting-list">
|
||||
<li>
|
||||
|
|
|
|||
|
|
@ -1,6 +1,6 @@
|
|||
<template>
|
||||
<div :label="$t('admin_dash.tabs.instance')">
|
||||
<div class="setting-item">
|
||||
<div class="setting-section">
|
||||
<h3>{{ $t('admin_dash.rate_limit.account_confirmation_resend') }}</h3>
|
||||
<ul class="setting-list">
|
||||
<li>
|
||||
|
|
|
|||
|
|
@ -1,6 +1,6 @@
|
|||
<template>
|
||||
<div :label="$t('admin_dash.tabs.instance')">
|
||||
<div class="setting-item">
|
||||
<div class="setting-section">
|
||||
<h3>{{ $t('admin_dash.instance.registrations') }}</h3>
|
||||
<ul class="setting-list">
|
||||
<li>
|
||||
|
|
|
|||
|
|
@ -1,6 +1,6 @@
|
|||
<template>
|
||||
<div :label="$t('admin_dash.tabs.uploads')">
|
||||
<div class="setting-item">
|
||||
<div class="setting-section">
|
||||
<h3>{{ $t('admin_dash.uploads.upload') }}</h3>
|
||||
<ul class="setting-list">
|
||||
<li>
|
||||
|
|
|
|||
|
|
@ -1,10 +1,11 @@
|
|||
<template>
|
||||
<span
|
||||
v-if="matchesExpertLevel"
|
||||
class="AttachmentSetting"
|
||||
class="AttachmentSetting setting-item"
|
||||
:class="{ '-compact': compact }"
|
||||
>
|
||||
<label
|
||||
class="setting-label"
|
||||
:for="path"
|
||||
:class="{ 'faint': shouldBeDisabled }"
|
||||
>
|
||||
|
|
|
|||
|
|
@ -1,9 +1,10 @@
|
|||
<template>
|
||||
<label
|
||||
v-if="matchesExpertLevel"
|
||||
class="BooleanSetting"
|
||||
class="BooleanSetting setting-item"
|
||||
>
|
||||
<Checkbox
|
||||
class="setting-control setting-label"
|
||||
:model-value="visibleState"
|
||||
:disabled="shouldBeDisabled"
|
||||
:indeterminate="isIndeterminate"
|
||||
|
|
@ -13,6 +14,12 @@
|
|||
class="label"
|
||||
:class="{ 'faint': shouldBeDisabled }"
|
||||
>
|
||||
<ModifiedIndicator
|
||||
:changed="isChanged"
|
||||
:onclick="reset"
|
||||
/>
|
||||
<ProfileSettingIndicator :is-profile="isProfileSetting" />
|
||||
{{ ' ' }}
|
||||
<template v-if="backendDescriptionLabel">
|
||||
{{ backendDescriptionLabel }}
|
||||
</template>
|
||||
|
|
@ -22,13 +29,6 @@
|
|||
<slot v-else />
|
||||
</span>
|
||||
</Checkbox>
|
||||
{{ ' ' }}
|
||||
<ModifiedIndicator
|
||||
:changed="isChanged"
|
||||
:onclick="reset"
|
||||
/>
|
||||
<ProfileSettingIndicator :is-profile="isProfileSetting" />
|
||||
<DraftButtons />
|
||||
<p
|
||||
v-if="backendDescriptionDescription"
|
||||
class="setting-description"
|
||||
|
|
@ -36,7 +36,35 @@
|
|||
>
|
||||
{{ backendDescriptionDescription + ' ' }}
|
||||
</p>
|
||||
<DraftButtons />
|
||||
</label>
|
||||
</template>
|
||||
|
||||
<script src="./boolean_setting.js"></script>
|
||||
|
||||
<style lang="scss">
|
||||
.BooleanSetting {
|
||||
display: grid;
|
||||
grid-template-columns: subgrid;
|
||||
|
||||
.checkbox {
|
||||
display: grid;
|
||||
grid-template-columns: subgrid;
|
||||
}
|
||||
|
||||
.label {
|
||||
grid-area: label;
|
||||
text-align: right;
|
||||
}
|
||||
|
||||
.-mobile & {
|
||||
.label {
|
||||
text-align: left;
|
||||
}
|
||||
}
|
||||
|
||||
.checkbox-indicator {
|
||||
grid-area: control;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
|
|
|||
|
|
@ -1,17 +1,25 @@
|
|||
<template>
|
||||
<label
|
||||
v-if="matchesExpertLevel"
|
||||
class="ChoiceSetting"
|
||||
class="ChoiceSetting setting-item"
|
||||
:class="{ 'faint': shouldBeDisabled }"
|
||||
>
|
||||
<span class="setting-label">
|
||||
<ModifiedIndicator
|
||||
:changed="isChanged"
|
||||
:onclick="reset"
|
||||
/>
|
||||
<ProfileSettingIndicator :is-profile="isProfileSetting" />
|
||||
{{ ' ' }}
|
||||
<template v-if="backendDescriptionLabel">
|
||||
{{ backendDescriptionLabel }}
|
||||
</template>
|
||||
<template v-else>
|
||||
<slot />
|
||||
</template>
|
||||
{{ ' ' }}
|
||||
</span>
|
||||
<Select
|
||||
class="setting-control"
|
||||
:model-value="realDraftMode ? draft : state"
|
||||
:disabled="shouldBeDisabled"
|
||||
@update:model-value="update"
|
||||
|
|
@ -25,11 +33,6 @@
|
|||
{{ option.value === defaultState ? $t('settings.instance_default_simple') : '' }}
|
||||
</option>
|
||||
</Select>
|
||||
<ModifiedIndicator
|
||||
:changed="isChanged"
|
||||
:onclick="reset"
|
||||
/>
|
||||
<ProfileSettingIndicator :is-profile="isProfileSetting" />
|
||||
<DraftButtons />
|
||||
<p
|
||||
v-if="backendDescriptionDescription"
|
||||
|
|
@ -41,3 +44,16 @@
|
|||
</template>
|
||||
|
||||
<script src="./choice_setting.js"></script>
|
||||
|
||||
<style lang="scss">
|
||||
.ChoiceSetting.setting-item {
|
||||
.-mobile & {
|
||||
display: block;
|
||||
|
||||
.setting-label {
|
||||
display: block;
|
||||
margin-bottom: 0.5em
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
|
|
|||
|
|
@ -1,7 +1,7 @@
|
|||
<template>
|
||||
<label
|
||||
v-if="matchesExpertLevel"
|
||||
class="ColorSetting"
|
||||
class="ColorSetting setting-item"
|
||||
>
|
||||
<label
|
||||
v-if="!hideLabel"
|
||||
|
|
|
|||
|
|
@ -1,7 +1,7 @@
|
|||
<template>
|
||||
<span
|
||||
v-if="matchesExpertLevel"
|
||||
class="GroupSetting"
|
||||
class="GroupSetting setting-item"
|
||||
>
|
||||
<ModifiedIndicator
|
||||
:changed="isChanged"
|
||||
|
|
|
|||
|
|
@ -1,7 +1,7 @@
|
|||
<template>
|
||||
<div
|
||||
v-if="matchesExpertLevel"
|
||||
class="ListSetting"
|
||||
class="ListSetting setting-item"
|
||||
>
|
||||
<label
|
||||
class="setting-label"
|
||||
|
|
|
|||
|
|
@ -1,7 +1,7 @@
|
|||
<template>
|
||||
<div
|
||||
v-if="matchesExpertLevel"
|
||||
class="MapSetting"
|
||||
class="MapSetting setting-item"
|
||||
>
|
||||
<label
|
||||
class="setting-label"
|
||||
|
|
|
|||
|
|
@ -1,7 +1,7 @@
|
|||
<template>
|
||||
<span
|
||||
v-if="matchesExpertLevel"
|
||||
class="NumberSetting"
|
||||
class="NumberSetting setting-item"
|
||||
>
|
||||
<label
|
||||
v-if="!hideLabel"
|
||||
|
|
@ -20,7 +20,7 @@
|
|||
{{ ' ' }}
|
||||
<input
|
||||
:id="path"
|
||||
class="input number-input"
|
||||
class="input number-input setting-control"
|
||||
type="number"
|
||||
:step="step || 1"
|
||||
:disabled="shouldBeDisabled"
|
||||
|
|
|
|||
|
|
@ -1,7 +1,7 @@
|
|||
<template>
|
||||
<label
|
||||
v-if="matchesExpertLevel"
|
||||
class="ProxySetting"
|
||||
class="ProxySetting setting-item"
|
||||
>
|
||||
<label
|
||||
v-if="!hideLabel"
|
||||
|
|
|
|||
|
|
@ -1,7 +1,7 @@
|
|||
<template>
|
||||
<div
|
||||
v-if="matchesExpertLevel"
|
||||
class="PWAManifestIconsSetting"
|
||||
class="PWAManifestIconsSetting setting-item"
|
||||
>
|
||||
<label
|
||||
class="setting-label"
|
||||
|
|
|
|||
|
|
@ -1,7 +1,7 @@
|
|||
<template>
|
||||
<div
|
||||
v-if="matchesExpertLevel"
|
||||
class="RateSetting"
|
||||
class="RateSetting setting-item"
|
||||
>
|
||||
<label
|
||||
class="setting-label"
|
||||
|
|
|
|||
|
|
@ -1,7 +1,7 @@
|
|||
<template>
|
||||
<label
|
||||
<span
|
||||
v-if="matchesExpertLevel"
|
||||
class="StringSetting"
|
||||
class="StringSetting setting-item"
|
||||
>
|
||||
<label
|
||||
v-if="!hideLabel"
|
||||
|
|
@ -9,6 +9,12 @@
|
|||
class="setting-label"
|
||||
:class="{ 'faint': shouldBeDisabled }"
|
||||
>
|
||||
<ModifiedIndicator
|
||||
:changed="isChanged"
|
||||
:onclick="reset"
|
||||
/>
|
||||
<ProfileSettingIndicator :is-profile="isProfileSetting" />
|
||||
{{ ' ' }}
|
||||
<template v-if="backendDescriptionLabel">
|
||||
{{ backendDescriptionLabel + ' ' }}
|
||||
</template>
|
||||
|
|
@ -17,10 +23,9 @@
|
|||
</template>
|
||||
<slot v-else />
|
||||
</label>
|
||||
{{ ' ' }}
|
||||
<input
|
||||
:id="path"
|
||||
class="input string-input"
|
||||
class="setting-control input string-input"
|
||||
:class="{ disabled: shouldBeDisabled }"
|
||||
:disabled="shouldBeDisabled"
|
||||
:placeholder="backendDescriptionSuggestions"
|
||||
|
|
@ -28,11 +33,6 @@
|
|||
@change="update"
|
||||
>
|
||||
{{ ' ' }}
|
||||
<ModifiedIndicator
|
||||
:changed="isChanged"
|
||||
:onclick="reset"
|
||||
/>
|
||||
<ProfileSettingIndicator :is-profile="isProfileSetting" />
|
||||
<DraftButtons v-if="!hideDraftButtons" />
|
||||
<p
|
||||
v-if="backendDescriptionDescription"
|
||||
|
|
@ -41,7 +41,7 @@
|
|||
>
|
||||
{{ backendDescriptionDescription + ' ' }}
|
||||
</p>
|
||||
</label>
|
||||
</span>
|
||||
</template>
|
||||
|
||||
<script src="./string_setting.js"></script>
|
||||
|
|
|
|||
|
|
@ -1,7 +1,7 @@
|
|||
<template>
|
||||
<label
|
||||
<span
|
||||
class="setting-item"
|
||||
v-if="matchesExpertLevel"
|
||||
class="TupleSetting"
|
||||
>
|
||||
<label
|
||||
v-if="!hideLabel"
|
||||
|
|
@ -9,6 +9,12 @@
|
|||
class="setting-label"
|
||||
:class="{ 'faint': shouldBeDisabled }"
|
||||
>
|
||||
<ModifiedIndicator
|
||||
:changed="isChanged"
|
||||
:onclick="reset"
|
||||
/>
|
||||
<ProfileSettingIndicator :is-profile="isProfileSetting" />
|
||||
{{ ' ' }}
|
||||
<template v-if="backendDescriptionLabel">
|
||||
{{ backendDescriptionLabel + ' ' }}
|
||||
</template>
|
||||
|
|
@ -17,7 +23,7 @@
|
|||
</template>
|
||||
<slot v-else />
|
||||
</label>
|
||||
{{ ' ' }}
|
||||
<span class="setting-control">
|
||||
<input
|
||||
:id="path"
|
||||
class="input string-input"
|
||||
|
|
@ -37,22 +43,7 @@
|
|||
:value="visibleState?.tuple?.[1]"
|
||||
@change="e => update({ e, side: 1 })"
|
||||
>
|
||||
{{ ' ' }}
|
||||
<input
|
||||
:id="path"
|
||||
class="input string-input"
|
||||
:class="{ disabled: shouldBeDisabled }"
|
||||
:disabled="shouldBeDisabled"
|
||||
:placeholder="backendDescriptionSuggestions?.[0]?.[1]"
|
||||
:value="visibleState?.tuple?.[2]"
|
||||
@change="e => update({ e, side: 2 })"
|
||||
>
|
||||
{{ ' ' }}
|
||||
<ModifiedIndicator
|
||||
:changed="isChanged"
|
||||
:onclick="reset"
|
||||
/>
|
||||
<ProfileSettingIndicator :is-profile="isProfileSetting" />
|
||||
</span>
|
||||
<DraftButtons v-if="!hideDraftButtons" />
|
||||
<p
|
||||
v-if="backendDescriptionDescription"
|
||||
|
|
@ -61,7 +52,7 @@
|
|||
>
|
||||
{{ backendDescriptionDescription + ' ' }}
|
||||
</p>
|
||||
</label>
|
||||
</span>
|
||||
</template>
|
||||
|
||||
<script src="./tuple_setting.js"></script>
|
||||
|
|
|
|||
|
|
@ -1,16 +1,16 @@
|
|||
<template>
|
||||
<span
|
||||
v-if="matchesExpertLevel"
|
||||
class="UnitSetting"
|
||||
class="UnitSetting setting-item"
|
||||
>
|
||||
<label
|
||||
:for="path"
|
||||
class="size-label"
|
||||
class="setting-label size-label"
|
||||
>
|
||||
<slot />
|
||||
</label>
|
||||
{{ ' ' }}
|
||||
<span class="no-break">
|
||||
<span class="no-break setting-control">
|
||||
<input
|
||||
:id="path"
|
||||
class="input number-input"
|
||||
|
|
@ -50,7 +50,7 @@
|
|||
<style lang="scss">
|
||||
.UnitSetting {
|
||||
.no-break {
|
||||
display: inline-block;
|
||||
display: inline-flex;
|
||||
}
|
||||
|
||||
.number-input {
|
||||
|
|
|
|||
|
|
@ -161,9 +161,11 @@ export default {
|
|||
const contentClasses = ['tab-content']
|
||||
if (props['full-width'] || props['full-width'] === '') {
|
||||
contentClasses.push('-full-width')
|
||||
wrapperClasses.push('-full-width')
|
||||
}
|
||||
if (props['full-height'] || props['full-width'] === '') {
|
||||
contentClasses.push('-full-height')
|
||||
wrapperClasses.push('-full-height')
|
||||
}
|
||||
return (
|
||||
<div class={wrapperClasses} >
|
||||
|
|
|
|||
|
|
@ -26,24 +26,6 @@
|
|||
}
|
||||
|
||||
> .contents {
|
||||
flex: 1 0 35em;
|
||||
|
||||
.tab-content {
|
||||
align-self: center;
|
||||
|
||||
&:not(.-full-width) {
|
||||
max-width: 40em;
|
||||
}
|
||||
|
||||
&.-full-width {
|
||||
align-self: stretch;
|
||||
}
|
||||
|
||||
&.-full-height {
|
||||
flex: 1;
|
||||
}
|
||||
}
|
||||
|
||||
.tab-content-label {
|
||||
box-sizing: border-box;
|
||||
margin: 0;
|
||||
|
|
@ -60,8 +42,24 @@
|
|||
flex: 1 1 auto;
|
||||
height: 100%;
|
||||
overflow-y: auto;
|
||||
display: flex;
|
||||
display: grid;
|
||||
grid-template-columns: minmax(1em, 1fr) minmax(min-content, 45em) minmax(1em, 1fr);
|
||||
grid-template-areas: ". content .";
|
||||
flex-direction: column;
|
||||
|
||||
.tab-content {
|
||||
grid-area: content;
|
||||
|
||||
&.-full-width {
|
||||
grid-column: 1 / 4;
|
||||
}
|
||||
|
||||
&.-full-height {
|
||||
> * {
|
||||
height: 100%;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.tab-content-wrapper {
|
||||
|
|
|
|||
|
|
@ -35,14 +35,53 @@
|
|||
line-height: 1.5;
|
||||
}
|
||||
|
||||
.setting-item > p {
|
||||
margin-left: 1em;
|
||||
.setting-item {
|
||||
display: grid;
|
||||
grid-template-areas:
|
||||
"label control"
|
||||
". desc"
|
||||
". draft";
|
||||
grid-template-columns: 1fr 1fr;
|
||||
column-gap: 0.5em;
|
||||
align-items: baseline;
|
||||
padding: 0.5em 0;
|
||||
|
||||
.setting-label {
|
||||
grid-area: label;
|
||||
text-align: right;
|
||||
}
|
||||
|
||||
.ModifiedIndicator,
|
||||
.ProfileSettingIndicator {
|
||||
grid-area: indicator;
|
||||
}
|
||||
|
||||
.setting-control {
|
||||
grid-area: control;
|
||||
}
|
||||
|
||||
.setting-control.setting-label {
|
||||
grid-column: 1 / 3;
|
||||
text-align: left;
|
||||
}
|
||||
|
||||
.setting-description {
|
||||
grid-area: desc;
|
||||
}
|
||||
|
||||
.DraftButtons {
|
||||
grid-area: draft;
|
||||
}
|
||||
}
|
||||
|
||||
.vertical-tab-switcher {
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
.setting-list,
|
||||
.option-list {
|
||||
list-style-type: none;
|
||||
padding-left: 2em;
|
||||
padding-left: 0;
|
||||
margin: 0;
|
||||
|
||||
.btn:not(.dropdown-button) {
|
||||
|
|
@ -55,21 +94,6 @@
|
|||
}
|
||||
}
|
||||
|
||||
li {
|
||||
display: block;
|
||||
margin: 0.75em 0;
|
||||
|
||||
> label {
|
||||
display: block;
|
||||
margin: 0.75em 0;
|
||||
padding: 0.5em 0;
|
||||
}
|
||||
}
|
||||
|
||||
.suboptions {
|
||||
margin-top: 0.3em;
|
||||
}
|
||||
|
||||
&.two-column {
|
||||
display: grid;
|
||||
grid-template-columns: 1fr 1fr;
|
||||
|
|
@ -135,20 +159,24 @@
|
|||
}
|
||||
}
|
||||
|
||||
.setting-item {
|
||||
border-bottom: 1px solid var(--border);
|
||||
grid-template-columns: 1fr min-content;
|
||||
column-gap: 0.5em;
|
||||
padding: 1em 0;
|
||||
align-items: center;
|
||||
|
||||
.setting-label {
|
||||
text-align: left;
|
||||
}
|
||||
}
|
||||
|
||||
ul {
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
.setting-list:not(.suboptions),
|
||||
.option-list {
|
||||
padding-left: 0.25em;
|
||||
|
||||
|
||||
/* stylelint-disable no-descending-specificity */
|
||||
// it makes no sense
|
||||
> li {
|
||||
margin: 1em 0;
|
||||
line-height: 1.5em;
|
||||
vertical-align: middle;
|
||||
}
|
||||
/* stylelint-enable no-descending-specificity */
|
||||
|
||||
&.two-column {
|
||||
grid-template-columns: 1fr;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,48 +0,0 @@
|
|||
.settings_tab-switcher {
|
||||
height: 100%;
|
||||
|
||||
.setting-item {
|
||||
border-bottom: 2px solid var(--border);
|
||||
margin: 1em 1em 1.4em;
|
||||
padding-bottom: 1.4em;
|
||||
|
||||
> div,
|
||||
> label {
|
||||
display: block;
|
||||
margin-bottom: 0.5em;
|
||||
|
||||
&:last-child {
|
||||
margin-bottom: 0;
|
||||
}
|
||||
}
|
||||
|
||||
.select-multiple {
|
||||
margin-top: 0.5em;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
|
||||
.option-list {
|
||||
margin: 0;
|
||||
margin-top: 0.5em;
|
||||
padding-left: 0.5em;
|
||||
}
|
||||
}
|
||||
|
||||
&:last-child {
|
||||
border-bottom: none;
|
||||
padding-bottom: 0;
|
||||
margin-bottom: 1em;
|
||||
}
|
||||
|
||||
textarea {
|
||||
width: 100%;
|
||||
max-width: 100%;
|
||||
height: 100px;
|
||||
}
|
||||
|
||||
.unavailable,
|
||||
.unavailable svg {
|
||||
color: var(--cRed);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
@ -2,7 +2,7 @@
|
|||
<vertical-tab-switcher
|
||||
v-if="adminDescriptionsLoaded && (noDb || adminDbLoaded)"
|
||||
ref="tabSwitcher"
|
||||
class="settings_tab-switcher"
|
||||
class="settings-admin-content settings_tab-switcher"
|
||||
:side-tab-bar="true"
|
||||
:scrollable-tabs="true"
|
||||
:render-only-focused="true"
|
||||
|
|
@ -15,7 +15,7 @@
|
|||
data-tab-name="nodb-notice"
|
||||
>
|
||||
<div :label="$t('admin_dash.tabs.nodb')">
|
||||
<div class="setting-item">
|
||||
<div class="setting-section">
|
||||
<h2>{{ $t('admin_dash.nodb.heading') }}</h2>
|
||||
<i18n-t
|
||||
scope="global"
|
||||
|
|
@ -185,4 +185,10 @@
|
|||
|
||||
<script src="./settings_modal_admin_content.js"></script>
|
||||
|
||||
<style src="./settings_modal_admin_content.scss" lang="scss"></style>
|
||||
<style lang="scss">
|
||||
.settings-admin-content {
|
||||
.setting-item {
|
||||
grid-template-columns: 1fr 3fr;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
|
|
|||
|
|
@ -1,50 +0,0 @@
|
|||
.settings_tab-switcher {
|
||||
height: 100%;
|
||||
|
||||
[full-height="true"] {
|
||||
height: 100%
|
||||
}
|
||||
|
||||
.setting-item {
|
||||
margin: 1em 1em 1.4em;
|
||||
padding-bottom: 1.4em;
|
||||
|
||||
> div,
|
||||
> label {
|
||||
margin-bottom: 0.5em;
|
||||
|
||||
&:last-child {
|
||||
margin-bottom: 0;
|
||||
}
|
||||
}
|
||||
|
||||
.select-multiple {
|
||||
margin-top: 1em;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
|
||||
.option-list {
|
||||
margin: 0;
|
||||
margin-top: 0.5em;
|
||||
padding-left: 0.5em;
|
||||
}
|
||||
}
|
||||
|
||||
&:last-child {
|
||||
border-bottom: none;
|
||||
padding-bottom: 0;
|
||||
margin-bottom: 1em;
|
||||
}
|
||||
|
||||
textarea {
|
||||
width: 100%;
|
||||
max-width: 100%;
|
||||
height: 100px;
|
||||
}
|
||||
|
||||
.unavailable,
|
||||
.unavailable svg {
|
||||
color: var(--cRed);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
@ -49,7 +49,7 @@
|
|||
<AppearanceTab />
|
||||
</div>
|
||||
<div
|
||||
:full-width="true"
|
||||
:full-width="$store.getters.mergedConfig.expertLevel > 0"
|
||||
:label="$t('settings.layout')"
|
||||
icon="table-columns"
|
||||
data-tab-name="layout"
|
||||
|
|
@ -68,7 +68,6 @@
|
|||
</div>
|
||||
<div
|
||||
:label="$t('settings.filtering')"
|
||||
:full-width="true"
|
||||
icon="filter"
|
||||
data-tab-name="filtering"
|
||||
>
|
||||
|
|
@ -139,5 +138,3 @@
|
|||
</template>
|
||||
|
||||
<script src="./settings_modal_user_content.js"></script>
|
||||
|
||||
<style src="./settings_modal_user_content.scss" lang="scss"></style>
|
||||
|
|
|
|||
|
|
@ -1,4 +1,6 @@
|
|||
.appearance-tab {
|
||||
margin: 1em;
|
||||
|
||||
h3 {
|
||||
border: none
|
||||
}
|
||||
|
|
@ -138,6 +140,7 @@
|
|||
border: 1px solid var(--border);
|
||||
margin-bottom: 0.5em;
|
||||
margin-top: 0;
|
||||
padding: 0.5em;
|
||||
}
|
||||
|
||||
.palettes {
|
||||
|
|
|
|||
|
|
@ -5,7 +5,7 @@
|
|||
icon="table-columns"
|
||||
>
|
||||
<div
|
||||
class="setting-item"
|
||||
class="setting-section"
|
||||
:label="$t('settings.theme')"
|
||||
icon="paintbrush"
|
||||
>
|
||||
|
|
|
|||
|
|
@ -1,6 +1,6 @@
|
|||
<template>
|
||||
<div class="clutter-tab">
|
||||
<div class="setting-item">
|
||||
<div class="setting-section">
|
||||
<h3>{{ $t('settings.interface') }}</h3>
|
||||
<ul class="setting-list">
|
||||
<li>
|
||||
|
|
|
|||
|
|
@ -1,14 +1,16 @@
|
|||
<template>
|
||||
<div :label="$t('settings.posts')">
|
||||
<div class="setting-item">
|
||||
<div class="setting-section">
|
||||
<h3>{{ $t('settings.general') }}</h3>
|
||||
<ul class="setting-list">
|
||||
<li>
|
||||
<label for="default-vis">
|
||||
<label class="setting-item " for="default-vis">
|
||||
<span class="setting-label">
|
||||
<ProfileSettingIndicator :is-profile="true" />
|
||||
{{ $t('settings.default_vis') }}
|
||||
{{ ' ' }}
|
||||
</span>
|
||||
<ScopeSelector
|
||||
class="scope-selector"
|
||||
class="scope-selector setting-control"
|
||||
:show-all="true"
|
||||
:user-default="$store.state.profileConfig.defaultScope"
|
||||
:initial-scope="$store.state.profileConfig.defaultScope"
|
||||
|
|
@ -16,7 +18,6 @@
|
|||
:unstyled="false"
|
||||
uns
|
||||
/>
|
||||
<ProfileSettingIndicator :is-profile="true" />
|
||||
</label>
|
||||
</li>
|
||||
<li>
|
||||
|
|
|
|||
|
|
@ -3,7 +3,7 @@
|
|||
class="data-import-export-tab"
|
||||
:label="$t('settings.data_import_export_tab')"
|
||||
>
|
||||
<div class="setting-item">
|
||||
<div class="setting-section">
|
||||
<h3>{{ $t('settings.import_export.title') }}</h3>
|
||||
<ul class="setting-list">
|
||||
<li>
|
||||
|
|
|
|||
|
|
@ -3,7 +3,7 @@
|
|||
:label="$t('settings.developer')"
|
||||
class="developer-tab"
|
||||
>
|
||||
<div class="setting-item">
|
||||
<div class="setting-section">
|
||||
<h3>{{ $t('settings.version.title') }}</h3>
|
||||
<dl class="setting-list">
|
||||
<dt>{{ $t('settings.version.backend_version') }}</dt>
|
||||
|
|
|
|||
|
|
@ -1,6 +1,6 @@
|
|||
<template>
|
||||
<div class="filtering-tab">
|
||||
<div class="setting-item">
|
||||
<div class="setting-section">
|
||||
<h3>{{ $t('settings.filter.mute_filter') }}</h3>
|
||||
<ul class="setting-list">
|
||||
<li>
|
||||
|
|
|
|||
|
|
@ -1,25 +1,25 @@
|
|||
<template>
|
||||
<div>
|
||||
<div class="setting-item">
|
||||
<div class="setting-section">
|
||||
<h3>{{ $t('settings.format_and_language') }}</h3>
|
||||
<ul class="setting-list">
|
||||
<li>
|
||||
<h4>{{ $t('settings.interfaceLanguage') }}</h4>
|
||||
<interface-language-switcher
|
||||
v-model="language"
|
||||
class="lang-selector"
|
||||
@update="val => language = val"
|
||||
>
|
||||
{{ $t('settings.interfaceLanguage') }}
|
||||
</interface-language-switcher>
|
||||
</li>
|
||||
<li>
|
||||
/>
|
||||
<h4>
|
||||
{{ $t('settings.email_language') }}
|
||||
{{ ' ' }}
|
||||
<ProfileSettingIndicator :is-profile="true" />
|
||||
</h4>
|
||||
<interface-language-switcher
|
||||
v-model="emailLanguage"
|
||||
class="lang-selector"
|
||||
:profile="true"
|
||||
@update:model-value="updateProfile()"
|
||||
>
|
||||
{{ $t('settings.email_language') }}
|
||||
</interface-language-switcher>
|
||||
</li>
|
||||
/>
|
||||
<li>
|
||||
<BooleanSetting path="useAbsoluteTimeFormat">
|
||||
{{ $t('settings.absolute_time_format') }}
|
||||
|
|
|
|||
|
|
@ -1,6 +1,6 @@
|
|||
<template>
|
||||
<div :label="$t('settings.layout')">
|
||||
<div class="setting-item">
|
||||
<div class="setting-section">
|
||||
<h3>{{ $t('settings.general') }}</h3>
|
||||
<ul class="setting-list">
|
||||
<li>
|
||||
|
|
|
|||
|
|
@ -1,6 +1,6 @@
|
|||
<template>
|
||||
<div :label="$t('settings.notifications')">
|
||||
<div class="setting-item">
|
||||
<div class="setting-section">
|
||||
<h3>{{ $t('settings.notification_setting_annoyance') }}</h3>
|
||||
<ul class="setting-list">
|
||||
<li>
|
||||
|
|
@ -28,7 +28,7 @@
|
|||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
<div class="setting-item">
|
||||
<div class="setting-section">
|
||||
<h3>{{ $t('settings.notification_setting_filters') }}</h3>
|
||||
<ul class="setting-list">
|
||||
<li>
|
||||
|
|
@ -241,7 +241,7 @@
|
|||
|
||||
<div
|
||||
v-if="expertLevel > 0"
|
||||
class="setting-item"
|
||||
class="setting-section"
|
||||
>
|
||||
<h3>{{ $t('settings.notification_setting_privacy') }}</h3>
|
||||
<ul class="setting-list">
|
||||
|
|
@ -279,7 +279,7 @@
|
|||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
<div class="setting-item">
|
||||
<div class="setting-section">
|
||||
<p>{{ $t('settings.notification_mutes') }}</p>
|
||||
<p>{{ $t('settings.notification_blocks') }}</p>
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -1,5 +1,6 @@
|
|||
.old-theme-tab {
|
||||
min-width: var(--themeEditorMinWidth, fit-content);
|
||||
margin: 1em;
|
||||
|
||||
.deprecation-warning {
|
||||
padding: 0.5em;
|
||||
|
|
|
|||
|
|
@ -1,6 +1,6 @@
|
|||
<template>
|
||||
<div class="posts-tab">
|
||||
<div class="setting-item">
|
||||
<div class="setting-section">
|
||||
<h3>{{ $t('settings.posts_appearance') }}</h3>
|
||||
<ul class="setting-list">
|
||||
<li>
|
||||
|
|
|
|||
|
|
@ -1,6 +1,6 @@
|
|||
.profile-tab {
|
||||
// overriding global for better look
|
||||
.setting-item.profile-edit {
|
||||
.setting-section.profile-edit {
|
||||
margin: 0;
|
||||
|
||||
h2 {
|
||||
|
|
|
|||
|
|
@ -1,17 +1,20 @@
|
|||
<template>
|
||||
<div class="profile-tab">
|
||||
<div class="setting-item profile-edit">
|
||||
<div class="setting-section profile-edit">
|
||||
<UserCard
|
||||
:user-id="user.id"
|
||||
:editable="true"
|
||||
:switcher="false"
|
||||
/>
|
||||
</div>
|
||||
<div class="setting-item">
|
||||
<div class="setting-section">
|
||||
<h3>{{ $t('settings.account_privacy') }}</h3>
|
||||
<ul class="setting-list">
|
||||
<li>
|
||||
<Checkbox v-model="locked">
|
||||
<Checkbox
|
||||
class="setting-item"
|
||||
v-model="locked"
|
||||
>
|
||||
{{ $t('settings.lock_account_description') }}
|
||||
</Checkbox>
|
||||
<ProfileSettingIndicator :is-profile="true" />
|
||||
|
|
|
|||
|
|
@ -1,7 +1,7 @@
|
|||
<template>
|
||||
<div
|
||||
v-if="readyInit && settings.available"
|
||||
class="setting-item mfa-settings"
|
||||
class="setting-section mfa-settings"
|
||||
>
|
||||
<div class="mfa-heading">
|
||||
<h2>{{ $t('settings.mfa.title') }}</h2>
|
||||
|
|
@ -10,7 +10,7 @@
|
|||
<div>
|
||||
<div
|
||||
v-if="!setupInProgress"
|
||||
class="setting-item"
|
||||
class="setting-section"
|
||||
>
|
||||
<!-- Enabled methods -->
|
||||
<h3>{{ $t('settings.mfa.authentication_methods') }}</h3>
|
||||
|
|
|
|||
|
|
@ -1,6 +1,6 @@
|
|||
<template>
|
||||
<div :label="$t('settings.security_tab')">
|
||||
<div class="setting-item">
|
||||
<div class="setting-section">
|
||||
<h3>{{ $t('settings.change_email') }}</h3>
|
||||
<ul class="setting-list">
|
||||
<li>
|
||||
|
|
@ -41,7 +41,7 @@
|
|||
</ul>
|
||||
</div>
|
||||
|
||||
<div class="setting-item">
|
||||
<div class="setting-section">
|
||||
<h3>{{ $t('settings.change_password') }}</h3>
|
||||
<ul class="setting-list">
|
||||
<li>
|
||||
|
|
@ -90,7 +90,7 @@
|
|||
</ul>
|
||||
</div>
|
||||
|
||||
<div class="setting-item">
|
||||
<div class="setting-section">
|
||||
<h3>{{ $t('settings.account_alias') }}</h3>
|
||||
<table>
|
||||
<thead>
|
||||
|
|
@ -160,7 +160,7 @@
|
|||
</div>
|
||||
|
||||
|
||||
<div class="setting-item">
|
||||
<div class="setting-section">
|
||||
<h3>{{ $t('settings.oauth_tokens') }}</h3>
|
||||
<table class="oauth-tokens">
|
||||
<thead>
|
||||
|
|
@ -191,7 +191,7 @@
|
|||
</div>
|
||||
<mfa />
|
||||
|
||||
<div class="setting-item">
|
||||
<div class="setting-section">
|
||||
<h3>{{ $t('settings.move_account') }}</h3>
|
||||
<p>{{ $t('settings.move_account_notes') }}</p>
|
||||
<div>
|
||||
|
|
@ -234,7 +234,7 @@
|
|||
</template>
|
||||
</div>
|
||||
|
||||
<div class="setting-item">
|
||||
<div class="setting-section">
|
||||
<h3>{{ $t('settings.delete_account') }}</h3>
|
||||
<p v-if="!deletingAccount">
|
||||
{{ $t('settings.delete_account_description') }}
|
||||
|
|
|
|||
|
|
@ -1,5 +1,6 @@
|
|||
.StyleTab {
|
||||
min-width: var(--themeEditorMinWidth, fit-content);
|
||||
margin: 1em;
|
||||
|
||||
.style-control {
|
||||
align-items: baseline;
|
||||
|
|
@ -45,7 +46,7 @@
|
|||
}
|
||||
}
|
||||
|
||||
.setting-item.heading {
|
||||
.setting-section.heading {
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
|
|
@ -84,7 +85,7 @@
|
|||
}
|
||||
}
|
||||
|
||||
.setting-item {
|
||||
.setting-section {
|
||||
padding-bottom: 0;
|
||||
|
||||
.btn {
|
||||
|
|
|
|||
|
|
@ -3,7 +3,7 @@
|
|||
|
||||
<template>
|
||||
<div class="StyleTab">
|
||||
<div class="setting-item heading">
|
||||
<div class="setting-section heading">
|
||||
<div class="meta-preview">
|
||||
<Preview id="edited-style-preview" />
|
||||
<teleport
|
||||
|
|
@ -82,7 +82,7 @@
|
|||
<tab-switcher>
|
||||
<div
|
||||
key="component"
|
||||
class="setting-item component-editor"
|
||||
class="setting-section component-editor"
|
||||
:label="$t('settings.style.themes3.editor.component_tab')"
|
||||
:full-width="true"
|
||||
>
|
||||
|
|
@ -331,7 +331,7 @@
|
|||
<div
|
||||
key="palette"
|
||||
:label="$t('settings.style.themes3.editor.palette_tab')"
|
||||
class="setting-item list-editor palette-editor"
|
||||
class="setting-section list-editor palette-editor"
|
||||
:full-width="true"
|
||||
>
|
||||
<label
|
||||
|
|
|
|||
|
|
@ -1,7 +1,7 @@
|
|||
<script src="./virtual_directives_tab.js"></script>
|
||||
|
||||
<template>
|
||||
<div class="setting-item list-editor variables-editor">
|
||||
<div class="setting-section list-editor variables-editor">
|
||||
<label
|
||||
class="list-select-label"
|
||||
for="variables-selector"
|
||||
|
|
|
|||
|
|
@ -1,6 +1,6 @@
|
|||
<template>
|
||||
<div :label="$t('admin_dash.tabs.uploads')">
|
||||
<div class="setting-item">
|
||||
<div class="setting-section">
|
||||
<h3>{{ $t('admin_dash.uploads.general') }}</h3>
|
||||
<ul class="setting-list">
|
||||
<li>
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue