CSS

README.md

CSS

Overlay and Loader

/! app/views/layouts/_loader.html.slim
.fixed-overlay
  .loading-content
    .text
    .image

app/assets/stylesheets/loader.scss

.fixed-overlay {
  position: fixed;
  width: 100%;
  top: 0;
  bottom: 0;
  background: rgba(144, 144, 144, 0.8);
  z-index: 9999;

  .loading-content {
    position: absolute;
    left: 50%;
    top: 50%;
    border: 1px solid #000;
    border-radius: 5px;
    background-color: #fff;
    transform: translate(-50%, -50%);
    -moz-transform: translate(-50%, -50%);
    -webkit-transform: translate(-50%, -50%);

    .image {
      width: 50px;
      height: 50px;
      display: inline-block;
      background: url(loading_light_bg.gif) no-repeat center center rgba(255, 255, 255, 0.8);
      background-size: 100% 100%;
    }
  }
}