tomo/nasin
tomo/nasin
1
0
Fork 0
Code Issues 2 Pull Requests Packages Projects Releases 14 Wiki Activity

Add styling for calendars

Browse Source
This commit is contained in:
Sasha Koshka 2024-06-19 00:31:50 -04:00
parent 45b2bee72d
commit 8e2fb26ab5
2 changed files with 139 additions and 26 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

84
internal/style/aluminum/style.go
View File

@ -23,22 +23,25 @@ func border (top, right, bottom, left uint32, width ...int) tomo.Border {
} }
} }
var colorDot = hex(0x7391c080) var colorDot = hex(0x7391c080)
var colorFocus = hex(0x5f8bc4FF) var colorFocus = hex(0x5f8bc4FF)
var colorHighlight = hex(0x5f8bc4FF) var colorHighlight = hex(0x5f8bc4FF)
var colorBackground = hex(0xd4d4d4FF) var colorBackground = hex(0xd4d4d4FF)
var colorForeground = color.Black var colorForeground = color.Black
var colorOutline = color.Black var colorOutline = color.Black
var colorGutter = hex(0xbfc6d1FF) var colorGutter = hex(0xbfc6d1FF)
var colorGutterHovered = hex(0xc5cbd6FF) var colorGutterHovered = hex(0xc5cbd6FF)
var colorRaised = hex(0xe9eaeaFF) var colorRaised = hex(0xe9eaeaFF)
var colorRaisedPressed = hex(0xccd4ddFF) var colorRaisedPressed = hex(0xccd4ddFF)
var colorRaisedFocused = hex(0xcfd6ddFF) var colorRaisedFocused = hex(0xcfd6ddFF)
var colorRaisedHovered = hex(0xf1f3f5FF) var colorRaisedHovered = hex(0xf1f3f5FF)
var colorSunken = hex(0xe9eaeaFF) var colorSunken = hex(0xe9eaeaFF)
var colorSunkenFocused = hex(0xe0e6eeFF) var colorSunkenFocused = hex(0xe0e6eeFF)
var colorSunkenPressed = hex(0xe0e6eeFF) var colorSunkenPressed = hex(0xe0e6eeFF)
var colorCalendarWeekdayHeader = hex(0xd3cac2FF)
var colorCalendarWeekend = hex(0xc2d3c4FF)
var colorCalendarDay = hex(0xd6dae2FF)
var outline = tomo.Border { var outline = tomo.Border {
Width: tomo.I(1), Width: tomo.I(1),
@ -335,4 +338,55 @@ var rules = []style.Rule {
}, },
), ),
}, },
// *.Calendar[*]
style.Rule {
Role: tomo.R("", "Calendar", ""),
Default: style.AS (
style.AttrBorder {
borderOuterShadow,
borderGap,
},
style.AttrColor { Color: tomo.ColorRaised },
style.AttrPadding(tomo.I(2)),
style.AttrGap { X: 2, Y: 2 },
),
},
// *.CalendarGrid[*]
style.Rule {
Role: tomo.R("", "CalendarGrid", ""),
Default: style.AS (
style.AttrGap { X: 2, Y: 2 },
),
},
// *.CalendarWeekdayHeader[*]
style.Rule {
Role: tomo.R("", "CalendarWeekdayHeader", ""),
Default: style.AS (
style.AttrPadding(tomo.I(2)),
style.AttrColor { Color: colorCalendarWeekdayHeader },
),
},
// *.CalendarDay[weekday]
style.Rule {
Role: tomo.R("", "CalendarDay", "weekday"),
Default: style.AS (
style.AttrPadding(tomo.I(2)),
style.AttrMinimumSize { X: 32, Y: 32 },
style.AttrColor { Color: colorCalendarDay },
),
},
// *.CalendarDay[weekend]
style.Rule {
Role: tomo.R("", "CalendarDay", "weekend"),
Default: style.AS (
style.AttrPadding(tomo.I(2)),
style.AttrMinimumSize { X: 32, Y: 32 },
style.AttrColor { Color: colorCalendarWeekend },
),
},
} }

81
internal/style/fallback/style.go
View File

