Mercurial > hg > mgallery
annotate basic.css @ 203:3798ba80a255
Cosmetics.
author | Matti Hamalainen <ccr@tnsp.org> |
---|---|
date | Tue, 20 Mar 2018 11:12:06 +0200 |
parents | 7b08e19f5a0e |
children | 7a9635967cb0 |
rev | line source |
---|---|
0 | 1 body { |
120
d1ed6213f6d2
Various improvements/changes to CSS and usability on mobile devices.
Matti Hamalainen <ccr@tnsp.org>
parents:
118
diff
changeset
|
2 color: white; |
0 | 3 background: #121; |
4 font-family: Verdana, Arial, helvetica, sans-serif; | |
120
d1ed6213f6d2
Various improvements/changes to CSS and usability on mobile devices.
Matti Hamalainen <ccr@tnsp.org>
parents:
118
diff
changeset
|
5 font-size: 12px; |
d1ed6213f6d2
Various improvements/changes to CSS and usability on mobile devices.
Matti Hamalainen <ccr@tnsp.org>
parents:
118
diff
changeset
|
6 margin: 0; |
d1ed6213f6d2
Various improvements/changes to CSS and usability on mobile devices.
Matti Hamalainen <ccr@tnsp.org>
parents:
118
diff
changeset
|
7 padding: 0; |
0 | 8 } |
9 | |
10 a { | |
11 color: white; | |
12 } | |
13 | |
14 a:hover { | |
15 text-decoration: none; | |
16 color: yellow; | |
17 text-shadow: 1px 1px 2px #000; | |
18 } | |
19 | |
20 | |
199
d03fad24f4bc
Make separate containing div elements for gallery and image view page types.
Matti Hamalainen <ccr@tnsp.org>
parents:
198
diff
changeset
|
21 #galleryPage, #imagePage { |
152
606b05c31d5e
Improve mobile experience and also desktop image display, maybe.
Matti Hamalainen <ccr@tnsp.org>
parents:
150
diff
changeset
|
22 padding: 0; |
606b05c31d5e
Improve mobile experience and also desktop image display, maybe.
Matti Hamalainen <ccr@tnsp.org>
parents:
150
diff
changeset
|
23 margin: 0; |
0 | 24 } |
25 | |
150 | 26 |
199
d03fad24f4bc
Make separate containing div elements for gallery and image view page types.
Matti Hamalainen <ccr@tnsp.org>
parents:
198
diff
changeset
|
27 #imagePage { |
d03fad24f4bc
Make separate containing div elements for gallery and image view page types.
Matti Hamalainen <ccr@tnsp.org>
parents:
198
diff
changeset
|
28 } |
d03fad24f4bc
Make separate containing div elements for gallery and image view page types.
Matti Hamalainen <ccr@tnsp.org>
parents:
198
diff
changeset
|
29 |
d03fad24f4bc
Make separate containing div elements for gallery and image view page types.
Matti Hamalainen <ccr@tnsp.org>
parents:
198
diff
changeset
|
30 |
82
e0e5e5197bb8
Refactor for somewhat more mobile-bullshit-friendly style and usage.
Matti Hamalainen <ccr@tnsp.org>
parents:
74
diff
changeset
|
31 h1 { |
123 | 32 font-size: 1.5em; |
0 | 33 font-family: helvetica; |
120
d1ed6213f6d2
Various improvements/changes to CSS and usability on mobile devices.
Matti Hamalainen <ccr@tnsp.org>
parents:
118
diff
changeset
|
34 margin: 0; |
d1ed6213f6d2
Various improvements/changes to CSS and usability on mobile devices.
Matti Hamalainen <ccr@tnsp.org>
parents:
118
diff
changeset
|
35 padding: 0.25em; |
0 | 36 color: white; |
37 text-shadow: 2px 2px 2px #000; | |
120
d1ed6213f6d2
Various improvements/changes to CSS and usability on mobile devices.
Matti Hamalainen <ccr@tnsp.org>
parents:
118
diff
changeset
|
38 background: #787; |
0 | 39 |
120
d1ed6213f6d2
Various improvements/changes to CSS and usability on mobile devices.
Matti Hamalainen <ccr@tnsp.org>
parents:
118
diff
changeset
|
40 border-top-left-radius: 0.25em; |
d1ed6213f6d2
Various improvements/changes to CSS and usability on mobile devices.
Matti Hamalainen <ccr@tnsp.org>
parents:
118
diff
changeset
|
41 border-top-right-radius: 0.25em; |
0 | 42 } |
43 | |
44 | |
120
d1ed6213f6d2
Various improvements/changes to CSS and usability on mobile devices.
Matti Hamalainen <ccr@tnsp.org>
parents:
118
diff
changeset
|
45 #pageInfoHeader { |
d1ed6213f6d2
Various improvements/changes to CSS and usability on mobile devices.
Matti Hamalainen <ccr@tnsp.org>
parents:
118
diff
changeset
|
46 background: #565; |
d1ed6213f6d2
Various improvements/changes to CSS and usability on mobile devices.
Matti Hamalainen <ccr@tnsp.org>
parents:
118
diff
changeset
|
47 margin: 0; |
d1ed6213f6d2
Various improvements/changes to CSS and usability on mobile devices.
Matti Hamalainen <ccr@tnsp.org>
parents:
118
diff
changeset
|
48 padding: 0.25em; |
d1ed6213f6d2
Various improvements/changes to CSS and usability on mobile devices.
Matti Hamalainen <ccr@tnsp.org>
parents:
118
diff
changeset
|
49 |
d1ed6213f6d2
Various improvements/changes to CSS and usability on mobile devices.
Matti Hamalainen <ccr@tnsp.org>
parents:
118
diff
changeset
|
50 border-top-left-radius: 0.5em; |
d1ed6213f6d2
Various improvements/changes to CSS and usability on mobile devices.
Matti Hamalainen <ccr@tnsp.org>
parents:
118
diff
changeset
|
51 border-top-right-radius: 0.5em; |
d1ed6213f6d2
Various improvements/changes to CSS and usability on mobile devices.
Matti Hamalainen <ccr@tnsp.org>
parents:
118
diff
changeset
|
52 box-shadow: 0px -4px 4px black; |
d1ed6213f6d2
Various improvements/changes to CSS and usability on mobile devices.
Matti Hamalainen <ccr@tnsp.org>
parents:
118
diff
changeset
|
53 } |
d1ed6213f6d2
Various improvements/changes to CSS and usability on mobile devices.
Matti Hamalainen <ccr@tnsp.org>
parents:
118
diff
changeset
|
54 |
102
f8e6e0f2471d
Use CSS id instead of generic selector.
Matti Hamalainen <ccr@tnsp.org>
parents:
94
diff
changeset
|
55 #pageInfoFooter { |
152
606b05c31d5e
Improve mobile experience and also desktop image display, maybe.
Matti Hamalainen <ccr@tnsp.org>
parents:
150
diff
changeset
|
56 position: fixed; |
203 | 57 |
152
606b05c31d5e
Improve mobile experience and also desktop image display, maybe.
Matti Hamalainen <ccr@tnsp.org>
parents:
150
diff
changeset
|
58 bottom: 0; |
606b05c31d5e
Improve mobile experience and also desktop image display, maybe.
Matti Hamalainen <ccr@tnsp.org>
parents:
150
diff
changeset
|
59 left: 0; |
606b05c31d5e
Improve mobile experience and also desktop image display, maybe.
Matti Hamalainen <ccr@tnsp.org>
parents:
150
diff
changeset
|
60 right: 0; |
606b05c31d5e
Improve mobile experience and also desktop image display, maybe.
Matti Hamalainen <ccr@tnsp.org>
parents:
150
diff
changeset
|
61 |
120
d1ed6213f6d2
Various improvements/changes to CSS and usability on mobile devices.
Matti Hamalainen <ccr@tnsp.org>
parents:
118
diff
changeset
|
62 background: #565; |
d1ed6213f6d2
Various improvements/changes to CSS and usability on mobile devices.
Matti Hamalainen <ccr@tnsp.org>
parents:
118
diff
changeset
|
63 margin: 0; |
0 | 64 padding: 0.25em; |
65 text-align: right; | |
66 font-size: 0.75em; | |
67 text-shadow: 1px 1px 1px black; | |
120
d1ed6213f6d2
Various improvements/changes to CSS and usability on mobile devices.
Matti Hamalainen <ccr@tnsp.org>
parents:
118
diff
changeset
|
68 |
152
606b05c31d5e
Improve mobile experience and also desktop image display, maybe.
Matti Hamalainen <ccr@tnsp.org>
parents:
150
diff
changeset
|
69 z-index: 12; |
606b05c31d5e
Improve mobile experience and also desktop image display, maybe.
Matti Hamalainen <ccr@tnsp.org>
parents:
150
diff
changeset
|
70 } |
606b05c31d5e
Improve mobile experience and also desktop image display, maybe.
Matti Hamalainen <ccr@tnsp.org>
parents:
150
diff
changeset
|
71 |
606b05c31d5e
Improve mobile experience and also desktop image display, maybe.
Matti Hamalainen <ccr@tnsp.org>
parents:
150
diff
changeset
|
72 |
606b05c31d5e
Improve mobile experience and also desktop image display, maybe.
Matti Hamalainen <ccr@tnsp.org>
parents:
150
diff
changeset
|
73 div.imagePageHeader { |
606b05c31d5e
Improve mobile experience and also desktop image display, maybe.
Matti Hamalainen <ccr@tnsp.org>
parents:
150
diff
changeset
|
74 position: fixed; |
606b05c31d5e
Improve mobile experience and also desktop image display, maybe.
Matti Hamalainen <ccr@tnsp.org>
parents:
150
diff
changeset
|
75 |
606b05c31d5e
Improve mobile experience and also desktop image display, maybe.
Matti Hamalainen <ccr@tnsp.org>
parents:
150
diff
changeset
|
76 z-index: 12; |
606b05c31d5e
Improve mobile experience and also desktop image display, maybe.
Matti Hamalainen <ccr@tnsp.org>
parents:
150
diff
changeset
|
77 |
606b05c31d5e
Improve mobile experience and also desktop image display, maybe.
Matti Hamalainen <ccr@tnsp.org>
parents:
150
diff
changeset
|
78 top: 0; |
606b05c31d5e
Improve mobile experience and also desktop image display, maybe.
Matti Hamalainen <ccr@tnsp.org>
parents:
150
diff
changeset
|
79 left: 0; |
606b05c31d5e
Improve mobile experience and also desktop image display, maybe.
Matti Hamalainen <ccr@tnsp.org>
parents:
150
diff
changeset
|
80 right: 0; |
0 | 81 } |
82 | |
168
ba02d12cb4be
Add "up" navigation button, to go back to the main gallery from image page.
Matti Hamalainen <ccr@tnsp.org>
parents:
156
diff
changeset
|
83 #pageInfoButton, #pageUpNaviButton { |
ba02d12cb4be
Add "up" navigation button, to go back to the main gallery from image page.
Matti Hamalainen <ccr@tnsp.org>
parents:
156
diff
changeset
|
84 display: block; |
ba02d12cb4be
Add "up" navigation button, to go back to the main gallery from image page.
Matti Hamalainen <ccr@tnsp.org>
parents:
156
diff
changeset
|
85 text-decoration: none; |
152
606b05c31d5e
Improve mobile experience and also desktop image display, maybe.
Matti Hamalainen <ccr@tnsp.org>
parents:
150
diff
changeset
|
86 position: fixed; |
606b05c31d5e
Improve mobile experience and also desktop image display, maybe.
Matti Hamalainen <ccr@tnsp.org>
parents:
150
diff
changeset
|
87 top: 0.25em; |
176
d7d773f6b246
Adjust hovering control button positions, size and opacity.
Matti Hamalainen <ccr@tnsp.org>
parents:
168
diff
changeset
|
88 left: 0.15em; |
152
606b05c31d5e
Improve mobile experience and also desktop image display, maybe.
Matti Hamalainen <ccr@tnsp.org>
parents:
150
diff
changeset
|
89 z-index: 30; |
606b05c31d5e
Improve mobile experience and also desktop image display, maybe.
Matti Hamalainen <ccr@tnsp.org>
parents:
150
diff
changeset
|
90 |
176
d7d773f6b246
Adjust hovering control button positions, size and opacity.
Matti Hamalainen <ccr@tnsp.org>
parents:
168
diff
changeset
|
91 text-align: center; |
d7d773f6b246
Adjust hovering control button positions, size and opacity.
Matti Hamalainen <ccr@tnsp.org>
parents:
168
diff
changeset
|
92 width: 1em; |
d7d773f6b246
Adjust hovering control button positions, size and opacity.
Matti Hamalainen <ccr@tnsp.org>
parents:
168
diff
changeset
|
93 height: 1em; |
152
606b05c31d5e
Improve mobile experience and also desktop image display, maybe.
Matti Hamalainen <ccr@tnsp.org>
parents:
150
diff
changeset
|
94 font-size: 1.25em; |
606b05c31d5e
Improve mobile experience and also desktop image display, maybe.
Matti Hamalainen <ccr@tnsp.org>
parents:
150
diff
changeset
|
95 |
606b05c31d5e
Improve mobile experience and also desktop image display, maybe.
Matti Hamalainen <ccr@tnsp.org>
parents:
150
diff
changeset
|
96 background: black; |
606b05c31d5e
Improve mobile experience and also desktop image display, maybe.
Matti Hamalainen <ccr@tnsp.org>
parents:
150
diff
changeset
|
97 color: white; |
606b05c31d5e
Improve mobile experience and also desktop image display, maybe.
Matti Hamalainen <ccr@tnsp.org>
parents:
150
diff
changeset
|
98 |
606b05c31d5e
Improve mobile experience and also desktop image display, maybe.
Matti Hamalainen <ccr@tnsp.org>
parents:
150
diff
changeset
|
99 border: 0.2em solid white; |
606b05c31d5e
Improve mobile experience and also desktop image display, maybe.
Matti Hamalainen <ccr@tnsp.org>
parents:
150
diff
changeset
|
100 border-radius: 0.3em; |
606b05c31d5e
Improve mobile experience and also desktop image display, maybe.
Matti Hamalainen <ccr@tnsp.org>
parents:
150
diff
changeset
|
101 padding: 1em; |
606b05c31d5e
Improve mobile experience and also desktop image display, maybe.
Matti Hamalainen <ccr@tnsp.org>
parents:
150
diff
changeset
|
102 } |
606b05c31d5e
Improve mobile experience and also desktop image display, maybe.
Matti Hamalainen <ccr@tnsp.org>
parents:
150
diff
changeset
|
103 |
168
ba02d12cb4be
Add "up" navigation button, to go back to the main gallery from image page.
Matti Hamalainen <ccr@tnsp.org>
parents:
156
diff
changeset
|
104 #pageInfoButton:hover, #pageUpNaviButton:hover { |
152
606b05c31d5e
Improve mobile experience and also desktop image display, maybe.
Matti Hamalainen <ccr@tnsp.org>
parents:
150
diff
changeset
|
105 background: white; |
606b05c31d5e
Improve mobile experience and also desktop image display, maybe.
Matti Hamalainen <ccr@tnsp.org>
parents:
150
diff
changeset
|
106 color: black; |
606b05c31d5e
Improve mobile experience and also desktop image display, maybe.
Matti Hamalainen <ccr@tnsp.org>
parents:
150
diff
changeset
|
107 } |
0 | 108 |
197 | 109 #pageInfoButton { |
110 top: 4em; | |
111 } | |
112 | |
168
ba02d12cb4be
Add "up" navigation button, to go back to the main gallery from image page.
Matti Hamalainen <ccr@tnsp.org>
parents:
156
diff
changeset
|
113 #pageUpNaviButton { |
197 | 114 top: 0.25em; |
168
ba02d12cb4be
Add "up" navigation button, to go back to the main gallery from image page.
Matti Hamalainen <ccr@tnsp.org>
parents:
156
diff
changeset
|
115 } |
ba02d12cb4be
Add "up" navigation button, to go back to the main gallery from image page.
Matti Hamalainen <ccr@tnsp.org>
parents:
156
diff
changeset
|
116 |
179 | 117 |
0 | 118 /* |
119 * Albums | |
120 */ | |
121 div.albumHeaderText { | |
122 padding: 0.5em; | |
123 font-size: 1.25em; | |
124 } | |
125 | |
20
12916fcdb8b8
Improve the non-tabled mode.
Matti Hamalainen <ccr@tnsp.org>
parents:
18
diff
changeset
|
126 .galleryTable { |
143
be2e9d5e127d
Fix CSS so that use_tables actually works with the default example CSS.
Matti Hamalainen <ccr@tnsp.org>
parents:
139
diff
changeset
|
127 align-items: center; |
be2e9d5e127d
Fix CSS so that use_tables actually works with the default example CSS.
Matti Hamalainen <ccr@tnsp.org>
parents:
139
diff
changeset
|
128 justify-content: center; |
be2e9d5e127d
Fix CSS so that use_tables actually works with the default example CSS.
Matti Hamalainen <ccr@tnsp.org>
parents:
139
diff
changeset
|
129 width: 100%; |
be2e9d5e127d
Fix CSS so that use_tables actually works with the default example CSS.
Matti Hamalainen <ccr@tnsp.org>
parents:
139
diff
changeset
|
130 background: #454; |
156 | 131 margin-bottom: 1em; |
143
be2e9d5e127d
Fix CSS so that use_tables actually works with the default example CSS.
Matti Hamalainen <ccr@tnsp.org>
parents:
139
diff
changeset
|
132 } |
be2e9d5e127d
Fix CSS so that use_tables actually works with the default example CSS.
Matti Hamalainen <ccr@tnsp.org>
parents:
139
diff
changeset
|
133 |
be2e9d5e127d
Fix CSS so that use_tables actually works with the default example CSS.
Matti Hamalainen <ccr@tnsp.org>
parents:
139
diff
changeset
|
134 div.galleryTable { |
104 | 135 display: flex; |
136 flex-wrap: wrap; | |
0 | 137 } |
138 | |
120
d1ed6213f6d2
Various improvements/changes to CSS and usability on mobile devices.
Matti Hamalainen <ccr@tnsp.org>
parents:
118
diff
changeset
|
139 div.galleryEntry { |
42
002c19b4618b
Add minimum width for image cells.
Matti Hamalainen <ccr@tnsp.org>
parents:
40
diff
changeset
|
140 min-width: 145px; |
120
d1ed6213f6d2
Various improvements/changes to CSS and usability on mobile devices.
Matti Hamalainen <ccr@tnsp.org>
parents:
118
diff
changeset
|
141 width: 15em; |
d1ed6213f6d2
Various improvements/changes to CSS and usability on mobile devices.
Matti Hamalainen <ccr@tnsp.org>
parents:
118
diff
changeset
|
142 padding: 1em; |
0 | 143 text-align: center; |
144 } | |
145 | |
120
d1ed6213f6d2
Various improvements/changes to CSS and usability on mobile devices.
Matti Hamalainen <ccr@tnsp.org>
parents:
118
diff
changeset
|
146 div.galleryEntry img { |
d1ed6213f6d2
Various improvements/changes to CSS and usability on mobile devices.
Matti Hamalainen <ccr@tnsp.org>
parents:
118
diff
changeset
|
147 min-width: 145px; |
d1ed6213f6d2
Various improvements/changes to CSS and usability on mobile devices.
Matti Hamalainen <ccr@tnsp.org>
parents:
118
diff
changeset
|
148 width: 100%; |
d1ed6213f6d2
Various improvements/changes to CSS and usability on mobile devices.
Matti Hamalainen <ccr@tnsp.org>
parents:
118
diff
changeset
|
149 } |
d1ed6213f6d2
Various improvements/changes to CSS and usability on mobile devices.
Matti Hamalainen <ccr@tnsp.org>
parents:
118
diff
changeset
|
150 |
20
12916fcdb8b8
Improve the non-tabled mode.
Matti Hamalainen <ccr@tnsp.org>
parents:
18
diff
changeset
|
151 .albumTable { |
120
d1ed6213f6d2
Various improvements/changes to CSS and usability on mobile devices.
Matti Hamalainen <ccr@tnsp.org>
parents:
118
diff
changeset
|
152 border-bottom: 1px solid black; |
0 | 153 } |
154 | |
20
12916fcdb8b8
Improve the non-tabled mode.
Matti Hamalainen <ccr@tnsp.org>
parents:
18
diff
changeset
|
155 .galleryTable a, .galleryTable a:visited { |
0 | 156 text-decoration: none; |
157 color: white; | |
158 outline: 0; | |
159 } | |
160 | |
20
12916fcdb8b8
Improve the non-tabled mode.
Matti Hamalainen <ccr@tnsp.org>
parents:
18
diff
changeset
|
161 .galleryTable a:hover, .galleryTable a:active, .galleryTable a:focus { |
0 | 162 text-shadow: 1px 1px 2px #000; |
163 text-decoration: underline; | |
164 color: #f00; | |
165 } | |
166 | |
143
be2e9d5e127d
Fix CSS so that use_tables actually works with the default example CSS.
Matti Hamalainen <ccr@tnsp.org>
parents:
139
diff
changeset
|
167 div.galleryTable .galleryEntry { |
20
12916fcdb8b8
Improve the non-tabled mode.
Matti Hamalainen <ccr@tnsp.org>
parents:
18
diff
changeset
|
168 display: inline-block; |
12916fcdb8b8
Improve the non-tabled mode.
Matti Hamalainen <ccr@tnsp.org>
parents:
18
diff
changeset
|
169 vertical-align: middle; |
12916fcdb8b8
Improve the non-tabled mode.
Matti Hamalainen <ccr@tnsp.org>
parents:
18
diff
changeset
|
170 } |
0 | 171 |
172 | |
173 /* | |
174 * | |
175 */ | |
203 | 176 #pageImageBox { |
177 top: 0; | |
178 bottom: 0; | |
179 left: 0; | |
180 right: 0; | |
181 } | |
182 | |
183 | |
177
724fac3d21e9
Use .imageBox class selector instead of more specific div.imageBox.
Matti Hamalainen <ccr@tnsp.org>
parents:
176
diff
changeset
|
184 .imageBox { |
0 | 185 text-align: center; |
186 } | |
187 | |
177
724fac3d21e9
Use .imageBox class selector instead of more specific div.imageBox.
Matti Hamalainen <ccr@tnsp.org>
parents:
176
diff
changeset
|
188 .imageBox img, |
150 | 189 div.imageCtrl img { |
0 | 190 border: 0.2em solid black; |
191 border-radius: 0.3em; | |
192 } | |
193 | |
177
724fac3d21e9
Use .imageBox class selector instead of more specific div.imageBox.
Matti Hamalainen <ccr@tnsp.org>
parents:
176
diff
changeset
|
194 .imageBox a:hover img, .imageBox a:active img, .imageBox a:focus img, |
0 | 195 div.imageCtrl a:hover img, div.imageCtrl a:active img, div.imageCtrl a:focus img { |
196 border: 0.2em solid white; | |
197 } | |
198 | |
177
724fac3d21e9
Use .imageBox class selector instead of more specific div.imageBox.
Matti Hamalainen <ccr@tnsp.org>
parents:
176
diff
changeset
|
199 .galleryEntry .imageBox img { |
120
d1ed6213f6d2
Various improvements/changes to CSS and usability on mobile devices.
Matti Hamalainen <ccr@tnsp.org>
parents:
118
diff
changeset
|
200 box-shadow: 2px 2px 4px -2px black; |
82
e0e5e5197bb8
Refactor for somewhat more mobile-bullshit-friendly style and usage.
Matti Hamalainen <ccr@tnsp.org>
parents:
74
diff
changeset
|
201 } |
e0e5e5197bb8
Refactor for somewhat more mobile-bullshit-friendly style and usage.
Matti Hamalainen <ccr@tnsp.org>
parents:
74
diff
changeset
|
202 |
18 | 203 img.albumIcon { |
204 border: 0.2em solid black; | |
21 | 205 border-radius: 0.6em; |
0 | 206 box-shadow: 0px 0px 4px black; |
18 | 207 } |
208 | |
209 a:hover img.albumIcon, a:active img.albumIcon, a:focus img.albumIcon { | |
210 border: 0.2em solid white; | |
0 | 211 } |
212 | |
82
e0e5e5197bb8
Refactor for somewhat more mobile-bullshit-friendly style and usage.
Matti Hamalainen <ccr@tnsp.org>
parents:
74
diff
changeset
|
213 div.imageCtrl { |
120
d1ed6213f6d2
Various improvements/changes to CSS and usability on mobile devices.
Matti Hamalainen <ccr@tnsp.org>
parents:
118
diff
changeset
|
214 position: absolute; |
82
e0e5e5197bb8
Refactor for somewhat more mobile-bullshit-friendly style and usage.
Matti Hamalainen <ccr@tnsp.org>
parents:
74
diff
changeset
|
215 min-width: 150px; |
104 | 216 width: 14%; |
82
e0e5e5197bb8
Refactor for somewhat more mobile-bullshit-friendly style and usage.
Matti Hamalainen <ccr@tnsp.org>
parents:
74
diff
changeset
|
217 top: 0; |
120
d1ed6213f6d2
Various improvements/changes to CSS and usability on mobile devices.
Matti Hamalainen <ccr@tnsp.org>
parents:
118
diff
changeset
|
218 bottom: 0; |
d1ed6213f6d2
Various improvements/changes to CSS and usability on mobile devices.
Matti Hamalainen <ccr@tnsp.org>
parents:
118
diff
changeset
|
219 background: rgba(0,0,0, 0.35); |
82
e0e5e5197bb8
Refactor for somewhat more mobile-bullshit-friendly style and usage.
Matti Hamalainen <ccr@tnsp.org>
parents:
74
diff
changeset
|
220 } |
e0e5e5197bb8
Refactor for somewhat more mobile-bullshit-friendly style and usage.
Matti Hamalainen <ccr@tnsp.org>
parents:
74
diff
changeset
|
221 |
e0e5e5197bb8
Refactor for somewhat more mobile-bullshit-friendly style and usage.
Matti Hamalainen <ccr@tnsp.org>
parents:
74
diff
changeset
|
222 div.imageCtrl.next, div.imageCtrl.nextBtm { |
e0e5e5197bb8
Refactor for somewhat more mobile-bullshit-friendly style and usage.
Matti Hamalainen <ccr@tnsp.org>
parents:
74
diff
changeset
|
223 right: 0; |
e0e5e5197bb8
Refactor for somewhat more mobile-bullshit-friendly style and usage.
Matti Hamalainen <ccr@tnsp.org>
parents:
74
diff
changeset
|
224 } |
e0e5e5197bb8
Refactor for somewhat more mobile-bullshit-friendly style and usage.
Matti Hamalainen <ccr@tnsp.org>
parents:
74
diff
changeset
|
225 |
e0e5e5197bb8
Refactor for somewhat more mobile-bullshit-friendly style and usage.
Matti Hamalainen <ccr@tnsp.org>
parents:
74
diff
changeset
|
226 |
e0e5e5197bb8
Refactor for somewhat more mobile-bullshit-friendly style and usage.
Matti Hamalainen <ccr@tnsp.org>
parents:
74
diff
changeset
|
227 div.imageCtrl.prev, div.imageCtrl.prevBtm { |
e0e5e5197bb8
Refactor for somewhat more mobile-bullshit-friendly style and usage.
Matti Hamalainen <ccr@tnsp.org>
parents:
74
diff
changeset
|
228 left: 0; |
e0e5e5197bb8
Refactor for somewhat more mobile-bullshit-friendly style and usage.
Matti Hamalainen <ccr@tnsp.org>
parents:
74
diff
changeset
|
229 } |
e0e5e5197bb8
Refactor for somewhat more mobile-bullshit-friendly style and usage.
Matti Hamalainen <ccr@tnsp.org>
parents:
74
diff
changeset
|
230 |
e0e5e5197bb8
Refactor for somewhat more mobile-bullshit-friendly style and usage.
Matti Hamalainen <ccr@tnsp.org>
parents:
74
diff
changeset
|
231 |
e0e5e5197bb8
Refactor for somewhat more mobile-bullshit-friendly style and usage.
Matti Hamalainen <ccr@tnsp.org>
parents:
74
diff
changeset
|
232 div.imageCtrl a { |
e0e5e5197bb8
Refactor for somewhat more mobile-bullshit-friendly style and usage.
Matti Hamalainen <ccr@tnsp.org>
parents:
74
diff
changeset
|
233 display: block; |
e0e5e5197bb8
Refactor for somewhat more mobile-bullshit-friendly style and usage.
Matti Hamalainen <ccr@tnsp.org>
parents:
74
diff
changeset
|
234 position: absolute; |
e0e5e5197bb8
Refactor for somewhat more mobile-bullshit-friendly style and usage.
Matti Hamalainen <ccr@tnsp.org>
parents:
74
diff
changeset
|
235 top: 0; |
e0e5e5197bb8
Refactor for somewhat more mobile-bullshit-friendly style and usage.
Matti Hamalainen <ccr@tnsp.org>
parents:
74
diff
changeset
|
236 bottom: 0; |
e0e5e5197bb8
Refactor for somewhat more mobile-bullshit-friendly style and usage.
Matti Hamalainen <ccr@tnsp.org>
parents:
74
diff
changeset
|
237 left: 0; |
e0e5e5197bb8
Refactor for somewhat more mobile-bullshit-friendly style and usage.
Matti Hamalainen <ccr@tnsp.org>
parents:
74
diff
changeset
|
238 right: 0; |
0 | 239 } |
240 | |
82
e0e5e5197bb8
Refactor for somewhat more mobile-bullshit-friendly style and usage.
Matti Hamalainen <ccr@tnsp.org>
parents:
74
diff
changeset
|
241 div.imageCtrl a img { |
e0e5e5197bb8
Refactor for somewhat more mobile-bullshit-friendly style and usage.
Matti Hamalainen <ccr@tnsp.org>
parents:
74
diff
changeset
|
242 position: relative; |
e0e5e5197bb8
Refactor for somewhat more mobile-bullshit-friendly style and usage.
Matti Hamalainen <ccr@tnsp.org>
parents:
74
diff
changeset
|
243 display: block; |
e0e5e5197bb8
Refactor for somewhat more mobile-bullshit-friendly style and usage.
Matti Hamalainen <ccr@tnsp.org>
parents:
74
diff
changeset
|
244 margin: auto; |
e0e5e5197bb8
Refactor for somewhat more mobile-bullshit-friendly style and usage.
Matti Hamalainen <ccr@tnsp.org>
parents:
74
diff
changeset
|
245 } |
e0e5e5197bb8
Refactor for somewhat more mobile-bullshit-friendly style and usage.
Matti Hamalainen <ccr@tnsp.org>
parents:
74
diff
changeset
|
246 |
e0e5e5197bb8
Refactor for somewhat more mobile-bullshit-friendly style and usage.
Matti Hamalainen <ccr@tnsp.org>
parents:
74
diff
changeset
|
247 |
e0e5e5197bb8
Refactor for somewhat more mobile-bullshit-friendly style and usage.
Matti Hamalainen <ccr@tnsp.org>
parents:
74
diff
changeset
|
248 div.imageCtrl.nextBtm, div.imageCtrl.prevBtm { |
e0e5e5197bb8
Refactor for somewhat more mobile-bullshit-friendly style and usage.
Matti Hamalainen <ccr@tnsp.org>
parents:
74
diff
changeset
|
249 z-index: 1; |
e0e5e5197bb8
Refactor for somewhat more mobile-bullshit-friendly style and usage.
Matti Hamalainen <ccr@tnsp.org>
parents:
74
diff
changeset
|
250 } |
e0e5e5197bb8
Refactor for somewhat more mobile-bullshit-friendly style and usage.
Matti Hamalainen <ccr@tnsp.org>
parents:
74
diff
changeset
|
251 |
e0e5e5197bb8
Refactor for somewhat more mobile-bullshit-friendly style and usage.
Matti Hamalainen <ccr@tnsp.org>
parents:
74
diff
changeset
|
252 div.imageCtrl.prev, div.imageCtrl.next { |
e0e5e5197bb8
Refactor for somewhat more mobile-bullshit-friendly style and usage.
Matti Hamalainen <ccr@tnsp.org>
parents:
74
diff
changeset
|
253 opacity: 0; |
e0e5e5197bb8
Refactor for somewhat more mobile-bullshit-friendly style and usage.
Matti Hamalainen <ccr@tnsp.org>
parents:
74
diff
changeset
|
254 transition: opacity 0.15s linear; |
e0e5e5197bb8
Refactor for somewhat more mobile-bullshit-friendly style and usage.
Matti Hamalainen <ccr@tnsp.org>
parents:
74
diff
changeset
|
255 z-index: 10; |
0 | 256 } |
257 | |
82
e0e5e5197bb8
Refactor for somewhat more mobile-bullshit-friendly style and usage.
Matti Hamalainen <ccr@tnsp.org>
parents:
74
diff
changeset
|
258 div.imageCtrl.prev:hover, div.imageCtrl.next:hover { |
e0e5e5197bb8
Refactor for somewhat more mobile-bullshit-friendly style and usage.
Matti Hamalainen <ccr@tnsp.org>
parents:
74
diff
changeset
|
259 opacity: 1; |
0 | 260 } |
261 | |
82
e0e5e5197bb8
Refactor for somewhat more mobile-bullshit-friendly style and usage.
Matti Hamalainen <ccr@tnsp.org>
parents:
74
diff
changeset
|
262 |
180
05fba4ce0b5a
Add #imageImageBox style def.
Matti Hamalainen <ccr@tnsp.org>
parents:
179
diff
changeset
|
263 #imageImageBox { |
05fba4ce0b5a
Add #imageImageBox style def.
Matti Hamalainen <ccr@tnsp.org>
parents:
179
diff
changeset
|
264 } |
05fba4ce0b5a
Add #imageImageBox style def.
Matti Hamalainen <ccr@tnsp.org>
parents:
179
diff
changeset
|
265 |
203 | 266 |
82
e0e5e5197bb8
Refactor for somewhat more mobile-bullshit-friendly style and usage.
Matti Hamalainen <ccr@tnsp.org>
parents:
74
diff
changeset
|
267 #imageImage { |
e0e5e5197bb8
Refactor for somewhat more mobile-bullshit-friendly style and usage.
Matti Hamalainen <ccr@tnsp.org>
parents:
74
diff
changeset
|
268 position: relative; |
e0e5e5197bb8
Refactor for somewhat more mobile-bullshit-friendly style and usage.
Matti Hamalainen <ccr@tnsp.org>
parents:
74
diff
changeset
|
269 z-index: 5; |
e0e5e5197bb8
Refactor for somewhat more mobile-bullshit-friendly style and usage.
Matti Hamalainen <ccr@tnsp.org>
parents:
74
diff
changeset
|
270 } |
e0e5e5197bb8
Refactor for somewhat more mobile-bullshit-friendly style and usage.
Matti Hamalainen <ccr@tnsp.org>
parents:
74
diff
changeset
|
271 |
e0e5e5197bb8
Refactor for somewhat more mobile-bullshit-friendly style and usage.
Matti Hamalainen <ccr@tnsp.org>
parents:
74
diff
changeset
|
272 div.imageCtrl * img { |
e0e5e5197bb8
Refactor for somewhat more mobile-bullshit-friendly style and usage.
Matti Hamalainen <ccr@tnsp.org>
parents:
74
diff
changeset
|
273 position: absolute; |
e0e5e5197bb8
Refactor for somewhat more mobile-bullshit-friendly style and usage.
Matti Hamalainen <ccr@tnsp.org>
parents:
74
diff
changeset
|
274 top: 40%; |
e0e5e5197bb8
Refactor for somewhat more mobile-bullshit-friendly style and usage.
Matti Hamalainen <ccr@tnsp.org>
parents:
74
diff
changeset
|
275 } |
e0e5e5197bb8
Refactor for somewhat more mobile-bullshit-friendly style and usage.
Matti Hamalainen <ccr@tnsp.org>
parents:
74
diff
changeset
|
276 |
e0e5e5197bb8
Refactor for somewhat more mobile-bullshit-friendly style and usage.
Matti Hamalainen <ccr@tnsp.org>
parents:
74
diff
changeset
|
277 |
e0e5e5197bb8
Refactor for somewhat more mobile-bullshit-friendly style and usage.
Matti Hamalainen <ccr@tnsp.org>
parents:
74
diff
changeset
|
278 |
120
d1ed6213f6d2
Various improvements/changes to CSS and usability on mobile devices.
Matti Hamalainen <ccr@tnsp.org>
parents:
118
diff
changeset
|
279 div.albumTitle, div.imageCaption { |
0 | 280 text-align: center; |
281 text-shadow: 1px 1px 2px black; | |
282 padding: 0.5em; | |
283 } | |
284 | |
24 | 285 .galleryEntry div.imageCaption { |
120
d1ed6213f6d2
Various improvements/changes to CSS and usability on mobile devices.
Matti Hamalainen <ccr@tnsp.org>
parents:
118
diff
changeset
|
286 font-size: 1.25em; |
0 | 287 } |
288 | |
198 | 289 #pageImageBox div.imageCaption { |
152
606b05c31d5e
Improve mobile experience and also desktop image display, maybe.
Matti Hamalainen <ccr@tnsp.org>
parents:
150
diff
changeset
|
290 background: #350; |
606b05c31d5e
Improve mobile experience and also desktop image display, maybe.
Matti Hamalainen <ccr@tnsp.org>
parents:
150
diff
changeset
|
291 z-index: 12; |
144
c0c0708bd94d
Make image caption stand out a bit better on the image page.
Matti Hamalainen <ccr@tnsp.org>
parents:
143
diff
changeset
|
292 } |
0 | 293 |
197 | 294 #infoBox { |
152
606b05c31d5e
Improve mobile experience and also desktop image display, maybe.
Matti Hamalainen <ccr@tnsp.org>
parents:
150
diff
changeset
|
295 position: fixed; |
120
d1ed6213f6d2
Various improvements/changes to CSS and usability on mobile devices.
Matti Hamalainen <ccr@tnsp.org>
parents:
118
diff
changeset
|
296 bottom: 0; |
152
606b05c31d5e
Improve mobile experience and also desktop image display, maybe.
Matti Hamalainen <ccr@tnsp.org>
parents:
150
diff
changeset
|
297 left: 0.1em; |
606b05c31d5e
Improve mobile experience and also desktop image display, maybe.
Matti Hamalainen <ccr@tnsp.org>
parents:
150
diff
changeset
|
298 right: 0.1em; |
82
e0e5e5197bb8
Refactor for somewhat more mobile-bullshit-friendly style and usage.
Matti Hamalainen <ccr@tnsp.org>
parents:
74
diff
changeset
|
299 height: auto; |
e0e5e5197bb8
Refactor for somewhat more mobile-bullshit-friendly style and usage.
Matti Hamalainen <ccr@tnsp.org>
parents:
74
diff
changeset
|
300 min-height: 5em; |
e0e5e5197bb8
Refactor for somewhat more mobile-bullshit-friendly style and usage.
Matti Hamalainen <ccr@tnsp.org>
parents:
74
diff
changeset
|
301 background: rgba(0,0,0, 0.5); |
e0e5e5197bb8
Refactor for somewhat more mobile-bullshit-friendly style and usage.
Matti Hamalainen <ccr@tnsp.org>
parents:
74
diff
changeset
|
302 |
0 | 303 text-align: center; |
120
d1ed6213f6d2
Various improvements/changes to CSS and usability on mobile devices.
Matti Hamalainen <ccr@tnsp.org>
parents:
118
diff
changeset
|
304 margin: 0; |
156 | 305 padding-top: 0.5em; |
306 padding-bottom: 2em; | |
0 | 307 border: 0.2em solid white; |
308 border-radius: 0.5em; | |
82
e0e5e5197bb8
Refactor for somewhat more mobile-bullshit-friendly style and usage.
Matti Hamalainen <ccr@tnsp.org>
parents:
74
diff
changeset
|
309 |
e0e5e5197bb8
Refactor for somewhat more mobile-bullshit-friendly style and usage.
Matti Hamalainen <ccr@tnsp.org>
parents:
74
diff
changeset
|
310 opacity: 0; |
152
606b05c31d5e
Improve mobile experience and also desktop image display, maybe.
Matti Hamalainen <ccr@tnsp.org>
parents:
150
diff
changeset
|
311 z-index: 15; |
0 | 312 } |
313 | |
197 | 314 #infoBox:hover { |
82
e0e5e5197bb8
Refactor for somewhat more mobile-bullshit-friendly style and usage.
Matti Hamalainen <ccr@tnsp.org>
parents:
74
diff
changeset
|
315 opacity: 1; |
e0e5e5197bb8
Refactor for somewhat more mobile-bullshit-friendly style and usage.
Matti Hamalainen <ccr@tnsp.org>
parents:
74
diff
changeset
|
316 } |
e0e5e5197bb8
Refactor for somewhat more mobile-bullshit-friendly style and usage.
Matti Hamalainen <ccr@tnsp.org>
parents:
74
diff
changeset
|
317 |
e0e5e5197bb8
Refactor for somewhat more mobile-bullshit-friendly style and usage.
Matti Hamalainen <ccr@tnsp.org>
parents:
74
diff
changeset
|
318 |
94
1e9a6e773627
Improve best quality/"full size" link CSS styling.
Matti Hamalainen <ccr@tnsp.org>
parents:
91
diff
changeset
|
319 #imageLink { |
1e9a6e773627
Improve best quality/"full size" link CSS styling.
Matti Hamalainen <ccr@tnsp.org>
parents:
91
diff
changeset
|
320 position: absolute; |
1e9a6e773627
Improve best quality/"full size" link CSS styling.
Matti Hamalainen <ccr@tnsp.org>
parents:
91
diff
changeset
|
321 left: 0; |
1e9a6e773627
Improve best quality/"full size" link CSS styling.
Matti Hamalainen <ccr@tnsp.org>
parents:
91
diff
changeset
|
322 right: 0; |
1e9a6e773627
Improve best quality/"full size" link CSS styling.
Matti Hamalainen <ccr@tnsp.org>
parents:
91
diff
changeset
|
323 bottom: 0; |
155 | 324 |
94
1e9a6e773627
Improve best quality/"full size" link CSS styling.
Matti Hamalainen <ccr@tnsp.org>
parents:
91
diff
changeset
|
325 background: white; |
1e9a6e773627
Improve best quality/"full size" link CSS styling.
Matti Hamalainen <ccr@tnsp.org>
parents:
91
diff
changeset
|
326 color: black; |
155 | 327 |
94
1e9a6e773627
Improve best quality/"full size" link CSS styling.
Matti Hamalainen <ccr@tnsp.org>
parents:
91
diff
changeset
|
328 text-shadow: none; |
1e9a6e773627
Improve best quality/"full size" link CSS styling.
Matti Hamalainen <ccr@tnsp.org>
parents:
91
diff
changeset
|
329 text-decoration: none; |
1e9a6e773627
Improve best quality/"full size" link CSS styling.
Matti Hamalainen <ccr@tnsp.org>
parents:
91
diff
changeset
|
330 font-size: 1.25em; |
155 | 331 |
152
606b05c31d5e
Improve mobile experience and also desktop image display, maybe.
Matti Hamalainen <ccr@tnsp.org>
parents:
150
diff
changeset
|
332 padding: 0.5em; |
94
1e9a6e773627
Improve best quality/"full size" link CSS styling.
Matti Hamalainen <ccr@tnsp.org>
parents:
91
diff
changeset
|
333 } |
1e9a6e773627
Improve best quality/"full size" link CSS styling.
Matti Hamalainen <ccr@tnsp.org>
parents:
91
diff
changeset
|
334 |
1e9a6e773627
Improve best quality/"full size" link CSS styling.
Matti Hamalainen <ccr@tnsp.org>
parents:
91
diff
changeset
|
335 |
0 | 336 span.infoDateTime { |
337 display: block; | |
338 color: white; | |
339 font-weight: bold; | |
340 text-shadow: 1px 1px 2px black; | |
341 } | |
342 | |
40 | 343 |
0 | 344 /* |
40 | 345 * Navigation controls |
0 | 346 */ |
3
c85f630a4198
Improve bread crumb navigation by making the current album a link as well.
Matti Hamalainen <ccr@tnsp.org>
parents:
0
diff
changeset
|
347 .naviBreadCrumbItem { |
c85f630a4198
Improve bread crumb navigation by making the current album a link as well.
Matti Hamalainen <ccr@tnsp.org>
parents:
0
diff
changeset
|
348 } |
c85f630a4198
Improve bread crumb navigation by making the current album a link as well.
Matti Hamalainen <ccr@tnsp.org>
parents:
0
diff
changeset
|
349 |
c85f630a4198
Improve bread crumb navigation by making the current album a link as well.
Matti Hamalainen <ccr@tnsp.org>
parents:
0
diff
changeset
|
350 .naviBreadCrumbCurr { |
0 | 351 color: red; |
352 } | |
353 | |
3
c85f630a4198
Improve bread crumb navigation by making the current album a link as well.
Matti Hamalainen <ccr@tnsp.org>
parents:
0
diff
changeset
|
354 .naviBreadCrumbSep:before { |
0 | 355 content: " → "; |
356 color: #0f0; | |
357 font-weight: bold; | |
358 font-size: 1.5em; | |
359 } | |
360 | |
118
6739c52e110c
Change naviBreadCrumbs to CSS id instead of class.
Matti Hamalainen <ccr@tnsp.org>
parents:
116
diff
changeset
|
361 #naviBreadCrumbs { |
0 | 362 text-shadow: 1px 1px 1px black; |
363 padding: 0.5em; | |
364 padding-top: 0; | |
120
d1ed6213f6d2
Various improvements/changes to CSS and usability on mobile devices.
Matti Hamalainen <ccr@tnsp.org>
parents:
118
diff
changeset
|
365 font-size: 1.25em; |
0 | 366 |
120
d1ed6213f6d2
Various improvements/changes to CSS and usability on mobile devices.
Matti Hamalainen <ccr@tnsp.org>
parents:
118
diff
changeset
|
367 background: #676; |
d1ed6213f6d2
Various improvements/changes to CSS and usability on mobile devices.
Matti Hamalainen <ccr@tnsp.org>
parents:
118
diff
changeset
|
368 box-shadow: 0px 2px 4px -4px black; |
0 | 369 } |
44
bc9da3b71888
Implement imgur-style image zoom/de-zoom via image click/enter.
Matti Hamalainen <ccr@tnsp.org>
parents:
42
diff
changeset
|
370 |
bc9da3b71888
Implement imgur-style image zoom/de-zoom via image click/enter.
Matti Hamalainen <ccr@tnsp.org>
parents:
42
diff
changeset
|
371 |
48
5a2dd41ff7ad
Initial implementation of language selector.
Matti Hamalainen <ccr@tnsp.org>
parents:
44
diff
changeset
|
372 #languages { |
5a2dd41ff7ad
Initial implementation of language selector.
Matti Hamalainen <ccr@tnsp.org>
parents:
44
diff
changeset
|
373 position: absolute; |
135 | 374 right: 0.5em; |
375 top: 0.5em; | |
73
5e98fe999fac
Adjust language selector CSS.
Matti Hamalainen <ccr@tnsp.org>
parents:
72
diff
changeset
|
376 background: black; |
5e98fe999fac
Adjust language selector CSS.
Matti Hamalainen <ccr@tnsp.org>
parents:
72
diff
changeset
|
377 border-radius: 0.35em; |
135 | 378 padding: 0.5em; |
48
5a2dd41ff7ad
Initial implementation of language selector.
Matti Hamalainen <ccr@tnsp.org>
parents:
44
diff
changeset
|
379 } |
116
7964b6a27f8a
Adjust language selection box.
Matti Hamalainen <ccr@tnsp.org>
parents:
110
diff
changeset
|
380 |
7964b6a27f8a
Adjust language selection box.
Matti Hamalainen <ccr@tnsp.org>
parents:
110
diff
changeset
|
381 #languages a { |
120
d1ed6213f6d2
Various improvements/changes to CSS and usability on mobile devices.
Matti Hamalainen <ccr@tnsp.org>
parents:
118
diff
changeset
|
382 display: inline-block; |
116
7964b6a27f8a
Adjust language selection box.
Matti Hamalainen <ccr@tnsp.org>
parents:
110
diff
changeset
|
383 padding: 0.5em; |
120
d1ed6213f6d2
Various improvements/changes to CSS and usability on mobile devices.
Matti Hamalainen <ccr@tnsp.org>
parents:
118
diff
changeset
|
384 margin: 0.1em; |
d1ed6213f6d2
Various improvements/changes to CSS and usability on mobile devices.
Matti Hamalainen <ccr@tnsp.org>
parents:
118
diff
changeset
|
385 background: white; |
d1ed6213f6d2
Various improvements/changes to CSS and usability on mobile devices.
Matti Hamalainen <ccr@tnsp.org>
parents:
118
diff
changeset
|
386 color: black; |
d1ed6213f6d2
Various improvements/changes to CSS and usability on mobile devices.
Matti Hamalainen <ccr@tnsp.org>
parents:
118
diff
changeset
|
387 border-radius: 0.35em; |
152
606b05c31d5e
Improve mobile experience and also desktop image display, maybe.
Matti Hamalainen <ccr@tnsp.org>
parents:
150
diff
changeset
|
388 text-align: center; |
116
7964b6a27f8a
Adjust language selection box.
Matti Hamalainen <ccr@tnsp.org>
parents:
110
diff
changeset
|
389 } |
120
d1ed6213f6d2
Various improvements/changes to CSS and usability on mobile devices.
Matti Hamalainen <ccr@tnsp.org>
parents:
118
diff
changeset
|
390 |
d1ed6213f6d2
Various improvements/changes to CSS and usability on mobile devices.
Matti Hamalainen <ccr@tnsp.org>
parents:
118
diff
changeset
|
391 |
d1ed6213f6d2
Various improvements/changes to CSS and usability on mobile devices.
Matti Hamalainen <ccr@tnsp.org>
parents:
118
diff
changeset
|
392 @media screen and (min-resolution: 150dpi) { |
203 | 393 |
120
d1ed6213f6d2
Various improvements/changes to CSS and usability on mobile devices.
Matti Hamalainen <ccr@tnsp.org>
parents:
118
diff
changeset
|
394 div.albumTitle, div.imageCaption { |
d1ed6213f6d2
Various improvements/changes to CSS and usability on mobile devices.
Matti Hamalainen <ccr@tnsp.org>
parents:
118
diff
changeset
|
395 font-size: 1.5em; |
d1ed6213f6d2
Various improvements/changes to CSS and usability on mobile devices.
Matti Hamalainen <ccr@tnsp.org>
parents:
118
diff
changeset
|
396 } |
d1ed6213f6d2
Various improvements/changes to CSS and usability on mobile devices.
Matti Hamalainen <ccr@tnsp.org>
parents:
118
diff
changeset
|
397 |
139
c7e8f8b9dd8d
Oops, forgot to rename "contents" to "pageContents" here ..
Matti Hamalainen <ccr@tnsp.org>
parents:
138
diff
changeset
|
398 #pageContents { |
120
d1ed6213f6d2
Various improvements/changes to CSS and usability on mobile devices.
Matti Hamalainen <ccr@tnsp.org>
parents:
118
diff
changeset
|
399 padding: 0; |
d1ed6213f6d2
Various improvements/changes to CSS and usability on mobile devices.
Matti Hamalainen <ccr@tnsp.org>
parents:
118
diff
changeset
|
400 margin: 0; |
d1ed6213f6d2
Various improvements/changes to CSS and usability on mobile devices.
Matti Hamalainen <ccr@tnsp.org>
parents:
118
diff
changeset
|
401 } |
d1ed6213f6d2
Various improvements/changes to CSS and usability on mobile devices.
Matti Hamalainen <ccr@tnsp.org>
parents:
118
diff
changeset
|
402 |
d1ed6213f6d2
Various improvements/changes to CSS and usability on mobile devices.
Matti Hamalainen <ccr@tnsp.org>
parents:
118
diff
changeset
|
403 #languages { |
d1ed6213f6d2
Various improvements/changes to CSS and usability on mobile devices.
Matti Hamalainen <ccr@tnsp.org>
parents:
118
diff
changeset
|
404 position: relative; |
152
606b05c31d5e
Improve mobile experience and also desktop image display, maybe.
Matti Hamalainen <ccr@tnsp.org>
parents:
150
diff
changeset
|
405 top: 0; |
606b05c31d5e
Improve mobile experience and also desktop image display, maybe.
Matti Hamalainen <ccr@tnsp.org>
parents:
150
diff
changeset
|
406 right: 0; |
606b05c31d5e
Improve mobile experience and also desktop image display, maybe.
Matti Hamalainen <ccr@tnsp.org>
parents:
150
diff
changeset
|
407 left: 0; |
606b05c31d5e
Improve mobile experience and also desktop image display, maybe.
Matti Hamalainen <ccr@tnsp.org>
parents:
150
diff
changeset
|
408 text-align: right; |
120
d1ed6213f6d2
Various improvements/changes to CSS and usability on mobile devices.
Matti Hamalainen <ccr@tnsp.org>
parents:
118
diff
changeset
|
409 } |
d1ed6213f6d2
Various improvements/changes to CSS and usability on mobile devices.
Matti Hamalainen <ccr@tnsp.org>
parents:
118
diff
changeset
|
410 |
d1ed6213f6d2
Various improvements/changes to CSS and usability on mobile devices.
Matti Hamalainen <ccr@tnsp.org>
parents:
118
diff
changeset
|
411 #languages a { |
d1ed6213f6d2
Various improvements/changes to CSS and usability on mobile devices.
Matti Hamalainen <ccr@tnsp.org>
parents:
118
diff
changeset
|
412 width: 5em; |
d1ed6213f6d2
Various improvements/changes to CSS and usability on mobile devices.
Matti Hamalainen <ccr@tnsp.org>
parents:
118
diff
changeset
|
413 padding: 1em; |
d1ed6213f6d2
Various improvements/changes to CSS and usability on mobile devices.
Matti Hamalainen <ccr@tnsp.org>
parents:
118
diff
changeset
|
414 } |
d1ed6213f6d2
Various improvements/changes to CSS and usability on mobile devices.
Matti Hamalainen <ccr@tnsp.org>
parents:
118
diff
changeset
|
415 |
d1ed6213f6d2
Various improvements/changes to CSS and usability on mobile devices.
Matti Hamalainen <ccr@tnsp.org>
parents:
118
diff
changeset
|
416 #naviBreadCrumbs { |
d1ed6213f6d2
Various improvements/changes to CSS and usability on mobile devices.
Matti Hamalainen <ccr@tnsp.org>
parents:
118
diff
changeset
|
417 font-size: 1.6em; |
d1ed6213f6d2
Various improvements/changes to CSS and usability on mobile devices.
Matti Hamalainen <ccr@tnsp.org>
parents:
118
diff
changeset
|
418 } |
d1ed6213f6d2
Various improvements/changes to CSS and usability on mobile devices.
Matti Hamalainen <ccr@tnsp.org>
parents:
118
diff
changeset
|
419 |
123 | 420 h1 { |
120
d1ed6213f6d2
Various improvements/changes to CSS and usability on mobile devices.
Matti Hamalainen <ccr@tnsp.org>
parents:
118
diff
changeset
|
421 font-size: 1.25em; |
d1ed6213f6d2
Various improvements/changes to CSS and usability on mobile devices.
Matti Hamalainen <ccr@tnsp.org>
parents:
118
diff
changeset
|
422 } |
152
606b05c31d5e
Improve mobile experience and also desktop image display, maybe.
Matti Hamalainen <ccr@tnsp.org>
parents:
150
diff
changeset
|
423 |
606b05c31d5e
Improve mobile experience and also desktop image display, maybe.
Matti Hamalainen <ccr@tnsp.org>
parents:
150
diff
changeset
|
424 #pageInfoFooter { |
606b05c31d5e
Improve mobile experience and also desktop image display, maybe.
Matti Hamalainen <ccr@tnsp.org>
parents:
150
diff
changeset
|
425 display: none; |
606b05c31d5e
Improve mobile experience and also desktop image display, maybe.
Matti Hamalainen <ccr@tnsp.org>
parents:
150
diff
changeset
|
426 } |
606b05c31d5e
Improve mobile experience and also desktop image display, maybe.
Matti Hamalainen <ccr@tnsp.org>
parents:
150
diff
changeset
|
427 |
168
ba02d12cb4be
Add "up" navigation button, to go back to the main gallery from image page.
Matti Hamalainen <ccr@tnsp.org>
parents:
156
diff
changeset
|
428 #pageInfoButton, #pageUpNaviButton { |
152
606b05c31d5e
Improve mobile experience and also desktop image display, maybe.
Matti Hamalainen <ccr@tnsp.org>
parents:
150
diff
changeset
|
429 font-size: 1.5em; |
168
ba02d12cb4be
Add "up" navigation button, to go back to the main gallery from image page.
Matti Hamalainen <ccr@tnsp.org>
parents:
156
diff
changeset
|
430 top: auto; |
ba02d12cb4be
Add "up" navigation button, to go back to the main gallery from image page.
Matti Hamalainen <ccr@tnsp.org>
parents:
156
diff
changeset
|
431 left: auto; |
ba02d12cb4be
Add "up" navigation button, to go back to the main gallery from image page.
Matti Hamalainen <ccr@tnsp.org>
parents:
156
diff
changeset
|
432 bottom: 0.5em; |
ba02d12cb4be
Add "up" navigation button, to go back to the main gallery from image page.
Matti Hamalainen <ccr@tnsp.org>
parents:
156
diff
changeset
|
433 } |
ba02d12cb4be
Add "up" navigation button, to go back to the main gallery from image page.
Matti Hamalainen <ccr@tnsp.org>
parents:
156
diff
changeset
|
434 |
ba02d12cb4be
Add "up" navigation button, to go back to the main gallery from image page.
Matti Hamalainen <ccr@tnsp.org>
parents:
156
diff
changeset
|
435 #pageInfoButton { |
ba02d12cb4be
Add "up" navigation button, to go back to the main gallery from image page.
Matti Hamalainen <ccr@tnsp.org>
parents:
156
diff
changeset
|
436 right: 0.5em; |
ba02d12cb4be
Add "up" navigation button, to go back to the main gallery from image page.
Matti Hamalainen <ccr@tnsp.org>
parents:
156
diff
changeset
|
437 } |
ba02d12cb4be
Add "up" navigation button, to go back to the main gallery from image page.
Matti Hamalainen <ccr@tnsp.org>
parents:
156
diff
changeset
|
438 |
ba02d12cb4be
Add "up" navigation button, to go back to the main gallery from image page.
Matti Hamalainen <ccr@tnsp.org>
parents:
156
diff
changeset
|
439 #pageUpNaviButton { |
176
d7d773f6b246
Adjust hovering control button positions, size and opacity.
Matti Hamalainen <ccr@tnsp.org>
parents:
168
diff
changeset
|
440 right: 4.5em; |
152
606b05c31d5e
Improve mobile experience and also desktop image display, maybe.
Matti Hamalainen <ccr@tnsp.org>
parents:
150
diff
changeset
|
441 } |
120
d1ed6213f6d2
Various improvements/changes to CSS and usability on mobile devices.
Matti Hamalainen <ccr@tnsp.org>
parents:
118
diff
changeset
|
442 } |
d1ed6213f6d2
Various improvements/changes to CSS and usability on mobile devices.
Matti Hamalainen <ccr@tnsp.org>
parents:
118
diff
changeset
|
443 |
d1ed6213f6d2
Various improvements/changes to CSS and usability on mobile devices.
Matti Hamalainen <ccr@tnsp.org>
parents:
118
diff
changeset
|
444 |
d1ed6213f6d2
Various improvements/changes to CSS and usability on mobile devices.
Matti Hamalainen <ccr@tnsp.org>
parents:
118
diff
changeset
|
445 @media screen and (min-resolution: 150dpi) and (orientation: landscape) { |
d1ed6213f6d2
Various improvements/changes to CSS and usability on mobile devices.
Matti Hamalainen <ccr@tnsp.org>
parents:
118
diff
changeset
|
446 body { |
d1ed6213f6d2
Various improvements/changes to CSS and usability on mobile devices.
Matti Hamalainen <ccr@tnsp.org>
parents:
118
diff
changeset
|
447 font-size: 18px; |
d1ed6213f6d2
Various improvements/changes to CSS and usability on mobile devices.
Matti Hamalainen <ccr@tnsp.org>
parents:
118
diff
changeset
|
448 } |
d1ed6213f6d2
Various improvements/changes to CSS and usability on mobile devices.
Matti Hamalainen <ccr@tnsp.org>
parents:
118
diff
changeset
|
449 } |
d1ed6213f6d2
Various improvements/changes to CSS and usability on mobile devices.
Matti Hamalainen <ccr@tnsp.org>
parents:
118
diff
changeset
|
450 |
d1ed6213f6d2
Various improvements/changes to CSS and usability on mobile devices.
Matti Hamalainen <ccr@tnsp.org>
parents:
118
diff
changeset
|
451 |
d1ed6213f6d2
Various improvements/changes to CSS and usability on mobile devices.
Matti Hamalainen <ccr@tnsp.org>
parents:
118
diff
changeset
|
452 @media screen and (min-resolution: 150dpi) and (orientation: portrait) { |
d1ed6213f6d2
Various improvements/changes to CSS and usability on mobile devices.
Matti Hamalainen <ccr@tnsp.org>
parents:
118
diff
changeset
|
453 body { |
d1ed6213f6d2
Various improvements/changes to CSS and usability on mobile devices.
Matti Hamalainen <ccr@tnsp.org>
parents:
118
diff
changeset
|
454 font-size: 25px; |
d1ed6213f6d2
Various improvements/changes to CSS and usability on mobile devices.
Matti Hamalainen <ccr@tnsp.org>
parents:
118
diff
changeset
|
455 } |
d1ed6213f6d2
Various improvements/changes to CSS and usability on mobile devices.
Matti Hamalainen <ccr@tnsp.org>
parents:
118
diff
changeset
|
456 |
d1ed6213f6d2
Various improvements/changes to CSS and usability on mobile devices.
Matti Hamalainen <ccr@tnsp.org>
parents:
118
diff
changeset
|
457 div.galleryEntry { |
d1ed6213f6d2
Various improvements/changes to CSS and usability on mobile devices.
Matti Hamalainen <ccr@tnsp.org>
parents:
118
diff
changeset
|
458 width: 40%; |
d1ed6213f6d2
Various improvements/changes to CSS and usability on mobile devices.
Matti Hamalainen <ccr@tnsp.org>
parents:
118
diff
changeset
|
459 } |
152
606b05c31d5e
Improve mobile experience and also desktop image display, maybe.
Matti Hamalainen <ccr@tnsp.org>
parents:
150
diff
changeset
|
460 |
168
ba02d12cb4be
Add "up" navigation button, to go back to the main gallery from image page.
Matti Hamalainen <ccr@tnsp.org>
parents:
156
diff
changeset
|
461 #pageInfoButton, #pageUpNaviButton { |
152
606b05c31d5e
Improve mobile experience and also desktop image display, maybe.
Matti Hamalainen <ccr@tnsp.org>
parents:
150
diff
changeset
|
462 font-size: 2em; |
606b05c31d5e
Improve mobile experience and also desktop image display, maybe.
Matti Hamalainen <ccr@tnsp.org>
parents:
150
diff
changeset
|
463 } |
120
d1ed6213f6d2
Various improvements/changes to CSS and usability on mobile devices.
Matti Hamalainen <ccr@tnsp.org>
parents:
118
diff
changeset
|
464 } |