Add a button-style for subtle highlighting

and use it to subtly highlight commonly used symbols in the
accent-views of the German layouts.

Part-of: <https://gitlab.gnome.org/World/Phosh/squeekboard/-/merge_requests/637>
This commit is contained in:
MoonlightWave-12
2024-04-02 18:24:05 +02:00
parent e0092bd860
commit 5ac85d21b9
6 changed files with 122 additions and 38 deletions

View File

@ -1,11 +1,12 @@
---
outlines:
default: { width: 35.33, height: 52 }
altline: { width: 52.67, height: 52 }
change-view: { width: 52.67, height: 52 }
wide: { width: 62, height: 52 }
spaceline: { width: 89.3, height: 52 }
special: { width: 35.33, height: 52 }
default: { width: 35.33, height: 52 }
subtle-highlight: { width: 35.33, height: 52 }
altline: { width: 52.67, height: 52 }
change-view: { width: 52.67, height: 52 }
wide: { width: 62, height: 52 }
spaceline: { width: 89.3, height: 52 }
special: { width: 35.33, height: 52 }
views:
base:
@ -31,7 +32,7 @@ views:
eschars:
- "ä è é ö ü Ä È É Ö Ü"
- "à â ê î ô À Â È Î Ô"
- "show_numbers « » ç Ç æ œ ß BackSpace"
- "show_numbers « » ç Ç æ œ ß-subtle-highlight BackSpace"
- "show_letters show_eschars preferences space „ “ Return"
buttons:
@ -79,3 +80,18 @@ buttons:
outline: "altline"
icon: "key-enter"
keysym: "Return"
ä:
outline: "subtle-highlight"
ö:
outline: "subtle-highlight"
ü:
outline: "subtle-highlight"
Ä:
outline: "subtle-highlight"
Ö:
outline: "subtle-highlight"
Ü:
outline: "subtle-highlight"
ß-subtle-highlight:
outline: "subtle-highlight"
text: "ß"

View File

@ -1,14 +1,15 @@
---
outlines:
default: { width: 48, height: 42 }
halfwidth: { width: 24, height: 42 }
thin: { width: 30, height: 42 }
narrow: { width: 40.5, height: 42 }
altline: { width: 81, height: 42 }
change-view: { width: 81, height: 42 }
wide: { width: 108, height: 42 }
spaceline: { width: 156, height: 42 }
special: { width: 48, height: 42 }
default: { width: 48, height: 42 }
subtle-highlight: { width: 48, height: 42 }
halfwidth: { width: 24, height: 42 }
thin: { width: 30, height: 42 }
narrow: { width: 40.5, height: 42 }
altline: { width: 81, height: 42 }
change-view: { width: 81, height: 42 }
wide: { width: 108, height: 42 }
spaceline: { width: 156, height: 42 }
special: { width: 48, height: 42 }
views:
base:
@ -32,9 +33,9 @@ views:
- "show_numbers \\ / § π τ [ ] BackSpace"
- "show_letters show_eschars preferences space ,-narrow .-narrow Return"
eschars:
- è é ö ü Ä È É Ö Ü"
- -subtle-highlight è é ö-subtle-highlight ü-subtle-highlight Ä-subtle-highlight È É Ö-subtle-highlight Ü-subtle-highlight"
- "à â ê î ô À Â È Î Ô"
- "show_numbers « » ç Ç æ œ ß BackSpace"
- "show_numbers « » ç Ç æ œ ß-subtle-highlight BackSpace"
- "show_letters show_eschars preferences space „ “ Return"
buttons:
@ -104,3 +105,24 @@ buttons:
ß-thin:
outline: "thin"
text: "ß"
ä-subtle-highlight:
outline: "subtle-highlight"
text: "ä"
ö-subtle-highlight:
outline: "subtle-highlight"
text: "ö"
ü-subtle-highlight:
outline: "subtle-highlight"
text: "ü"
Ä-subtle-highlight:
outline: "subtle-highlight"
text: "Ä"
Ö-subtle-highlight:
outline: "subtle-highlight"
text: "Ö"
Ü-subtle-highlight:
outline: "subtle-highlight"
text: "Ü"
ß-subtle-highlight:
outline: "subtle-highlight"
text: "ß"

