Chocobozzz/PeerTube

@use 'sass:math';
@use '_variables' as *;
@use '_mixins' as *;

$form-base-input-width: 340px;

input:not([type=submit]) {
  @include peertube-input-text($form-base-input-width);
}

my-input-text {
  display: block;

  @include responsive-width($form-base-input-width);
}

.peertube-select-container {
  @include peertube-select-container($form-base-input-width);
}

my-select-custom-value {
  display: block;

  @include responsive-width($form-base-input-width);
}

.dashboard {
  display: flex;
  flex-wrap: wrap;
  margin: 0 -5px;
  max-width: 900px;

  > div {
    box-sizing: border-box;
    flex: 0 0 math.percentage(math.div(1, 3));
    padding: 0 5px;
    margin-bottom: 10px;

    > a {
      text-decoration: none;
      color: inherit;
      display: block;
      font-size: 18px;

      @include disable-default-a-behaviour;

      &:active,
      &:focus,
      &:hover {
        opacity: .8;
      }
    }

    > a,
    > div {
      padding: 20px;
      background: pvar(--submenuBackgroundColor);
      border-radius: 4px;
      box-sizing: border-box;
      height: 100%;
    }
  }

  .dashboard-num,
  .dashboard-text {
    text-align: center;
    font-size: 130%;
    color: pvar(--mainForegroundColor);
    line-height: 30px;
    margin-bottom: 20px;
  }

  .dashboard-label {
    font-size: 90%;
    color: pvar(--inputPlaceholderColor);
    text-align: center;
  }
}