Troplo/pleroma-fe
1
0
Fork 0
Code Issues Pull requests Projects Releases Wiki Activity

lightBg -> highlight because it causes issues with v2

Browse source
This commit is contained in:
Henry Jameson 2020-01-22 01:28:46 +02:00
parent 803edcb53a
commit 644ce497a0
8 changed files with 48 additions and 48 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

24
src/components/style_switcher/style_switcher.vue
View file

@ -518,27 +518,27 @@
/> />
</div> </div>
<div class="color-item"> <div class="color-item">
<h4>{{ $t('settings.style.advanced_colors.lightBg') }}</h4> <h4>{{ $t('settings.style.advanced_colors.highlight') }}</h4>
<ColorInput <ColorInput
v-model="lightBgColorLocal" v-model="highlightColorLocal"
name="lightBg" name="highlight"
:label="$t('settings.background')" :label="$t('settings.background')"
:fallback="previewTheme.colors.lightBg" :fallback="previewTheme.colors.highlight"
/> />
<ColorInput <ColorInput
v-model="lightBgTextColorLocal" v-model="highlightTextColorLocal"
name="lightBgText" name="highlightText"
:label="$t('settings.text')" :label="$t('settings.text')"
:fallback="previewTheme.colors.lightBgText" :fallback="previewTheme.colors.highlightText"
/> />
<ContrastRatio :contrast="previewContrast.lightBgText" /> <ContrastRatio :contrast="previewContrast.highlightText" />
<ColorInput <ColorInput
v-model="lightBgLinkColorLocal" v-model="highlightLinkColorLocal"
name="lightBgLink" name="highlightLink"
:label="$t('settings.links')" :label="$t('settings.links')"
:fallback="previewTheme.colors.lightBgLink" :fallback="previewTheme.colors.highlightLink"
/> />
<ContrastRatio :contrast="previewContrast.lightBgLink" /> <ContrastRatio :contrast="previewContrast.highlightLink" />
</div> </div>
<div class="color-item"> <div class="color-item">
<h4>{{ $t('settings.style.advanced_colors.selectedPost') }}</h4> <h4>{{ $t('settings.style.advanced_colors.selectedPost') }}</h4>

2
src/i18n/en.json
View file

@ -449,7 +449,7 @@
"underlay": "Underlay", "underlay": "Underlay",
"poll": "Poll graph", "poll": "Poll graph",
"icons": "Icons", "icons": "Icons",
"lightBg": "Highlighted elements", "highlight": "Highlighted elements",
"pressed": "Pressed", "pressed": "Pressed",
"selectedPost": "Selected post", "selectedPost": "Selected post",
"selectedMenu": "Selected menu item", "selectedMenu": "Selected menu item",

60
src/services/theme_data/theme_data.service.js
View file

