mirror of
https://github.com/the-djmaze/snappymail.git
synced 2026-08-30 20:49:20 +03:00
Improve new .tabs CSS from
This commit is contained in:
parent
d7a30cba79
commit
637ed9a478
4 changed files with 56 additions and 67 deletions
|
|
@ -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;
|
||||
}
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue