Cacher is the code snippet organizer for pro developers

<div class="loader">
  <span>{</span><span>}</span>
</div>

@background-color: #4684ee;
@loader-color: #fff;
@loader-size: 30vh;

html, body {
  width: 100%;
  height: 100%;
  margin: 0;
  padding: 0;  
}

body {
  display: flex;  
  justify-content: center;
  align-items: center;
  background-color: @background-color;
}

.loader {
  color: #fff;
  
  font-family: Consolas, Menlo, Monaco, monospace;
  font-weight: bold;
  font-size: @loader-size;
  
  opacity: 0.8;

  span {
    display: inline-block;
    animation: pulse 0.4s alternate infinite ease-in-out;

    &:nth-child(odd) {
      animation-delay: 0.4s;
    }
  }
}

@keyframes pulse {
  to {
    transform: scale(0.8);
    opacity: 0.5;
  }
}