weathermen/soundstorm

View on GitHub
app/assets/stylesheets/components/translation.scss

Summary

Maintainability
Test Coverage
.translations {}

.translation {
  display: grid;
  grid-template-rows: 1fr 1fr;
  grid-template-columns: 6fr 1fr;
  max-height: 3em;
}
  .translation--open {
    max-height: inherit;

    .translation__button, .translation__value {
      animation: slideDown 1s both;
      display: block;
    }
  }

.translation__button, .translation__value {
  display: none;
}

.translation__key {
  grid-column-start: 1;
  grid-column-end: 4;
  padding-top: 15px;
  cursor: pointer;
}

.translation__value {
  width: 100%;
}

.translation__response {
  display: none;
}