Use consistent color for tooltip icons

The previously used .black class was not specified anywhere, instead other targeting was used for the coloring of the icons, which was not consistently applied everywhere. By adding a utility class of .black-74 and using that, we ensure that all tooltip info icons have the same color.
WikiWatershed · May 18, 2020 · 4330e28 · 4330e28
1 parent 2996cee
commit 4330e28
Show file tree

Hide file tree

Showing 14 changed files with 25 additions and 21 deletions.
diff --git a/src/mmw/js/src/analyze/templates/analyzeDescription.html b/src/mmw/js/src/analyze/templates/analyzeDescription.html
@@ -9,7 +9,7 @@
                data-template="<div class='popover'><div class='pull-right'
                                 id='popover-close-button'><i class='fa fa-times' /></div><div
                                 class='popover-content'></div><div class='arrow'></div></div>">
-                <i class="fa fa-info-circle black"></i>
+                <i class="fa fa-info-circle black-74"></i>
             </a>
         {% endif %}
     {% endif %}

diff --git a/src/mmw/js/src/analyze/templates/streamLengthPopover.html b/src/mmw/js/src/analyze/templates/streamLengthPopover.html
@@ -4,5 +4,5 @@
    data-template="<div class='popover'><div class='pull-right'
      id='popover-close-button'><i class='fa fa-times' /></div><div
      class='popover-content'></div><div class='arrow'></div></div>">
-   <i class="fa fa-info-circle black"></i>
+   <i class="fa fa-info-circle black-74"></i>
 </a>
diff --git a/src/mmw/js/src/analyze/templates/streamTableRow.html b/src/mmw/js/src/analyze/templates/streamTableRow.html
@@ -7,7 +7,7 @@
            data-template="<div class='popover'><div class='pull-right'
              id='popover-close-button'><i class='fa fa-times' /></div><div
              class='popover-content'></div><div class='arrow'></div></div>">
-           <i class="fa fa-info-circle black"></i>
+           <i class="fa fa-info-circle black-74"></i>
         </a>
     {% endif %}
 </td>

diff --git a/src/mmw/js/src/data_catalog/templates/resultDetailsCinergi.html b/src/mmw/js/src/data_catalog/templates/resultDetailsCinergi.html
@@ -53,7 +53,7 @@ <h2>
                        data-html="true" data-container="body" role="button"
                        data-content="The Community Inventory of EarthCube Resources for Geosciences Interoperability (CINERGI) Data Portal is a catalog of databases, services and data portals developed by numerous organizations representing a diversity of geoscience domains. Explore CINERGI at <a href='http://cinergi.sdsc.edu/' target='_blank' rel='noreferrer noopener'>http://cinergi.sdsc.edu/</a>"
                        data-template="<div class='popover'><div class='pull-right' id='popover-close-button' onclick='closePopover()'><i class='fa fa-times' /></div><div class='popover-content'></div><div class='arrow'></div></div>">
-                        <i class="fa fa-info-circle black"></i>
+                        <i class="fa fa-info-circle black-74"></i>
                     </a>
                 </td>
             </tr>

diff --git a/src/mmw/js/src/data_catalog/templates/resultDetailsCuahsi.html b/src/mmw/js/src/data_catalog/templates/resultDetailsCuahsi.html
@@ -15,7 +15,7 @@ <h2>
                        data-html="true" data-container="body" role="button"
                        data-content="{{ description }}"
                        data-template="<div class='popover'><div class='pull-right' id='popover-close-button' onclick='closePopover()'><i class='fa fa-times' /></div><div class='popover-content'></div><div class='arrow'></div></div>">
-                        <i class="fa fa-info-circle black"></i>
+                        <i class="fa fa-info-circle black-74"></i>
                     </a>
                 </td>
             </tr>
