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

sorting, typo

Browse source
This commit is contained in:
Henry Jameson 2025-07-03 17:11:23 +03:00
commit b2f7309e1e
5 changed files with 19 additions and 17 deletions
Download patch file Download diff file Expand all files Collapse all files

2
src/components/component_preview/component_preview.js
View file

@ -52,7 +52,7 @@ export default {
this.$emit('update:shadow', { axis, value: Number(value) })
},
update () {
const sheet = createStyleSheet('style-component-preview')
const sheet = createStyleSheet('style-component-preview', 90)
sheet.clear()

6
src/components/settings_modal/tabs/appearance_tab.js
View file

@ -412,11 +412,9 @@ const AppearanceTab = {
}
const sheet = createStyleSheet('appearance-tab-previews')
const sheet = createStyleSheet('appearance-tab-previews', 90)
sheet.addRule([
'#theme-preview-',
key,
' {\n',
'#theme-preview-', key, ' {\n',
getCssRules(theme3.eager).join('\n'),
'\n}'
].join(''))

2
src/components/settings_modal/tabs/style_tab/style_tab.js
View file

@ -695,7 +695,7 @@ export default {
return
}
const sheet = createStyleSheet('style-tab-overall-preview')
const sheet = createStyleSheet('style-tab-overall-preview', 90)
sheet.clear()
sheet.addRule([

2
src/components/settings_modal/tabs/theme_tab/theme_tab.js
View file

@ -697,7 +697,7 @@ export default {
liteMode: true
})
const sheet = createStyleSheet('theme-tab-overall-preview')
const sheet = createStyleSheet('theme-tab-overall-preview', 90)
const rule = getScopedVersion(
getCssRules(theme3.eager),
'&'

24
src/services/style_setter/style_setter.js
View file

@ -10,11 +10,12 @@ const supportsAdoptedStyleSheets = !!document.adoptedStyleSheets
const stylesheets = {}
export const createStyleSheet = (id) => {
export const createStyleSheet = (id, priority) => {
if (stylesheets[id]) return stylesheets[id]
const newStyleSheet = {
rules: [],
ready: false,
priority,
clear () {
this.rules = []
},
@ -40,9 +41,10 @@ export const adoptStyleSheets = throttle(() => {
document.adoptedStyleSheets = Object
.values(stylesheets)
.filter(x => x.ready)
.map(x => {
.sort((a, b) => a.priority - b.priority)
.map(sheet => {
const css = new CSSStyleSheet()
x.rules.forEach(r => css.insertRule(r, css.cssRules.length))
sheet.rules.forEach(r => css.insertRule(r, css.cssRules.length))
return css
})
} else {
@ -50,8 +52,10 @@ export const adoptStyleSheets = throttle(() => {
Object
.values(stylesheets)
.filter(x => x.ready)
.sort((a, b) => a.priority - b.priority)
.forEach(sheet => {
sheet.rules.forEach(r => holder.sheet.insertRule(r))
sheet.rules.forEach(r => holder.sheet.insertRule(r, holder.sheet.cssRules.length))
})
}
// Some older browsers do not support document.adoptedStyleSheets.
@ -115,8 +119,8 @@ export const tryLoadCache = async () => {
if (!cache) return null
try {
if (cache.engineChecksum === getEngineChecksum()) {
const eagerStyles = createStyleSheet(EAGER_STYLE_ID)
const lazyStyles = createStyleSheet(LAZY_STYLE_ID)
const eagerStyles = createStyleSheet(EAGER_STYLE_ID, 10)
const lazyStyles = createStyleSheet(LAZY_STYLE_ID, 20)
cache.data[0].forEach(rule => eagerStyles.addRule(rule))
cache.data[1].forEach(rule => lazyStyles.addRule(rule))
@ -144,8 +148,8 @@ export const applyTheme = (
onFinish = () => {},
debug
) => {
const eagerStyles = createStyleSheet(EAGER_STYLE_ID)
const lazyStyles = createStyleSheet(LAZY_STYLE_ID)
const eagerStyles = createStyleSheet(EAGER_STYLE_ID, 10)
const lazyStyles = createStyleSheet(LAZY_STYLE_ID, 20)
const { lazyProcessFunc } = generateTheme(
@ -165,7 +169,7 @@ export const applyTheme = (
console.info('Eager part of theme finished, waiting for lazy part to finish to store cache')
},
onLazyFinished () {
eagerStyles.ready = true
lazyStyles.ready = true
adoptStyleSheets()
const cache = { engineChecksum: getEngineChecksum(), data: [eagerStyles.rules, lazyStyles.rules] }
onFinish(cache)
@ -235,7 +239,7 @@ export const applyConfig = (input) => {
.filter(([, v]) => v)
.map(([k, v]) => `--${k}: ${v}`).join(';')
const styleSheet = createStyleSheet('theme-holder')
const styleSheet = createStyleSheet('theme-holder', 30)
styleSheet.addRule(`:root { ${rules} }`)