slitaz-forge view arm/style.css @ rev 483

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