* Make tabs smaller Fomantic's tabs are excessively wide and with another tab added on the repo tabbar (https://github.com/go-gitea/gitea/pull/8346) it would break the layout on the english language. Globally reduce tab bar padding to around half of the previous values. * disable no-duplicate-selectors linter rule * more tab bar tweaks * more tweaks * merge rules and nesting * remove arc-green weird hover color * few more arc-green tweaks * restore to 12px * tweaks * use half width height padding * final tweak * 10px * remove min-height * 11px * remve new-menu background on light theme too * background fixes for new-menu Co-authored-by: Lauris BH <lauris@nix.lv> Co-authored-by: techknowlogick <techknowlogick@gitea.io>tags/v1.13.0-rc1
@@ -887,7 +887,7 @@ footer { | |||
padding-top: 15px !important; | |||
margin-top: -15px !important; | |||
margin-bottom: 15px !important; | |||
background-color: #fafafa !important; | |||
background: #fafafa; | |||
border-width: 1px !important; | |||
} | |||
@@ -895,7 +895,7 @@ footer { | |||
.ui.menu.new-menu { | |||
overflow-x: auto !important; | |||
justify-content: left !important; | |||
padding-bottom: 5px; | |||
padding-bottom: 2px; | |||
} | |||
.ui.menu.new-menu::-webkit-scrollbar { | |||
@@ -1011,19 +1011,6 @@ footer { | |||
margin-top: 3em !important; | |||
} | |||
/* Tab color tweaks */ | |||
.ui.tabular.menu .item { | |||
color: rgba(0, 0, 0, .5); | |||
} | |||
.ui.tabular.menu .item:hover { | |||
color: rgba(0, 0, 0, .8); | |||
} | |||
.ui.tabular.menu .item.active { | |||
color: rgba(0, 0, 0, .9); | |||
} | |||
/* multiple radio or checkboxes as inline element */ | |||
.inline-grouped-list { | |||
display: inline-block; | |||
@@ -1300,3 +1287,23 @@ i.icon.centerlock { | |||
.ui.sub.header { | |||
text-transform: none; | |||
} | |||
.ui.tabular.menu { | |||
.item { | |||
padding: 11px 12px; | |||
color: rgba(0, 0, 0, .5); | |||
} | |||
.item:hover { | |||
color: rgba(0, 0, 0, .8); | |||
} | |||
.item.active { | |||
color: rgba(0, 0, 0, .9); | |||
margin-top: 1px; /* offset fomantic's margin-bottom: -1px */ | |||
} | |||
} | |||
.ui.secondary.pointing.menu .item { | |||
padding: 12px; | |||
} |
@@ -3037,3 +3037,13 @@ td.blob-excerpt { | |||
.added-code { | |||
background-color: #99ff99; | |||
} | |||
.repository .ui.menu.new-menu { | |||
background: none !important; | |||
@media only screen and (max-width: 1200px) { | |||
&:after { | |||
background: none !important; | |||
} | |||
} | |||
} |
@@ -516,13 +516,13 @@ a.ui.basic.green.label:hover { | |||
} | |||
.ui.tabular.menu { | |||
border-bottom-color: rgba(187, 187, 187, .24); | |||
border-bottom-color: rgba(255, 255, 255, .1); | |||
.item.active { | |||
border-top-color: transparent; | |||
border-left-color: transparent; | |||
border-right-color: transparent; | |||
background: #404552; | |||
background: #383c4a; | |||
color: #dbdbdb; | |||
} | |||
@@ -536,10 +536,8 @@ a.ui.basic.green.label:hover { | |||
&.navbar { | |||
.item.active { | |||
background: #383c4a; | |||
border-left-color: transparent; | |||
border-right-color: transparent; | |||
border-top: none; | |||
} | |||
} | |||
} | |||
@@ -857,10 +855,12 @@ a.ui.basic.green.label:hover { | |||
background: #353945; | |||
} | |||
.ui.secondary.pointing.menu { | |||
border-bottom-color: rgba(255, 255, 255, .15); | |||
} | |||
.ui.secondary.pointing.menu .active.item { | |||
color: #dbdbdb; | |||
border: 0; | |||
background: #383c4a; | |||
} | |||
.ui.user.list .item:not(:first-child) { | |||
@@ -868,9 +868,7 @@ a.ui.basic.green.label:hover { | |||
} | |||
.ui.secondary.pointing.menu .active.item:hover { | |||
border-color: #af8b4c; | |||
color: #dbdbdb; | |||
background: #4b5162; | |||
} | |||
.ui.secondary.pointing.menu .dropdown.item:hover, | |||
@@ -902,11 +900,12 @@ a.ui.basic.green.label:hover { | |||
} | |||
.ui.menu.new-menu { | |||
background-color: #2a2e3a !important; | |||
background: #2a2e3a; | |||
border-color: transparent !important; | |||
@media only screen and (max-width: 1200px) { | |||
&:after { | |||
background-image: linear-gradient(to right, rgba(42, 46, 42, 0), rgba(42, 46, 42, 1) 100%); | |||
background: linear-gradient(to right, transparent 0%, #2a2e3a 100%); | |||
} | |||
} | |||
} | |||
@@ -1359,7 +1358,7 @@ a.ui.labels .label:hover { | |||
background: #404552; | |||
} | |||
border-color: rgba(187, 187, 187, .24); | |||
border-color: rgba(255, 255, 255, .15); | |||
} | |||
.footer { |