css: Fix jQuery UI widgets' font

Use the main font with jQuery UI widgets (e.g. autocomplete forms)

(cherry picked from commit e540a9d774f5dfcdd18bf51529932f79f78374a0)

4 files changed, 24 insertions, 8 deletions

diff --git a/src/usr/local/www/css/pfSense-BETA.css b/src/usr/local/www/css/pfSense-BETA.css
index 821a7e7..a865084 100644
--- a/src/usr/local/www/css/pfSense-BETA.css
+++ b/src/usr/local/www/css/pfSense-BETA.css
@@ -114,3 +114,7 @@ a.fa, i.fa {
 .panel-heading {
     padding: 5px 10px;
 }
+
+.ui-widget {
+    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
+}
diff --git a/src/usr/local/www/css/pfSense-dark-BETA.css b/src/usr/local/www/css/pfSense-dark-BETA.css
index d5f3ede..df8e841 100644
--- a/src/usr/local/www/css/pfSense-dark-BETA.css
+++ b/src/usr/local/www/css/pfSense-dark-BETA.css
@@ -118,3 +118,7 @@ a.fa, i.fa {
 .panel-heading {
     padding: 5px 10px;
 }
+
+.ui-widget {
+    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
+}
diff --git a/src/usr/local/www/css/pfSense-dark.css b/src/usr/local/www/css/pfSense-dark.css
index 7a7dfc8..d2a0837 100644
--- a/src/usr/local/www/css/pfSense-dark.css
+++ b/src/usr/local/www/css/pfSense-dark.css
@@ -75,9 +75,9 @@ h1 a:link, h1 a:visited {
     color: #fff;
 }
 
-h1 a:hover, h1 a:active { 
-    color: #fff; 
-    text-decoration: none !important; 
+h1 a:hover, h1 a:active {
+    color: #fff;
+    text-decoration: none !important;
 }
 
 /** Content structure */
@@ -380,13 +380,13 @@ caption {
 
 a.list-group-item, .list-group-item {
     background-color: #424242;
-    color: #e0e0e0;  
-    border: 1px solid #212121;  
+    color: #e0e0e0;
+    border: 1px solid #212121;
 }
 
 a.list-group-item:focus, a.list-group-item:hover, .list-group-item:focus, .list-group-item:hover {
     background-color: #303030;
-    color: #e0e0e0; 
+    color: #e0e0e0;
 }
 
 a.list-group-item .list-group-item-heading, .list-group-item .list-group-item-heading {
@@ -438,12 +438,12 @@ ul.tree li A:link, ul.tree li A:hover, ul.tree li A:visited {
 
 table[data-sortable].sortable-theme-bootstrap th[data-sorted="true"] {
     background-color: #000;
-    color: #009688; 
+    color: #009688;
     border-bottom-color: #009688;
 }
 
 table[data-sortable].sortable-theme-bootstrap tbody td {
-    border-top: 1px solid #303030; 
+    border-top: 1px solid #303030;
 }
 
 textarea {
@@ -456,6 +456,10 @@ textarea {
     background-color: #e0e0e0;
 }
 
+.ui-widget {
+    font-family: Roboto, sans-serif;
+}
+
 /* Callouts */
 .bs-callout {
     padding: 10px 15px;
diff --git a/src/usr/local/www/css/pfSense.css b/src/usr/local/www/css/pfSense.css
index 24382fa..2229163 100644
--- a/src/usr/local/www/css/pfSense.css
+++ b/src/usr/local/www/css/pfSense.css
@@ -109,6 +109,10 @@ h1 a:hover, h1 a:active {
     cursor: move;
 }
 
+.ui-widget {
+    font-family: Roboto, sans-serif;
+}
+
 tr.disabled td,
 tr.disabled th {
     opacity: .5;