[style][layout] css optimizations, values table improvement

src/src/WebServer/DevicesPage.cpp

@@ -1329,11 +1329,11 @@ void devicePage_show_task_values(taskIndex_t taskIndex, deviceIndex_t DeviceInde
 
     // table header
     addHtml(F("<TR><TH style='width:30px;' align='center'>#"));
-    html_table_header(F("Name"));
+    html_table_header(F("Name"),500);
 
     if (Device[DeviceIndex].FormulaOption)
     {
-      html_table_header(F("Formula"), F("EasyFormula"), 0);
+      html_table_header(F("Formula"), F("EasyFormula"), 500);
       ++colCount;
     }
 
@@ -1351,6 +1351,10 @@ void devicePage_show_task_values(taskIndex_t taskIndex, deviceIndex_t DeviceInde
       ++colCount;
     }
 
+    //placeholder header
+     html_table_header(F(""),0);
+     ++colCount;
+
     LoadTaskSettings(taskIndex);
     // table body
     for (uint8_t varNr = 0; varNr < valueCount; varNr++)

src/src/WebServer/Markup.cpp

@@ -769,7 +769,7 @@ void addTextBox(const String  & id,
 {
   addHtml(F("<input "));
   addHtmlAttribute(F("class"),     classname);
-  addHtmlAttribute(F("type"),      F("search"));
+  addHtmlAttribute(F("type"),      F("text"));
   addHtmlAttribute(F("name"),      id);
   if (maxlength > 0) {
     addHtmlAttribute(F("maxlength"), maxlength);

static/espeasy_default.css

@@ -124,21 +124,12 @@ h6 {
 	font-size: 10pt
 }
 
-code,
-kbd,
-pre,
-samp,
-tt,
-xmp {
-	font: 1em monospace, monospace
-}
-
 .button {
 	border: 0;
 	border-radius: 5px;
 	color: var(--c6);
-	margin: 4px;
-	padding: 4px 16px
+	margin: 5px;
+	padding: 5px 15px
 }
 
 input,
@@ -151,16 +142,17 @@ select,
 .checkmark,
 input,
 select,
-textarea {
-	border-color: gray;
-	border-style: solid;
-	border-width: 1px
+hr,
+textarea,
+#toastmessage,
+.dotmark,
+.logviewer {
+	border: .1px solid gray;
 }
 
 .button.link.wide {
 	display: inline-block;
 	text-align: center;
-	width: 100%
 }
 
 .button.link.red {
@@ -193,12 +185,13 @@ textarea {
 
 .wide {
 	margin-bottom: 5px;
-	max-width: 350px;
+	max-width: 300px;
+	min-width: 85px;
 	width: 95%
 }
 
 .xwide {
-	width: 350px
+	width: 300px
 }
 
 .widenumber {
@@ -248,18 +241,6 @@ textarea {
 	background-color: var(--bg3)
 }
 
-#toastmessage,
-.dotmark,
-.logviewer {
-	border-color: gray;
-	border-style: solid
-}
-
-#toastmessage,
-.dotmark {
-	border-width: 1px
-}
-
 .container2 {
 	margin-bottom: 20px;
 	margin-left: 9px;
@@ -397,9 +378,6 @@ tbody {
 .multirow,
 .normal {
 	border-spacing: 0;
-	border-style: none;
-	min-width: 420px;
-	padding-bottom: 5px;
 	width: 100%
 }