@gravity-ui/page-constructor 4.23.0-alpha.0 → 4.23.0

package/styles/mixins.scss

@@ -8,26 +8,6 @@
     line-height: var(--g-text-#{$name}-line-height);
 }
 
-@mixin focusable($offset: 0, $mode: 'outline') {
-    @if $mode == 'outline' {
-        &:focus {
-            outline: 2px solid var(--g-color-line-focus);
-            outline-offset: $offset;
-        }
-        &:focus:not(:focus-visible) {
-            outline: 0;
-        }
-    }
-    @if $mode == 'box-shadow' {
-        &:focus {
-            box-shadow: 0 0 0 2px var(--g-color-line-focus);
-        }
-        &:focus:not(:focus-visible) {
-            box-shadow: none;
-        }
-    }
-}
-
 @mixin link() {
     @include islands-focus();
 
@@ -557,3 +537,60 @@ unpredictable css rules order in build */
         padding-right: $indentXS;
     }
 }
+
+// indent system for blocks
+@mixin indents($class) {
+    @include add-specificity($class) {
+        &_indentTop {
+            &_0 {
+                margin-top: 0;
+            }
+
+            &_xs {
+                margin-top: $indentXS;
+            }
+
+            &_s {
+                margin-top: $indentSM;
+            }
+
+            &_m {
+                margin-top: $indentM;
+            }
+
+            &_l {
+                margin-top: $indentL;
+            }
+
+            &_xl {
+                margin-top: $indentXL;
+            }
+        }
+
+        &_indentBottom {
+            &_0 {
+                padding-bottom: 0;
+            }
+
+            &_xs {
+                padding-bottom: $indentXS;
+            }
+
+            &_s {
+                padding-bottom: $indentSM;
+            }
+
+            &_m {
+                padding-bottom: $indentM;
+            }
+
+            &_l {
+                padding-bottom: $indentL;
+            }
+
+            &_xl {
+                padding-bottom: $indentXL;
+            }
+        }
+    }
+}

package/styles/root.scss

@@ -37,12 +37,10 @@
 
     &_theme_light {
         @include pc-colors-light;
-        --g-color-line-focus: var(--g-color-text-brand);
     }
 
     &_theme_dark {
         @include pc-colors-dark;
-        --g-color-line-focus: var(--g-color-text-light-primary);
     }
 
     &.g-root_theme_dark {

package/styles/styles.css

@@ -70,7 +70,6 @@ unpredictable css rules order in build */
   color: var(--g-color-text-link);
   text-decoration: none;
   cursor: pointer;
-  border-radius: var(--g-focus-border-radius);
 }
 .utilityfocus .yfm_constructor a:focus {
   outline: 2px solid #ffdb4d;
@@ -79,12 +78,6 @@ unpredictable css rules order in build */
   --pc-text-header-color: var(--g-color-text-link-hover);
   color: var(--g-color-text-link-hover);
 }
-.yfm_constructor a:focus {
-  box-shadow: 0 0 0 2px var(--g-color-line-focus);
-}
-.yfm_constructor a:focus:not(:focus-visible) {
-  box-shadow: none;
-}
 .yfm_constructor table {
   color: var(--g-color-text-primary);
   border: 1px solid var(--g-color-line-generic);

package/styles/yfm.scss

@@ -85,8 +85,6 @@
 
     a {
         @include link();
-        @include focusable(0, 'box-shadow');
-        border-radius: var(--g-focus-border-radius);
     }
 
     table {