dotfiles/quickshell/config/Theme.qml

pragma Singleton

import QtQuick
import Quickshell

// Takemi palette: crimson, black, white. Nothing else.
//
// White does the work: text, icons, idle indicators. Crimson is the only accent
// and it always means the same thing — active, or wrong. Black is structure,
// used as a hard keyline rather than as a shadow. There are no gradients in
// this shell; every fill is flat.
//
// The wallpaper is teal. The UI used to be teal too, and the two fought each
// other into a murky blue-grey. Letting the UI go monochrome-plus-red is what
// lets the wallpaper read as the colour in the composition.
Singleton {
    id: root

    // ---------------------------------------------------------------- colors
    readonly property color ink: "#000000"

    readonly property color base: "#0a0a0c"
    readonly property color mantle: "#0d0d10"
    readonly property color surface: "#141418"
    readonly property color surfaceAlt: "#1c1c22"
    readonly property color overlay: "#26262e"
    readonly property color outline: "#3a3a44"

    readonly property color text: "#ffffff"
    readonly property color subtext: "#c8c8ce"
    readonly property color muted: "#6b6b70"

    // ------------------------------------------------------------ THE KNOB
    // The one colour in this shell. Change this line and the entire accent
    // recolours — everything below is derived from it, and nothing else in the
    // palette carries hue at all.
    //
    // Keep it in step with `$accent` at the top of
    // ~/.config/hypr/modules/takemi.conf, which is what colours the Hyprland
    // window borders. Those are the only two places the colour is written.
    readonly property color accent: "#ff2d40"

    readonly property color accentDim: Qt.darker(root.accent, 1.9)
    readonly property color accentSoft: Qt.lighter(root.accent, 1.35)

    // `primary` is the resting voice of the UI, which is now simply white.
    // Kept under the old name so the existing call sites don't all have to move.
    readonly property color primary: root.text
    readonly property color primaryDim: "#9a9aa2"
    readonly property color deep: root.surfaceAlt

    // `glow` is the hover highlight. It used to be a brighter teal, which now
    // that everything rests at white would have made hover invisible — so it
    // resolves to crimson. Pointing at a thing lights it up red.
    readonly property color glow: root.accent

    // ------------------------------------------------ semantic treatments
    // These tokens describe interaction meaning, not new palette entries. Each
    // state is composed only from Takemi's black, white, crimson, and neutral
    // surfaces so callers do not invent one-off state colors.
    readonly property color treatmentRestFill: root.surface
    readonly property color treatmentRestMark: root.outline
    readonly property color treatmentRestText: root.text

    readonly property color treatmentHoverFill: root.surface
    readonly property color treatmentHoverMark: root.accent
    readonly property color treatmentHoverText: root.text

    readonly property color treatmentFocusFill: root.text
    readonly property color treatmentFocusMark: root.ink
    readonly property color treatmentFocusText: root.ink
    readonly property color treatmentSelectedFill: root.treatmentFocusFill
    readonly property color treatmentSelectedMark: root.treatmentFocusMark
    readonly property color treatmentSelectedText: root.treatmentFocusText

    readonly property color treatmentActiveFill: root.surface
    readonly property color treatmentActiveMark: root.accent
    readonly property color treatmentActiveText: root.text

    // Crimson carries destructive/error meaning. Text and keylines stay black:
    // black-on-crimson is 5.70:1, while small white-on-crimson is only 3.68:1.
    readonly property color treatmentDestructiveFill: root.accent
    readonly property color treatmentDestructiveMark: root.ink
    readonly property color treatmentDestructiveText: root.ink
    readonly property color treatmentErrorFill: root.treatmentDestructiveFill
    readonly property color treatmentErrorMark: root.treatmentDestructiveMark
    readonly property color treatmentErrorText: root.treatmentDestructiveText

    readonly property color treatmentUrgentFill: root.surface
    readonly property color treatmentUrgentMark: root.accent
    readonly property color treatmentUrgentText: root.text

    readonly property color treatmentDisabledFill: root.surface
    readonly property color treatmentDisabledMark: root.outline
    readonly property color treatmentDisabledText: root.muted

    // Retired hues. Aliases only — do not introduce new uses.
    //
    // `warn` used to be accentSoft, which put a washed-out pink-red on screen
    // wherever something was merely notable. That reads as a faded accent, not
    // as a decision. There is no half-crimson in this palette: a thing is wrong
    // (accent) or it is not (text). `warn` now resolves to the real accent, so
    // low battery shouts properly and everything merely informational is white.
    readonly property color blue: root.primaryDim
    readonly property color ok: root.text
    readonly property color warn: root.accent

    // Display text carries a crimson and a black offset rather than an RGB
    // split. Same trick, correct palette.
    readonly property color splitRed: root.accent
    readonly property color splitCyan: root.ink

    function alpha(c: color, a: real): color {
        return Qt.rgba(c.r, c.g, c.b, a);
    }

    function mix(a: color, b: color, t: real): color {
        const k = Math.max(0, Math.min(1, t));
        return Qt.rgba(a.r + (b.r - a.r) * k,
                       a.g + (b.g - a.g) * k,
                       a.b + (b.b - a.b) * k,
                       a.a + (b.a - a.a) * k);
    }

    // Load readouts sit white until the number actually matters, then bleed to
    // crimson. Not a hue cycle — red always means the same thing.
    function heat(pct: real): color {
        if (pct <= 55) return root.text;
        return root.mix(root.text, root.accent, (pct - 55) / 45);
    }

    // ----------------------------------------------------------------- fonts
    readonly property string fontDisplay: "Archivo Black"
    readonly property string fontMono: "JetBrainsMono Nerd Font"
    readonly property string fontIcon: "JetBrainsMono Nerd Font"

    readonly property int weightDisplay: Font.Black
    readonly property int weightBody: Font.Medium

    readonly property int fsMicro: 9
    readonly property int fsSmall: 11
    readonly property int fsBody: 12
    readonly property int fsLarge: 15
    readonly property int fsTitle: 20
    readonly property int fsHuge: 34
    readonly property int fsMega: 92

    // -------------------------------------------------------------- geometry
    readonly property int barHeight: 40
    readonly property int barMargin: 8
    readonly property int barGap: 8

    // The right-hand rail uses the same lean and chamfer as the bar — a
    // vertical panel leans its horizontal edges by a fraction of its width,
    // which works out to the same 14 degrees.
    readonly property int railWidth: 48

    // ONE angle, everywhere. tan(14deg). Persona geometry is disciplined, not
    // random: every edge in the shell leans by exactly this much in exactly the
    // same direction, and every corner is chopped by exactly `cut`. Varying
    // these per module reads as noise, not as style.
    readonly property real skew: 0.249
    readonly property int cut: 10
    readonly property int stroke: 2

    // Pure-black keyline and offset copy behind panels. This is the one piece of
    // layering the style needs; it is not a soft shadow and never blurs.
    readonly property real dropOffset: 3
    readonly property real keylineWidth: 2

    readonly property int padS: 6
    readonly property int padM: 12
    readonly property int padL: 20
    readonly property int padXL: 32

    readonly property int popoutWidth: 380
    readonly property int popoutGap: 10

    // ------------------------------------------------------------ animation
    // P5 motion is snappy and slightly overshooting — never soft.
    readonly property int durFast: 110
    readonly property int durBase: 190
    readonly property int durSlow: 340
    readonly property int durLazy: 620

    readonly property var easeSnap: [0.16, 1.0, 0.3, 1.0, 1, 1]        // outExpo-ish
    readonly property var easeBack: [0.34, 1.56, 0.64, 1.0, 1, 1]      // overshoot
    readonly property var easeIn: [0.55, 0.0, 0.9, 0.35, 1, 1]

    // -------------------------------------------------------------- textures
    readonly property url texHalftone: "root:/assets/halftone.png"
    readonly property url texStripes: "root:/assets/stripes.png"
    readonly property url texScanline: "root:/assets/scanline.png"

    // Last resort only. The live wallpaper comes from the Wallpaper singleton,
    // which asks hyprpaper what is actually on screen — a path written down
    // here goes stale the moment the wallpaper is switched, which is exactly
    // what happened to the lock screen.
    readonly property url fallbackWallpaper: "file:///home/narl/.wallpapers/takemi_1.jpg"
}