@@ -50,7 +50,7 @@ <h2>
                        data-html="true" data-container="body" role="button"
                        data-content="The Consortium of Universities for the Advancement of Hydrologic Science, Inc. (CUAHSI) Water Data Center (WDC) provides tools for data access, analysis and collaboration, including a Catalog of hydrological time series data available as Water One Flow (WOF) and WaterML web services. See <a href='https://www.cuahsi.org/data-models/discovery-and-analysis/' target='_blank' rel='noreferrer noopener'>https://www.cuahsi.org/data-models/discovery-and-analysis/</a>"
                        data-template="<div class='popover'><div class='pull-right' id='popover-close-button' onclick='closePopover()'><i class='fa fa-times' /></div><div class='popover-content'></div><div class='arrow'></div></div>">
-                        <i class="fa fa-info-circle black"></i>
+                        <i class="fa fa-info-circle black-74"></i>
                     </a>
                 </td>
             </tr>

diff --git a/src/mmw/js/src/data_catalog/templates/resultDetailsCuahsiTableRowVariableCol.html b/src/mmw/js/src/data_catalog/templates/resultDetailsCuahsiTableRowVariableCol.html
@@ -11,7 +11,7 @@
             <p><strong>Speciation:</strong> {{ speciation }}</p>
             {% endif %}
             <p><strong>Medium:</strong> {{ sample_medium }}</p>">
-        <i class="fa fa-info-circle black"></i>
+        <i class="fa fa-info-circle black-74"></i>
     </a>
 {% endif %}
 {% if error %}

diff --git a/src/mmw/js/src/data_catalog/templates/resultDetailsHydroshare.html b/src/mmw/js/src/data_catalog/templates/resultDetailsHydroshare.html
@@ -39,7 +39,7 @@ <h2>
                        data-html="true" data-container="body" role="button"
                        data-content="The fundamental unit of digital content in HydroShare is a <strong>Resource</strong>. For more information see <a href='https://help.hydroshare.org/hydroshare-resource-types/' target='_blank' rel='noreferrer noopener'>https://help.hydroshare.org/hydroshare-resource-types/</a>"
                        data-template="<div class='popover'><div class='pull-right' id='popover-close-button' onclick='closePopover()'><i class='fa fa-times' /></div><div class='popover-content'></div><div class='arrow'></div></div>">
-                        <i class="fa fa-info-circle black"></i>
+                        <i class="fa fa-info-circle black-74"></i>
                     </a>
                 </td>
             </tr>
@@ -51,7 +51,7 @@ <h2>
                        data-html="true" data-container="body" role="button"
                        data-content="HydroShare is an online collaborative environment for sharing hydrologic data and models. Its goal is to facilitate creation, collaboration around, discovery and access to data and model resources shared by members of the Hydrology community. See <a href='https://www.hydroshare.org/' target='_blank' rel='noreferrer noopener'>https://www.hydroshare.org/</a>"
                        data-template="<div class='popover'><div class='pull-right' id='popover-close-button' onclick='closePopover()'><i class='fa fa-times' /></div><div class='popover-content'></div><div class='arrow'></div></div>">
-                        <i class="fa fa-info-circle black"></i>
+                        <i class="fa fa-info-circle black-74"></i>
                     </a>
                 </td>
             </tr>

diff --git a/src/mmw/js/src/data_catalog/templates/resultDetailsUSGSWQP.html b/src/mmw/js/src/data_catalog/templates/resultDetailsUSGSWQP.html
@@ -26,7 +26,7 @@ <h2>
                        data-html="true" data-container="body" role="button"
                        data-content="<a href='https://www.waterqualitydata.us/provider/{{ provider_name }}/{{ service_org }}/' target='_blank'>{{ service_orgname }} ({{ service_org }})</a>"
                        data-template="<div class='popover'><div class='pull-right' id='popover-close-button' onclick='closePopover()'><i class='fa fa-times' /></div><div class='popover-content'></div><div class='arrow'></div></div>">
