_nav.css
1.76 KB
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
.order-nav {
$liWidth: 120px;
$liHeight: 40px;
$liBorderColor: #e6e6e6;
$fontColor: #616161;
height: calc($liHeight + 2px);
line-height: calc($liHeight + 2px);
border-bottom: 1px solid $liBorderColor;
z-index: 0;
.tabs {
display: inline-block;
height: $liHeight;
li {
width: $liWidth;
height: $liHeight;
line-height: $liHeight;
float: left;
font-size: 16px;
text-align: center;
background-color: #fff;
color: #666;
cursor: pointer;
position: relative;
&.active {
border: 1px solid $liBorderColor;
height: calc($liHeight + 1px);
line-height: calc($liHeight - 2px);
top: 1px;
border-bottom: none;
color: #1b1b1b;
font-weight: bold;
z-index: 3;
}
}
}
.search-bar {
$height: 30px;
$buttonWidth: 67px;
height: calc($liHeight);
float: right;
position: relative;
font-size: 12px;
.search-ctrl {
height: $height;
position: absolute;
top: 50%;
margin-top: -calc($height/2);
}
input {
width: 170px;
padding: 0 5px;
position: absolute;
right: $buttonWidth;
border: 1px solid $liBorderColor;
border-right: none;
color: $fontColor;
}
button {
width: $buttonWidth;
background-color: #3a3a3a;
color: #fff;
border: none;
right: 0;
cursor: pointer;
}
}
}