Cacher is the code snippet organizer for pro developers

<div class="box">
  <h1>Fuck yeah</h1>
</div>

/*
@content usage example
DISPLAY TABLE BOX
other examples: https://robots.thoughtbot.com/sasss-content-directive
*/
.box {
  display: table;
  width: 100%;
  height: 100vh; }
  .box > * {
    display: table-cell;
    text-align: center;
    vertical-align: middle;
    background-color: yellow; }

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


/*
@content usage example
DISPLAY TABLE BOX
other examples: https://robots.thoughtbot.com/sasss-content-directive
*/

@mixin display-table($vertical-align) {
  display:table;
  width: 100%;
  height: 100vh;
  > * {
    display: table-cell;
    text-align: center;
    vertical-align: $vertical-align;
    @content;
  }
}

.box {
  @include display-table(middle) {
    background-color: yellow;
  }
}

<div class="box">
  <h1>Fuck yeah</h1>
</div>