@ -47,7 +47,7 @@ export const LAYERS = {
badge: null, // no transparency support badge: null, // no transparency support
fg: null, fg: null,
bg: 'underlay', bg: 'underlay',
lightBg: 'bg', highlight: 'bg',
panel: 'bg', panel: 'bg',
btn: 'bg', btn: 'bg',
btnPanel: 'panel', btnPanel: 'panel',
@ -148,57 +148,57 @@ export const SLOT_INHERITANCE = {
cGreen: '#00FF00', cGreen: '#00FF00',
cOrange: '#E3FF00', cOrange: '#E3FF00',
lightBg: { highlight: {
depends: ['bg'], depends: ['bg'],
color: (mod, bg) => brightness(5 * mod, bg).rgb color: (mod, bg) => brightness(5 * mod, bg).rgb
}, },
lightBgFaintText: { highlightFaintText: {
depends: ['faint'], depends: ['faint'],
layer: 'lightBg', layer: 'highlight',
textColor: true textColor: true
}, },
lightBgFaintLink: { highlightFaintLink: {
depends: ['faintLink'], depends: ['faintLink'],
layer: 'lightBg', layer: 'highlight',
textColor: 'preserve' textColor: 'preserve'
}, },
lightBgText: { highlightText: {
depends: ['text'], depends: ['text'],
layer: 'lightBg', layer: 'highlight',
textColor: true textColor: true
}, },
lightBgLink: { highlightLink: {
depends: ['link'], depends: ['link'],
layer: 'lightBg', layer: 'highlight',
textColor: 'preserve' textColor: 'preserve'
}, },
lightBgIcon: { highlightIcon: {
depends: ['lightBg', 'lightBgText'], depends: ['highlight', 'highlightText'],
color: (mod, bg, text) => mixrgb(bg, text) color: (mod, bg, text) => mixrgb(bg, text)
}, },
selectedPost: '--lightBg', selectedPost: '--highlight',
selectedPostFaintText: { selectedPostFaintText: {
depends: ['lightBgFaintText'], depends: ['highlightFaintText'],
layer: 'lightBg', layer: 'highlight',
variant: 'selectedPost', variant: 'selectedPost',
textColor: true textColor: true
}, },
selectedPostFaintLink: { selectedPostFaintLink: {
depends: ['lightBgFaintLink'], depends: ['highlightFaintLink'],
layer: 'lightBg', layer: 'highlight',
variant: 'selectedPost', variant: 'selectedPost',
textColor: 'preserve' textColor: 'preserve'
}, },
selectedPostText: { selectedPostText: {
depends: ['lightBgText'], depends: ['highlightText'],
layer: 'lightBg', layer: 'highlight',
variant: 'selectedPost', variant: 'selectedPost',
textColor: true textColor: true
}, },
selectedPostLink: { selectedPostLink: {
depends: ['lightBgLink'], depends: ['highlightLink'],
layer: 'lightBg', layer: 'highlight',
variant: 'selectedPost', variant: 'selectedPost',
textColor: 'preserve' textColor: 'preserve'
}, },
@ -207,28 +207,28 @@ export const SLOT_INHERITANCE = {
color: (mod, bg, text) => mixrgb(bg, text) color: (mod, bg, text) => mixrgb(bg, text)
}, },
selectedMenu: '--lightBg', selectedMenu: '--highlight',
selectedMenuFaintText: { selectedMenuFaintText: {
depends: ['lightBgFaintText'], depends: ['highlightFaintText'],
layer: 'lightBg', layer: 'highlight',
variant: 'selectedMenu', variant: 'selectedMenu',
textColor: true textColor: true
}, },
selectedMenuFaintLink: { selectedMenuFaintLink: {
depends: ['lightBgFaintLink'], depends: ['highlightFaintLink'],
layer: 'lightBg', layer: 'highlight',
variant: 'selectedMenu', variant: 'selectedMenu',
textColor: 'preserve' textColor: 'preserve'
}, },
selectedMenuText: { selectedMenuText: {
depends: ['lightBgText'], depends: ['highlightText'],
layer: 'lightBg', layer: 'highlight',
variant: 'selectedMenu', variant: 'selectedMenu',
textColor: true textColor: true
}, },
selectedMenuLink: { selectedMenuLink: {
depends: ['lightBgLink'], depends: ['highlightLink'],
layer: 'lightBg', layer: 'highlight',
variant: 'selectedMenu', variant: 'selectedMenu',
textColor: 'preserve' textColor: 'preserve'
}, },

2
static/themes/breezy-dark.json
View file

@ -114,7 +114,7 @@
"cGreen": "#27ae60", "cGreen": "#27ae60",
"cOrange": "#f67400", "cOrange": "#f67400",
"btnPressed": "--accent", "btnPressed": "--accent",
"lightBg": "--accent", "highlight": "--accent",
"selectedPost": "--bg,10" "selectedPost": "--bg,10"
}, },
"radii": { "radii": {

2
static/themes/breezy-light.json
View file

@ -117,7 +117,7 @@
"cGreen": "#27ae60", "cGreen": "#27ae60",
"cOrange": "#f67400", "cOrange": "#f67400",
"btnPressed": "--accent", "btnPressed": "--accent",
"lightBg": "--accent", "highlight": "--accent",
"selectedPost": "--bg,10" "selectedPost": "--bg,10"
}, },
"radii": { "radii": {

2
static/themes/redmond-xx-se.json
View file

@ -283,7 +283,7 @@
"cBlue": "#008080", "cBlue": "#008080",
"cGreen": "#008000", "cGreen": "#008000",
"cOrange": "#808000", "cOrange": "#808000",
"lightBg": "--accent", "highlight": "--accent",
"selectedPost": "--bg,-10" "selectedPost": "--bg,-10"
}, },
"radii": { "radii": {

2
static/themes/redmond-xx.json
View file

@ -274,7 +274,7 @@
"cBlue": "#008080", "cBlue": "#008080",
"cGreen": "#008000", "cGreen": "#008000",
"cOrange": "#808000", "cOrange": "#808000",
"lightBg": "--accent", "highlight": "--accent",
"selectedPost": "--bg,-10" "selectedPost": "--bg,-10"
}, },
"radii": { "radii": {

2
static/themes/redmond-xxi.json
View file

@ -256,7 +256,7 @@
"cBlue": "#6699cc", "cBlue": "#6699cc",
"cGreen": "#669966", "cGreen": "#669966",
"cOrange": "#cc6633", "cOrange": "#cc6633",
"lightBg": "--accent", "highlight": "--accent",
"selectedPost": "--bg,-10" "selectedPost": "--bg,-10"
}, },
"radii": { "radii": {