From 2b25dd24f0af381c1f2468905b50134bfebfff52 Mon Sep 17 00:00:00 2001
From: Michael Shamoon <4887959+shamoon@users.noreply.github.com>
Date: Tue, 8 Mar 2022 15:50:10 -0800
Subject: [PATCH] fix some focus styling
---
.../app-frame/app-frame.component.html | 4 ++--
src-ui/src/theme.scss | 19 +++++++++++++++++++
2 files changed, 21 insertions(+), 2 deletions(-)
diff --git a/src-ui/src/app/components/app-frame/app-frame.component.html b/src-ui/src/app/components/app-frame/app-frame.component.html
index 235289074..b609a1c78 100644
--- a/src-ui/src/app/components/app-frame/app-frame.component.html
+++ b/src-ui/src/app/components/app-frame/app-frame.component.html
@@ -92,7 +92,7 @@
{{d.title | documentTitle}}
-
+
@@ -169,7 +169,7 @@
-
+
GitHub
diff --git a/src-ui/src/theme.scss b/src-ui/src/theme.scss
index f74ea925c..9b6f1f945 100644
--- a/src-ui/src/theme.scss
+++ b/src-ui/src/theme.scss
@@ -62,6 +62,7 @@ svg.logo {
}
.btn:focus,
+.btn:active:focus,
.dropdown-item:focus,
.btn-check:focus + .btn,
.form-control:focus,
@@ -70,6 +71,16 @@ svg.logo {
box-shadow: 0 0 0 0.25rem hsla(var(--ngx-green), var(--l), 0.7);
}
+.nav-link:focus-visible, .nav-item a:focus-visible {
+ outline: none;
+ background-color: var(--ngx-bg-darker);
+}
+
+a.navbar-brand:focus-visible {
+ outline: none;
+ color: var(--ngx-primary-darken-10);
+}
+
.dropdown.show {
> .btn-primary {
background-color: var(--bs-primary);
@@ -138,6 +149,14 @@ textarea,
color: var(--bs-body-color);
border-bottom: 1px solid transparent;
}
+
+ &:focus {
+ border-color: var(--bs-border-color);
+ }
+
+ &.active:focus {
+ border-bottom: 1px solid transparent;
+ }
}
}