fix panel link color, fix broken user profiles

This commit is contained in:
Henry Jameson 2018-11-26 20:12:59 +03:00
parent a806d43f05
commit bb39b99d65
5 changed files with 20 additions and 4 deletions

View file

@ -407,6 +407,11 @@ main-router {
min-width: 1px; min-width: 1px;
align-self: stretch; align-self: stretch;
} }
a {
color: $fallback--link;
color: var(--panelLink, $fallback--link)
}
} }
.panel-heading.stub { .panel-heading.stub {
@ -417,6 +422,11 @@ main-router {
.panel-footer { .panel-footer {
border-radius: 0 0 $fallback--panelRadius $fallback--panelRadius; border-radius: 0 0 $fallback--panelRadius $fallback--panelRadius;
border-radius: 0 0 var(--panelRadius, $fallback--panelRadius) var(--panelRadius, $fallback--panelRadius); border-radius: 0 0 var(--panelRadius, $fallback--panelRadius) var(--panelRadius, $fallback--panelRadius);
a {
color: $fallback--link;
color: var(--panelLink, $fallback--link)
}
} }
.panel-body > p { .panel-body > p {

View file

@ -62,6 +62,7 @@ export default {
panelColorLocal: undefined, panelColorLocal: undefined,
panelTextColorLocal: undefined, panelTextColorLocal: undefined,
panelLinkColorLocal: undefined,
panelFaintColorLocal: undefined, panelFaintColorLocal: undefined,
panelOpacityLocal: undefined, panelOpacityLocal: undefined,
@ -155,6 +156,7 @@ export default {
panel: this.panelColorLocal, panel: this.panelColorLocal,
panelText: this.panelTextColorLocal, panelText: this.panelTextColorLocal,
panelLink: this.panelLinkColorLocal,
panelFaint: this.panelFaintColorLocal, panelFaint: this.panelFaintColorLocal,
input: this.inputColorLocal, input: this.inputColorLocal,
@ -230,6 +232,7 @@ export default {
const fgs = { const fgs = {
text: hex2rgb(colors.text), text: hex2rgb(colors.text),
panelText: hex2rgb(colors.panelText), panelText: hex2rgb(colors.panelText),
panelLink: hex2rgb(colors.panelLink),
btnText: hex2rgb(colors.btnText), btnText: hex2rgb(colors.btnText),
topBarText: hex2rgb(colors.topBarText), topBarText: hex2rgb(colors.topBarText),
inputText: hex2rgb(colors.inputText), inputText: hex2rgb(colors.inputText),
@ -268,6 +271,7 @@ export default {
tintText: getContrastRatio(alphaBlend(bgs.bg, 0.5, fgs.panelText), fgs.text), tintText: getContrastRatio(alphaBlend(bgs.bg, 0.5, fgs.panelText), fgs.text),
panelText: getContrastRatio(alphaBlend(bgs.panel, opacity.panel, fgs.panelText), fgs.panelText), panelText: getContrastRatio(alphaBlend(bgs.panel, opacity.panel, fgs.panelText), fgs.panelText),
panelLink: getContrastRatio(alphaBlend(bgs.panel, opacity.panel, fgs.panelLink), fgs.panelLink),
btnText: getContrastRatio(alphaBlend(bgs.btn, opacity.btn, fgs.btnText), fgs.btnText), btnText: getContrastRatio(alphaBlend(bgs.btn, opacity.btn, fgs.btnText), fgs.btnText),

View file

@ -183,8 +183,10 @@
<h4>{{ $t('settings.style.advanced_colors.panel_header') }}</h4> <h4>{{ $t('settings.style.advanced_colors.panel_header') }}</h4>
<ColorInput name="panelColor" v-model="panelColorLocal" :fallback="fgColorLocal" :label="$t('settings.background')"/> <ColorInput name="panelColor" v-model="panelColorLocal" :fallback="fgColorLocal" :label="$t('settings.background')"/>
<OpacityInput name="panelOpacity" v-model="panelOpacityLocal" :fallback="previewTheme.opacity.panel || 1"/> <OpacityInput name="panelOpacity" v-model="panelOpacityLocal" :fallback="previewTheme.opacity.panel || 1"/>
<ColorInput name="panelTextColor" v-model="panelTextColorLocal" :fallback="previewTheme.colors.panelText" :label="$t('settings.links')"/> <ColorInput name="panelTextColor" v-model="panelTextColorLocal" :fallback="previewTheme.colors.panelText" :label="$t('settings.text')"/>
<ContrastRatio :contrast="previewContrast.panelText" large="1"/> <ContrastRatio :contrast="previewContrast.panelText" large="1"/>
<ColorInput name="panelLinkColor" v-model="panelLinkColorLocal" :fallback="previewTheme.colors.panelLink" :label="$t('settings.links')"/>
<ContrastRatio :contrast="previewContrast.panelLink" large="1"/>
</div> </div>
<div class="color-item"> <div class="color-item">
<h4>{{ $t('settings.style.advanced_colors.top_bar') }}</h4> <h4>{{ $t('settings.style.advanced_colors.top_bar') }}</h4>

View file

@ -105,10 +105,9 @@
<span v-if="!hideUserStatsLocal">{{user.followers_count}}</span> <span v-if="!hideUserStatsLocal">{{user.followers_count}}</span>
</div> </div>
</div> </div>
<p v-if="!hideBio && user.description_html" class="profile-bio" v-html="user.description_html"></p>
<p v-else-if="!hideBio" class="profile-bio">{{ user.description }}</p>
</div> </div>
<p v-if="!hideBio && user.description_html" class="profile-bio" v-html="user.description_html"></p>
<p v-else-if="!hideBio" class="profile-bio">{{ user.description }}</p>
</div>
</div> </div>
</template> </template>

View file

@ -172,6 +172,7 @@ const generateColors = (input) => {
colors.panel = col.panel || Object.assign({}, col.fg) colors.panel = col.panel || Object.assign({}, col.fg)
colors.panelText = col.panelText || getTextColor(colors.panel, colors.fgText) colors.panelText = col.panelText || getTextColor(colors.panel, colors.fgText)
colors.panelLink = col.panelLink || getTextColor(colors.panel, colors.fgLink)
colors.panelFaint = col.panelFaint || getTextColor(colors.panel, colors.faint) colors.panelFaint = col.panelFaint || getTextColor(colors.panel, colors.faint)
colors.topBar = col.topBar || Object.assign({}, col.fg) colors.topBar = col.topBar || Object.assign({}, col.fg)