Generated by SassMeister.com.

SassMeister-input.scss

// ----
// libsass (v3.2.5)
// ----

%component {
    // The width and height (also including min-width, max-width, min-height and max-height properties) of an element
    // are calculated as the width/height of the content plus the padding and border.
    box-sizing: border-box;
}

%component-hidden {
    // need to force
    // as some components apply "display" later
    display: none !important;
}

.componentPage {
    @extend %component;
    @extend %component-hidden;

    //width:      $width;
    //height:     $height;
    position:   absolute;
    left:       0;
    top:        0;
    visibility: hidden;
    overflow:   hidden;

    // only one active page is visible
    &-active {
        visibility: inherit
    }
}

.componentList {
    @extend %component;
    @extend %component-hidden;
}

.componentGrid {
    @extend %component;
    @extend %component-hidden;
}

SassMeister-output.css

.componentPage, .componentList, .componentGrid {
  box-sizing: border-box; }

.componentPage, .componentList, .componentGrid {
  display: none !important; }

.componentPage {
  position: absolute;
  left: 0;
  top: 0;
  visibility: hidden;
  overflow: hidden; }
  .componentPage-active {
    visibility: inherit; }