31ad8f9c93
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>
80 lines
1.8 KiB
CSS
80 lines
1.8 KiB
CSS
/* Keyboard style */
|
|
sq_view {
|
|
background-color: mix(@theme_base_color, @theme_fg_color, 0.1);
|
|
box-shadow:inset 0 1px 0 0 mix(@borders, @theme_base_color, 0.8);
|
|
}
|
|
|
|
sq_button {
|
|
color: @theme_fg_color;
|
|
background: alpha(@theme_fg_color, 0.07);
|
|
box-shadow: 0 1px 0 0 rgba(0,0,0,0.2);
|
|
}
|
|
|
|
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 {
|
|
background: alpha(@theme_fg_color, 0.15);
|
|
}
|
|
|
|
sq_button.altline:active,
|
|
sq_button.special:active,
|
|
sq_button.wide:active {
|
|
background: alpha(@theme_fg_color, 0.2);
|
|
}
|
|
|
|
sq_button.latched {
|
|
background: alpha(@theme_fg_color, 0.2);
|
|
color: alpha(@theme_fg_color, 0.8);
|
|
}
|
|
|
|
sq_button.locked {
|
|
background: alpha(@theme_fg_color, 0.5);
|
|
color: @theme_base_color;
|
|
}
|
|
|
|
#Return {
|
|
background: @theme_selected_bg_color;
|
|
color: @theme_selected_fg_color;
|
|
}
|
|
|
|
#Return:active {
|
|
background: mix(@theme_selected_bg_color, black, 0.2);
|
|
color: mix(@theme_selected_fg_color, black, 0.2);
|
|
}
|
|
|
|
@import url("resource:///sm/puri/squeekboard/common.css");
|