Make style buttons resizable
This commit is contained in:
parent
8828398707
commit
f7a680587d
|
@ -14,15 +14,14 @@ const
|
||||||
# GTK CSS for overriding the default icon size of buttons
|
# GTK CSS for overriding the default icon size of buttons
|
||||||
gtkCSS = """
|
gtkCSS = """
|
||||||
.style-button {
|
.style-button {
|
||||||
-gtk-icon-size: 5.5em;
|
padding: 0.3em 0.3em;
|
||||||
padding: 0.1em 0.4em;
|
border-radius: 14%;
|
||||||
border-radius: 0.75em;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
.accent-button {
|
.accent-button {
|
||||||
-gtk-icon-size: 1.65em;
|
-gtk-icon-size: 1.65em;
|
||||||
padding: 0.4em;
|
padding: 0.4em;
|
||||||
border-radius: 1.5em;
|
border-radius: 50%;
|
||||||
}
|
}
|
||||||
|
|
||||||
#.accent-button.suggested-action {
|
#.accent-button.suggested-action {
|
||||||
|
@ -36,7 +35,7 @@ const
|
||||||
themeStyles = ["Default", "Nord", "Dracula", "Catppuccin", "Everforest", "Gruvbox"]
|
themeStyles = ["Default", "Nord", "Dracula", "Catppuccin", "Everforest", "Gruvbox"]
|
||||||
accentColors = ["Blue", "Red", "Purple", "Pink", "Teal", "Green", "Yellow", "Orange", "Grey"]
|
accentColors = ["Blue", "Red", "Purple", "Pink", "Teal", "Green", "Yellow", "Orange", "Grey"]
|
||||||
|
|
||||||
var iconsDirs = @[styleIconsDir]
|
var iconsDirs: seq[string]
|
||||||
|
|
||||||
for dir in walkDirs(accentIconsDir / "*"):
|
for dir in walkDirs(accentIconsDir / "*"):
|
||||||
iconsDirs.add(dir)
|
iconsDirs.add(dir)
|
||||||
|
@ -82,7 +81,7 @@ method view(app: AppState): Widget =
|
||||||
Window:
|
Window:
|
||||||
title = "TROMjaro Theme Switcher"
|
title = "TROMjaro Theme Switcher"
|
||||||
# Shrink window to the smallest size
|
# Shrink window to the smallest size
|
||||||
defaultSize = (0, 0)
|
defaultSize = (900, 700)
|
||||||
iconName = appLogo
|
iconName = appLogo
|
||||||
# Vertical box
|
# Vertical box
|
||||||
Box(orient = OrientY, margin = 13, spacing = 10):
|
Box(orient = OrientY, margin = 13, spacing = 10):
|
||||||
|
@ -96,7 +95,7 @@ method view(app: AppState): Widget =
|
||||||
Box(orient = OrientX, spacing = 5):
|
Box(orient = OrientX, spacing = 5):
|
||||||
for styleName in themeStyles:
|
for styleName in themeStyles:
|
||||||
insert(makeThemeButton(shadeName, styleName)) {.vAlign: AlignCenter, hAlign: AlignCenter.}
|
insert(makeThemeButton(shadeName, styleName)) {.vAlign: AlignCenter, hAlign: AlignCenter.}
|
||||||
Separator(margin = Margin(top: 5))
|
Separator(margin = Margin(top: 5)) {.vAlign: AlignCenter.}
|
||||||
Label:
|
Label:
|
||||||
useMarkup=true
|
useMarkup=true
|
||||||
text="<span size='large'>ACCENT COLOR</span>"
|
text="<span size='large'>ACCENT COLOR</span>"
|
||||||
|
@ -104,7 +103,7 @@ method view(app: AppState): Widget =
|
||||||
Box(orient = OrientX, spacing = 3):
|
Box(orient = OrientX, spacing = 3):
|
||||||
for accentColor in accentColors:
|
for accentColor in accentColors:
|
||||||
insert(makeAccentButton(accentColor)) {.vAlign: AlignCenter, hAlign: AlignCenter.}
|
insert(makeAccentButton(accentColor)) {.vAlign: AlignCenter, hAlign: AlignCenter.}
|
||||||
Separator(margin = Margin(top: 12))
|
Separator(margin = Margin(top: 12)) {.vAlign: AlignCenter.}
|
||||||
# Vertical box
|
# Vertical box
|
||||||
Box(orient = OrientY):
|
Box(orient = OrientY):
|
||||||
Label:
|
Label:
|
||||||
|
@ -181,7 +180,8 @@ proc makeThemeButton(shadeName: string, styleName: string): Widget =
|
||||||
|
|
||||||
result = gui:
|
result = gui:
|
||||||
Button:
|
Button:
|
||||||
icon = fmt"Colloid{shade}{style}"
|
Picture:
|
||||||
|
pixbuf = loadPixbuf(fmt"{styleIconsDir}/Colloid{shade}{style}.svg")
|
||||||
tooltip = if shadeName == "": styleName else: fmt"{shadeName}-{styleName}"
|
tooltip = if shadeName == "": styleName else: fmt"{shadeName}-{styleName}"
|
||||||
style = if (shadeName, styleName) == (currentTheme.shade, currentTheme.style):
|
style = if (shadeName, styleName) == (currentTheme.shade, currentTheme.style):
|
||||||
[StyleClass("style-button"), ButtonSuggested]
|
[StyleClass("style-button"), ButtonSuggested]
|
||||||
|
|
Loading…
Reference in New Issue
Block a user