From 637ed9a478a2e740bd81eba7c9a6844b9995225c Mon Sep 17 00:00:00 2001
From: djmaze <djmaze@djmaze.lan>
Date: Thu, 26 Aug 2021 20:10:14 +0200
Subject: [PATCH] Improve new .tabs CSS from

---
 dev/Styles/Ui.less                            | 47 ++++++++++++++++++
 .../Common/PopupsKeyboardShortcutsHelp.html   | 22 +++------
 vendors/bootstrap/less/navs.less              | 49 -------------------
 vendors/bootstrap/less/tables.less            |  5 +-
 4 files changed, 56 insertions(+), 67 deletions(-)

diff --git a/dev/Styles/Ui.less b/dev/Styles/Ui.less
index 8387e010f..64d8f11cc 100644
--- a/dev/Styles/Ui.less
+++ b/dev/Styles/Ui.less
@@ -74,3 +74,50 @@ textarea + .settings-save-trigger {
 .list-table {
 	max-width: 800px;
 }
+
+// TABS
+// -------------
+
+.tabs {
+    display: grid;
+}
+
+.tabs input[type="radio"] {
+	position: absolute;
+	top: 0;
+	left: -9999px;
+	display: none;
+}
+
+// Actual tabs
+.tabs label {
+	grid-row-start: 1;
+	color: #555;
+	margin: 0 2px -1px 0;
+	line-height: @baseLineHeight;
+	border: 1px solid transparent;
+	border-radius: 4px 4px 0 0;
+	padding: 5px;
+	&:hover {
+		border-color: @grayLighter @grayLighter #ddd;
+	}
+}
+.tabs [id^="tab"]:checked + label {
+	color: @gray;
+	background-color: @white;
+	border-color: #ddd #ddd transparent #ddd;
+	z-index: 1;
+}
+
+// TABBABLE
+// --------
+
+.tabs .tab-content {
+	grid-column-start: 1;
+	grid-row-start: 2;
+	visibility: hidden;
+}
+
+.tabs [id^="tab"]:checked + label + .tab-content {
+	visibility: visible;
+}
diff --git a/snappymail/v/0.0.0/app/templates/Views/Common/PopupsKeyboardShortcutsHelp.html b/snappymail/v/0.0.0/app/templates/Views/Common/PopupsKeyboardShortcutsHelp.html
index d13e3a931..2cd7f27e8 100644
--- a/snappymail/v/0.0.0/app/templates/Views/Common/PopupsKeyboardShortcutsHelp.html
+++ b/snappymail/v/0.0.0/app/templates/Views/Common/PopupsKeyboardShortcutsHelp.html
@@ -14,9 +14,7 @@
 				aria-controls="panel1"
 				tabindex="0"
 				data-i18n="SHORTCUTS_HELP/TAB_MAILBOX"></label>
-			<div class="tab-content"
-					role="tabpanel"
-					aria-hidden="false">
+			<div class="tab-content" role="tabpanel" aria-hidden="false">
 				<table class="table table-striped table-bordered">
 				<tbody>
 					<tr><td></td><td data-i18n="SHORTCUTS_HELP/LABEL_OPEN_USER_DROPDOWN"></td><td>M, Menu</td></tr>
@@ -35,10 +33,8 @@
 				aria-selected="false"
 				aria-controls="panel2"
 				tabindex="0"
-				 data-i18n="SHORTCUTS_HELP/TAB_MESSAGE_LIST"></label>
-			<div class="tab-content"
-					role="tabpanel"
-					aria-hidden="true">
+				data-i18n="SHORTCUTS_HELP/TAB_MESSAGE_LIST"></label>
+			<div class="tab-content" role="tabpanel" aria-hidden="true">
 				<table class="table table-striped table-bordered">
 				<tbody>
 					<tr><td class="fontastic">☑</td><td data-i18n="SHORTCUTS_HELP/LABEL_CHECK_ALL"></td><td><!-- ko text: metaKey --><!-- /ko --> + A</td></tr>
@@ -64,10 +60,8 @@
 				aria-selected="false"
 				aria-controls="panel3"
 				tabindex="0"
-				 data-i18n="SHORTCUTS_HELP/TAB_MESSAGE_VIEW"></label>
-			<div class="tab-content"
-					role="tabpanel"
-					aria-hidden="true">
+				data-i18n="SHORTCUTS_HELP/TAB_MESSAGE_VIEW"></label>
+			<div class="tab-content" role="tabpanel" aria-hidden="true">
 				<table class="table table-striped table-bordered">
 				<tbody>
 					<tr><td data-i18n="SHORTCUTS_HELP/LABEL_FULLSCREEN_TOGGLE"></td><td>Enter, Open</td></tr>
@@ -86,10 +80,8 @@
 				aria-selected="false"
 				aria-controls="panel4"
 				tabindex="0"
-				 data-i18n="SHORTCUTS_HELP/TAB_COMPOSE"></label>
-			<div class="tab-content"
-					role="tabpanel"
-					aria-hidden="true">
+				data-i18n="SHORTCUTS_HELP/TAB_COMPOSE"></label>
+			<div class="tab-content" role="tabpanel" aria-hidden="true">
 				<table class="table table-striped table-bordered">
 				<tbody>
 					<tr><td data-i18n="SHORTCUTS_HELP/LABEL_OPEN_COMPOSE_POPUP"></td><td>W, C, New</td></tr>
diff --git a/vendors/bootstrap/less/navs.less b/vendors/bootstrap/less/navs.less
index c9a20ed95..66e1c3fde 100644
--- a/vendors/bootstrap/less/navs.less
+++ b/vendors/bootstrap/less/navs.less
@@ -20,52 +20,3 @@
   text-decoration: none;
   background-color: @grayLighter;
 }
-
-
-
-// TABS
-// -------------
-
-.tabs {
-    display: grid;
-}
-
-.tabs input[type="radio"] {
-	position: absolute;
-	top: 0;
-	left: -9999px;
-	display: none;
-}
-
-// Actual tabs
-.tabs label {
-	grid-row-start: 1;
-	color: #555;
-	margin: 0 2px -1px 0;
-	line-height: @baseLineHeight;
-	border: 1px solid transparent;
-	border-radius: 4px 4px 0 0;
-	padding: 5px;
-	&:hover {
-		border-color: @grayLighter @grayLighter #ddd;
-	}
-}
-[id^="tab"]:checked + label {
-	color: @gray;
-	background-color: @white;
-	border-color: #ddd #ddd transparent #ddd;
-	z-index: 1;
-}
-
-// TABBABLE
-// --------
-
-.tab-content {
-	grid-column-start: 1;
-	grid-row-start: 2;
-	visibility: hidden;
-}
-
-[id^="tab"]:checked + label + .tab-content {
-	visibility: visible;
-}
diff --git a/vendors/bootstrap/less/tables.less b/vendors/bootstrap/less/tables.less
index b70946911..6d5e09a45 100644
--- a/vendors/bootstrap/less/tables.less
+++ b/vendors/bootstrap/less/tables.less
@@ -47,10 +47,9 @@
 .table-bordered {
   border: 1px solid @tableBorder;
   border-collapse: separate; // Done so we can round those corners!
-  border-left: 0;
   border-radius: 4px;
-  th,
-  td {
+  th + th,
+  td + td {
     border-left: 1px solid @tableBorder;
   }
   // Prevent a double border