Files
spacestation/capytal/forgejo/assets/js/capytal-theme.js

70 lines
2.2 KiB
JavaScript

const CAPYTAL_THEME_NAME = "capytal-dark";
(() => {
let version = document.querySelector('div.left-links > a[href="/admin/config"]')?.textContent
if (!version) {
console.warn(`${CAPYTAL_THEME_NAME}: unable to find Forgejo instance version!`)
return
}
console.debug(`${CAPYTAL_THEME_NAME}: version found ${version}`)
let style = document.querySelector(`link[href="/assets/css/theme-${CAPYTAL_THEME_NAME}.css?v=${version}"`)
if (!style) {
console.warn(`${CAPYTAL_THEME_NAME}: capytal theme not selected, skipping!`)
return
}
console.log(`${CAPYTAL_THEME_NAME}: starting to apply theme modifications`)
labelStyles()
})()
function labelStyles() {
/** @type {Element[]} */
let labels = [];
document.querySelectorAll('.labels-list').forEach(e => labels = labels.concat(...e.children))
document.querySelectorAll('ul.issue-label-list').forEach(e => labels = labels.concat(...e.children))
document.querySelectorAll('div.filter.menu.ugc-labels').forEach(e => {
for (let c of e.children) {
let label = c.querySelector('span.ui.label.scope-parent') ?? c.querySelector('div.ui.label')
if (label) {
labels.push(label)
}
}
})
for (let label of labels) {
console.log(label)
let left = label.querySelector('.scope-left')
let right = label.querySelector('.scope-right')
if (!left && !right) {
label = (label.querySelector('div.ui.label')?? label)
let color = label.getAttribute('style')?.split(' ')?.at(-2)
label.setAttribute('style', `color: ${color} !important;`+
`border: solid 1px ${color} !important;`+
`background-color: ${color.slice(0, -2) + '22'} !important;`)
}
if (left) {
let color = left.getAttribute('style')?.split(' ')?.at(-2)
left.setAttribute('style', `color: ${color} !important;`+
`border: solid 1px ${color} !important;`+
`border-right: solid 0px !important;`+
`background-color: transparent !important;`)
}
if (right) {
let color = right.getAttribute('style')?.split(' ')?.at(-2)
right.setAttribute('style', `color: ${color} !important;`+
`border: solid 1px ${color} !important;`+
`border-left: solid 0px !important;`+
`background-color: ${color.slice(0, -2) + '22'} !important;`)
}
}
}