UHasselt Component Library

Spacer 

<!-- Xs Spacer -->
<div class="spacer spacer-xs"></div>


<!-- Sm Spacer -->
<div class="spacer spacer-sm"></div>


<!-- Md Spacer -->
<div class="spacer spacer-md"></div>


<!-- Lg Spacer -->
<div class="spacer spacer-lg"></div>


<!-- Xl Spacer -->
<div class="spacer spacer-xl"></div>


<div class="spacer {{modifier}}"></div>
 
/* Xs Spacer */
{
  "modifier": "spacer-xs"
}


/* Sm Spacer */
{
  "modifier": "spacer-sm"
}


/* Md Spacer */
{
  "modifier": "spacer-md"
}


/* Lg Spacer */
{
  "modifier": "spacer-lg"
}


/* Xl Spacer */
{
  "modifier": "spacer-xl"
}
  • Content: 
    .spacer {
    @apply bg-gray;

    &-xs {
        @apply h-2;
    }

    &-sm {
        @apply h-4;
    }

    &-md {
        @apply h-6;
    }

    &-lg {
        @apply h-12;
    }

    &-xl {
        @apply h-24;
    }
}
  • URL: /components/raw/spacer/spacer.css
  • Filesystem Path: src\components\02-atoms\spacer\spacer.css
  • Size: 247 Bytes

No notes defined.