slitaz-forge annotate pkgs/pkgs.css @ rev 605

mirror, pkgs: synchronize current changes
author Aleksej Bobylev <al.bobylev@gmail.com>
date Mon Nov 30 01:03:59 2015 +0200 (2015-11-30)
parents d50b1e11ce39
children 401b2efda7ed
rev   line source
al@605 1 body {
al@605 2 background: #FBFBFB;
al@605 3 /* url(/lib/bg.png) */
al@605 4 /* word-wrap: break-word; */
al@605 5 }
al@605 6 main {
al@605 7 background: #FFF;
al@605 8 border-radius: 6px;
al@605 9 }
al@605 10 .hidden { display: none; }
al@605 11
al@293 12 /* TABLE */
al@293 13 table {
al@293 14 width: 100%;
al@284 15 border: 1px solid #CCC;
al@293 16 -moz-border-radius: 4px; -webkit-border-radius: 4px; border-radius: 4px;
al@293 17 border-spacing: 0;
al@603 18 padding: 0;
al@293 19 }
al@293 20 tr {
al@293 21 margin: 0;
al@284 22 padding: 4px;
al@293 23 }
al@293 24 td {
al@293 25 margin: 0;
al@293 26 padding: 6px;
al@293 27 vertical-align: top;
al@605 28 line-height: 1.3;
al@605 29 }
al@605 30 [dir="rtl"] td {
al@605 31 text-align: right;
al@293 32 }
al@603 33 .first {
al@293 34 width: 1%;
al@293 35 white-space: nowrap;
al@293 36 }
al@605 37 /*.first img:hover {
al@605 38 border: none; border-radius: 4px;
al@605 39 box-shadow: 0 0 1px #888;
al@605 40 }*/
al@603 41 .pre {
al@293 42 padding-left: 2em;
al@293 43 white-space: nowrap;
al@603 44 border-bottom: 1px solid #CCC;
al@293 45 }
al@605 46 .bugs tr:nth-child(even) {
al@605 47 border-bottom: 1px solid #CCC;
al@605 48 }
al@605 49 .list tr:last-child td {
al@605 50 border-bottom: none;
al@605 51 }
al@293 52
al@293 53
al@293 54 /* --- */
al@293 55
al@603 56 .form {
al@293 57 display: table;
al@293 58 table-layout: auto;
al@293 59 width: 100%;
al@293 60 padding: 0;
al@293 61 margin: 0 0 20px 0; /* t r b l */
al@284 62 }
al@284 63
al@293 64 #s_form {
al@293 65 display: table-row;
al@603 66 padding: 6px;
al@293 67 margin: 0;
al@293 68 text-align: center;
al@293 69 }
al@284 70
al@293 71 .small {
al@293 72 white-space: nowrap;
al@293 73 display: table-cell;
al@293 74 width: 10%;
al@293 75 }
al@603 76 select, input, button {
al@603 77 -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box;
al@603 78 height: 2rem;
al@603 79 min-height: 2rem;
al@603 80 font-size: 1rem;
al@284 81 }
al@293 82 span.stretch {
al@293 83 display: table-cell;
al@293 84 width: 100%;
al@603 85 padding: 0;
al@293 86 margin: 0;
al@284 87 }
al@603 88 #query { width: 100%; }
al@293 89
al@603 90 #ticker {
al@603 91 padding: 12px 0;
al@293 92 }
al@603 93 #ticker img {
al@293 94 float: right;
al@603 95 width: 16px;
al@603 96 height: 16px;
al@603 97 }
al@603 98 #ticker progress {
al@603 99 width: 100%;
al@603 100 box-sizing: border-box;
al@293 101 }
al@293 102
al@293 103 .summary {
al@293 104 text-align: center;
al@293 105 font-style: italic;
al@293 106 }
al@603 107 mark {
al@603 108 background: #FF8;
al@605 109 border: solid #EB7;
al@605 110 border-radius: 4px;
al@605 111 border-width: 1px 0;
al@605 112
al@603 113 }
al@603 114 .err::before {
al@603 115 display: inline-block;
al@603 116 vertical-align: middle;
al@603 117 content: url(icons/dialog-error.png);
al@603 118 padding: 1ex;
al@603 119 }
al@603 120
al@603 121
al@603 122
al@603 123
al@603 124 /* Tags cloud (and other "clouds") */
al@603 125
al@603 126 /* tag - Number of elements */
al@603 127 .tagn {
al@603 128 color: #99F;
al@603 129 font-size: 9pt;
al@603 130 padding-left: 5px;
al@603 131 padding-right: 2px;
al@603 132 }
al@603 133 /* tag - Anchor */
al@605 134 .tagn + a {
al@293 135 font-weight: bold;
al@603 136 text-decoration: none;
al@293 137 }
al@605 138
al@605 139 .tag1 { font-size: 10pt; color: #005E80; /*#222222*/ }
al@605 140 .tag2 { font-size: 11pt; color: #4A5C79; /*#383432*/ }
al@605 141 .tag3 { font-size: 12pt; color: #6F5A71; /*#4E433F*/ }
al@605 142 .tag4 { font-size: 13pt; color: #8A5769; /*#644E46*/ }
al@605 143 .tag5 { font-size: 14pt; color: #A05561; /*#7A5749*/ }
al@605 144 .tag6 { font-size: 15pt; color: #B45357; /*#905C48*/ }
al@605 145 .tag7 { font-size: 16pt; color: #C5504C; /*#A75E43*/ }
al@605 146 .tag8 { font-size: 17pt; color: #D54E40; /*#BD5D39*/ }
al@605 147 .tag9 { font-size: 18pt; color: #E44B31; /*#D3582A*/ }
al@605 148 .tag10{ font-size: 19pt; color: #F2491D; /*#E95117*/ }
al@605 149 .tag11{ font-size: 20pt; color: #FF4600; /*#FF4600*/ }
al@603 150
al@603 151
al@603 152
al@293 153
al@293 154 /* SYNTAX HIGHLIGHTER */
al@293 155 .r-comment { color: #888; }
al@293 156 .r-literal { color: #f35a00; }
al@605 157 .r-var { font-weight: 600; color: #070; }
al@293 158 .r-func { color: #4895DD; }
al@293 159 .r-url { text-decoration: none; }
al@293 160 .r-com, .r-scom { color: #4895DD; font-weight: bold; /*background-color: #cde;*/ }
al@293 161 .r-path { text-decoration: underline; color: brown; }
al@293 162 .r-param { font-weight: bold; color: #444; }
al@603 163
al@603 164
al@603 165
al@603 166
al@603 167 /* Actions icons */
al@603 168
al@603 169 .last { text-align: right; white-space: nowrap; }
al@603 170
al@603 171 .dl, .rc, .co {
al@603 172 height: 16px;
al@603 173 background-repeat: no-repeat; background-position: left top; background-size: contain;
al@603 174 display: inline-block; vertical-align: middle;
al@603 175 white-space: nowrap; overflow: hidden; width: 0;
al@603 176 padding-left: 16px;
al@603 177 font-size: smaller;
al@603 178 /*transition: all 0.3s cubic-bezier(.5, .51, .4, 1) 0s;*/
al@605 179 direction: initial;
al@603 180 }
al@603 181 .dl { background-image: url(icons/a-dl.png); }
al@603 182 .rc { background-image: url(icons/a-rc.png); }
al@603 183 .co { background-image: url(icons/a-co.png); }
al@605 184
al@605 185 .avatar::before { content: url(icons16/authors.png); }
al@605 186 .license::before { content: url(icons16/text-x-copying.png); }
al@605 187 .web::before { content: url(icons16/text-html.png); }
al@605 188 .receipt::before { content: url(icons16/text-x-source.png); }
al@605 189 .dep::before { content: url(icons16/x-dia-diagram.png); }
al@605 190 .description::before { content: url(icons16/text-x-readme.png); }
al@605 191 .bugs::before { content: url(icons16/bug-buddy.png); }
al@605 192 .arch::before { content: url(icons16/jockey.png); }
al@605 193 .category::before { content: url(icons16/applications-graphics.png); }
al@605 194 .file::before { content: url(icons16/multipart-encrypted.png); }
al@605 195 .common::before { content: url(icons16/edit-cut.png); }
al@605 196 .pkgi::before { content: url(icons16/package-install.png); }
al@605 197 .pkgr::before { content: url(icons16/package-remove.png); }
al@605 198 .download::before { content: url(icons16/emblem-downloads.png); }
al@605 199 .files-list::before { content: url(icons16/files-list.png); }
al@605 200 .cooker::before { content: url(icons16/text-x-makefile.png); }
al@605 201 .tag::before { content: url(icons16/easytag.png); }
al@605 202 .pkg::before { content: url(icons16/package-x-generic.png); }
al@605 203
al@605 204 .avatar::before, .license::before, .web::before, .receipt::before, .dep::before,
al@605 205 .description::before, .bugs::before, .arch::before, .category::before, .file::before,
al@605 206 .common::before, .pkgi::before, .pkgr::before, .download::before, .files-list::before,
al@605 207 .cooker::before, .tag::before, .pkg::before {
al@605 208 display: inline-block; vertical-align: middle; padding: 0 0.5ex 0 0; }
al@605 209
al@603 210 @media
al@603 211 (-webkit-min-device-pixel-ratio: 1.5),
al@603 212 (min--moz-device-pixel-ratio: 1.5),
al@603 213 (-o-min-device-pixel-ratio: 3/2),
al@603 214 (min-device-pixel-ratio: 1.5),
al@603 215 (min-resolution: 144dpi),
al@603 216 (min-resolution: 1.5dppx)
al@603 217 {
al@603 218 .dl { background-image: url(icons1.5/a-dl.png); }
al@603 219 .rc { background-image: url(icons1.5/a-rc.png); }
al@603 220 .co { background-image: url(icons1.5/a-co.png); }
al@603 221 }
al@603 222 @media
al@603 223 (-webkit-min-device-pixel-ratio: 2),
al@603 224 (min--moz-device-pixel-ratio: 2),
al@603 225 (-o-min-device-pixel-ratio: 2/1),
al@603 226 (min-device-pixel-ratio: 2),
al@603 227 (min-resolution: 192dpi),
al@603 228 (min-resolution: 2dppx)
al@603 229 {
al@603 230 .dl { background-image: url(icons2/a-dl.png); }
al@603 231 .rc { background-image: url(icons2/a-rc.png); }
al@603 232 .co { background-image: url(icons2/a-co.png); }
al@603 233 }
al@603 234 /*td:hover .dl, td:hover .rc, td:hover .co { width: inherit; }*/
al@603 235
al@603 236
al@603 237
al@603 238 /* Levels for tree */
al@603 239
al@603 240 .l1, .l2, .l3, .l4, .l5, .l6, .l7, .l8 { display: table; }
al@603 241 .l1 { margin-left: 3ex; }
al@603 242 .l2 { margin-left: 6ex; }
al@603 243 .l3 { margin-left: 9ex; }
al@603 244 .l4 { margin-left: 12ex; }
al@603 245 .l5 { margin-left: 15ex; }
al@603 246 .l6 { margin-left: 18ex; }
al@603 247 .l7 { margin-left: 21ex; }
al@603 248 .l8 { margin-left: 24ex; }
al@603 249
al@603 250
al@603 251 footer a+a::before { display: inline-block; content: '• '; color: #E81; }
al@603 252
al@605 253
al@605 254
al@605 255
al@603 256 table.info { position: relative; }
al@603 257
al@603 258 .appImg {
al@603 259 display: inline-block;
al@605 260 position: absolute; top: 0.3rem;
al@603 261 width: 64px; height: 64px;
al@603 262 }
al@605 263 [dir="ltr"] .appImg { right: 0.3rem; }
al@605 264 [dir="rtl"] .appImg { left: 0.3rem; }
al@605 265
al@605 266 .info a { display: inline-block; }
al@605 267 .spkg img { width: 16px; height: 16px; padding: 0 0.5ex 0 0;}
al@603 268
al@603 269 .desc {
al@603 270 -moz-border-radius: 4px;
al@603 271 -webkit-border-radius: 4px;
al@603 272 border-radius: 4px;
al@603 273 border: 1px solid #CCC;
al@603 274 padding: 6px;
al@603 275 }
al@603 276
al@603 277 .lang select { vertical-align: middle; }
al@603 278
al@605 279 .center { text-align: center; }
al@605 280
al@605 281
al@605 282 /* Conditional blocks */
al@605 283
al@605 284 /* Show on Small Screens - hide by default */
al@605 285 .sssi, .sssb, .sssc { display: none; }
al@605 286 /* Hide on Small Screens - show by default */
al@605 287 .hssi { display: inline-block; } .hssb { display: block; } .hssc { display: table-cell; }
al@605 288
al@605 289 @media (max-width: 480px) {
al@605 290 .sssi { display: inline-block; } .sssb { display: block; }
al@605 291 .hssi, .hssb, .hssc { display: none; }
al@605 292 }
al@605 293
al@603 294
al@603 295 /* Responsive */
al@603 296
al@603 297 @media (max-width: 480px) {
al@603 298 .form, #s_form, .small, .stretch {
al@603 299 display: block;
al@603 300 width: inherit;
al@603 301 max-width: 100%;
al@603 302 }
al@603 303 .list td:nth-child(2) {
al@603 304 display: inline-block;
al@603 305 clear: both;
al@603 306 }
al@603 307 .list td:nth-child(3) {
al@603 308 display: block;
al@603 309 text-align: right;
al@603 310 width: inherit;
al@603 311 font-size: 11px;
al@603 312 border-top: 1px dotted #CCC;
al@603 313 }
al@603 314 .small, .stretch, form select, input, button {
al@603 315 display: block !important;
al@603 316 -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box;
al@603 317 width: 100%;
al@603 318 height: 2rem;
al@603 319 min-height: 2rem;
al@603 320 margin: 6px 0;
al@603 321 font-size: 1rem;
al@603 322 }
al@603 323 .dl, .rc, .co {
al@603 324 white-space: normal; width: inherit;
al@603 325 }
al@605 326 .pre {
al@605 327 white-space: normal;
al@605 328 }
al@603 329 }
al@603 330
al@603 331 @media (max-device-width: 480px) {
al@603 332 body {
al@603 333 background-color: #DDD;
al@603 334 }
al@605 335 /* Custom look of standard controls */
al@603 336 select, input, button {
al@603 337 -webkit-appearance: none;
al@603 338 display: inline-block;
al@603 339 border: 1px solid #666;
al@603 340 border-radius: 4px;
al@603 341 margin: 12px 0;
al@603 342 padding: 0 6px;
al@603 343 }
al@605 344 /* Add an arrow to the "select" control */
al@603 345 select {
al@603 346 background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAsAAAAGAQMAAAAv/Pa7AAAABlBMVEUAAABJSUn0lwL4AAAAAXRSTlMAQObYZgAAABpJREFUCB1j+P+Aof4Ag30DgzwDAx8DAwsDADiuBA9DaVFpAAAAAElFTkSuQmCC');
al@603 347 background-position: 98% 50%;
al@603 348 background-repeat: no-repeat;
al@603 349 margin: 12px 0;
al@603 350 }
al@603 351 input, button {
al@603 352 margin: 16px 0 8px;
al@603 353 }
al@603 354 /* Remove the dots between links */
al@603 355 footer a+a::before { content: ' '; }
al@603 356 }
al@603 357
al@603 358
al@603 359
al@603 360 *::-moz-selection, *::selection { background-color: #FFA500; color: #000; }