eslint

blackbaud · Aug 6, 2024 · 07e64f2 · 07e64f2
1 parent 9d99d0f
commit 07e64f2
Show file tree

Hide file tree

Showing 2 changed files with 13 additions and 13 deletions.
diff --git a/apps/playground/src/app/components/colorpicker/colorpicker/colorpicker.component.html b/apps/playground/src/app/components/colorpicker/colorpicker/colorpicker.component.html
@@ -1,14 +1,14 @@
 <form novalidate [formGroup]="reactiveForm" (ngSubmit)="submit()">
-  <div class="sky-form-group">
+  <div class="sky-form-group sky-padding-even-md">
     <sky-colorpicker
+      #colorPicker
       helpKey="help-key.html"
       hintText="Hint text content."
-      labelText="What is your favorite color?"
+      labelText="Favorite color"
       pickerButtonIcon="calendar"
       pickerButtonIconType="skyux"
       stacked="true"
       (selectedColorChanged)="onSelectedColorChanged($event)"
-      #colorPicker
     >
       <input
         formControlName="favoriteColor"
@@ -17,14 +17,14 @@
         [skyColorpickerInput]="colorPicker"
       />
 
-      <sky-form-error
-        *ngIf="favoriteColor.errors?.['opaque']"
-        errorName="opaque"
-        errorText="Color must have at least 80% opacity."
-      />
+      @if ("favoriteColor.errors?.['opaque']") {
+        <sky-form-error
+          errorName="opaque"
+          errorText="Color must have at least 80% opacity."
+        />
+      }
     </sky-colorpicker>
   </div>
-
   <table>
     <tr>
       <th>Touched</th>

diff --git a/libs/components/colorpicker/src/lib/modules/colorpicker/colorpicker.component.html b/libs/components/colorpicker/src/lib/modules/colorpicker/colorpicker.component.html
@@ -30,6 +30,7 @@
   </div>
 
   <button
+    #triggerButtonRef
     aria-haspopup="dialog"
     class="sky-colorpicker-button"
     type="button"
@@ -61,7 +62,6 @@
     }"
     [style.background-color]="backgroundColorForDisplay"
     (click)="onTriggerButtonClick()"
-    #triggerButtonRef
   >
     <sky-icon
       *ngIf="pickerButtonIcon"
@@ -85,6 +85,7 @@
 
   <ng-template #colorpickerTemplateRef>
     <div
+      #colorpickerRef
       class="sky-colorpicker-container"
       role="dialog"
       [attr.aria-labelledby]="triggerButtonId"
@@ -96,7 +97,6 @@
       }"
       [cdkTrapFocus]="true"
       [cdkTrapFocusAutoCapture]="false"
-      #colorpickerRef
     >
       <div class="sky-colorpicker">
         <div
@@ -125,25 +125,25 @@
           </div>
           <div class="right">
             <div
+              #hueSlider
               class="hue"
               [skyColorpickerSlider]
               [xAxis]="1"
               (newColorContrast)="hue = $event"
-              #hueSlider
             >
               <div
                 class="cursor sky-rounded-circle"
                 [style.left.px]="slider.hue"
               ></div>
             </div>
             <div
+              #alphaSlider
               *ngIf="this.allowTransparency"
               class="alpha"
               [skyColorpickerSlider]
               [style.background-color]="alphaSliderColor"
               [xAxis]="1"
               (newColorContrast)="alphaAxis = $event"
-              #alphaSlider
             >
               <div
                 class="cursor sky-rounded-circle"