thanks

2 files changed, 52 insertions, 0 deletions

diff --git a/web/share/css/kvm/about.css b/web/share/css/kvm/about.css
index 83ba6091..306f0a73 100644
--- a/web/share/css/kvm/about.css
+++ b/web/share/css/kvm/about.css
@@ -48,3 +48,8 @@ div#about tr.version {
 div#about div#about-meta {
 	height: 200px;
 }
+
+#about-tab-info-button:checked~#about-tab-info-content,
+#about-tab-thanks-button:checked~#about-tab-thanks-content {
+	display: block;
+}
diff --git a/web/share/css/tabs.css b/web/share/css/tabs.css
new file mode 100644
index 00000000..46c46b4b
--- /dev/null
+++ b/web/share/css/tabs.css
@@ -0,0 +1,47 @@
+/*****************************************************************************
+#                                                                            #
+#    KVMD - The main Pi-KVM daemon.                                          #
+#                                                                            #
+#    Copyright (C) 2018  Maxim Devaev <[email protected]>                    #
+#                                                                            #
+#    This program is free software: you can redistribute it and/or modify    #
+#    it under the terms of the GNU General Public License as published by    #
+#    the Free Software Foundation, either version 3 of the License, or       #
+#    (at your option) any later version.                                     #
+#                                                                            #
+#    This program is distributed in the hope that it will be useful,         #
+#    but WITHOUT ANY WARRANTY; without even the implied warranty of          #
+#    MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the           #
+#    GNU General Public License for more details.                            #
+#                                                                            #
+#    You should have received a copy of the GNU General Public License       #
+#    along with this program.  If not, see <https://www.gnu.org/licenses/>.  #
+#                                                                            #
+*****************************************************************************/
+
+
+div.tabs>input[type="radio"] {
+	display: none;
+}
+
+div.tabs>div {
+	display: none;
+	border: var(--border-default-thin);
+	padding: 10px 10px;
+}
+
+div.tabs>label {
+	display: inline-block;
+	text-align: center;
+	vertical-align: middle;
+	user-select: none;
+	border: var(--border-default-thin);
+	padding: 4px 8px;
+	cursor: pointer;
+	position: relative;
+	top: 1px;
+}
+
+div.tabs>input[type="radio"]:checked+label {
+	background-color: var(--cs-control-default-bg);
+}