[gtk/wip/exalm/entries] Adwaita: Convert entries to the new focus rings
- From: Alexander Mikhaylenko <alexm src gnome org>
- To: commits-list gnome org
- Cc:
- Subject: [gtk/wip/exalm/entries] Adwaita: Convert entries to the new focus rings
- Date: Mon, 4 May 2020 14:25:24 +0000 (UTC)
commit d2b5beffbfa3d8d8dc5f04424ad235b524c2b17b
Author: Alexander Mikhaylenko <alexm gnome org>
Date: Mon May 4 19:23:49 2020 +0500
Adwaita: Convert entries to the new focus rings
gtk/theme/Adwaita/_common.scss | 36 ++++--------------------------------
gtk/theme/Adwaita/_drawing.scss | 21 ++++++---------------
2 files changed, 10 insertions(+), 47 deletions(-)
---
diff --git a/gtk/theme/Adwaita/_common.scss b/gtk/theme/Adwaita/_common.scss
index ba1e6738dd..ac06013bcb 100644
--- a/gtk/theme/Adwaita/_common.scss
+++ b/gtk/theme/Adwaita/_common.scss
@@ -291,6 +291,8 @@ entry {
@include entry(normal);
+ @include focus-ring($within: true);
+
> image { // icons inside the entry
&.left { margin-right: 6px; }
&.right { margin-left: 6px; }
@@ -338,7 +340,8 @@ entry {
(warning, $warning_color) {
&.#{$e_type} {
color: $e_color;
- border-color: entry_focus_border($e_color);
+
+ @include focus-ring($within: true, $fc: $e_color);
&:focus-within { @include entry(focus, $e_color); }
@@ -396,13 +399,6 @@ entry {
// linked entries
.linked:not(.vertical) > & { @extend %linked; }
- .linked:not(.vertical) > &:focus-within + &,
- .linked:not(.vertical) > &:focus-within + button,
- .linked:not(.vertical) > &:focus-within + combobox > box > button.combo { border-left-color:
entry_focus_border(); }
-
- .linked:not(.vertical) > &:focus-within.error + &,
- .linked:not(.vertical) > &:focus-within.error + button,
- .linked:not(.vertical) > &:focus-within.error + combobox > box > button.combo { border-left-color:
entry_focus_border($error_color); }
.linked:not(.vertical) > &:drop(active) + &,
.linked:not(.vertical) > &:drop(active) + button,
@@ -425,33 +421,9 @@ entry {
&:disabled + %entry:disabled,
&:disabled + entry:disabled { border-top-color: mix($borders_color, $base_color, 30%); }
- // color back the top border of a linked focused entry following another entry.
- // :not(:only-child) is a specificity bump hack.
- + %entry:focus-within:not(:only-child),
- + entry:focus-within:not(:only-child) { border-top-color: entry_focus_border(); }
-
- + %entry:focus-within.error:not(:only-child),
- + entry:focus-within.error:not(:only-child) { border-top-color: entry_focus_border($error_color); }
-
+ %entry:drop(active):not(:only-child),
+ entry:drop(active):not(:only-child) { border-top-color: $drop_target_color; }
- // this takes care of coloring the top border of the focused entry subsequent widget.
- // :not(:only-child) is a specificity bump hack.
- &:focus-within:not(:only-child) {
- + %entry,
- + entry,
- + button,
- + combobox > box > button.combo { border-top-color: entry_focus_border(); }
- }
-
- &:focus-within.error:not(:only-child) {
- + %entry,
- + entry,
- + button,
- + combobox > box > button.combo { border-top-color: entry_focus_border($error_color); }
- }
-
&:drop(active):not(:only-child) {
+ %entry,
+ entry,
diff --git a/gtk/theme/Adwaita/_drawing.scss b/gtk/theme/Adwaita/_drawing.scss
index d505e43e57..7e9e68ca31 100644
--- a/gtk/theme/Adwaita/_drawing.scss
+++ b/gtk/theme/Adwaita/_drawing.scss
@@ -7,15 +7,18 @@
//
// If $target is specified, the focus ring is applied to the specified child element.
// If $outer is true, the focus ring extends outward. Otherwise, it extends inward.
+// If $within is true, use focus-within instead of focus:focus-visible
//
-@mixin focus-ring($target: null, $width: 2px, $offset: -$width, $outer: false) {
+@mixin focus-ring($target: null, $width: 2px, $offset: -$width, $outer: false, $within: false, $fc:
$focus_border_color) {
& #{$target} {
outline: 0 solid transparent;
outline-offset: if($outer, $offset + 4px, $offset + $width + 4px);
}
- &:focus:focus-visible #{$target} {
- outline-color: $focus_border_color;
+ $focus-state: if($within, "focus-within", "focus:focus-visible");
+
+ &:#{$focus-state} #{$target} {
+ outline-color: $fc;
outline-width: $width;
outline-offset: $offset;
}
@@ -41,11 +44,6 @@
}
// entries
-@function entry_focus_border($fc:$focus_border_color) {
- @return $fc;
-}
-
-@function entry_focus_shadow($fc:$focus_border_color) { @return inset 0 0 0 1px $fc; }
@mixin entry($t, $fc:$focus_border_color, $edge: none) {
//
@@ -67,14 +65,8 @@
color: $text_color;
border-color: $borders_color;
background-color: $base_color;
- @include _shadows(entry_focus_shadow(transparentize($fc, 1)), $_entry_edge);
// for the transition to work the number of shadows in different states needs to match, hence the
transparent shadow here.
}
- @if $t==focus {
- @include _shadows(entry_focus_shadow($fc), $_entry_edge);
- border-color: entry_focus_border($fc);
- outline: none;
- }
@if $t==insensitive {
color: $insensitive_fg_color;
border-color: $borders_color;
@@ -107,7 +99,6 @@
border-color: $selected_bg_color;
background-color: transparentize(opacify($osd_borders_color, 1), 0.5);
background-clip: padding-box;
- box-shadow: entry_focus_shadow($fc);
text-shadow: 0 1px black;
-gtk-icon-shadow: 0 1px black;
}
[
Date Prev][
Date Next] [
Thread Prev][
Thread Next]
[
Thread Index]
[
Date Index]
[
Author Index]