commit: 4c68009ae0e96780fb80f120e323de1bc6d7721d
parent b21133ee126715ad92c95ae1893d1e7d7a86614e
Author: Henry Jameson <me@hjkos.com>
Date: Thu, 14 Nov 2024 19:18:10 +0200
layout improvements
Diffstat:
2 files changed, 62 insertions(+), 51 deletions(-)
diff --git a/src/components/settings_modal/tabs/appearance_tab.vue b/src/components/settings_modal/tabs/appearance_tab.vue
@@ -69,60 +69,71 @@
</h4>
</button>
</ul>
- <h3>{{ $t('settings.style.themes3.palette.label') }}</h3>
- <div class="palettes">
- <template v-if="customThemeVersion === 'v3'">
- <h4>{{ $t('settings.style.themes3.palette.bundled') }}</h4>
- <button
- v-for="p in bundledPalettes"
- :key="p.name"
- class="btn button-default palette-entry"
- :class="{ toggled: isPaletteActive(p.key) }"
- @click="() => setPalette(p.key)"
- >
- <label>
- {{ p.name }}
- </label>
- <span
- v-for="c in palettesKeys"
- :key="c"
- class="palette-square"
- :style="{ backgroundColor: p[c], border: '1px solid ' + (p[c] ?? 'var(--text)') }"
- />
- </button>
- <h4 v-if="stylePalettes?.length > 0">
- {{ $t('settings.style.themes3.palette.style') }}
- </h4>
- <button
- v-for="p in stylePalettes || []"
- :key="p.name"
- class="btn button-default palette-entry"
- :class="{ toggled: isPaletteActive(p.key) }"
- @click="() => setPaletteCustom(p)"
- >
- <label>
- {{ p.name }}
- </label>
- <span
- v-for="c in palettesKeys"
- :key="c"
- class="palette-square"
- :style="{ backgroundColor: p[c], border: '1px solid ' + (p[c] ?? 'var(--text)') }"
- />
- </button>
- </template>
- <template v-else-if="customThemeVersion === 'v2'">
- <div class="alert neutral theme-notice unsupported-theme-v2">
- {{ $t('settings.style.themes3.palette.v2_unsupported') }}
- </div>
- </template>
+ <div class="import-file-container">
+ <button
+ class="btn button-default"
+ @click="importFile"
+ >
+ <FAIcon icon="folder-open" />
+ {{ $t('settings.style.themes3.editor.load_style') }}
+ </button>
+ </div>
+ <div class="setting-item">
+ <h2>{{ $t('settings.style.themes3.palette.label') }}</h2>
+ <div class="palettes">
+ <template v-if="customThemeVersion === 'v3'">
+ <h4>{{ $t('settings.style.themes3.palette.bundled') }}</h4>
+ <button
+ v-for="p in bundledPalettes"
+ :key="p.name"
+ class="btn button-default palette-entry"
+ :class="{ toggled: isPaletteActive(p.key) }"
+ @click="() => setPalette(p.key)"
+ >
+ <label>
+ {{ p.name }}
+ </label>
+ <span
+ v-for="c in palettesKeys"
+ :key="c"
+ class="palette-square"
+ :style="{ backgroundColor: p[c], border: '1px solid ' + (p[c] ?? 'var(--text)') }"
+ />
+ </button>
+ <h4 v-if="stylePalettes?.length > 0">
+ {{ $t('settings.style.themes3.palette.style') }}
+ </h4>
+ <button
+ v-for="p in stylePalettes || []"
+ :key="p.name"
+ class="btn button-default palette-entry"
+ :class="{ toggled: isPaletteActive(p.key) }"
+ @click="() => setPaletteCustom(p)"
+ >
+ <label>
+ {{ p.name }}
+ </label>
+ <span
+ v-for="c in palettesKeys"
+ :key="c"
+ class="palette-square"
+ :style="{ backgroundColor: p[c], border: '1px solid ' + (p[c] ?? 'var(--text)') }"
+ />
+ </button>
+ </template>
+ <template v-else-if="customThemeVersion === 'v2'">
+ <div class="alert neutral theme-notice unsupported-theme-v2">
+ {{ $t('settings.style.themes3.palette.v2_unsupported') }}
+ </div>
+ </template>
+ </div>
</div>
- </div>
- <div class="alert neutral theme-notice">
- {{ $t("settings.style.appearance_tab_note") }}
</div>
<div class="setting-item">
<h2>{{ $t('settings.scale_and_layout') }}</h2>
+ <div class="alert neutral theme-notice">
+ {{ $t("settings.style.appearance_tab_note") }}
+ </div>
<ul class="setting-list">
<li>
<UnitSetting
diff --git a/src/i18n/en.json b/src/i18n/en.json
@@ -778,7 +778,7 @@
"editor": {
"title": "Style",
"reset_style": "Reset",
- "load_style": "Open",
+ "load_style": "Open from file",
"save_style": "Save",
"style_name": "Stylesheet name",
"style_author": "Made by",