resources/sass/rounds.scss

   1 .rounds {
   2         margin: 1rem 0;
   3         padding: 0;
   4
   5         .round {
   6                 margin: 1rem 0;
   7                 border: $border-width solid $secondary;
   8                 border-radius: $border-radius;
   9                 background: $gray-700;
  10                 padding: 1ex;
  11
  12                 &.has-not-finished {
  13                         border-color: $light;
  14                         box-shadow: 0 0 0.25rem 0.25rem $info;
  15                 }
  16
  17                 .info {
  18                         padding-right: 1rem;
  19                         min-width: 13em;
  20
  21                         .date {
  22                                 font-size: 125%;
  23                         }
  24
  25                         .rolled-by {
  26                                 display: inline-block;
  27                                 vertical-align: middle;
  28
  29                                 img {
  30                                         max-height: 2rem;
  31                                         width: auto;
  32                                         border-radius: 50%;
  33                                 }
  34                         }
  35
  36                         .seed-code, .btn, .rolled-by {
  37                                 margin-bottom: 1ex;
  38                         }
  39                 }
  40         }
  41 }
  42
  43 .seed-code {
  44         align-items: center;
  45         align-content: center;
  46         justify-content: flex-start;
  47         gap: 0.5ex;
  48         padding: 0.5ex;
  49         border-radius: 0.5ex;
  50         background: $dark;
  51         color: $light;
  52         vertical-align: middle;
  53
  54         &.game-alttpr {
  55                 display: inline-flex;
  56                 flex-direction: row;
  57                 flex-wrap: nowrap;
  58         }
  59
  60         &.game-smr {
  61                 display: inline-grid;
  62                 grid-template-columns: 1fr 1fr;
  63                 > span {
  64                         text-transform: uppercase;
  65                 }
  66         }
  67 }