Browse Source

improve fade

Kirk Trombley 2 years ago
parent
commit
5e23fd89f7
3 changed files with 6 additions and 3 deletions
  1. 1 1
      index.html
  2. 4 2
      script.js
  3. 1 0
      styles.css

+ 1 - 1
index.html

@@ -217,7 +217,7 @@
       <div id="sort-fn-mount"></div>
       <div id="sort-metric-mount"></div>
       <hr />
-      <div class="emphasis center">Cluster Ranking</div>
+      <div id="cls-title" class="emphasis center">Cluster Ranking</div>
       <div id="cls-fn-mount"></div>
       <div id="cls-metric-mount"></div>
       <hr />

+ 4 - 2
script.js

@@ -225,8 +225,10 @@ U.template(
 );
 
 U.reactive(() => {
-  document.forms.clsMetric.dataset.faded = document.forms.clsFunction.dataset.faded =
-    sortIgnoresCluster.value;
+  document.getElementById("cls-title").dataset.faded =
+    document.forms.clsMetric.dataset.faded =
+    document.forms.clsFunction.dataset.faded =
+      sortIgnoresCluster.value;
 });
 
 // ---- Score Calculation ----

+ 1 - 0
styles.css

@@ -202,6 +202,7 @@ button.color-select:hover {
   flex: 0 0 2rem;
 }
 
+#cls-title,
 :is(#cls-fn-mount, #cls-metric-mount) form {
   transition: opacity 200ms;
 }