balmet.com

Unnamed repository; edit this file 'description' to name the repository.
Log | Files | Refs

common.scss (1157B)

      1 // Most used breakpoints
      2 $break-huge: 1440px;
      3 $break-wide: 1280px;
      4 $break-large: 960px; // admin sidebar auto folds. Breakpoint for tablet
      5 $break-medium: 782px; // adminbar goes big
      6 $break-small: 600px; // Breakpoint for mobile
      7 $break-mobile: 480px;
      8 $break-js-tablet: 1025px;
      9 $break-js-mobile: 768px;
     10 
     11 [class*="ugb-"] form[class*="-link"],
     12 form[class*="ugb-"][class*="-link"],
     13 [class*="ugb-"] + form[class*="-link"] {
     14     display: flex;
     15     justify-content: center;
     16     align-items: center;
     17 }
     18 
     19 // Text margin bottom
     20 $text-margin-bottom: 16px;
     21 
     22 // Box
     23 $box-radius: 12px;
     24 $box-hori-padding: 35px;
     25 $box-vert-padding: 40px;
     26 
     27 @mixin boxNoPadding() {
     28     box-shadow: 0 5px 5px 0 rgba(18, 63, 82, 0.035), 0 0 0 1px rgba(176, 181, 193, 0.2);
     29     background-color: #fff;
     30     border-radius: $box-radius;
     31     overflow: hidden;
     32 }
     33 @mixin box() {
     34     @include boxNoPadding();
     35     padding: $box-vert-padding $box-hori-padding;
     36     @media screen and (max-width: $break-medium) {
     37         padding: ($box-vert-padding * 2/3) ($box-hori-padding * 2/3);
     38     }
     39     @media screen and (max-width: $break-small) {
     40         padding: $box-hori-padding ($box-hori-padding / 2);
     41     }
     42 }