diff options
| -rw-r--r-- | src/components/poll/poll.vue | 4 | ||||
| -rw-r--r-- | src/components/style_switcher/style_switcher.vue | 37 | ||||
| -rw-r--r-- | src/i18n/en.json | 4 | ||||
| -rw-r--r-- | src/services/theme_data/theme_data.service.js | 15 |
4 files changed, 51 insertions, 9 deletions
diff --git a/src/components/poll/poll.vue b/src/components/poll/poll.vue index db8e33b3..56e91cca 100644 --- a/src/components/poll/poll.vue +++ b/src/components/poll/poll.vue @@ -104,8 +104,10 @@ .result-fill { height: 100%; position: absolute; + color: $fallback--text; + color: var(--pollText, $fallback--text); background-color: $fallback--lightBg; - background-color: var(--linkBg, $fallback--lightBg); + background-color: var(--poll, $fallback--lightBg); border-radius: $fallback--panelRadius; border-radius: var(--panelRadius, $fallback--panelRadius); top: 0; diff --git a/src/components/style_switcher/style_switcher.vue b/src/components/style_switcher/style_switcher.vue index ff6a8264..e0894b6d 100644 --- a/src/components/style_switcher/style_switcher.vue +++ b/src/components/style_switcher/style_switcher.vue @@ -215,20 +215,20 @@ :label="$t('settings.text')" :fallback="previewTheme.colors.alertErrorText" /> - <ContrastRatio :contrast="previewContrast.alertError" /> + <ContrastRatio :contrast="previewContrast.alertErrorText" large="1"/> <ColorInput v-model="alertWarningColorLocal" name="alertWarning" :label="$t('settings.style.advanced_colors.alert_warning')" :fallback="previewTheme.colors.alertWarning" /> - <ContrastRatio :contrast="previewContrast.alertWarning" /> <ColorInput v-model="alertWarningTextColorLocal" name="alertWarningText" :label="$t('settings.text')" :fallback="previewTheme.colors.alertWarningText" /> + <ContrastRatio :contrast="previewContrast.alertWarningText" large="1"/> </div> <div class="color-item"> <h4>{{ $t('settings.style.advanced_colors.badge') }}</h4> @@ -238,6 +238,13 @@ :label="$t('settings.style.advanced_colors.badge_notification')" :fallback="previewTheme.colors.badgeNotification" /> + <ColorInput + v-model="badgeNotificationTextColorLocal" + name="badgeNotificationText" + :label="$t('settings.text')" + :fallback="previewTheme.colors.badgeNotificationText" + /> + <ContrastRatio :contrast="previewContrast.badgeNotificationText" large="1" /> </div> <div class="color-item"> <h4>{{ $t('settings.style.advanced_colors.panel_header') }}</h4> @@ -388,7 +395,7 @@ v-model="underlayColorLocal" name="underlay" :label="$t('settings.style.advanced_colors.underlay')" - fallback="#000000" + :fallback="previewTheme.colors.underlay" /> <OpacityInput v-model="underlayOpacityLocal" @@ -397,6 +404,30 @@ :disabled="underlayOpacityLocal === 'transparent'" /> </div> + <div class="color-item"> + <h4>{{ $t('settings.style.advanced_colors.poll') }}</h4> + <ColorInput + v-model="pollColorLocal" + name="poll" + :label="$t('settings.background')" + :fallback="previewTheme.colors.poll" + /> + <ColorInput + v-model="pollTextColorLocal" + name="poll" + :label="$t('settings.text')" + :fallback="previewTheme.colors.pollText" + /> + </div> + <div class="color-item"> + <h4>{{ $t('settings.style.advanced_colors.icons') }}</h4> + <ColorInput + v-model="iconColorLocal" + name="poll" + :label="$t('settings.style.advanced_colors.icons')" + :fallback="previewTheme.colors.icon" + /> + </div> </div> <div diff --git a/src/i18n/en.json b/src/i18n/en.json index d97b4909..bd3d7413 100644 --- a/src/i18n/en.json +++ b/src/i18n/en.json @@ -431,7 +431,9 @@ "buttons": "Buttons", "inputs": "Input fields", "faint_text": "Faded text", - "underlay": "Underlay" + "underlay": "Underlay", + "poll": "Poll graph", + "icons": "Icons" }, "radii": { "_tab_label": "Roundness" diff --git a/src/services/theme_data/theme_data.service.js b/src/services/theme_data/theme_data.service.js index e2e9331c..21bab1a2 100644 --- a/src/services/theme_data/theme_data.service.js +++ b/src/services/theme_data/theme_data.service.js @@ -20,7 +20,8 @@ export const LAYERS = { inputPanel: 'panel', inputTopBar: 'topBar', alert: 'bg', - alertPanel: 'panel' + alertPanel: 'panel', + poll: 'bg' } export const DEFAULT_OPACITY = { @@ -33,7 +34,8 @@ export const DEFAULT_OPACITY = { alert: 0.5, input: 0.5, faint: 0.5, - underlay: 0.15 + underlay: 0.15, + poll: 1 } export const SLOT_INHERITANCE = { @@ -65,9 +67,14 @@ export const SLOT_INHERITANCE = { color: (mod, fg) => brightness(2 * mod, fg).rgb }, - linkBg: { + poll: { depends: ['accent', 'bg'], - color: (mod, accent, bg) => alphaBlend(accent, 0.4, bg).rgb + color: (mod, accent, bg) => alphaBlend(accent, 0.4, bg) + }, + pollText: { + depends: ['text'], + layer: 'poll', + textColor: true }, icon: { |