@ -5,17 +5,21 @@ import "git.tebibyte.media/tomo/tomo"
import "golang.org/x/image/font/basicfont" import "golang.org/x/image/font/basicfont"
import "git.tebibyte.media/tomo/nasin/internal/style" import "git.tebibyte.media/tomo/nasin/internal/style"
var colorFocus = color.RGBA { R: 61, G: 128, B: 143, A: 255 } var colorFocus = color.RGBA { R: 61, G: 128, B: 143, A: 255 }
var colorInput = color.RGBA { R: 208, G: 203, B: 150, A: 255 } var colorInput = color.RGBA { R: 208, G: 203, B: 150, A: 255 }
var colorCarved = color.RGBA { R: 151, G: 160, B: 150, A: 255 } var colorCarved = color.RGBA { R: 151, G: 160, B: 150, A: 255 }
var colorGutter = color.RGBA { R: 116, G: 132, B: 126, A: 255 } var colorGutter = color.RGBA { R: 116, G: 132, B: 126, A: 255 }
var colorShadow = color.RGBA { R: 57, G: 59, B: 57, A: 255 } var colorShadow = color.RGBA { R: 57, G: 59, B: 57, A: 255 }
var colorInputShadow = color.RGBA { R: 143, G: 146, B: 91, A: 255 } var colorShade = color.RGBA { A: 128 }
var colorHighlight = color.RGBA { R: 207, G: 215, B: 210, A: 255 } var colorInputShadow = color.RGBA { R: 143, G: 146, B: 91, A: 255 }
var colorBackground = color.RGBA { R: 169, G: 171, B: 168, A: 255 } var colorHighlight = color.RGBA { R: 207, G: 215, B: 210, A: 255 }
var colorCarvedPressed = color.RGBA { R: 129, G: 142, B: 137, A: 255 } var colorBackground = color.RGBA { R: 169, G: 171, B: 168, A: 255 }
var colorForeground = color.Black var colorCarvedPressed = color.RGBA { R: 129, G: 142, B: 137, A: 255 }
var colorOutline = color.Black var colorForeground = color.Black
var colorOutline = color.Black
var colorCalendarWeekdayHeader = color.RGBA { R: 194, G: 162, B: 132, A: 255 }
var colorCalendarWeekend = color.RGBA { R: 165, G: 185, B: 120, A: 255 }
var colorCalendarDay = color.RGBA { R: 194, G: 189, B: 132, A: 255 }
var outline = tomo.Border { var outline = tomo.Border {
Width: tomo.I(1), Width: tomo.I(1),
@ -31,6 +35,7 @@ var borderColorEngraved = [4]color.Color { colorShadow, colorHighlight, col
var borderColorLifted = [4]color.Color { colorHighlight, colorShadow, colorShadow, colorHighlight } var borderColorLifted = [4]color.Color { colorHighlight, colorShadow, colorShadow, colorHighlight }
var borderColorInput = [4]color.Color { colorInputShadow, colorInput, colorInput, colorInputShadow } var borderColorInput = [4]color.Color { colorInputShadow, colorInput, colorInput, colorInputShadow }
var borderColorFocused = [4]color.Color { colorFocus, colorFocus, colorFocus, colorFocus } var borderColorFocused = [4]color.Color { colorFocus, colorFocus, colorFocus, colorFocus }
var borderColorShade = [4]color.Color { colorShade, colorShade, colorShade, colorShade }
var rules = []style.Rule { var rules = []style.Rule {
// *.*[*] // *.*[*]
@ -342,4 +347,58 @@ var rules = []style.Rule {
}, },
), ),
}, },
// *.Calendar[*]
style.Rule {
Role: tomo.R("", "Calendar", ""),
Default: style.AS (
style.AttrBorder {
tomo.Border {
Width: tomo.I(0, 1, 1, 0),
Color: borderColorShade,
},
outline,
},
style.AttrColor { Color: colorInput },
style.AttrPadding(tomo.I(2)),
style.AttrGap { X: 2, Y: 2 },
),
},
// *.CalendarGrid[*]
style.Rule {
Role: tomo.R("", "CalendarGrid", ""),
Default: style.AS (
style.AttrGap { X: 2, Y: 2 },
),
},
// *.CalendarWeekdayHeader[*]
style.Rule {
Role: tomo.R("", "CalendarWeekdayHeader", ""),
Default: style.AS (
style.AttrPadding(tomo.I(2)),
style.AttrColor { Color: colorCalendarWeekdayHeader },
),
},
// *.CalendarDay[weekday]
style.Rule {
Role: tomo.R("", "CalendarDay", "weekday"),
Default: style.AS (
style.AttrPadding(tomo.I(2)),
style.AttrMinimumSize { X: 32, Y: 32 },
style.AttrColor { Color: colorCalendarDay },
),
},
// *.CalendarDay[weekend]
style.Rule {
Role: tomo.R("", "CalendarDay", "weekend"),
Default: style.AS (
style.AttrPadding(tomo.I(2)),
style.AttrMinimumSize { X: 32, Y: 32 },
style.AttrColor { Color: colorCalendarWeekend },
),
},
} }