fix: add specificity for few buttons (#230)

Author: NikitaCG

src/blocks/Share/Share.scss

@@ -18,57 +18,59 @@ $block: '.#{$ns}share-block';
     }
 
     &__item {
-        display: flex;
-        justify-content: center;
-        width: 48px;
-        height: 48px;
-        border-radius: 100%;
-
-        &_type_vk {
-            background-color: var(--yc-color-vk);
-        }
+        @include add-specificity(&) {
+            display: flex;
+            justify-content: center;
+            width: 48px;
+            height: 48px;
+            border-radius: 100%;
+
+            &_type_vk {
+                background-color: var(--yc-color-vk);
+            }
 
-        &_type_facebook {
-            background-color: var(--yc-color-facebook);
-        }
+            &_type_facebook {
+                background-color: var(--yc-color-facebook);
+            }
 
-        &_type_twitter {
-            background-color: var(--yc-color-twitter);
-        }
+            &_type_twitter {
+                background-color: var(--yc-color-twitter);
+            }
 
-        &_type_telegram {
-            background-color: var(--yc-color-telegram);
-        }
+            &_type_telegram {
+                background-color: var(--yc-color-telegram);
+            }
 
-        &_type_telegram {
-            background-color: var(--yc-color-telegram);
-        }
+            &_type_telegram {
+                background-color: var(--yc-color-telegram);
+            }
 
-        &_type_linkedin {
-            background-color: var(--yc-color-linkedin);
-        }
+            &_type_linkedin {
+                background-color: var(--yc-color-linkedin);
+            }
 
-        @include add-specificity(&) {
-            &:before {
-                border-radius: 100%;
+            @include add-specificity(&) {
+                &:before {
+                    border-radius: 100%;
+                }
             }
-        }
 
-        &:hover {
-            &:before {
-                //redefine component style
-                /* stylelint-disable-next-line declaration-no-important */
-                background-color: var(--yc-color-base-generic) !important;
-                border-radius: 100%;
+            &:hover {
+                &:before {
+                    //redefine component style
+                    /* stylelint-disable-next-line declaration-no-important */
+                    background-color: var(--yc-color-base-generic) !important;
+                    border-radius: 100%;
+                }
             }
-        }
 
-        & + & {
-            margin-left: $indentXXS;
-        }
+            & + & {
+                margin-left: $indentXXS;
+            }
 
-        svg {
-            color: var(--yc-color-base-background);
+            svg {
+                color: var(--yc-color-base-background);
+            }
         }
     }
 

src/components/ButtonTabs/ButtonTabs.scss

@@ -5,23 +5,25 @@ $block: '.#{$ns}button-tabs';
 
 #{$block} {
     &__item {
-        margin-right: $indentXXXS;
-        margin-bottom: $indentXXS;
-
-        @include button(
-            var(--pc-tab-item-color),
-            var(--pc-tab-item-background-color),
-            $hoverBackgroundColor: var(--pc-tab-item-background-color-hover)
-        );
-
-        &_active {
-            pointer-events: none;
+        @include add-specificity(&) {
+            margin-right: $indentXXXS;
+            margin-bottom: $indentXXS;
 
             @include button(
-                var(--pc-selected-tab-item-color),
-                var(--pc-selected-tab-item-background-color),
-                $hoverBackgroundColor: var(--pc-selected-tab-item-background-color-hover)
+                var(--pc-tab-item-color),
+                var(--pc-tab-item-background-color),
+                $hoverBackgroundColor: var(--pc-tab-item-background-color-hover)
             );
+
+            &_active {
+                pointer-events: none;
+
+                @include button(
+                    var(--pc-selected-tab-item-color),
+                    var(--pc-selected-tab-item-background-color),
+                    $hoverBackgroundColor: var(--pc-selected-tab-item-background-color-hover)
+                );
+            }
         }
     }
 }

src/sub-blocks/BannerCard/BannerCard.scss

@@ -65,7 +65,9 @@ $block: '.#{$ns}banner-card';
     }
 
     &__button {
-        margin-top: 28px;
+        @include add-specificity(&) {
+            margin-top: 28px;
+        }
     }
 
     &__image {