focus → focus-visible (#1330)

danirabbit · web-flow · commit 3d7e2b74ad8b · 2025-07-16T00:20:40.000Z
diff --git a/src/gtk-4.0/widgets/_badges.scss b/src/gtk-4.0/widgets/_badges.scss
@@ -45,7 +45,7 @@
         min-height: 0;
         min-width: rem(16px);
 
-        row:selected:not(:focus) & {
+        row:selected:not(:focus-visible) & {
             color: inherit;
             background: rgba($fg-color, 0.15);
         }
diff --git a/src/gtk-4.0/widgets/_buttons.scss b/src/gtk-4.0/widgets/_buttons.scss
@@ -18,7 +18,7 @@ button {
             background: rgba($fg-color, 0.15);
         }
 
-        &:focus {
+        &:focus-visible {
             @extend selection;
             outline-style: none;
         }
@@ -52,7 +52,7 @@ button {
         &.destructive-action:not(:disabled) {
 
             &,
-            &:focus {
+            &:focus-visible {
                 @if $color-scheme == "light" {
                     background-clip: border-box;
                     border-color: $border-color;
@@ -70,7 +70,7 @@ button {
             text-shadow: 0 1px 1px $STRAWBERRY_500;
             -gtk-icon-shadow: 0 1px 1px $STRAWBERRY_500;
 
-            &:focus {
+            &:focus-visible {
                 outline-color: rgba($STRAWBERRY_300, 0.5);
             }
         }
@@ -115,7 +115,7 @@ button {
                 outset-shadow(1);
         }
 
-        &:focus {
+        &:focus-visible {
             @if $color-scheme == "light" {
                 border-color: #{'@accent_color'};
             }
diff --git a/src/gtk-4.0/widgets/_checkbuttons.scss b/src/gtk-4.0/widgets/_checkbuttons.scss
@@ -48,7 +48,7 @@ radio {
         -gtk-icon-source: -gtk-icontheme("check-mixed-symbolic");
     }
 
-    &:focus {
+    &:focus-visible {
         &:not(:checked) {
             @if $color-scheme == "light" {
                 border-color: #{'@accent_color'};
diff --git a/src/gtk-4.0/widgets/_columnviews.scss b/src/gtk-4.0/widgets/_columnviews.scss
@@ -39,7 +39,7 @@ columnview {
                 background: rgba($fg-color, 0.15);
             }
 
-            &:focus:selected {
+            &:focus-visible:selected {
                 @extend selection;
             }
         }
diff --git a/src/gtk-4.0/widgets/_lists.scss b/src/gtk-4.0/widgets/_lists.scss
@@ -7,12 +7,12 @@ listview {
     }
 
     row {
-        &:focus,
+        &:focus-visible,
         &:selected {
             background: rgba($fg-color, 0.15);
         }
 
-        &:focus:selected {
+        &:focus-visible:selected {
             @extend selection;
         }
     }
diff --git a/src/gtk-4.0/widgets/_scales.scss b/src/gtk-4.0/widgets/_scales.scss
@@ -227,7 +227,7 @@ scale {
         }
     }
 
-    &:focus slider {
+    &:focus-visible slider {
         @if $color-scheme == "light" {
             box-shadow:
                 outset-highlight("full"),
diff --git a/src/gtk-4.0/widgets/_switches.scss b/src/gtk-4.0/widgets/_switches.scss
@@ -73,7 +73,7 @@ switch {
         }
     }
 
-    &:focus {
+    &:focus-visible {
         @if $color-scheme == "light" {
             border-color: #{'@accent_color'};
         }
diff --git a/src/gtk-4.0/widgets/_treeviews.scss b/src/gtk-4.0/widgets/_treeviews.scss
@@ -4,7 +4,7 @@ treeview {
             background: rgba($fg-color, 0.15);
         }
 
-        &:focus:selected {
+        &:focus-visible:selected {
             @extend selection;
         }
     }
diff --git a/src/gtk-4.0/widgets/_views.scss b/src/gtk-4.0/widgets/_views.scss
@@ -14,7 +14,7 @@ iconview.view.cell {
         background: rgba($fg-color, 0.15);
     }
 
-    &:focus:selected {
+    &:focus-visible:selected {
         @extend selection;
     }
 }
@@ -23,12 +23,12 @@ gridview child,
 flowboxchild {
     border-radius: rem(3px);
 
-    &:focus,
+    &:focus-visible,
     &:selected {
         background: rgba($fg-color, 0.15);
     }
 
-    &:focus:selected {
+    &:focus-visible:selected {
         @extend selection;
     }
 }

Original file line number	Diff line number	Diff line change
`@@ -45,7 +45,7 @@`
`45`	`45`	`min-height: 0;`
`46`	`46`	`min-width: rem(16px);`
`47`	`47`
`48`		`- row:selected:not(:focus) & {`
	`48`	`+ row:selected:not(:focus-visible) & {`
`49`	`49`	`color: inherit;`
`50`	`50`	`background: rgba($fg-color, 0.15);`
`51`	`51`	`}`
Original file line number	Diff line number	Diff line change
`@@ -18,7 +18,7 @@ button {`
`18`	`18`	`background: rgba($fg-color, 0.15);`
`19`	`19`	`}`
`20`	`20`
`21`		`- &:focus {`
	`21`	`+ &:focus-visible {`
`22`	`22`	`@extend selection;`
`23`	`23`	`outline-style: none;`
`24`	`24`	`}`
`@@ -52,7 +52,7 @@ button {`
`52`	`52`	`&.destructive-action:not(:disabled) {`
`53`	`53`
`54`	`54`	`&,`
`55`		`- &:focus {`
	`55`	`+ &:focus-visible {`
`56`	`56`	`@if $color-scheme == "light" {`
`57`	`57`	`background-clip: border-box;`
`58`	`58`	`border-color: $border-color;`
`@@ -70,7 +70,7 @@ button {`
`70`	`70`	`text-shadow: 0 1px 1px $STRAWBERRY_500;`
`71`	`71`	`-gtk-icon-shadow: 0 1px 1px $STRAWBERRY_500;`
`72`	`72`
`73`		`- &:focus {`
	`73`	`+ &:focus-visible {`
`74`	`74`	`outline-color: rgba($STRAWBERRY_300, 0.5);`
`75`	`75`	`}`
`76`	`76`	`}`
`@@ -115,7 +115,7 @@ button {`
`115`	`115`	`outset-shadow(1);`
`116`	`116`	`}`
`117`	`117`
`118`		`- &:focus {`
	`118`	`+ &:focus-visible {`
`119`	`119`	`@if $color-scheme == "light" {`
`120`	`120`	`border-color: #{'@accent_color'};`
`121`	`121`	`}`
Original file line number	Diff line number	Diff line change
`@@ -48,7 +48,7 @@ radio {`
`48`	`48`	`-gtk-icon-source: -gtk-icontheme("check-mixed-symbolic");`
`49`	`49`	`}`
`50`	`50`
`51`		`- &:focus {`
	`51`	`+ &:focus-visible {`
`52`	`52`	`&:not(:checked) {`
`53`	`53`	`@if $color-scheme == "light" {`
`54`	`54`	`border-color: #{'@accent_color'};`
Original file line number	Diff line number	Diff line change
`@@ -39,7 +39,7 @@ columnview {`
`39`	`39`	`background: rgba($fg-color, 0.15);`
`40`	`40`	`}`
`41`	`41`
`42`		`- &:focus:selected {`
	`42`	`+ &:focus-visible:selected {`
`43`	`43`	`@extend selection;`
`44`	`44`	`}`
`45`	`45`	`}`
Original file line number	Diff line number	Diff line change
`@@ -7,12 +7,12 @@ listview {`
`7`	`7`	`}`
`8`	`8`
`9`	`9`	`row {`
`10`		`- &:focus,`
	`10`	`+ &:focus-visible,`
`11`	`11`	`&:selected {`
`12`	`12`	`background: rgba($fg-color, 0.15);`
`13`	`13`	`}`
`14`	`14`
`15`		`- &:focus:selected {`
	`15`	`+ &:focus-visible:selected {`
`16`	`16`	`@extend selection;`
`17`	`17`	`}`
`18`	`18`	`}`
Original file line number	Diff line number	Diff line change
`@@ -227,7 +227,7 @@ scale {`
`227`	`227`	`}`
`228`	`228`	`}`
`229`	`229`
`230`		`- &:focus slider {`
	`230`	`+ &:focus-visible slider {`
`231`	`231`	`@if $color-scheme == "light" {`
`232`	`232`	`box-shadow:`
`233`	`233`	`outset-highlight("full"),`
Original file line number	Diff line number	Diff line change
`@@ -73,7 +73,7 @@ switch {`
`73`	`73`	`}`
`74`	`74`	`}`
`75`	`75`
`76`		`- &:focus {`
	`76`	`+ &:focus-visible {`
`77`	`77`	`@if $color-scheme == "light" {`
`78`	`78`	`border-color: #{'@accent_color'};`
`79`	`79`	`}`
Original file line number	Diff line number	Diff line change
`@@ -4,7 +4,7 @@ treeview {`
`4`	`4`	`background: rgba($fg-color, 0.15);`
`5`	`5`	`}`
`6`	`6`
`7`		`- &:focus:selected {`
	`7`	`+ &:focus-visible:selected {`
`8`	`8`	`@extend selection;`
`9`	`9`	`}`
`10`	`10`	`}`
Original file line number	Diff line number	Diff line change
`@@ -14,7 +14,7 @@ iconview.view.cell {`
`14`	`14`	`background: rgba($fg-color, 0.15);`
`15`	`15`	`}`
`16`	`16`
`17`		`- &:focus:selected {`
	`17`	`+ &:focus-visible:selected {`
`18`	`18`	`@extend selection;`
`19`	`19`	`}`
`20`	`20`	`}`
`@@ -23,12 +23,12 @@ gridview child,`
`23`	`23`	`flowboxchild {`
`24`	`24`	`border-radius: rem(3px);`
`25`	`25`
`26`		`- &:focus,`
	`26`	`+ &:focus-visible,`
`27`	`27`	`&:selected {`
`28`	`28`	`background: rgba($fg-color, 0.15);`
`29`	`29`	`}`
`30`	`30`
`31`		`- &:focus:selected {`
	`31`	`+ &:focus-visible:selected {`
`32`	`32`	`@extend selection;`
`33`	`33`	`}`
`34`	`34`	`}`