degree-planner.component.scss

#plans-container {
  height: calc(100vh - 112px);
}

mat-sidenav {
  width: 340px;
}

#menu-toggle-btn {
  position: absolute;
  right: 0px;
  top: 20px;
  border-radius: 50% 0 0 50%;
  padding: 8px;
  background-color: #f0f0f0;
}

.degree-plan-selector {
  height: 27px;

  mat-select-trigger {
    height: 24px;
    display: inline-block;
    position: relative;
    top: 1px;

    .plan-name {
      position: relative;
      top: 1px;
      display: inline-block;
      vertical-align: top;
      height: 24px;
      line-height: 24px;
    }
  }

  .primary-star {
    margin-right: 12px;
  }
}

@media screen and (max-width: 600px) {
  #menu-toggle-btn {
    position: relative;
    top: 0;
    right: 0;
    border-radius: 50%;
    padding: 12px;
  }
}

// Course search
.search-input-wrapper {
  display: flex;
  justify-content: space-between;
  align-items: center;
}

#loading-plan-progress {
  position: absolute;
  z-index: 1000;
}

#degree-plan-wrapper.isLoadingPlan {
  overflow: hidden;

  #year-wrapper {
    opacity: 0.5;
  }

  #year-mask {
    width: 100%;
    height: 100%;
    display: block;
    position: absolute;
    z-index: 9000;
  }
}

#year-mask {
  display: none;
}