moon
/
pleroma-fe
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Fixes selects having unreadable text on some browsers/OSes. Added bonus: theme 

switcher select now has styled options that show preview of what theme's bg/fg
colors are
This commit is contained in:
Henry Jameson 2018-08-05 09:18:04 +03:00
parent 32fd108e97
commit 3373d28701
2 changed files with 11 additions and 1 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

7
src/App.scss
View File

@ -168,6 +168,13 @@ input, textarea, .select {
} }
} }
option {
color: $fallback--fg;
color: var(--fg, $fallback--fg);
background-color: $fallback--bg;
background-color: var(--bg, $fallback--bg);
}
i[class*=icon-] { i[class*=icon-] {
color: $fallback--icon; color: $fallback--icon;
color: var(--icon, $fallback--icon) color: var(--icon, $fallback--icon)

5
src/components/style_switcher/style_switcher.vue
View File

@ -3,7 +3,10 @@
<div>{{$t('settings.presets')}} <div>{{$t('settings.presets')}}
<label for="style-switcher" class='select'> <label for="style-switcher" class='select'>
<select id="style-switcher" v-model="selected" class="style-switcher"> <select id="style-switcher" v-model="selected" class="style-switcher">
<option v-for="style in availableStyles" :value="style">{{style[0]}}</option> <option v-for="style in availableStyles" :value="style" :style="{
backgroundColor: style[1],
color: style[3]
}">{{style[0]}}</option>
</select> </select>
<i class="icon-down-open"/> <i class="icon-down-open"/>
</label> </label>