packages/styles/scss/lib/_logical.scss

   1 /**
   2  * Give logical string for a "classic" placement
   3  * @param {String} $placement - top/left/right/bottom/vertical/horizontal/t/r/b/l/v/h/x/y
   4  * @return {String} - the logical prop fragment
   5  */
   6 @function logical($placement) {
   7         @if $placement == 'top' or $placement == 't' {
   8                 @return 'block-start';
   9         }
  10
  11         @if $placement == 'bottom' or $placement == 'b' {
  12                 @return 'block-end';
  13         }
  14
  15         @if $placement == 'left' or $placement == 'l' {
  16                 @return 'inline-start';
  17         }
  18
  19         @if $placement == 'right' or $placement == 'r' {
  20                 @return 'inline-end';
  21         }
  22
  23         @if $placement == 'horizontal' or $placement == 'h' or $placement == 'x' {
  24                 @return 'inline';
  25         }
  26
  27         @if $placement == 'vertical' or $placement == 'v' or $placement == 'y' {
  28                 @return 'block';
  29         }
  30
  31         @return null;
  32 }