wcag: Add caution icon to duplicate node warning. #285

Author: benloh

app/assets/images/icn_caution.svg

@@ -135,6 +135,12 @@
 }
 .nccomponent .warning {
   color: red;
+  display: flex;
+  gap: 0.5rem;
+  margin: 0 0.5rem;
+}
+.nccomponent .warning {
+  padding-left: 2px;
 }
 .nccomponent .help {
   font-size: 10px;

app/view/netcreate/components/NCNode.css

@@ -875,12 +875,20 @@ class NCNode extends UNISYS.Component {
               )}
               {uShowMatchlist && matchList && (
                 <div className="matchlist">
-                  {isDuplicate && <div className="warning">{duplicateWarning}</div>}
+                  {isDuplicate && (
+                    <div className="warning">
+                      <img src={`images/icn_caution.svg`} />
+                      <span>{duplicateWarning}</span>
+                    </div>
+                  )}
                   {matchList}
                 </div>
               )}
               {isDuplicate && (
-                <div className="message warning">{duplicateWarning}</div>
+                <div className="message warning">
+                  <img src={`images/icn_caution.svg`} />
+                  <span>{duplicateWarning}</span>
+                </div>
               )}
             </div>
             {/* Special handling for `type` field */}