Mercurial > dottes

comparison web/css/dottes.css @ 630:eb1392fd0b76

Find changesets by keywords (author, files, the commit message), revision number or hash, or revset expression.
More CSS tweaks.
author Jim Hague <jim.hague@acm.org>
date Sun, 06 Nov 2016 21:42:04 +0000
parents 37a9b621b5a6
children 7a64aeaaa294
comparison
equal deleted inserted replaced
629:37a9b621b5a6 630:eb1392fd0b76
5 body { 5 body {
6 background-color: #9900cc; 6 background-color: #9900cc;
7 background-image: url('../img/purple-fabric-background.jpg'); 7 background-image: url('../img/purple-fabric-background.jpg');
8 color: #000000; 8 color: #000000;
9 height: auto; 9 height: auto;
10 padding-top: 0px;
11 padding-bottom: 20px;
12 font-family: 'Open Sans', sans-serif; 10 font-family: 'Open Sans', sans-serif;
13 } 11 }
14 12
15 h1 { 13 h1 {
16 background: white; 14 background: white;
19 } 17 }
20 18
21 p 19 p
22 { 20 {
23 background: white; 21 background: white;
24 margin: 10px;
25 } 22 }
26 23
27 div.banner 24 div.banner
28 { 25 {
29 background-color: black; 26 background-color: black;
39 -webkit-border-bottom-right-radius: 5px; 36 -webkit-border-bottom-right-radius: 5px;
40 -moz-border-radius-bottomleft: 5px; 37 -moz-border-radius-bottomleft: 5px;
41 -moz-border-radius-bottomright: 5px; 38 -moz-border-radius-bottomright: 5px;
42 border-bottom-left-radius: 5px; 39 border-bottom-left-radius: 5px;
43 border-bottom-right-radius: 5px; 40 border-bottom-right-radius: 5px;
44
45 margin-top: 5px;
46 margin-bottom: 5px;
47 } 41 }
48 42
49 div.banner img 43 div.banner img
50 { 44 {
51 width: 100%; 45 width: 100%;
85 border-bottom-right-radius: 5px; 79 border-bottom-right-radius: 5px;
86 80
87 margin-top: 5px; 81 margin-top: 5px;
88 margin-bottom: 5px; 82 margin-bottom: 5px;
89 83
84 padding: 10px;
85 }
86
87 div.dottes-body h1
88 {
89 text-align: left;
90 }
91
92 div.dottes-transpose-container
93 {
94 border: 2px solid grey;
95 }
96
97 div.dottes-transpose-instrument
98 {
99 display: table;
100 width: 100%;
101 }
102
103 div.dottes-transpose-instrument-item
104 {
105 display: table-cell;
106 vertical-align: middle;
90 padding: 5px; 107 padding: 5px;
91 } 108 }
92 109
93 div.dottes-body h1
94 {
95 margin: 10px;
96 text-align: left;
97 }
98
99 div.dottes-transpose-container
100 {
101 border: 2px solid grey;
102 margin: 5px;
103 }
104
105 div.dottes-transpose-instrument
106 {
107 display: table;
108 width: 100%;
109 }
110
111 div.dottes-transpose-instrument-item
112 {
113 display: table-cell;
114 vertical-align: middle;
115 }
116
117 div.dottes-transpose-instrument-name 110 div.dottes-transpose-instrument-name
118 { 111 {
119 width: 15%; 112 width: 15%;
120 } 113 }
121 114
129 width: 30%; 122 width: 30%;
130 } 123 }
131 124
132 div.dottes-tune-display 125 div.dottes-tune-display
133 { 126 {
134 margin: 10px;
135 } 127 }
136 128
137 div.dottes-tune-header 129 div.dottes-tune-header
138 { 130 {
139 display: table; 131 display: table;
223 } 215 }
224 216
225 div.dottes-tune-footer-links 217 div.dottes-tune-footer-links
226 { 218 {
227 display: table-cell; 219 display: table-cell;
220 vertical-align: middle;
228 } 221 }
229 222
230 div.dottes-tune-footer-play 223 div.dottes-tune-footer-play
231 { 224 {
232 display: table-cell; 225 display: table-cell;
233 text-align: center; 226 text-align: center;
227 vertical-align: middle;
234 } 228 }
235 229
236 div.dottes-tune-footer-last 230 div.dottes-tune-footer-last
237 { 231 {
238 display: table-cell; 232 display: table-cell;
239 text-align: right; 233 text-align: right;
234 vertical-align: middle;
240 } 235 }
241 236
242 div.dottes-tune-learner 237 div.dottes-tune-learner
243 { 238 {
244 display: table; 239 display: table;
317 312
318 ul.tune-data-list 313 ul.tune-data-list
319 { 314 {
320 list-style-type: none; 315 list-style-type: none;
321 margin: 0px; 316 margin: 0px;
317 padding: 0px;
322 } 318 }
323 319
324 ul.tune-data-list li 320 ul.tune-data-list li
325 { 321 {
326 display: inline; 322 display: inline;