style networks folders

Signed-off-by: Vladimir Mandic <mandic00@live.com>

javascript/sdnext.css

@@ -1197,7 +1197,7 @@ table.settings-value-table td {
 }
 
 .extra-networks .search textarea {
-  width: calc(120px / 1.1);
+  width: calc(140px / 1.1);
   resize: none;
   margin-right: 2px;
 }
@@ -1233,7 +1233,7 @@ table.settings-value-table td {
   padding: 3px 3px 3px 12px;
   text-align: left;
   text-indent: -6px;
-  width: 120px;
+  width: 140px;
   width: 100%;
 }
 
@@ -1249,7 +1249,7 @@ table.settings-value-table td {
 .extra-network-subdirs {
   background: var(--input-background-fill);
   border-radius: 4px;
-  min-width: max(15%, 120px);
+  min-width: max(15%, 140px);
   overflow-x: hidden;
   overflow-y: auto;
   padding-top: 0.5em;
@@ -1471,7 +1471,6 @@ table.settings-value-table td {
   overflow-y: auto;
 }
 
-
 .extra-details td:first-child {
   font-weight: bold;
   vertical-align: top;
@@ -1481,6 +1480,29 @@ table.settings-value-table td {
   max-height: 50vh;
 }
 
+.network-folder::before {
+  content: "󰉖 ";
+  margin-right: 0.8em;
+}
+
+.network-reference {
+  filter: contrast(0.9);
+}
+
+.network-reference::before {
+  content: "󰴊 ";
+  margin-right: 0.8em;
+}
+
+.network-model {
+  opacity: 0.6;
+}
+
+.network-model::before {
+  content: "󰴉 ";
+  margin-right: 0.8em;
+}
+
 .input-accordion-checkbox {
   display: none !important;
 }

modules/ui_extra_networks.py

@@ -294,7 +294,7 @@ class ExtraNetworksPage:
         versions = sorted({item.get("version", "") for item in self.items if item.get("version")})
         versions_html = ''
         for ver in versions:
-            versions_html += f'<button class="lg secondary gradio-button custom-button" onclick="extraNetworksFilterVersion(event)" style="margin-left:4px">{html.escape(ver)}</button><br>'
+            versions_html += f'<button class="lg secondary gradio-button custom-button network-model" onclick="extraNetworksFilterVersion(event)">{html.escape(ver)}</button><br>'
         self.create_xyz_grid()
         htmls = []