_sass: Increase selector specificity for schedule classes

kevinlin1 · Jun 24, 2020 · 5852a89 · 5852a89
1 parent 02ea110
commit 5852a89
Showing 1 changed file with 75 additions and 74 deletions.
diff --git a/_sass/custom/schedule.scss b/_sass/custom/schedule.scss
@@ -10,98 +10,99 @@
   ul.schedule-timeline,
   ul.schedule-group,
   ul.schedule-events {
+    margin-top: 0;
     padding-left: 0;
   }
-}
-
-.schedule-timeline {
-  margin: 40px auto 0;
-  position: absolute;
-  width: 100%;
-}
 
-.schedule-time {
-  @extend .fs-2;
-  color: $grey-dk-000;
-  height: 40px;
-  margin: 0;
-  padding: $sp-2;
-  position: relative;
-
-  &::after {
-    background-color: $border-color;
-    content: '';
-    height: 1px;
-    left: 0;
+  ul.schedule-timeline {
+    margin: 40px auto 0;
     position: absolute;
-    top: 0;
     width: 100%;
   }
-}
 
-.schedule-group {
-  display: flex;
-  margin-bottom: 0;
-  position: relative;
-}
-
-.schedule-day {
-  border-left: $border $border-color;
-  flex: 1 0 0;
-  margin: 0;
-  min-width: 130px;
+  .schedule-time {
+    @extend .fs-2;
+    color: $grey-dk-000;
+    height: 40px;
+    margin: 0;
+    padding: $sp-2;
+    position: relative;
+
+    &::after {
+      background-color: $border-color;
+      content: '';
+      height: 1px;
+      left: 0;
+      position: absolute;
+      top: 0;
+      width: 100%;
+    }
+  }
 
-  &:first-of-type {
-    border-left: 0;
+  .schedule-group {
+    display: flex;
+    margin-bottom: 0;
+    position: relative;
   }
-}
 
-.schedule-header {
-  @extend .fw-700;
-  align-items: center;
-  display: flex;
-  font-size: 18px !important;
-  height: 40px;
-  justify-content: center;
-  margin: 0;
-}
+  .schedule-day {
+    border-left: $border $border-color;
+    flex: 1 0 0;
+    margin: 0;
+    min-width: 130px;
 
-.schedule-events {
-  display: flex;
-  padding: 0;
-  position: relative;
-}
+    &:first-of-type {
+      border-left: 0;
+    }
+  }
 
-.schedule-event {
-  background-color: $grey-dk-000;
-  border-radius: $border-radius;
-  box-shadow: 0 10px 20px rgba(0, 0, 0, .1), inset 0 -3px 0 rgba(0, 0, 0, .2);
-  color: $white;
-  float: left;
-  height: 100%;
-  margin: 0;
-  padding: $sp-1 $sp-2;
-  position: absolute;
-  width: 100%;
-
-  .name {
-    @extend .fs-3, .fw-700;
+  h2.schedule-header {
+    @extend .fw-700;
+    align-items: center;
+    display: flex;
+    font-size: 18px !important;
+    height: 40px;
+    justify-content: center;
+    margin: 0;
   }
 
-  .time,
-  .location {
-    @extend .fs-2;
+  .schedule-events {
+    display: flex;
+    padding: 0;
+    position: relative;
   }
 
-  &.lecture {
+  .schedule-event {
     background-color: $grey-dk-000;
-  }
+    border-radius: $border-radius;
+    box-shadow: 0 10px 20px rgba(0, 0, 0, .1), inset 0 -3px 0 rgba(0, 0, 0, .2);
+    color: $white;
+    float: left;
+    height: 100%;
+    margin: 0;
+    padding: $sp-1 $sp-2;
+    position: absolute;
+    width: 100%;
 
-  &.section {
-    background-color: $purple-000;
-  }
+    .name {
+      @extend .fs-3, .fw-700;
+    }
+
+    .time,
+    .location {
+      @extend .fs-2;
+    }
+
+    &.lecture {
+      background-color: $grey-dk-000;
+    }
+
+    &.section {
+      background-color: $purple-000;
+    }
 
-  &.office-hours {
-    background-color: $blue-000;
+    &.office-hours {
+      background-color: $blue-000;
+    }
   }
 }