zoriya/noctalia-shell
1
0
Fork 0
mirror of https://github.com/zoriya/noctalia-shell.git synced 2026-08-15 18:43:59 +00:00
Code Issues Packages Projects Releases Wiki Activity

app theming: walker

Browse Source
This commit is contained in:
ItsLemmy
2025-10-29 10:57:11 -04:00
parent 2f9c3abcb5
commit 98bed3d8be
3 changed files with 77 additions and 75 deletions
Download Patch File Download Diff File Expand all files Collapse all files
Services/AppThemeService.qml
+39 -38
View File
@@ -114,7 +114,8 @@ Singleton {
"input": "walker.css",
"outputs": [{
"path": "~/.config/walker/themes/noctalia/style.css"
}]
}],
"strict": true
}
})
@@ -194,12 +195,9 @@ Singleton {
handleTerminalThemes()
const isDarkMode = Settings.data.colorSchemes.darkMode
const mode = isDarkMode ? "dark" : "light"
const mode = Settings.data.colorSchemes.darkMode ? "dark" : "light"
const colors = schemeData[mode]
const matugenColors = generatePalette(colors.mPrimary, colors.mSecondary, colors.mTertiary, colors.mError, colors.mSurface, colors.mOutline, isDarkMode)
let script = processAllTemplates(matugenColors, mode)
let script = processAllTemplates(colors, mode)
// Add user templates if enabled
script += buildUserTemplateCommandForPredefined(schemeData, mode)
@@ -208,75 +206,74 @@ Singleton {
generateProcess.running = true
}
function generatePalette(primaryColor, secondaryColor, tertiaryColor, errorColor, backgroundColor, outlineColor, isDarkMode) {
function generatePalette(colors, isDarkMode, isStrict) {
const c = hex => ({
"default": {
"hex": hex,
"hex_stripped": hex.replace(/^#/, "")
}
})
// Generate container colors
const primaryContainer = ColorsConvert.generateContainerColor(primaryColor, isDarkMode)
const secondaryContainer = ColorsConvert.generateContainerColor(secondaryColor, isDarkMode)
const tertiaryContainer = ColorsConvert.generateContainerColor(tertiaryColor, isDarkMode)
const primaryContainer = ColorsConvert.generateContainerColor(colors.mPrimary, isDarkMode)
const secondaryContainer = ColorsConvert.generateContainerColor(colors.mSecondary, isDarkMode)
const tertiaryContainer = ColorsConvert.generateContainerColor(colors.mTertiary, isDarkMode)
// Generate "on" colors (for text/icons)
const onPrimary = ColorsConvert.generateOnColor(primaryColor, isDarkMode)
const onSecondary = ColorsConvert.generateOnColor(secondaryColor, isDarkMode)
const onTertiary = ColorsConvert.generateOnColor(tertiaryColor, isDarkMode)
const onBackground = ColorsConvert.generateOnColor(backgroundColor, isDarkMode)
// Generate "on" colors
const onPrimary = ColorsConvert.generateOnColor(colors.mPrimary, isDarkMode)
const onSecondary = ColorsConvert.generateOnColor(colors.mSecondary, isDarkMode)
const onTertiary = ColorsConvert.generateOnColor(colors.mTertiary, isDarkMode)
const onPrimaryContainer = ColorsConvert.generateOnColor(primaryContainer, isDarkMode)
const onSecondaryContainer = ColorsConvert.generateOnColor(secondaryContainer, isDarkMode)
const onTertiaryContainer = ColorsConvert.generateOnColor(tertiaryContainer, isDarkMode)
// Generate error colors (standard red-based)
const errorContainer = ColorsConvert.generateContainerColor(errorColor, isDarkMode)
const onError = ColorsConvert.generateOnColor(errorColor, isDarkMode)
const errorContainer = ColorsConvert.generateContainerColor(colors.mError, isDarkMode)
const onError = ColorsConvert.generateOnColor(colors.mError, isDarkMode)
const onErrorContainer = ColorsConvert.generateOnColor(errorContainer, isDarkMode)
// Surface is same as background in Material Design 3
const surface = backgroundColor
const onSurface = onBackground
const surface = colors.mSurface
const onSurface = isStrict ? colors.mOnSurface : ColorsConvert.generateOnColor(colors.mSurface, isDarkMode)
// Generate surface variant (slightly different tone)
const surfaceVariant = ColorsConvert.adjustLightness(backgroundColor, isDarkMode ? 5 : -3)
const onSurfaceVariant = ColorsConvert.generateOnColor(surfaceVariant, isDarkMode)
const surfaceVariant = isStrict ? colors.mSurfaceVariant : ColorsConvert.adjustLightness(colors.mSurface, isDarkMode ? 5 : -3)
const onSurfaceVariant = isStrict ? colors.mOnSurfaceVariant : ColorsConvert.generateOnColor(surfaceVariant, isDarkMode)
// Generate surface containers (progressive elevation)
const surfaceContainerLowest = ColorsConvert.generateSurfaceVariant(backgroundColor, 0, isDarkMode)
const surfaceContainerLow = ColorsConvert.generateSurfaceVariant(backgroundColor, 1, isDarkMode)
const surfaceContainer = ColorsConvert.generateSurfaceVariant(backgroundColor, 2, isDarkMode)
const surfaceContainerHigh = ColorsConvert.generateSurfaceVariant(backgroundColor, 3, isDarkMode)
const surfaceContainerHighest = ColorsConvert.generateSurfaceVariant(backgroundColor, 4, isDarkMode)
const surfaceContainerLowest = ColorsConvert.generateSurfaceVariant(surface, 0, isDarkMode)
const surfaceContainerLow = ColorsConvert.generateSurfaceVariant(surface, 1, isDarkMode)
const surfaceContainer = ColorsConvert.generateSurfaceVariant(surface, 2, isDarkMode)
const surfaceContainerHigh = ColorsConvert.generateSurfaceVariant(surface, 3, isDarkMode)
const surfaceContainerHighest = ColorsConvert.generateSurfaceVariant(surface, 4, isDarkMode)
// Generate outline colors (for borders/dividers)
const outline = isDarkMode ? "#938f99" : "#79747e"
const outline = isStrict ? colors.mOutline : (isDarkMode ? "#938f99" : "#79747e")
const outlineVariant = ColorsConvert.adjustLightness(outline, isDarkMode ? -10 : 10)
// Shadow is always very dark
const shadow = "#000000"
return {
"primary": c(primaryColor),
"primary": c(colors.mPrimary),
"on_primary": c(onPrimary),
"primary_container": c(primaryContainer),
"on_primary_container": c(onPrimaryContainer),
"secondary": c(secondaryColor),
"secondary": c(colors.mSecondary),
"on_secondary": c(onSecondary),
"secondary_container": c(secondaryContainer),
"on_secondary_container": c(onSecondaryContainer),
"tertiary": c(tertiaryColor),
"tertiary": c(colors.mTertiary),
"on_tertiary": c(onTertiary),
"tertiary_container": c(tertiaryContainer),
"on_tertiary_container": c(onTertiaryContainer),
"error": c(errorColor),
"error": c(colors.mError),
"on_error": c(onError),
"error_container": c(errorContainer),
"on_error_container": c(onErrorContainer),
"background": c(backgroundColor),
"on_background": c(onBackground),
"background": c(surface),
"on_background": c(onSurface),
"surface": c(surface),
"on_surface": c(onSurface),
"surface_variant": c(surfaceVariant),
@@ -309,7 +306,11 @@ Singleton {
const templatePath = `${Quickshell.shellDir}/Assets/MatugenTemplates/${config.input}`
let script = ""
const palette = generatePalette(colors, Settings.data.colorSchemes.darkMode, config.strict || false)
config.outputs.forEach(output => {
const outputPath = output.path.replace("~", homeDir)
const outputDir = outputPath.substring(0, outputPath.lastIndexOf('/'))
@@ -319,14 +320,14 @@ Singleton {
script += `if [ -d "${baseConfigDir}" ]; then\n`
script += ` mkdir -p ${outputDir}\n`
script += ` cp '${templatePath}' '${outputPath}'\n`
script += ` ${replaceColorsInFile(outputPath, colors)}\n`
script += ` ${replaceColorsInFile(outputPath, palette)}\n`
script += `else\n`
script += ` echo "Discord client ${appName} not found at ${baseConfigDir}, skipping theme generation"\n`
script += `fi\n`
} else {
script += `mkdir -p ${outputDir}\n`
script += `cp '${templatePath}' '${outputPath}'\n`
script += replaceColorsInFile(outputPath, colors)
script += replaceColorsInFile(outputPath, palette)
}
})
@@ -410,7 +411,7 @@ Singleton {
const colors = schemeData[mode]
// Generate the matugen palette JSON
const matugenColors = generatePalette(colors.mPrimary, colors.mSecondary, colors.mTertiary, colors.mError, colors.mSurface, colors.mOutline, isDarkMode)
const palette = generatePalette(colors, isDarkMode, false)
// Create a temporary JSON file with the color palette
const tempJsonPath = Settings.cacheDir + "predefined-colors.json"
@@ -423,7 +424,7 @@ Singleton {
// Write the color palette to a temp JSON file
script += ` cat > '${tempJsonPathEsc}' << 'EOF'\n`
script += JSON.stringify({
"colors": matugenColors
"colors": palette
}, null, 2) + "\n"
script += "EOF\n"