slitaz-forge diff arm/style-tiny.css @ rev 592
arm/rpi: add Raspbian dual boot
author | Pascal Bellard <pascal.bellard@slitaz.org> |
---|---|
date | Thu Feb 19 16:13:06 2015 +0100 (2015-02-19) |
parents | |
children |
line diff
1.1 --- /dev/null Thu Jan 01 00:00:00 1970 +0000 1.2 +++ b/arm/style-tiny.css Thu Feb 19 16:13:06 2015 +0100 1.3 @@ -0,0 +1,103 @@ 1.4 +/* Tiny/Mobile screens CSS style for SliTaz */ 1.5 + 1.6 +@media (max-width: 620px) { 1.7 + 1.8 + body { font: 100% sans-serif, vernada, arial; } 1.9 + #header, #logo { display: none !important; } 1.10 + .mobile { display: block !important; } 1.11 + .mobile span { display: inline !important; } 1.12 + 1.13 + body { 1.14 + width: auto; 1.15 + margin: 0; 1.16 + padding: 0; 1.17 + } 1.18 + img, table, td, blockquote, code, pre, textarea, input, iframe, 1.19 + object, embed, video { 1.20 + max-width: 100%; 1.21 + } 1.22 + 1.23 + /* Keep images ratio */ 1.24 + img { 1.25 + height: auto; 1.26 + -webkit-box-sizing: border-box; 1.27 + -moz-box-sizing: border-box; 1.28 + box-sizing: border-box; 1.29 + } 1.30 + textarea, table, td, th, code, pre, samp { 1.31 + word-wrap: break-word; 1.32 + -webkit-hyphens: auto; 1.33 + -moz-hyphens: auto; 1.34 + hyphens: auto; 1.35 + } 1.36 + code, pre, samp { white-space: pre-wrap; } 1.37 + 1.38 + /* Navigation */ 1.39 + 1.40 + nav { 1.41 + min-height: 0; 1.42 + max-height: 0; 1.43 + font-size: 116%; 1.44 + padding: 0; 1.45 + text-align: left; 1.46 + color: #222; 1.47 + border-bottom: 1px solid #afafaf; 1.48 + margin-bottom: 20px; 1.49 + top: 0; 1.50 + display: block; 1.51 + } 1.52 + 1.53 + nav:before { 1.54 + content: "Menu \25BC"; 1.55 + display: block; 1.56 + padding: .8em; 1.57 + background: #333; 1.58 + color: #fff; 1.59 + border-bottom: 4px solid #afafaf; 1.60 + background: #222 url(images/logo.png) no-repeat right; 1.61 + } 1.62 + nav ul { 1.63 + max-height: 0; 1.64 + overflow: hidden; 1.65 + margin: 0; padding: 0; 1.66 + list-style: none; 1.67 + } 1.68 + nav a { 1.69 + display: block; 1.70 + padding: 0.8em; 1.71 + background: #4A7377; 1.72 + color: #fff; 1.73 + text-decoration: none; 1.74 + background-color: #000; 1.75 + opacity: 0.95; 1.76 + border-radius: 0px; 1.77 + } 1.78 + nav:not(:focus) ul { 1.79 + max-height: 0; 1.80 + } 1.81 + nav:focus ul { 1.82 + margin-bottom: 25em; 1.83 + } 1.84 + nav ul { 1.85 + /* number of <li> x5 */ 1.86 + max-height: 25em; 1.87 + -webkit-transition: max-height .4s; 1.88 + transition: max-height .4s; 1.89 + } 1.90 + 1.91 + /* Content */ 1.92 + 1.93 + #content { 1.94 + margin: 50px 0 0 0; 1.95 + padding: 2%; 1.96 + text-align: justify; 1.97 + max-width: auto; 1.98 + } 1.99 + pre, .box-dl, .box-rpi { overflow: hidden; } 1.100 +} 1.101 + 1.102 +@media (max-device-width:768px) and (orientation: landscape) { 1.103 + html { 1.104 + -webkit-text-size-adjust: 100%; 1.105 + } 1.106 +}