Add border at the bottom of view-changing buttons

to make those distinguishable from other highlighted buttons.

The border at the bottom makes it look like a stack of buttons
that will be put into position when tapping the view-changing buttons.

Part-of: <https://gitlab.gnome.org/World/Phosh/squeekboard/-/merge_requests/635>
This commit is contained in:
MoonlightWave-12
2024-04-08 19:43:41 +02:00
parent d3f03e9bef
commit 31ad8f9c93
8 changed files with 574 additions and 308 deletions

View File

@ -14,6 +14,36 @@ sq_button:active {
background: alpha(@theme_fg_color, 0.11);
}
sq_button.emoji-group {
background: alpha(@theme_fg_color, 0.105);
border-bottom: 0.4999px;
border-style: solid;
border-color: alpha(@theme_fg_color, 0.25);
}
sq_button.emoji-group:active {
background: alpha(@theme_fg_color, 0.16);
border-bottom: 0.4999px;
border-style: solid;
border-color: alpha(@theme_fg_color, 0.275);
}
sq_button.change-view,
sq_button.change-view-2 {
background: alpha(@theme_fg_color, 0.15);
border-bottom: 0.4999px;
border-style: solid;
border-color: alpha(@theme_fg_color, 0.25);
}
sq_button.change-view:active,
sq_button.change-view-2:active {
background: alpha(@theme_fg_color, 0.2);
border-bottom: 0.4999px;
border-style: solid;
border-color: alpha(@theme_fg_color, 0.275);
}
sq_button.altline,
sq_button.special,
sq_button.wide {