feat: enable rounded border

lcui-dev · Oct 3, 2019 · c59f6f8 · c59f6f8
1 parent c53a791
commit c59f6f8
Show file tree

Hide file tree

Showing 5 changed files with 19 additions and 6 deletions.
diff --git a/src/scss/_checkbox.scss b/src/scss/_checkbox.scss
@@ -4,6 +4,8 @@
   border: $checkbox-border-width solid $checkbox-border-color;
   display: inline-block;
   vertical-align: middle;
+
+  @include border-radius($border-radius);
 }
 
 .checkbox-inner-icon {

diff --git a/src/scss/_message.scss b/src/scss/_message.scss
@@ -11,17 +11,23 @@
 .message-notice-wrapper {
   display: flex;
   justify-content: center;
-  padding: map-get($spacers, 2) 0;
-  margin: 0 0 map-get($spacers, 2) 0;
+  padding: $box-shadow-wrapper-padding;
+  margin-top: 0 - map-get($spacers, 3);
+
+  &:first-child {
+    margin-top: 0;
+  }
 }
 
 .message-notice {
   display: inline-block;
   padding: $message-notice-padding-y $message-notice-padding-x;
   background-color: $message-notice-bg;
   border: $message-notice-border;
-  border-radius: $border-radius;
   pointer-events: auto;
+
+  @include border-radius($border-radius);
+  @include box-shadow($box-shadow);
 }
 
 .message-notice-icon {

diff --git a/src/scss/_modal.scss b/src/scss/_modal.scss
@@ -21,6 +21,7 @@
 .modal-dialog {
   width: auto;
   position: relative;
+  padding: $box-shadow-wrapper-padding;
   margin: $modal-dialog-margin;
   // allow clicks to pass through for custom click handling to close modal
   pointer-events: none;

diff --git a/src/scss/_notification.scss b/src/scss/_notification.scss
@@ -1,7 +1,7 @@
 .notification-container {
   width: 100%;
   max-width: 384px;
-  padding: map-get($spacers, 3);
+  padding: $box-shadow-wrapper-padding;
   z-index: $zindex-notification-notice;
   position: absolute;
   pointer-events: none;
@@ -11,9 +11,11 @@
   padding: $notification-notice-padding-y $notification-notice-padding-x;
   background-color: $notification-notice-bg;
   border: $notification-notice-border;
-  border-radius: $border-radius;
   pointer-events: auto;
   margin-bottom: $notification-margin-bottom;
+
+  @include box-shadow($box-shadow);
+  @include border-radius($border-radius);
 }
 
 .notification-notice-close {

diff --git a/src/scss/_variables.scss b/src/scss/_variables.scss
@@ -95,7 +95,7 @@ $yiq-text-light: $white !default;
 // Quickly modify global styling by enabling or disabling optional features.
 
 $enable-caret:              true !default;
-$enable-rounded:            false !default;
+$enable-rounded:            true !default;
 $enable-shadows:            true !default;
 $enable-gradients:          false !default;
 $enable-transitions:        false !default;
@@ -192,6 +192,8 @@ $box-shadow-sm:               0 rem2px(.125) rem2px(.25) rgba($black, .075) !def
 $box-shadow:                  0 rem2px(.5) rem2px(1) rgba($black, .15) !default;
 $box-shadow-lg:               0 rem2px(1) rem2px(3) rgba($black, .175) !default;
 
+$box-shadow-wrapper-padding:  rem2px(.5) rem2px(1) rem2px(1.5) rem2px(1) !default;
+
 $component-active-color:      $white !default;
 $component-active-bg:         theme-color("primary") !default;