Panama/config/dot/quickshell/config/Theme.qml

pragma Singleton

// ─────────────────────────────────────────────────────────────────────────────
// Tokyo Night Moon — the single source of truth for every colour, radius,
// duration and font in the shell. Nothing below this file should hardcode a
// colour; if you find yourself writing "#" outside this file, add a token here.
//
// The bar keeps GNOME's 36px information density but sits directly on the
// desktop, edge to edge. The dock retains the former glass vocabulary: bottom,
// 48px icons and dot indicators.
// ─────────────────────────────────────────────────────────────────────────────

import Quickshell
// QtQuick is required even though nothing visual is declared here: `color` is a
// QtQuick value type, and Qt.rgba() lives in its JS namespace.
import QtQuick

Singleton {
    id: root

    // ── Palette ─────────────────────────────────────────────────────────────
    // Canonical Tokyo Night Moon. `accent` matches the GNOME accent exactly.
    readonly property color bg: "#222436"
    readonly property color bgDark: "#1e2030"
    readonly property color bgHighlight: "#2f334d"
    readonly property color bgPanel: "#2e2f3d" // dock glass surface
    readonly property color bgPopover: "#21212f" // Openbar submenu background

    readonly property color fg: "#c8d3f5"
    readonly property color fgDim: "#828bb8"
    readonly property color fgMuted: "#636da6"
    readonly property color gutter: "#3b4261"

    // The pair. `accent` is the primary and carries every state meaning
    // (focused, active, on). `accentSecondary` is the orchid from the tmux
    // theme — it never appears alone, only as the far end of a gradient. That
    // restraint is the whole point: the two colours meeting is the signature,
    // so the pink stops being special the moment it's used as a flat fill.
    readonly property color accent: "#82aaff" // blue
    readonly property color accentSecondary: "#b172b0" // orchid, from tmux
    readonly property color accentAlt: "#65bcff" // blue1, a lighter blue
    readonly property color cyan: "#86e1fc"
    readonly property color teal: "#4fd6be"
    readonly property color green: "#c3e88d"
    readonly property color yellow: "#ffc777"
    readonly property color orange: "#ff966c"
    readonly property color red: "#ff757f"
    readonly property color redDeep: "#c53b53"
    readonly property color magenta: "#c099ff"
    readonly property color pink: "#fca7ea"

    // Semantic aliases — prefer these in widgets so intent survives a repaint.
    readonly property color ok: green
    readonly property color warn: yellow
    readonly property color danger: red
    readonly property color urgent: orange

    // ── Surface alphas ──────────────────────────────────────────────────────
    // The dock sits on compositor blur, so its fill is deliberately very
    // translucent. Popovers are near-opaque because they carry text that must
    // stay legible. The bar itself has no surface or alpha token.
    readonly property real dockAlpha: 0.34
    readonly property real popoverAlpha: 0.92
    readonly property real overlayAlpha: 0.55
    readonly property real hoverAlpha: 0.14
    readonly property real activeAlpha: 0.24

    // ── Geometry ────────────────────────────────────────────────────────────
    readonly property int barHeight: 36
    readonly property int barGap: 6 // breathing room below the bar for popovers
    readonly property int barSideMargin: 10 // inset for floating popovers

    readonly property int dockIconSize: 48
    readonly property int dockPadding: 8
    readonly property int dockGap: 8
    readonly property int dockRadius: 20

    readonly property int popoverRadius: 18
    readonly property int popoverPadding: 14
    readonly property int popoverWidth: 380
    readonly property int controlCenterWidth: 430
    readonly property int controlCenterTopGap: 2

    readonly property int cardRadius: 12
    readonly property int pillRadius: 999
    readonly property int itemSpacing: 8
    readonly property int sectionSpacing: 14

    // ── Type ────────────────────────────────────────────────────────────────
    // Adwaita Sans for everything the user reads as text. No exceptions: a
    // monospaced clock or percentage reads as a terminal readout pasted into a
    // UI, which is the opposite of the intent here.
    readonly property string fontFamily: DesktopPreferences.get("interfaceFont")

    // Nerd Font, used ONLY to draw icon glyphs — never for text. It is the
    // pragmatic alternative to freedesktop symbolic icons, which ship with a
    // hardcoded dark fill Qt will not recolour (see widgets/ThemedIcon.qml).
    readonly property string fontMono: DesktopPreferences.get("iconFont")

    // Apply to any text whose digits change in place — clocks, percentages,
    // elapsed timers, dimension readouts. Tabular figures all share one
    // advance width, so the text stops twitching as the numbers tick without
    // needing a monospaced face.
    //
    //   font.family: Theme.fontFamily
    //   font.features: Theme.tabularFigures
    readonly property var tabularFigures: ({
            "tnum": 1
        })
    // The four sizes are a scale, not four independent numbers: they move
    // together so the relationship between body, caption, heading and title
    // survives a change to the base rather than drifting apart.
    readonly property int fontSize: DesktopPreferences.get("interfaceFontSize")
    readonly property int fontSizeSmall: Math.max(9, root.fontSize - 2)
    readonly property int fontSizeLarge: root.fontSize + 3
    readonly property int fontSizeTitle: root.fontSize + 7

    // ── Motion ──────────────────────────────────────────────────────────────
    // Event-driven only. Nothing in this shell animates while idle — no pulse,
    // no shimmer, no spinners. These durations are used for open/close/hover.
    readonly property int durFast: 120
    readonly property int durNormal: 200
    readonly property int durSlow: 320

    // The dock revealing is the one animation that answers a live pointer
    // movement, so it gets its own (much shorter) duration. Anything slower
    // reads as the desktop lagging behind the cursor rather than as motion.
    readonly property int durDockReveal: 90

    // Matches the "snappy" spring curve defined in hypr/looks.lua.
    readonly property list<real> easeStandard: [0.05, 0.9, 0.1, 1.0]
    readonly property list<real> easeOvershoot: [0.34, 1.56, 0.64, 1.0]

    // ── Helpers ─────────────────────────────────────────────────────────────
    // Qt.alpha() does not exist; this is the idiomatic way to re-alpha a token.
    function alpha(c: color, a: real): color {
        return Qt.rgba(c.r, c.g, c.b, a);
    }

    // Blend two tokens — used for hover/pressed states so we never invent a
    // colour that isn't derived from the palette.
    function mix(a: color, b: color, ratio: real): color {
        return Qt.rgba(a.r + (b.r - a.r) * ratio, a.g + (b.g - a.g) * ratio, a.b + (b.b - a.b) * ratio, a.a + (b.a - a.a) * ratio);
    }

    // ── The prism ───────────────────────────────────────────────────────────
    // Where the two accents meet. Used for the hairline along the top edge of
    // every glass surface (widgets/PrismEdge.qml), the focused window border,
    // the active workspace pill and slider fills.
    //
    // Where the gradient runs left-to-right the blue leads, because the eye
    // reads left first and blue is the colour that carries meaning.
    readonly property real prismStart: 0.22
    readonly property real prismEnd: 0.78

    // Opacity of the hairline itself. Deliberately below 1: at full strength it
    // reads as a drawn line rather than as light catching an edge.
    readonly property real prismEdgeAlpha: 0.85
}