-                        <i class="fa fa-info-circle black"></i>
+                        <i class="fa fa-info-circle black-74"></i>
                     </a>
                 </td>
             </tr>
@@ -41,7 +41,7 @@ <h2>
 {#                       data-html="true" data-container="body" role="button"#}
 {#                       data-content="{{ description }}"#}
 {#                       data-template="<div class='popover'><div class='pull-right' id='popover-close-button' onclick='closePopover()'><i class='fa fa-times' /></div><div class='popover-content'></div><div class='arrow'></div></div>">#}
-{#                        <i class="fa fa-info-circle black"></i>#}
+{#                        <i class="fa fa-info-circle black-74"></i>#}
 {#                    </a>#}
 {#                </td>#}
 {#            </tr>#}
@@ -79,7 +79,7 @@ <h2>
                        data-html="true" data-container="body" role="button"
                        data-content="<a href='https://www.waterqualitydata.us/provider/{{ provider_name }}/' target='_blank'>{{ provider_name }}</a>"
                        data-template="<div class='popover'><div class='pull-right' id='popover-close-button' onclick='closePopover()'><i class='fa fa-times' /></div><div class='popover-content'></div><div class='arrow'></div></div>">
-                        <i class="fa fa-info-circle black"></i>
+                        <i class="fa fa-info-circle black-74"></i>
                     </a>
                 </td>
             </tr>
@@ -94,7 +94,7 @@ <h2>
                        and the National Water Quality Monitoring Council (NWQMC).
                        It serves data collected by over 400 state, federal, tribal, and local agencies."
                        data-template="<div class='popover'><div class='pull-right' id='popover-close-button' onclick='closePopover()'><i class='fa fa-times' /></div><div class='popover-content'></div><div class='arrow'></div></div>">
-                        <i class="fa fa-info-circle black"></i>
+                        <i class="fa fa-info-circle black-74"></i>
                     </a>
                 </td>
             </tr>
@@ -120,4 +120,4 @@ <h2>
 {#    <hr />#}
     <h3>Citation</h3>
     <p>{{ service_citation }}</p>
-</div>
+</div>
diff --git a/src/mmw/js/src/draw/templates/splash.html b/src/mmw/js/src/draw/templates/splash.html
@@ -37,7 +37,7 @@ <h2>
                    data-html="true" data-container="body" role="button"
                    data-content="The Community Inventory of EarthCube Resources for Geosciences Interoperability (CINERGI) Data Portal is a catalog of databases, services and data portals developed by numerous organizations representing a diversity of geoscience domains. Explore CINERGI at <a href='http://cinergi.sdsc.edu/' target='_blank' rel='noreferrer noopener'>http://cinergi.sdsc.edu/</a>"
                    data-template="<div class='popover'><div class='pull-right' id='popover-close-button' onclick='closePopover()'><i class='fa fa-times' /></div><div class='popover-content'></div><div class='arrow'></div></div>">
-                    <i class="fa fa-info-circle black"></i>
+                    <i class="fa fa-info-circle black-74"></i>
                 </a>
             </li>
             <li>
@@ -46,7 +46,7 @@ <h2>
                    data-html="true" data-container="body" role="button"
                    data-content="HydroShare is an online collaborative environment for sharing hydrologic data and models. Its goal is to facilitate creation, collaboration around, discovery and access to data and model resources shared by members of the Hydrology community. See <a href='https://www.hydroshare.org/' target='_blank' rel='noreferrer noopener'>https://www.hydroshare.org/</a>"
                    data-template="<div class='popover'><div class='pull-right' id='popover-close-button' onclick='closePopover()'><i class='fa fa-times' /></div><div class='popover-content'></div><div class='arrow'></div></div>">
-                    <i class="fa fa-info-circle black"></i>
+                    <i class="fa fa-info-circle black-74"></i>
                 </a>
             </li>
             <li>
@@ -55,7 +55,7 @@ <h2>
                    data-html="true" data-container="body" role="button"
                    data-content="The Consortium of Universities for the Advancement of Hydrologic Science, Inc. (CUAHSI) Water Data Center (WDC) provides tools for data access, analysis and collaboration, including a Catalog of hydrological time series data available as Water One Flow (WOF) and WaterML web services. See <a href='https://www.hydroshare.org/' target='_blank' rel='noreferrer noopener'>https://www.cuahsi.org/data-models/discovery-and-analysis/</a>"
                    data-template="<div class='popover'><div class='pull-right' id='popover-close-button' onclick='closePopover()'><i class='fa fa-times' /></div><div class='popover-content'></div><div class='arrow'></div></div>">
-                    <i class="fa fa-info-circle black"></i>
+                    <i class="fa fa-info-circle black-74"></i>
                 </a>
             </li>
         </ol>

diff --git a/src/mmw/js/src/modeling/gwlfe/quality/templates/result.html b/src/mmw/js/src/modeling/gwlfe/quality/templates/result.html
@@ -14,7 +14,7 @@
         data-container="body" role="button"
         data-content="Stream lengths presented here are for NHDplus v2 medium resolution flow lines. To make GWLF-E bank erosion calculations similar to those of the high resolution flow lines available for PA, and soon to be available nationwide with the NHDplus HR release, we used a sediment erosion adjustment factor of 1.4."
         data-template="<div class='popover'><div class='popover-content'></div><div class='arrow'></div></div>">
-        <i class="fa fa-info-circle black"></i>
+        <i class="fa fa-info-circle black-74"></i>
     </a>
 </p>
 {% if showSubbasinModelingButton %}

diff --git a/src/mmw/js/src/modeling/gwlfe/runoff/templates/result.html b/src/mmw/js/src/modeling/gwlfe/runoff/templates/result.html
@@ -14,7 +14,7 @@
         data-container="body" role="button"
         data-content="Stream lengths presented here are for NHDplus v2 medium resolution flow lines. To make GWLF-E bank erosion calculations similar to those of the high resolution flow lines available for PA, and soon to be available nationwide with the NHDplus HR release, we used a sediment erosion adjustment factor of 1.4."
         data-template="<div class='popover'><div class='popover-content'></div><div class='arrow'></div></div>">
-        <i class="fa fa-info-circle black"></i>
+        <i class="fa fa-info-circle black-74"></i>
     </a>
 </p>
 <div class="runoff-selector-region"></div>

diff --git a/src/mmw/js/src/modeling/gwlfe/templates/weatherStationLayerToggle.html b/src/mmw/js/src/modeling/gwlfe/templates/weatherStationLayerToggle.html
@@ -25,7 +25,7 @@
             data-template="<div class='popover'><div class='pull-right'
                             id='popover-close-button'><i class='fa fa-times' /></div><div
                             class='popover-content'></div><div class='arrow'></div></div>">
-            <i class="fa fa-info-circle black"></i>
+            <i class="fa fa-info-circle black-74"></i>
         </a>
     </div>
 {% endif %}
diff --git a/src/mmw/js/src/modeling/templates/modelDetailsDropdown.html b/src/mmw/js/src/modeling/templates/modelDetailsDropdown.html
@@ -15,7 +15,7 @@ <h3>{{modelPackage.display_name}}
            data-template="<div class='popover'><div class='pull-right'
                   id='popover-close-button'><i class='fa fa-times' /></div><div
                   class='popover-content'></div><div class='arrow'></div></div>">
-            <i class="fa fa-info-circle black"></i>
+            <i class="fa fa-info-circle black-74"></i>
         </a>
     </h3>
 </div>
diff --git a/src/mmw/sass/utils/_quick-classes.scss b/src/mmw/sass/utils/_quick-classes.scss
@@ -61,3 +61,7 @@
 .ui-danger {
   color: $ui-danger;
 }
+
+.black-74 {
+  color: $black-74;
+}