diff --git a/.changeset/young-trainers-yell.md b/.changeset/young-trainers-yell.md new file mode 100644 index 0000000000..af3ec5cbac --- /dev/null +++ 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 index aac7ae0fd1..9d403f3fbb 100644 --- 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 index bb96b73a1f..018a781e06 100644 --- 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 //