fix(DocsDecorator): add new css prefix support

gravity-ui · Sep 22, 2023 · f341fe0 · f341fe0
1 parent 9a4bd59
commit f341fe0
Showing 1 changed file with 55 additions and 53 deletions.
diff --git a/src/demo/DocsDecorator/DocsDecorator.scss b/src/demo/DocsDecorator/DocsDecorator.scss
@@ -8,41 +8,6 @@ $offset-l: 40px;
 $root: '.docs-decorator';
 
 #{$root}#{$root}#{$root}#{$root}#{$root} {
-    p,
-    li:not([class*='yc-']),
-    a:not([class*='yc-']) {
-        @include mixins.text-body-2;
-    }
-
-    .sbdocs-wrapper {
-        padding: 0 $offset-l;
-    }
-
-    .sbdocs-content {
-        max-width: 800px;
-    }
-
-    p,
-    ul:not([class*='yc-']),
-    ol:not([class*='yc-']) {
-        margin: $offset-xs 0;
-
-        & + p,
-        & + ul,
-        & + ol {
-            margin-top: $offset-s;
-        }
-    }
-
-    li + li:not([class*='yc-']) {
-        margin-top: $offset-xs;
-    }
-
-    ul:not([class*='yc-']),
-    ol:not([class*='yc-']) {
-        padding-left: $offset-m;
-    }
-
     h1 {
         @include mixins.text-display-3;
     }
@@ -64,26 +29,12 @@ $root: '.docs-decorator';
         margin-bottom: $offset-m;
     }
 
-    a:not([class*='yc-']) {
-        text-decoration: none;
-        touch-action: manipulation;
-        -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
-        cursor: pointer;
-
-        color: var(--g-color-text-link);
-
-        &:hover {
-            color: var(--g-color-text-link-hover);
-        }
+    .sbdocs-wrapper {
+        padding: 0 $offset-l;
     }
 
-    p code,
-    li:not([class*='yc-']) code {
-        @include mixins.text-code-inline-2;
-        line-height: 1;
-        padding: 1px 4px;
-        background: var(--g-color-base-misc-light);
-        color: var(--g-color-text-misc);
+    .sbdocs-content {
+        max-width: 800px;
     }
 
     .docblock-source {
@@ -93,4 +44,55 @@ $root: '.docs-decorator';
     .docs-example {
         margin: $offset-m 0;
     }
+
+    :not([class*='yc-']):not([class*='g-']) > {
+        p,
+        li:not([class*='yc-']):not([class*='g-']),
+        a:not([class*='yc-']):not([class*='g-']) {
+            @include mixins.text-body-2;
+        }
+
+        p,
+        ul:not([class*='yc-']):not([class*='g-']),
+        ol:not([class*='yc-']):not([class*='g-']) {
+            margin: $offset-xs 0;
+
+            & + p,
+            & + ul,
+            & + ol {
+                margin-top: $offset-s;
+            }
+        }
+
+        li + li:not([class*='yc-']):not([class*='g-']) {
+            margin-top: $offset-xs;
+        }
+
+        ul:not([class*='yc-']):not([class*='g-']),
+        ol:not([class*='yc-']):not([class*='g-']) {
+            padding-left: $offset-m;
+        }
+
+        a:not([class*='yc-']):not([class*='g-']) {
+            text-decoration: none;
+            touch-action: manipulation;
+            -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
+            cursor: pointer;
+
+            color: var(--g-color-text-link);
+
+            &:hover {
+                color: var(--g-color-text-link-hover);
+            }
+        }
+
+        p code,
+        li:not([class*='yc-']):not([class*='g-']) code {
+            @include mixins.text-code-inline-2;
+            line-height: 1;
+            padding: 1px 4px;
+            background: var(--g-color-base-misc-light);
+            color: var(--g-color-text-misc);
+        }
+    }
 }