Sha256: ac2c27601ce8f725745a94b5dd415a66cab4afce7702892c56cbc342d555b5dd

Contents?: true

Size: 1.66 KB

Versions: 114

Compression:

Stored size: 1.66 KB

Contents

@import "../tokens/colors";
@import "../tokens/spacing";
@import "../pb_caption/caption";

$section_colors: (
  background:   $bg_light,
  card:   $card_light,
);

[class^=pb_section_separator_kit] {
  display: flex;
  justify-content: center;
  align-items: center;
  position: relative;

  @each $color_name, $color_value in $section_colors {
    &[class*=_#{$color_name}] {
      span {
        display: inline-block;
        padding: 0 $space_xs;
        background: #{$color_value};
        position: relative;
        z-index: 1;
      }
    }
  }
 
  &::after {
    content: "";
    height: 1px;
    width: 100%;
    background: $border_light;
    position: absolute;
    top: 50%;
    left: 0;
    z-index: 0;
  }

  &[class*=_horizontal] {
    justify-content: center;
  }
  &[class*=_vertical] {
    &::after {
      content: "";
      height: 100%;
      width: 1px;
      margin-left: $space_xs;
      margin-right: $space_xs;
      background: $border_light;
      position: initial;
      z-index: 0;
    }
  }
  
  &[class*=_dark] {
    &::after {
      content: "";
      height: 1px;
      width: 100%;
      background: $border_dark;
      position: absolute;
      top: 50%;
      left: 0;
      z-index: 0;
    }
    &[class*=_background] {
      span {
        display: inline-block;
        padding: 0 $space_xs;
        background: $bg_dark;
        position: relative;
        z-index: 1;
      }
    }
    &[class*=_vertical] {
      &::after {
        content: "";
        height: 100%;
        width: 1px;
        margin-left: $space_xs;
        margin-right: $space_xs;
        background: $border_dark;
        position: initial;
        z-index: 0;
      }
    }
  }
}

Version data entries

114 entries across 114 versions & 1 rubygems

Version Path
playbook_ui-7.3.0.pre.alpha2 app/pb_kits/playbook/pb_section_separator/_section_separator.scss
playbook_ui-7.1.2 app/pb_kits/playbook/pb_section_separator/_section_separator.scss
playbook_ui-7.1.0.pre.alpha2 app/pb_kits/playbook/pb_section_separator/_section_separator.scss
playbook_ui-7.1.1.pre.alpha1 app/pb_kits/playbook/pb_section_separator/_section_separator.scss
playbook_ui-7.0.1 app/pb_kits/playbook/pb_section_separator/_section_separator.scss
playbook_ui-7.1.1 app/pb_kits/playbook/pb_section_separator/_section_separator.scss
playbook_ui-7.1.0.pre.alpha1 app/pb_kits/playbook/pb_section_separator/_section_separator.scss
playbook_ui-7.1.0 app/pb_kits/playbook/pb_section_separator/_section_separator.scss
playbook_ui-7.0.1.pre.alpha15 app/pb_kits/playbook/pb_section_separator/_section_separator.scss
playbook_ui-6.8.2.pre.alpha1 app/pb_kits/playbook/pb_section_separator/_section_separator.scss
playbook_ui-7.0.0.pre.alpha15 app/pb_kits/playbook/pb_section_separator/_section_separator.scss
playbook_ui-7.0.1.pre.alpha14 app/pb_kits/playbook/pb_section_separator/_section_separator.scss
playbook_ui-7.0.0.pre.alpha14 app/pb_kits/playbook/pb_section_separator/_section_separator.scss
playbook_ui-7.0.0.pre.alpha13 app/pb_kits/playbook/pb_section_separator/_section_separator.scss
playbook_ui-7.0.0.pre.alpha12 app/pb_kits/playbook/pb_section_separator/_section_separator.scss
playbook_ui-7.0.0 app/pb_kits/playbook/pb_section_separator/_section_separator.scss
playbook_ui-7.0.0.pre.alpha11 app/pb_kits/playbook/pb_section_separator/_section_separator.scss
playbook_ui-6.8.1 app/pb_kits/playbook/pb_section_separator/_section_separator.scss
playbook_ui-6.8.0 app/pb_kits/playbook/pb_section_separator/_section_separator.scss
playbook_ui-6.7.0.pre.alpha1 app/pb_kits/playbook/pb_section_separator/_section_separator.scss