Many hyperlinks are disabled.
Use anonymous login
to enable hyperlinks.
Overview
| Comment: | Changes to the CSS for the default skin so that it works better on mobile. |
|---|---|
| Downloads: | Tarball | ZIP archive | SQL archive |
| Timelines: | family | ancestors | descendants | both | trunk |
| Files: | files | file ages | folders |
| SHA3-256: |
c565732f78b03407839c237351295357 |
| User & Date: | drh 2018-08-31 17:15:29 |
Context
|
2018-08-31
| ||
| 19:03 | In the default skin, adjust the labels in the menu bar depending on screen width. (check-in: 306f8ffd user: drh tags: trunk) | |
| 17:15 | Changes to the CSS for the default skin so that it works better on mobile. (check-in: c565732f user: drh tags: trunk) | |
| 13:05 | Improvements to the skin editor. (check-in: bd2bf81c user: drh tags: trunk) | |
Changes
Changes to skins/default/css.txt.
1 2 3 4 5 6 7 8 9 10 .. 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 .. 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 100 101 102 ... 208 209 210 211 212 213 214 |
body {
margin: 0 auto;
padding: 0px 20px;
background-color: white;
font-family: sans-serif;
font-size:14pt;
-moz-text-size-adjust: none;
-webkit-text-size-adjust: none;
-mx-text-size-adjust: none;
}
................................................................................
hr {
color: #eee;
}
.title {
color: #4183C4;
float:left;
padding-top: 30px;
padding-bottom: 10px;
}
.title h1 {
display:inline;
}
.title h1:after {
content: " / ";
color: #777;
................................................................................
display: inline-block;
margin-right: 1em;
}
.status {
float:right;
font-size:.7em;
padding-top:50px;
}
.mainmenu {
font-size:.8em;
clear:both;
padding:10px;
background:#eaeaea linear-gradient(#fafafa, #eaeaea) repeat-x;
border:1px solid #eaeaea;
border-radius:5px;
overflow-x: auto;
white-space: nowrap;
}
.mainmenu a {
padding: 10px 20px;
text-decoration:none;
color: #777;
border-right:1px solid #eaeaea;
}
.mainmenu a.active,
.mainmenu a:hover {
color: #000;
................................................................................
}
span.submenuctrl {
white-space: nowrap;
}
div.submenu label {
white-space: nowrap;
}
|
< < < < < < > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > |
1 2 3 4 5 6 7 8 9 .. 23 24 25 26 27 28 29 30 31 32 33 34 35 36 .. 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 ... 202 203 204 205 206 207 208 209 210 211 212 213 214 215 216 217 218 219 220 221 222 223 224 225 226 227 228 229 230 231 232 233 234 235 236 237 238 239 240 241 242 243 244 245 |
body {
margin: 0 auto;
background-color: white;
font-family: sans-serif;
font-size:14pt;
-moz-text-size-adjust: none;
-webkit-text-size-adjust: none;
-mx-text-size-adjust: none;
}
................................................................................
hr {
color: #eee;
}
.title {
color: #4183C4;
float:left;
}
.title h1 {
display:inline;
}
.title h1:after {
content: " / ";
color: #777;
................................................................................
display: inline-block;
margin-right: 1em;
}
.status {
float:right;
font-size:.7em;
}
.mainmenu {
font-size:.8em;
clear:both;
background:#eaeaea linear-gradient(#fafafa, #eaeaea) repeat-x;
border:1px solid #eaeaea;
border-radius:5px;
overflow-x: auto;
white-space: nowrap;
}
.mainmenu a {
text-decoration:none;
color: #777;
border-right:1px solid #eaeaea;
}
.mainmenu a.active,
.mainmenu a:hover {
color: #000;
................................................................................
}
span.submenuctrl {
white-space: nowrap;
}
div.submenu label {
white-space: nowrap;
}
@media screen and (max-width: 600px) {
/* Adjustments for mobile */
body {
padding-left: 4px;
padding-right: 4px;
}
.title {
padding-top: 0px;
padding-bottom: 0px;
}
.status {padding-top: 0px;}
.mainmenu a {
padding: 10px 10px;
}
.mainmenu {
padding: 10px;
}
}
@media screen and (min-width: 600px) {
/* Spacing for desktop */
body {
padding-left: 20px;
padding-right: 20px;
}
.title {
padding-top: 30px;
padding-bottom: 10px;
}
.status {padding-top: 50px;}
.mainmenu a {
padding: 10px 20px;
}
.mainmenu {
padding: 10px;
}
}
|