rev |
line source |
pankso@469
|
1 /* CSS style for SliTaz Network (minimal version) */
|
pankso@469
|
2
|
pankso@469
|
3 html { min-height: 102%; }
|
pankso@469
|
4 body { font: 13px sans-serif, vernada, arial; margin: 0; }
|
pankso@469
|
5 h1 { margin: 0; padding: 8px; color: #fff; font-size: 20px; }
|
pankso@469
|
6 h1 a { color: #fff; text-decoration: none; }
|
pankso@485
|
7 h2 { color: #444; border-bottom: 1px dashed #afafaf;
|
pankso@485
|
8 padding: 4px 0px; margin: 30px 0 0 0; }
|
pankso@472
|
9 h3 { color: #666; font-size: 140%; }
|
pankso@469
|
10 a { text-decoration: underline; color: #215090; }
|
pankso@469
|
11 a:hover { text-decoration: none; }
|
pankso@493
|
12 li { list-style-type: square; }
|
pankso@469
|
13 img { border: 0pt none; vertical-align: middle; }
|
pankso@469
|
14 pre {
|
pankso@469
|
15 overflow: auto;
|
pankso@469
|
16 font-size: 98%;
|
pankso@469
|
17 }
|
pankso@469
|
18
|
pankso@469
|
19 /* Header */
|
pankso@469
|
20
|
pankso@469
|
21 #header {
|
pankso@469
|
22 background: #222;
|
pankso@469
|
23 height: 40px;
|
pankso@469
|
24 }
|
pankso@469
|
25
|
pankso@469
|
26 #header h1 {
|
pankso@469
|
27 margin: 0;
|
pankso@469
|
28 padding: 8px 0 0 42px;
|
pankso@469
|
29 width: 250px;
|
pankso@469
|
30 }
|
pankso@469
|
31
|
pankso@469
|
32 #header h1 a {
|
pankso@469
|
33 color: white;
|
pankso@469
|
34 text-decoration: none;
|
pankso@469
|
35 font-size: 20px;
|
pankso@469
|
36 font-style: italic;
|
pankso@469
|
37 }
|
pankso@469
|
38
|
pankso@469
|
39 #header h1 a:hover {
|
pankso@469
|
40 color: #afafaf;
|
pankso@469
|
41 }
|
pankso@469
|
42
|
pankso@469
|
43 /* Header links */
|
pankso@469
|
44
|
pankso@469
|
45 #network {
|
pankso@469
|
46 float: right;
|
pankso@469
|
47 padding: 14px 5px 0;
|
pankso@469
|
48 font-size: 12px;
|
pankso@469
|
49 }
|
pankso@469
|
50
|
pankso@469
|
51 #network a, #network span {
|
pankso@469
|
52 padding: 0 4px;
|
pankso@469
|
53 color: #fff;
|
pankso@469
|
54 font-weight: bold;
|
pankso@469
|
55 text-decoration: none;
|
pankso@469
|
56 }
|
pankso@469
|
57
|
pankso@469
|
58 #network a:hover, #network span { color: #afafaf; }
|
pankso@469
|
59
|
pankso@469
|
60 /* Logo */
|
pankso@469
|
61
|
pankso@469
|
62 #logo {
|
pankso@469
|
63 background: url(images/logo.png) no-repeat left;
|
pankso@469
|
64 position: absolute;
|
pankso@469
|
65 float: left;
|
pankso@469
|
66 left: 0px;
|
pankso@469
|
67 top: 0px;
|
pankso@469
|
68 width: 40px;
|
pankso@469
|
69 height: 40px;
|
pankso@469
|
70 }
|
pankso@469
|
71
|
pankso@476
|
72 /* Block */
|
pankso@476
|
73
|
pankso@518
|
74 #block {
|
pankso@518
|
75 font-size: 120%;
|
pankso@485
|
76 min-height: 74px;
|
pankso@476
|
77 background: #ccc;
|
pankso@476
|
78 padding: 20px 10% 0px;
|
pankso@476
|
79 text-align: center;
|
pankso@476
|
80 color: #222;
|
pankso@476
|
81 border-bottom: 1px solid #afafaf;
|
pankso@476
|
82 }
|
pankso@476
|
83
|
pankso@518
|
84 nav { margin: 18px 0; }
|
pankso@476
|
85
|
pankso@476
|
86 nav a {
|
pankso@476
|
87 text-decoration: none;
|
pankso@518
|
88 padding: 12px;
|
pankso@476
|
89 color: #fff;
|
pankso@476
|
90 font-weight: bold;
|
pankso@476
|
91 vertical-align: middle;
|
pankso@518
|
92
|
pankso@476
|
93 }
|
pankso@518
|
94 /*nav a:hover { color: #afafaf; }
|
pankso@518
|
95 *
|
pankso@518
|
96 * transition: background-color 3s;
|
pankso@518
|
97 *
|
pankso@518
|
98 * */
|
pankso@476
|
99
|
pankso@518
|
100 .nav1 { background-color: #444; }
|
pankso@518
|
101 .nav1:hover { background-color: #555; }
|
pankso@518
|
102 .nav2 { background-color: #bd4300; }
|
pankso@518
|
103 .nav2:hover { background-color: #CF4800; }
|
pankso@518
|
104 .navpi { background-color: #444; }
|
pankso@518
|
105 .navpi:hover { background-color: #bc1142; }
|
pankso@476
|
106
|
pankso@469
|
107 /* Search */
|
pankso@469
|
108
|
pankso@469
|
109 #search {
|
pankso@469
|
110 position: absolute;
|
pankso@518
|
111 right: 20px; top: 60px;
|
pankso@469
|
112 }
|
pankso@469
|
113
|
pankso@469
|
114 #search input[type="text"] {
|
pankso@469
|
115 width: 200px;
|
pankso@469
|
116 padding: 4px;
|
pankso@469
|
117 margin: 4px 0px;
|
pankso@469
|
118 font-size: 14px;
|
pankso@469
|
119 line-height: 1.2em;
|
pankso@469
|
120 background: #fefefe;
|
pankso@469
|
121 border: 2px solid #afafaf;
|
pankso@469
|
122 -webkit-appearance: none;
|
pankso@469
|
123 -webkit-padding-end: 12px;
|
pankso@469
|
124 -webkit-padding-start: 6px;
|
pankso@469
|
125 }
|
pankso@469
|
126
|
pankso@469
|
127 /* Content */
|
pankso@469
|
128
|
pankso@469
|
129 #content {
|
pankso@469
|
130 margin: 40px auto;
|
pankso@469
|
131 padding: 0 20px;
|
pankso@469
|
132 text-align: justify;
|
pankso@485
|
133 max-width: 760px;
|
pankso@469
|
134 }
|
pankso@469
|
135
|
pankso@469
|
136 .box {
|
pankso@469
|
137 padding: 6px;
|
pankso@469
|
138 margin: 4px 0px;
|
pankso@469
|
139 }
|
pankso@469
|
140
|
pankso@485
|
141 .box-up, .box-share, .box-rpi {
|
pankso@485
|
142 padding: 20px 10px 20px 54px; margin: 20px 0; }
|
pankso@476
|
143
|
pankso@472
|
144 .box-dl {
|
pankso@472
|
145 background: url("images/download.png") no-repeat 12px center;
|
pankso@472
|
146 padding: 16px 16px 16px 54px;
|
pankso@472
|
147 margin: 20px 60px;
|
pankso@472
|
148 }
|
pankso@472
|
149
|
pankso@475
|
150 .box-up {
|
pankso@475
|
151 background: url("images/generic.png") no-repeat 12px center;
|
pankso@475
|
152 }
|
pankso@475
|
153
|
pankso@476
|
154 .box-share {
|
pankso@476
|
155 background: url("images/share.png") no-repeat 12px center;
|
pankso@476
|
156 }
|
pankso@476
|
157
|
pankso@485
|
158 .box-rpi {
|
pankso@485
|
159 background: url("images/raspberrypi.png") no-repeat 12px center;
|
pankso@485
|
160 }
|
pankso@485
|
161
|
pankso@485
|
162 pre, .box, .box-dl, .box-up, .box-share, .box-rpi {
|
pankso@472
|
163 background-color: #efefef;
|
pankso@469
|
164 border: 1px solid #ddd;
|
pankso@469
|
165 }
|
pankso@469
|
166
|
pankso@518
|
167 pre { padding: 10px; }
|
pankso@469
|
168 pre img { margin: 4px 4px 4px 0px; }
|
pankso@469
|
169
|
pankso@469
|
170 .error { color: red; }
|
pankso@469
|
171 .ok { color: green; }
|
pankso@469
|
172 .date { color: #666; font-size: 96%; }
|
pankso@469
|
173
|
pankso@469
|
174 /* Round corner */
|
pankso@469
|
175
|
pankso@485
|
176 pre, img, .box, .box-dl, .box-up, .box-rpi, input[type="text"],
|
pankso@518
|
177 #block_nav, .box-share, nav a {
|
pankso@469
|
178 -moz-border-radius: 4px;
|
pankso@469
|
179 -webkit-border-radius: 4px;
|
pankso@469
|
180 border-radius: 4px;
|
pankso@469
|
181 }
|
pankso@469
|
182
|
pankso@469
|
183 /* Footer */
|
pankso@469
|
184
|
pankso@469
|
185 #footer {
|
pankso@469
|
186 text-align: center;
|
pankso@469
|
187 padding: 20px;
|
pankso@469
|
188 border-top: 1px solid #ddd;
|
pankso@469
|
189 font-size: 90%;
|
pankso@469
|
190 }
|
pankso@469
|
191
|
pankso@469
|
192 #footer a { padding: 0 2px; }
|