From c0aee3f1a11188e862e8715b8a3a1a51259b333f Mon Sep 17 00:00:00 2001
From: Jan-Christoph Borchardt <hey@jancborchardt.net>
Date: Thu, 1 Nov 2018 04:16:56 +0100
Subject: [PATCH] Fix design of tabs in sidebar
Signed-off-by: Jan-Christoph Borchardt <hey@jancborchardt.net>
---
core/css/apps.scss | 30 +++++++++++++++++++++++++-----
1 file changed, 25 insertions(+), 5 deletions(-)
diff --git a/core/css/apps.scss b/core/css/apps.scss
index 8b94d08ce2e..54372afa45a 100644
--- a/core/css/apps.scss
+++ b/core/css/apps.scss
@@ -781,27 +781,47 @@ kbd {
/* TABS ------------------------------------------------------------ */
.tabHeaders {
- display: inline-block;
- margin: 15px;
+ display: flex;
+ margin-bottom: 16px;
+
.tabHeader {
- float: left;
- padding: 12px;
+ display: flex;
+ flex-direction: column;
+ flex-grow: 1;
+ text-align: center;
+ white-space: nowrap;
+ overflow: hidden;
+ text-overflow: ellipsis;
cursor: pointer;
color: var(--color-text-lighter);
margin-bottom: 1px;
+ padding: 5px;
+
+ /* Use same amount as sidebar padding */
+ &:first-child {
+ padding-left: 15px;
+ }
+ &:last-child {
+ padding-right: 15px;
+ }
+
.icon {
display: inline-block;
- width: 16px;
+ width: 100%;
height: 16px;
background-size: 16px;
vertical-align: middle;
margin-top: -2px;
margin-right: 3px;
opacity: .7;
+ cursor: pointer;
}
+
a {
color: var(--color-text-lighter);
margin-bottom: 1px;
+ overflow: hidden;
+ text-overflow: ellipsis;
}
&.selected {
font-weight: bold;
--
GitLab