app/assets/stylesheets/admin.scss

Summary

Maintainability
Test Coverage
@import "tom-select/dist/scss/tom-select.default";

body.no-front {
  #admin-bar {
    position: relative;
    top: -2.5rem;
  }
}

#admin-bar {
  padding: .75rem 0;
  background: white;
  border-bottom: 1px solid #333;
  box-shadow: 0 1px 10px 0 rgba(0, 0, 0, .65);
  font-size: 1rem;

  .container {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
  }

  .break {
    flex-basis: 100%;
    height: 0;
  }
}

#admin-bar_second-row {
  margin-top: 1rem;
}

#generic-controls, #session-controls, #admin-bar_second-row {
  display: flex;
  column-gap: 1rem;
}

.simple_form {
  textarea {
    width: 100%;
  }
}

fieldset {
  margin-bottom: 1rem;
  border: 4px double black;
}

legend {
  padding: .5rem;
}

form .fields {
  position: relative;
  background: #aaa;
  padding: 1rem;
  margin-bottom: 1rem;
  border-radius: .333rem;
  overflow: hidden;

  .sorting-controls {
    float: right;
  }

  .push-right {
    float: right;
  }
}

.btn {
  padding: 0.15rem 0.5rem;
  border: 1px solid #333;
  border-radius: 0.5rem;
  color: #555;

  &:visited, &:hover {
    color: #555;
  }

  &:hover {
    box-shadow: inset 0 0 1px .5px;
  }
}

.btn-flashy {
  background-color: #2286f6;
  color: #eee;

  &:hover, &:active, &:visited {
    color: #eee;
  }
}

.btn-danger {
  background-color: #ff8e47;

  color: #000;

  &:hover, &:active, &:visited {
    color: #000;
  }
}

.btn-smaller {
  font-size: 1rem;
}