better v1 detection, better menu-item consistency

This commit is contained in:
Henry Jameson 2024-02-27 17:03:39 +02:00
parent d3b5f76486
commit c83ddb0b2b
6 changed files with 57 additions and 12 deletions

View File

@ -30,17 +30,44 @@ export default {
{
state: ['active'],
directives: {
background: '$mod(--bg, 5)',
background: '$mod(--bg, 10)',
opacity: 1
}
},
{
state: ['active', 'hover'],
directives: {
background: '$mod(--bg, 15)',
opacity: 1
}
},
{
component: 'Text',
variant: 'normal',
parent: {
component: 'MenuItem',
state: ['normal', 'hover'],
variant: 'normal'
state: ['hover']
},
directives: {
textColor: '--link',
textAuto: 'no-preserve'
}
},
{
component: 'Text',
parent: {
component: 'MenuItem',
state: ['active']
},
directives: {
textColor: '--link',
textAuto: 'no-preserve'
}
},
{
component: 'Icon',
parent: {
component: 'MenuItem',
state: ['active']
},
directives: {
textColor: '--link',

View File

@ -10,7 +10,7 @@
>
<component
:is="routeTo ? 'a' : 'button'"
class="main-link button-unstyled"
class="main-link"
:href="href"
@click="navigate"
>
@ -84,11 +84,23 @@
}
.main-link {
background: none;
border: none;
outline: none;
display: inline;
text-align: initial;
font-size: 100%;
font-family: inherit;
line-height: unset;
cursor: pointer;
box-sizing: content-box;
color: var(--text);
flex: 1;
padding: 0 1em;
}
.menu-icon {
color: var(--icon);
margin-right: 0.8em;
}

View File

@ -514,6 +514,7 @@ export default {
this.$store.dispatch('setOption', {
name: 'customTheme',
value: {
themeFileVersion: this.selectedVersion,
themeEngineVersion: CURRENT_VERSION,
...this.previewTheme
}
@ -521,6 +522,7 @@ export default {
this.$store.dispatch('setOption', {
name: 'customThemeSource',
value: {
themeFileVersion: this.selectedVersion,
themeEngineVersion: CURRENT_VERSION,
shadows: this.shadowsLocal,
fonts: this.fontsLocal,

View File

@ -8,11 +8,11 @@ import { chunk } from 'lodash'
export const applyTheme = async (input) => {
let extraRules
if (input.themeType !== 1) {
if (input.themeFileVersion === 1) {
extraRules = convertTheme2To3(input)
} else {
const { theme } = generatePreset(input)
extraRules = convertTheme2To3(theme)
} else {
extraRules = convertTheme2To3(input)
}
const themes3 = init(extraRules, '#FFFFFF')
@ -125,7 +125,7 @@ export const getPreset = (val) => {
.then((themes) => themes[val] ? themes[val] : themes['pleroma-dark'])
.then((theme) => {
const isV1 = Array.isArray(theme)
const data = isV1 ? { themeType: 1 } : theme.theme
const data = isV1 ? {} : theme.theme
if (isV1) {
const bg = hex2rgb(theme[1])

View File

@ -155,7 +155,7 @@ export const getCssRules = (rules) => rules.map(rule => {
return [
header,
directives + ';',
(!rule.virtual && rule.directives.textNoCssColor !== 'yes') ? ' color: var(--text);' : '',
(rule.component === 'Text' && rule.directives.textNoCssColor !== 'yes') ? ' color: var(--text);' : '',
'',
virtualDirectives,
footer

View File

@ -275,8 +275,12 @@ export const init = (extraRuleset, ultimateBackgroundColor) => {
selector: cssSelector.split(/ /g).slice(0, -1).join(' '),
...combination,
directives: {},
virtualDirectives,
virtualDirectivesRaw
virtualDirectives: {
[virtualName]: getTextColorAlpha(newTextRule.directives, textColor, dynamicVars)
},
virtualDirectivesRaw: {
[virtualName]: textColor
}
}
} else {
computed[selector] = computed[selector] || {}