assets/sass/bourbon/bourbon/library/_border-radius.scss

   1 @charset "UTF-8";
   2
   3 /// Provides a concise, one-line method for setting `border-radius` on both the
   4 /// top-left and top-right of a box.
   5 ///
   6 /// @argument {number (with unit)} $radii
   7 ///
   8 /// @example scss
   9 ///   .element {
  10 ///     @include border-top-radius(4px);
  11 ///   }
  12 ///
  13 ///   // CSS Output
  14 ///   .element {
  15 ///     border-top-left-radius: 4px;
  16 ///     border-top-right-radius: 4px;
  17 ///   }
  18
  19 @mixin border-top-radius($radii) {
  20   border-top-left-radius: $radii;
  21   border-top-right-radius: $radii;
  22 }
  23
  24 /// Provides a concise, one-line method for setting `border-radius` on both the
  25 /// top-right and bottom-right of a box.
  26 ///
  27 /// @argument {number (with unit)} $radii
  28 ///
  29 /// @example scss
  30 ///   .element {
  31 ///     @include border-right-radius(3px);
  32 ///   }
  33 ///
  34 ///   // CSS Output
  35 ///   .element {
  36 ///     border-bottom-right-radius: 3px;
  37 ///     border-top-right-radius: 3px;
  38 ///   }
  39
  40 @mixin border-right-radius($radii) {
  41   border-bottom-right-radius: $radii;
  42   border-top-right-radius: $radii;
  43 }
  44
  45 /// Provides a concise, one-line method for setting `border-radius` on both the
  46 /// bottom-left and bottom-right of a box.
  47 ///
  48 /// @argument {number (with unit)} $radii
  49 ///
  50 /// @example scss
  51 ///   .element {
  52 ///     @include border-bottom-radius(2px);
  53 ///   }
  54 ///
  55 ///   // CSS Output
  56 ///   .element {
  57 ///     border-bottom-left-radius: 2px;
  58 ///     border-bottom-right-radius: 2px;
  59 ///   }
  60
  61 @mixin border-bottom-radius($radii) {
  62   border-bottom-left-radius: $radii;
  63   border-bottom-right-radius: $radii;
  64 }
  65
  66 /// Provides a concise, one-line method for setting `border-radius` on both the
  67 /// top-left and bottom-left of a box.
  68 ///
  69 /// @argument {number (with unit)} $radii
  70 ///
  71 /// @example scss
  72 ///   .element {
  73 ///     @include border-left-radius(1px);
  74 ///   }
  75 ///
  76 ///   // CSS Output
  77 ///   .element {
  78 ///     border-bottom-left-radius: 1px;
  79 ///     border-top-left-radius: 1px;
  80 ///   }
  81
  82 @mixin border-left-radius($radii) {
  83   border-bottom-left-radius: $radii;
  84   border-top-left-radius: $radii;
  85 }