grafana/public/sass/_old_responsive.scss

.navbar-buttons--zoom {
  display: none;
}

.navbar-page-btn {
  max-width: 200px;
}

.gf-timepicker-nav-btn {
  max-width: 120px;
}

.navbar-buttons--tv,
.navbar-buttons--actions {
  display: none;
}

// Media queries
// ---------------------

@include media-breakpoint-down(xs) {
  input[type='text'],
  input[type='number'],
  textarea {
    font-size: 16px;
  }
}

@include media-breakpoint-up(sm) {
  .navbar-page-btn {
    max-width: 250px;
  }
  .gf-timepicker-nav-btn {
    max-width: 200px;
  }
}

@include media-breakpoint-up(md) {
  .navbar-buttons--tv,
  .navbar-buttons--actions {
    display: flex;
  }
  .navbar-page-btn {
    max-width: 325px;
  }
  .gf-timepicker-nav-btn {
    max-width: 240px;
  }
}

@include media-breakpoint-up(lg) {
  .navbar-buttons--zoom {
    display: flex;
  }
  .navbar-page-btn {
    max-width: 450px;
  }
  .gf-timepicker-nav-btn {
    max-width: none;
  }
}

@include media-breakpoint-up(xl) {
  .navbar-page-btn {
    max-width: 600px;
  }
}