improve Tab styling
This commit is contained in:
parent
591d1ac1fa
commit
114d6a04f4
@ -2,12 +2,15 @@
|
|||||||
float: left;
|
float: left;
|
||||||
|
|
||||||
& .label {
|
& .label {
|
||||||
background: #eee;
|
cursor: pointer;
|
||||||
padding: 10px;
|
background: #F2F2F2;
|
||||||
border: 1px solid #ccc;
|
border: 1px solid #D8D8D8;
|
||||||
margin-left: -1px;
|
color: #646464;
|
||||||
position: relative;
|
position: relative;
|
||||||
left: 1px;
|
height: 55px;
|
||||||
|
padding: 14px 25px;
|
||||||
|
margin-right: 5px;
|
||||||
|
z-index: 0;
|
||||||
}
|
}
|
||||||
|
|
||||||
& .input[type=radio] {
|
& .input[type=radio] {
|
||||||
@ -16,23 +19,25 @@
|
|||||||
}
|
}
|
||||||
|
|
||||||
& .content {
|
& .content {
|
||||||
|
border-color: #D8D8D8;
|
||||||
|
border-style: solid;
|
||||||
|
border-width: 1px 0 0 0;
|
||||||
|
background: #FAFAFA;
|
||||||
position: absolute;
|
position: absolute;
|
||||||
top: 28px;
|
display: none;
|
||||||
|
top: 54px;
|
||||||
left: 0;
|
left: 0;
|
||||||
background: white;
|
|
||||||
right: 0;
|
right: 0;
|
||||||
bottom: 0;
|
bottom: 0;
|
||||||
padding: 20px;
|
|
||||||
border: 1px solid #ccc;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
& .input[type=radio]:checked ~ .label {
|
& .input[type=radio]:checked ~ .label {
|
||||||
background: white;
|
background: #FAFAFA;
|
||||||
border-bottom: 1px solid white;
|
border-bottom: 1px solid #FAFAFA;
|
||||||
z-index: 2;
|
z-index: 1;
|
||||||
}
|
}
|
||||||
|
|
||||||
& .input[type=radio]:checked ~ .label ~ .content {
|
& .input[type=radio]:checked ~ .label ~ .content {
|
||||||
z-index: 1;
|
display: block;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
@ -2,5 +2,4 @@
|
|||||||
position: relative;
|
position: relative;
|
||||||
min-height: 200px; /* This part sucks */
|
min-height: 200px; /* This part sucks */
|
||||||
clear: both;
|
clear: both;
|
||||||
margin: 25px 0;
|
|
||||||
}
|
}
|
||||||
|
Loading…
Reference in New Issue
Block a user