View File

@ -1,15 +1,16 @@
---
outlines:
default: { width: 35.33, height: 46 }
halfwidth: { width: 17.665, height: 46 }
narrow: { width: 26.335, height: 46 }
special: { width: 44, height: 46 }
altline: { width: 52.67, height: 46 }
large: { width: 52.67, height: 46 }
action: { width: 59, height: 46 }
wide: { width: 59, height: 46 }
spaceline: { width: 92.29, height: 46 }
small: { width: 50.471, height: 22 }
default: { width: 35.33, height: 46 }
subtle-highlight: { width: 35.33, height: 46 }
halfwidth: { width: 17.665, height: 46 }
narrow: { width: 26.335, height: 46 }
special: { width: 44, height: 46 }
altline: { width: 52.67, height: 46 }
large: { width: 52.67, height: 46 }
action: { width: 59, height: 46 }
wide: { width: 59, height: 46 }
spaceline: { width: 92.29, height: 46 }
small: { width: 50.471, height: 22 }
views:
base:
@ -245,3 +246,17 @@ buttons:
outline: "halfwidth"
_:
outline: "halfwidth"
ä:
outline: "subtle-highlight"
ö:
outline: "subtle-highlight"
ü:
outline: "subtle-highlight"
Ä:
outline: "subtle-highlight"
Ö:
outline: "subtle-highlight"
Ü:
outline: "subtle-highlight"
ß:
outline: "subtle-highlight"

View File

@ -1,15 +1,16 @@
---
outlines:
default: { width: 54, height: 37 }
halfwidth: { width: 27, height: 37 }
narrow: { width: 40.5, height: 37 }
special: { width: 54, height: 37 }
altline: { width: 81, height: 37 }
large: { width: 81, height: 37 }
action: { width: 90, height: 37 }
wide: { width: 90, height: 37 }
spaceline: { width: 153, height: 37 }
small: { width: 67.4, height: 22 }
default: { width: 54, height: 37 }
subtle-highlight: { width: 54, height: 37 }
halfwidth: { width: 27, height: 37 }
narrow: { width: 40.5, height: 37 }
special: { width: 54, height: 37 }
altline: { width: 81, height: 37 }
large: { width: 81, height: 37 }
action: { width: 90, height: 37 }
wide: { width: 90, height: 37 }
spaceline: { width: 153, height: 37 }
small: { width: 67.4, height: 22 }
views:
base:
@ -249,3 +250,17 @@ buttons:
outline: "halfwidth"
_:
outline: "halfwidth"
ä:
outline: "subtle-highlight"
ö:
outline: "subtle-highlight"
ü:
outline: "subtle-highlight"
Ä:
outline: "subtle-highlight"
Ö:
outline: "subtle-highlight"
Ü:
outline: "subtle-highlight"
ß:
outline: "subtle-highlight"

View File

@ -13,6 +13,14 @@ sq_button:active {
background: #747077;
}
sq_button.subtle-highlight {
background: #3f3e41;
}
sq_button.subtle-highlight:active {
background: #676669;
}
sq_button.emoji-group {
background: #3f3e41;
border-bottom: 0.4999px;

View File

@ -14,6 +14,14 @@ sq_button:active {
background: alpha(@theme_fg_color, 0.11);
}
sq_button.subtle-highlight {
background: alpha(@theme_fg_color, 0.105);
}
sq_button.subtle-highlight:active {
background: alpha(@theme_fg_color, 0.16);
}
sq_button.emoji-group {
background: alpha(@theme_fg_color, 0.105);
border-bottom: 0.4999px;