mirror of
https://github.com/phranck/TUIkit.git
synced 2026-05-21 09:50:35 +00:00
phranck
df4ee3253b
AppHeader is rendered at the top of the terminal by RenderLoop, similar to
StatusBar at the bottom. Views declare header content via .appHeader { }
ViewBuilder modifier. Supports standard (thin divider) and block (half-block
with appHeaderBackground) appearance. Hidden when no content is set.
Diff cache invalidates on header height changes to prevent ghosting.
87 lines
3.5 KiB
Swift
87 lines
3.5 KiB
Swift
// 🖥️ TUIKit — Terminal UI Kit for Swift
|
||
// BlockThemePage.swift
|
||
//
|
||
// Created by LAYERED.work
|
||
// CC BY-NC-SA 4.0 Shows all background roles side by side for color tuning.
|
||
//
|
||
|
||
import TUIkit
|
||
|
||
/// Block theme color tuning page.
|
||
///
|
||
/// Displays all background color roles used in block appearance
|
||
/// as labeled color swatches. This page is designed to be viewed
|
||
/// exclusively in block appearance mode for visual comparison.
|
||
struct BlockThemePage: View {
|
||
var body: some View {
|
||
VStack(spacing: 1) {
|
||
|
||
Text("Switch to block appearance (press 'a') and violet theme (press 't').")
|
||
.foregroundColor(.palette.foregroundSecondary)
|
||
|
||
// Panel with Header, Body, and Footer — shows all 3 block background roles
|
||
DemoSection("Panel with Header + Body + Footer") {
|
||
Panel("Header — surfaceHeaderBackground", titleColor: .palette.accent) {
|
||
Text("Body area — surfaceBackground").foregroundColor(.palette.foreground)
|
||
Text("Secondary on body").foregroundColor(.palette.foregroundSecondary)
|
||
Text("Tertiary on body").foregroundColor(.palette.foregroundTertiary)
|
||
} footer: {
|
||
Text("Footer — surfaceHeaderBackground").foregroundColor(.palette.foreground)
|
||
}
|
||
}
|
||
|
||
// Side-by-side containers to compare
|
||
DemoSection("Panel vs Card vs Box") {
|
||
HStack(spacing: 2) {
|
||
Panel("Panel", titleColor: .palette.accent) {
|
||
Text("Foreground").foregroundColor(.palette.foreground)
|
||
Text("Secondary").foregroundColor(.palette.foregroundSecondary)
|
||
Text("Tertiary").foregroundColor(.palette.foregroundTertiary)
|
||
}
|
||
|
||
Card {
|
||
Text("Foreground").foregroundColor(.palette.foreground)
|
||
Text("Secondary").foregroundColor(.palette.foregroundSecondary)
|
||
Text("Tertiary").foregroundColor(.palette.foregroundTertiary)
|
||
}
|
||
|
||
Box {
|
||
Text("Foreground").foregroundColor(.palette.foreground)
|
||
Text("Secondary").foregroundColor(.palette.foregroundSecondary)
|
||
Text("Tertiary").foregroundColor(.palette.foregroundTertiary)
|
||
}
|
||
}
|
||
}
|
||
|
||
// Buttons on app background
|
||
DemoSection("Buttons — elevatedBackground") {
|
||
HStack(spacing: 2) {
|
||
Button("Default") {}
|
||
Button("Primary", style: .primary) {}
|
||
Button("Destructive", style: .destructive) {}
|
||
}
|
||
}
|
||
|
||
// Buttons inside a Panel (on surfaceBackground)
|
||
DemoSection("Buttons inside Panel") {
|
||
Panel("Panel with Buttons", titleColor: .palette.accent) {
|
||
Text("Buttons on surfaceBackground:").foregroundColor(.palette.foregroundSecondary)
|
||
HStack(spacing: 2) {
|
||
Button("Default") {}
|
||
Button("Primary", style: .primary) {}
|
||
}
|
||
}
|
||
}
|
||
|
||
Spacer()
|
||
}
|
||
.appHeader {
|
||
HStack {
|
||
Text("Block Theme Colors").bold().foregroundColor(.palette.accent)
|
||
Spacer()
|
||
Text("TUIkit v\(tuiKitVersion)").foregroundColor(.palette.foregroundTertiary)
|
||
}
|
||
}
|
||
}
|
||
}
|