Make a consistent experience when looking at pentatonic scales as well

Author: salmacodecomputerlove

apps/fretonator-web/src/app/common/fretonator/fretboard/fretboard.component.html

@@ -44,9 +44,8 @@
 <div class="controlPanel">
   <div class="controlPanel__row">
     <div class="controlPanel__section">
-      <h4 class="controlPanel__title" *ngIf="mode | displayScaleDegrees">Highlight scale degrees</h4>
+      <h4 class="controlPanel__title">Highlight scale degrees</h4>
       <app-scale-degrees
-        *ngIf="mode | displayScaleDegrees"
         [tonicActive]="highlightedDegrees.has(ScaleDegrees.tonic)"
         [mediantActive]="highlightedDegrees.has(ScaleDegrees.mediant)"
         [dominantActive]="highlightedDegrees.has(ScaleDegrees.dominant)"

apps/fretonator-web/src/app/common/fretonator/fretboard/fretboard.component.scss

@@ -326,14 +326,6 @@ $note-height: 36;
       color: var(--note-color-dominant);
     }
   }
-
-  &[data-mode="majorPentatonic"],
-  &[data-mode="minorPentatonic"] {
-    &:after {
-      background-color: var(--note-background) !important;
-      color: var(--note-color) !important;
-    }
-  }
 }
 
 .fretboard__cell--string {

apps/fretonator-web/src/app/common/fretonator/scale-map/display-scale-degrees.pipe.spec.ts

@@ -1,10 +1,7 @@
 import { NgModule } from '@angular/core';
 import { CommonModule } from '@angular/common';
 import { ScaleMapComponent } from './scale-map.component';
-import { DisplayScaleDegreesPipe } from './display-scale-degrees.pipe';
-import { GetEnharmonicEquivalentPipe } from '../get-enharmonic-equivalent.pipe';
 import { RouterModule } from '@angular/router';
-import { GetEnharmonicRouterLinkPipe } from '../get-enharmonic-router-link.pipe';
 import { CrossModule } from '../../svgs/cross/cross.module';
 import { PlayModule } from '../../svgs/play/play.module';
 import { ScaleDegreesModule } from '../scale-degrees/scale-degrees.module';
@@ -13,11 +10,9 @@ import { ScaleDegreesModule } from '../scale-degrees/scale-degrees.module';
 @NgModule({
   declarations: [
     ScaleMapComponent,
-    DisplayScaleDegreesPipe
   ],
   exports: [
     ScaleMapComponent,
-    DisplayScaleDegreesPipe
   ],
   imports: [
     CommonModule,

apps/fretonator-web/src/app/common/fretonator/scale-map/display-scale-degrees.pipe.ts

@@ -1208,13 +1208,11 @@ exports[`HomeIndexComponent should create 1`] = `
               <div
                 class="controlPanel__section"
               >
-                
                 <h4
                   class="controlPanel__title"
                 >
                   Highlight scale degrees
                 </h4>
-                
                 <app-scale-degrees>
                   <div
                     class="degreesDisplay"