tutorbookapp/tutorbook

View on GitHub
components/availability-select/timeslot-rnd.module.scss

Summary

Maintainability
Test Coverage
@use 'sass:map';
@use 'styles/typography';
@use '@material/elevation';

.timeslot {
  @include elevation.elevation(4);
  background: var(--primary);
  border-radius: 2px;
  font-weight: 500;
  font-size: 12px;
  color: white;
  z-index: 4;

  .wrapper {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: center;
    padding: 10px 0;

    .btn {
      color: var(--on-primary);
      flex: none;
      margin-left: -6px;
      width: 24px;
      height: 24px;
      padding: (24px - 12px) / 2;

      svg {
        width: 12px;
        height: 12px;
        display: block;
      }
    }

    .content {
      @include typography.typography('body2');
      color: var(--on-primary);
      font-size: 12px;
      line-height: 12px;
    }
  }
}