feat: adding focus styles for questions block

gravity-ui · Sep 21, 2023 · f462f7b · f462f7b
1 parent a8df50d
commit f462f7b
Show file tree

Hide file tree

Showing 2 changed files with 12 additions and 0 deletions.
diff --git a/src/blocks/Questions/QuestionBlockItem/QuestionBlockItem.scss b/src/blocks/Questions/QuestionBlockItem/QuestionBlockItem.scss
@@ -13,10 +13,12 @@ $block: '.#{$ns}QuestionsBlockItem';
 
     &__title {
         @include heading4();
+        @include focusable();
 
         position: relative;
         padding-right: 24px;
         cursor: pointer;
+        border-radius: var(--g-focus-border-radius);
 
         a {
             @include link();
@@ -27,11 +29,20 @@ $block: '.#{$ns}QuestionsBlockItem';
         position: absolute;
         right: 0;
         top: 0;
+        bottom: 0;
+        margin: auto;
         color: var(--g-color-text-primary);
     }
 
     &__link {
         @include text-size(body-2);
+
+        @include add-specificity(&) {
+            a {
+                border-radius: calc(var(--g-focus-border-radius) + 2px);
+                outline-offset: -2px;
+            }
+        }
     }
 
     &__text {

diff --git a/src/components/Link/Link.scss b/src/components/Link/Link.scss
@@ -6,6 +6,7 @@ $block: '.#{$ns}link-block';
 #{$block} {
     $root: &;
     margin-top: $indentXS;
+    display: inline-flex;
 
     &__link {
         --g-color-line-focus: currentColor;