fix(alert): fix styles (#56)

* feat(navbar): collapse optimisation * feat(navbar): collapse optimisation * feat(alert): fix from mozornin
positive-js · Oct 16, 2018 · 698ff6e · 698ff6e
1 parent 92fcee8
commit 698ff6e
Show file tree

Hide file tree

Showing 2 changed files with 24 additions and 7 deletions.
diff --git a/src/lib-dev/alert/template.html b/src/lib-dev/alert/template.html
@@ -1,4 +1,6 @@
-<h1>Alerts</h1>
+<div class="mc-column-container">
+    <h1>Alerts</h1>
+</div>
 
 <div class="layout-row flex-100">
     <div class="flex-33 mc-column-container">
@@ -123,7 +125,9 @@ <h3>Small composition</h3>
     </div>
 </div>
 
-<h2>Long text</h2>
+<div class="mc-column-container">
+    <h2>Long text</h2>
+</div>
 
 <div class="layout-row flex-100">
     <div class="flex-50 mc-column-container">

diff --git a/src/lib/core/styles/_alerts.scss b/src/lib/core/styles/_alerts.scss
@@ -18,6 +18,10 @@
         margin: 0;
         padding: 0;
     }
+
+    .mc-link {
+        padding-left: 0;
+    }
 }
 
 .mc-alert_dismissible {
@@ -54,26 +58,26 @@
 
 .mc-alert_dismissible:not(.mc-alert_small) {
     .mc-alert_close {
-        top: 16px;
+        top: 15px;
     }
 }
 
 .mc-alert_dismissible.mc-alert_small {
     .mc-alert_close {
-        top: 12px;
+        top: 11px;
     }
 }
 
 .mc-alert:not(.mc-alert_small) {
-    padding: 14px 16px;
+    padding: 13px 15px;
 
     &.mc-alert_dismissible {
         padding-right: 32px;
     }
 }
 
 .mc-alert.mc-alert_small {
-    padding: 12px 16px;
+    padding: 11px 15px;
 
     &.mc-alert_dismissible {
         padding-right: 32px;
@@ -100,7 +104,7 @@
     $default: map-get($theme, default);
 
     .mc-alert_close:focus {
-        border-color: mc-color($primary, 500);
+        border: 1px solid mc-color($primary, 500);
         box-shadow: 0 0 0 1px mc-color($primary, 500);
         z-index: 1;
     }
@@ -146,5 +150,14 @@
         header {
             @include mc-typography-level-to-styles($config, caption);
         }
+
+        .mc-link__text {
+            @include mc-typography-level-to-styles($config, caption);
+        }
+    }
+
+    .mc-icon {
+        line-height: mc-line-height($config, body);
+        letter-spacing: mc-letter-spacing($config, body);
     }
 }