Global focus style CSS from feature flag (#2046)

* extra CSS found from cleaning up feat flag * lint * Create young-trainers-yell.md * fix mixin Co-authored-by: Jon Rohan <[email protected]>
primer · Apr 27, 2022 · 55e2b06 · 55e2b06
1 parent 9a7981c
commit 55e2b06
Show file tree

Hide file tree

Showing 3 changed files with 24 additions and 6 deletions.
diff --git a/.changeset/young-trainers-yell.md b/.changeset/young-trainers-yell.md
@@ -0,0 +1,5 @@
+---
+"@primer/css": major
+---
+
+Global focus style CSS from feature flag (next major)
diff --git a/src/autocomplete/autocomplete.scss b/src/autocomplete/autocomplete.scss
@@ -42,6 +42,14 @@
     // stylelint-disable-next-line
     border: none;
     box-shadow: none;
+
+    &:focus {
+      box-shadow: none;
+    }
+
+    &:focus-visible {
+      box-shadow: none;
+    }
   }
 }
 

diff --git a/src/forms/form-validation.scss b/src/forms/form-validation.scss
@@ -235,15 +235,16 @@ dl.form-group > dd, // TODO: Deprecate
   }
 
   &.focused {
-    border-radius: $border-radius;
-    box-shadow: var(--color-primer-shadow-inset), var(--color-primer-shadow-focus);
+    @include focusBoxShadowInset(2px, var(--color-accent-fg));
 
     .form-control {
+      border-color: transparent;
+      border-bottom-color: var(--color-accent-fg);
       box-shadow: none;
     }
 
     .drag-and-drop {
-      border-color: var(--color-accent-emphasis);
+      border-color: transparent;
     }
   }
 }
@@ -272,7 +273,9 @@ dl.form-group > dd, // TODO: Deprecate
     border: $border-width $border-style var(--color-border-default);
   }
 
-  .comment-form-error { margin-bottom: $spacer-2; }
+  .comment-form-error {
+    margin-bottom: $spacer-2;
+  }
 
   .write-content,
   .preview-content {
@@ -317,8 +320,10 @@ div.composer {
   min-height: 200px;
 }
 
-// stylelint-disable-next-line primer/spacing
-.composer .tabnav { margin: 0 0 10px; }
+.composer .tabnav {
+  // stylelint-disable-next-line primer/spacing
+  margin: 0 0 10px;
+}
 
 // Misc CSS
 //