aboutsummaryrefslogtreecommitdiff
path: root/src/components
diff options
context:
space:
mode:
Diffstat (limited to 'src/components')
-rw-r--r--src/components/settings_modal/helpers/unit_setting.js (renamed from src/components/settings_modal/helpers/size_setting.js)8
-rw-r--r--src/components/settings_modal/helpers/unit_setting.vue (renamed from src/components/settings_modal/helpers/size_setting.vue)19
-rw-r--r--src/components/settings_modal/settings_modal_admin_content.scss11
-rw-r--r--src/components/settings_modal/settings_modal_user_content.scss11
-rw-r--r--src/components/settings_modal/tabs/filtering_tab.js4
-rw-r--r--src/components/settings_modal/tabs/filtering_tab.vue5
-rw-r--r--src/components/settings_modal/tabs/general_tab.js4
-rw-r--r--src/components/settings_modal/tabs/general_tab.vue4
8 files changed, 30 insertions, 36 deletions
diff --git a/src/components/settings_modal/helpers/size_setting.js b/src/components/settings_modal/helpers/unit_setting.js
index 12cef705..c9c23cb0 100644
--- a/src/components/settings_modal/helpers/size_setting.js
+++ b/src/components/settings_modal/helpers/unit_setting.js
@@ -17,6 +17,10 @@ export default {
units: {
type: Array,
default: () => allCssUnits
+ },
+ unitSet: {
+ type: String,
+ default: 'none'
}
},
computed: {
@@ -30,6 +34,10 @@ export default {
},
methods: {
...Setting.methods,
+ getUnitString (value) {
+ if (this.unitSet === 'none') return value
+ return this.$t(['settings', 'units', this.unitSet, value].join('.'))
+ },
updateValue (e) {
this.configSink(this.path, parseInt(e.target.value) + this.stateUnit)
},
diff --git a/src/components/settings_modal/helpers/size_setting.vue b/src/components/settings_modal/helpers/unit_setting.vue
index 6c3fbaeb..d6aafe26 100644
--- a/src/components/settings_modal/helpers/size_setting.vue
+++ b/src/components/settings_modal/helpers/unit_setting.vue
@@ -1,7 +1,7 @@
<template>
<span
v-if="matchesExpertLevel"
- class="SizeSetting"
+ class="UnitSetting"
>
<label
:for="path"
@@ -23,7 +23,7 @@
:id="path"
:model-value="stateUnit"
:disabled="disabled"
- class="css-unit-input"
+ class="unit-input unstyled"
@change="updateUnit"
>
<option
@@ -31,7 +31,7 @@
:key="option"
:value="option"
>
- {{ option }}
+ {{ getUnitString(option) }}
</option>
</Select>
{{ ' ' }}
@@ -42,20 +42,19 @@
</span>
</template>
-<script src="./size_setting.js"></script>
+<script src="./unit_setting.js"></script>
<style lang="scss">
-.SizeSetting {
+.UnitSetting {
.number-input {
max-width: 6.5em;
+ text-align: right;
}
- .css-unit-input,
- .css-unit-input select {
- margin-left: 0.5em;
- width: 4em;
- max-width: 4em;
+ .unit-input,
+ .unit-input select {
min-width: 4em;
+ width: auto;
}
}
diff --git a/src/components/settings_modal/settings_modal_admin_content.scss b/src/components/settings_modal/settings_modal_admin_content.scss
index c984d703..a5314fe1 100644
--- a/src/components/settings_modal/settings_modal_admin_content.scss
+++ b/src/components/settings_modal/settings_modal_admin_content.scss
@@ -1,10 +1,8 @@
-@import "src/variables";
-
.settings_tab-switcher {
height: 100%;
.setting-item {
- border-bottom: 2px solid var(--fg, $fallback--fg);
+ border-bottom: 2px solid var(--border);
margin: 1em 1em 1.4em;
padding-bottom: 1.4em;
@@ -33,10 +31,6 @@
margin-bottom: 1em;
}
- select {
- min-width: 10em;
- }
-
textarea {
width: 100%;
max-width: 100%;
@@ -45,8 +39,7 @@
.unavailable,
.unavailable svg {
- color: var(--cRed, $fallback--cRed);
- color: $fallback--cRed;
+ color: var(--cRed);
}
}
}
diff --git a/src/components/settings_modal/settings_modal_user_content.scss b/src/components/settings_modal/settings_modal_user_content.scss
index c984d703..a5314fe1 100644
--- a/src/components/settings_modal/settings_modal_user_content.scss
+++ b/src/components/settings_modal/settings_modal_user_content.scss
@@ -1,10 +1,8 @@
-@import "src/variables";
-
.settings_tab-switcher {
height: 100%;
.setting-item {
- border-bottom: 2px solid var(--fg, $fallback--fg);
+ border-bottom: 2px solid var(--border);
margin: 1em 1em 1.4em;
padding-bottom: 1.4em;
@@ -33,10 +31,6 @@
margin-bottom: 1em;
}
- select {
- min-width: 10em;
- }
-
textarea {
width: 100%;
max-width: 100%;
@@ -45,8 +39,7 @@
.unavailable,
.unavailable svg {
- color: var(--cRed, $fallback--cRed);
- color: $fallback--cRed;
+ color: var(--cRed);
}
}
}
diff --git a/src/components/settings_modal/tabs/filtering_tab.js b/src/components/settings_modal/tabs/filtering_tab.js
index 06f238af..fbace15d 100644
--- a/src/components/settings_modal/tabs/filtering_tab.js
+++ b/src/components/settings_modal/tabs/filtering_tab.js
@@ -1,7 +1,7 @@
import { filter, trim, debounce } from 'lodash'
import BooleanSetting from '../helpers/boolean_setting.vue'
import ChoiceSetting from '../helpers/choice_setting.vue'
-import SizeSetting from '../helpers/size_setting.vue'
+import UnitSetting from '../helpers/unit_setting.vue'
import IntegerSetting from '../helpers/integer_setting.vue'
import SharedComputedObject from '../helpers/shared_computed_object.js'
@@ -20,7 +20,7 @@ const FilteringTab = {
components: {
BooleanSetting,
ChoiceSetting,
- SizeSetting,
+ UnitSetting,
IntegerSetting
},
computed: {
diff --git a/src/components/settings_modal/tabs/filtering_tab.vue b/src/components/settings_modal/tabs/filtering_tab.vue
index 0f796255..ab4f5b18 100644
--- a/src/components/settings_modal/tabs/filtering_tab.vue
+++ b/src/components/settings_modal/tabs/filtering_tab.vue
@@ -97,14 +97,15 @@
</BooleanSetting>
</li>
<li>
- <SizeSetting
+ <UnitSetting
key="hideScrobblesAfter"
path="hideScrobblesAfter"
:units="['m', 'h', 'd']"
+ unitSet="time"
expert="1"
>
{{ $t('settings.hide_scrobbles_after') }}
- </SizeSetting>
+ </UnitSetting>
</li>
</ul>
</div>
diff --git a/src/components/settings_modal/tabs/general_tab.js b/src/components/settings_modal/tabs/general_tab.js
index 3f2bcb13..7d701d34 100644
--- a/src/components/settings_modal/tabs/general_tab.js
+++ b/src/components/settings_modal/tabs/general_tab.js
@@ -3,7 +3,7 @@ import ChoiceSetting from '../helpers/choice_setting.vue'
import ScopeSelector from 'src/components/scope_selector/scope_selector.vue'
import IntegerSetting from '../helpers/integer_setting.vue'
import FloatSetting from '../helpers/float_setting.vue'
-import SizeSetting, { defaultHorizontalUnits } from '../helpers/size_setting.vue'
+import UnitSetting, { defaultHorizontalUnits } from '../helpers/unit_setting.vue'
import InterfaceLanguageSwitcher from 'src/components/interface_language_switcher/interface_language_switcher.vue'
import SharedComputedObject from '../helpers/shared_computed_object.js'
@@ -64,7 +64,7 @@ const GeneralTab = {
ChoiceSetting,
IntegerSetting,
FloatSetting,
- SizeSetting,
+ UnitSetting,
InterfaceLanguageSwitcher,
ScopeSelector,
ProfileSettingIndicator
diff --git a/src/components/settings_modal/tabs/general_tab.vue b/src/components/settings_modal/tabs/general_tab.vue
index f56fa8e0..05930e00 100644
--- a/src/components/settings_modal/tabs/general_tab.vue
+++ b/src/components/settings_modal/tabs/general_tab.vue
@@ -134,7 +134,7 @@
<li v-if="expertLevel > 0">
{{ $t('settings.column_sizes') }}
<div class="column-settings">
- <SizeSetting
+ <UnitSetting
v-for="column in columns"
:key="column"
:path="column + 'ColumnWidth'"
@@ -142,7 +142,7 @@
expert="1"
>
{{ $t('settings.column_sizes_' + column) }}
- </SizeSetting>
+ </UnitSetting>
</div>
</li>
<li class="select-multiple">
generated by cgit v1.2.3-70-g09d2 (git 2.49.0) at 2025-11-11 13:23:07 +0000