Commit | Line | Data |
---|---|---|
d449ae46 BA |
1 | // Menu: |
2 | ||
9a3c9f79 | 3 | #menuBar |
9a3c9f79 | 4 | background: linear-gradient(#e66465, #9198e5) |
d449ae46 BA |
5 | height: 77px |
6 | margin-bottom: 10px | |
7 | @media screen and (max-width: 767px) | |
8 | height: 100% | |
9 | margin-bottom: 0 | |
9a3c9f79 BA |
10 | @media screen and (min-width: 768px) |
11 | width: 100% | |
9a3c9f79 | 12 | |
d449ae46 BA |
13 | a#homeLink |
14 | margin: 27px 0 0 10px | |
15 | display: inline-block | |
16 | @media screen and (max-width: 767px) | |
17 | margin: 10px 0 0 10px | |
18 | display: block | |
9a3c9f79 | 19 | |
d449ae46 BA |
20 | .info-container |
21 | display: inline-block | |
22 | vertical-align: top | |
23 | padding: 0 | |
24 | box-sizing: border-box | |
25 | a | |
26 | text-decoration: none | |
27 | color: black | |
28 | a, p | |
29 | display: inline-block | |
30 | padding: 3px | |
31 | border: 1px solid black; | |
32 | margin: 25px 0 0 15px | |
33 | @media screen and (max-width: 767px) | |
34 | margin-top: 10px | |
35 | display: block | |
e7cfa68d | 36 | |
d449ae46 BA |
37 | #helpMenu |
38 | @media screen and (min-width: 768px) | |
39 | float: right | |
40 | cursor: pointer | |
41 | @media screen and (max-width: 767px) | |
42 | .info-container | |
43 | p | |
44 | margin-right: 5px | |
186516b8 | 45 | |
d449ae46 BA |
46 | #flagMenu |
47 | @media screen and (min-width: 768px) | |
48 | float: right | |
49 | cursor: pointer | |
50 | margin: 0 15px | |
51 | @media screen and (max-width: 767px) | |
52 | margin-right: 5px | |
53 | img | |
54 | display: inline-block | |
55 | height: 30px | |
56 | margin-top: 25px | |
186516b8 | 57 | |
d449ae46 BA |
58 | label.drawer-toggle |
59 | padding: 0 | |
60 | &::before | |
61 | font-size: 2.5em; | |
62 | max-height: 43px; | |
63 | top: -10px; | |
64 | left: 10px | |
65 | ||
66 | // Game section: | |
18f9c763 | 67 | |
bdb1f12d BA |
68 | .topindicator |
69 | position: relative | |
1d184b4c BA |
70 | border: 1px solid brown |
71 | ||
bdb1f12d BA |
72 | .indic-left |
73 | float: left | |
d449ae46 | 74 | margin: 0 0 var(--universal-margin) 20px |
bdb1f12d BA |
75 | |
76 | .indic-right | |
77 | float: right | |
d449ae46 | 78 | margin: 0 20px var(--universal-margin) 0 |
92342261 | 79 | |
d449ae46 BA |
80 | .my-chatmsg |
81 | color: black | |
92342261 | 82 | |
d449ae46 BA |
83 | .opp-chatmsg |
84 | color: blue | |
92342261 | 85 | |
1d184b4c BA |
86 | .connected |
87 | background-color: green | |
88 | ||
89 | .disconnected | |
90 | background-color: red | |
91 | ||
88af03d2 BA |
92 | .settings-btn |
93 | padding: 6px 7px 0 7px | |
3ed62725 | 94 | |
05290bf9 BA |
95 | .settings-btn-small |
96 | padding: 0 3px | |
97 | ||
bdb1f12d BA |
98 | .white-turn |
99 | background-color: white | |
100 | ||
101 | .black-turn | |
102 | background-color: black | |
103 | ||
d449ae46 BA |
104 | button.playing |
105 | background-color: #ffcc99 | |
106 | &:hover | |
107 | background-color: #ffcc99 | |
108 | ||
109 | button.seek | |
110 | background-color: #cc99ff | |
111 | &:hover | |
112 | background-color: #cc99ff | |
113 | ||
114 | .reserve-count | |
115 | padding-left: 40% | |
116 | ||
117 | .reserve-div | |
118 | margin-bottom: 20px | |
119 | ||
120 | .reserve-row-1 | |
121 | margin-bottom: 15px | |
122 | ||
1d184b4c BA |
123 | div.board |
124 | float: left | |
1d184b4c | 125 | height: 0 |
1d184b4c BA |
126 | display: inline-block |
127 | position: relative | |
128 | ||
c94bc812 BA |
129 | div.board8 |
130 | width: 12.5% | |
131 | padding-bottom: 12.5% | |
132 | ||
133 | div.board10 | |
134 | width: 10% | |
135 | padding-bottom: 10% | |
136 | ||
137 | div.board11 | |
8a196305 | 138 | width: 9.09% |
c94bc812 BA |
139 | padding-bottom: 9.1% |
140 | ||
bdb1f12d BA |
141 | .game |
142 | clear: both | |
80b15df1 BA |
143 | .board |
144 | cursor: pointer | |
1d184b4c BA |
145 | |
146 | #choices | |
80b15df1 BA |
147 | margin: 0 auto 0 auto |
148 | position: relative | |
149 | z-index: 300 | |
150 | overflow-y: inherit | |
d449ae46 | 151 | background-color: rgba(0,0,0,0) |
80b15df1 BA |
152 | img |
153 | cursor: pointer | |
154 | background-color: #e6ee9c | |
9a3c9f79 | 155 | &:hover |
80b15df1 BA |
156 | background-color: skyblue |
157 | .choice-piece | |
158 | width: 90% | |
159 | max-width: 100% | |
160 | height: auto | |
161 | display: block | |
162 | ||
d449ae46 BA |
163 | img.piece |
164 | width: 100% | |
165 | ||
80b15df1 BA |
166 | img.piece, img.mark-square |
167 | max-width: 100% | |
168 | height: auto | |
169 | display: block | |
1d184b4c BA |
170 | |
171 | img.mark-square | |
80b15df1 | 172 | opacity: 0.6 |
1d184b4c BA |
173 | width: 76% |
174 | position: absolute | |
175 | top: 12% | |
176 | left: 12% | |
177 | opacity: .7 | |
178 | ||
d449ae46 BA |
179 | img.ghost |
180 | position: absolute | |
181 | opacity: 0.4 | |
182 | top: 0 | |
183 | ||
130db3ef BA |
184 | .highlight |
185 | background-color: #00cc66 !important | |
186 | ||
187 | .incheck | |
188 | background-color: #cc3300 !important | |
189 | ||
a897b421 | 190 | .light-square.lichess |
80b15df1 | 191 | background-color: #f0d9b5; |
a897b421 | 192 | .dark-square.lichess |
80b15df1 | 193 | background-color: #b58863; |
d449ae46 | 194 | |
a897b421 | 195 | .light-square.chesscom |
80b15df1 | 196 | background-color: #e5e5ca; |
a897b421 | 197 | .dark-square.chesscom |
80b15df1 | 198 | background-color: #6f8f57; |
d449ae46 | 199 | |
a897b421 | 200 | .light-square.chesstempo |
80b15df1 | 201 | background-color: #fdfdfd; |
a897b421 | 202 | .dark-square.chesstempo |
80b15df1 | 203 | background-color: #88a0a8; |
1d184b4c | 204 | |
1d184b4c BA |
205 | .light-square-diag |
206 | background-color: #e5e5ca | |
207 | .dark-square-diag | |
208 | background-color: #6f8f57 | |
209 | ||
d449ae46 BA |
210 | #fen-string |
211 | margin-top: 0 | |
212 | ||
213 | #pgn-game | |
214 | margin-top: 0 | |
215 | margin-bottom: 0 | |
216 | ||
217 | #downloadBtn | |
218 | display: block | |
219 | margin-left: auto | |
220 | margin-right: auto | |
221 | ||
222 | #pgn-div > a | |
223 | display: none | |
224 | ||
225 | #fen-div > p | |
226 | margin-left: 0 | |
227 | margin-right: 0 | |
228 | ||
229 | // Rules section: | |
230 | ||
231 | .warn | |
232 | padding: 3px | |
233 | color: red | |
234 | background-color: lightgrey | |
235 | font-weight: bold | |
236 | ||
237 | figure.diagram-container | |
238 | margin: 15px 0 15px 0 | |
239 | text-align: center | |
240 | width: 100% | |
241 | display: block | |
242 | .diagram | |
243 | display: block | |
244 | width: 40% | |
245 | //min-width: 300px | |
246 | max-width: 800px | |
247 | margin-left: auto | |
248 | margin-right: auto | |
249 | .diag12 | |
250 | float: left | |
251 | margin-left: calc(10% - 20px) | |
252 | margin-right: 40px | |
253 | @media screen and (max-width: 500px) | |
254 | float: none | |
255 | margin: 0 auto 10px auto | |
256 | .diag22 | |
257 | float: left | |
258 | margin-right: calc(10% - 20px) | |
259 | @media screen and (max-width: 500px) | |
260 | float: none | |
261 | margin: 0 auto | |
262 | figcaption | |
263 | display: block | |
264 | clear: both | |
265 | padding-top: 5px | |
266 | ||
267 | .spaceleft | |
268 | margin-left: 30px | |
269 | ||
1d184b4c BA |
270 | p.boxed |
271 | background-color: #FFCC66 | |
272 | padding: 5px | |
273 | ||
274 | .stageDelimiter | |
275 | color: purple | |
276 | ||
277 | // To show (new) pieces, and/or there values... | |
278 | figure.showPieces > img | |
279 | width: 50px | |
280 | ||
281 | figure.showPieces > figcaption | |
282 | color: #6C6C6C | |
283 | ||
1d184b4c BA |
284 | .section-title |
285 | padding: 0 | |
286 | ||
287 | .section-title > h4 | |
288 | padding: 5px | |
289 | ||
1d184b4c BA |
290 | ol, ul:not(.browser-default) |
291 | padding-left: 20px | |
292 | ||
293 | ul:not(.browser-default) | |
294 | margin-top: 5px | |
295 | ||
296 | ul:not(.browser-default) > li | |
297 | list-style-type: disc | |
298 | ||
d449ae46 | 299 | // Problems section: |
da06a6eb | 300 | |
b5fb8e69 | 301 | .newproblem-form input, .newproblem-form textarea |
da06a6eb BA |
302 | width: 100% |
303 | ||
304 | .emphasis | |
305 | font-style: italic | |
306 | ||
307 | #newpbInstructions | |
308 | margin-bottom: var(--universal-margin); | |
309 | ||
310 | .center-btn | |
311 | margin-left: 40% | |
312 | ||
313 | //TODO? | |
314 | .center-inline | |
315 | text-align: center | |
316 | .center-block | |
317 | margin-left: auto | |
318 | margin-right: auto | |
319 | ||
320 | .mistake-newproblem | |
321 | color: #663300 | |
1a788978 BA |
322 | |
323 | #problem-solution | |
324 | display: none | |
b5fb8e69 BA |
325 | |
326 | .topspace | |
327 | margin-top: 15px | |
328 | ||
329 | .problem | |
330 | cursor: pointer | |
331 | margin-bottom: 15px | |
332 | ||
333 | #solution-div h3 | |
334 | cursor: pointer | |
643479f8 BA |
335 | |
336 | .newproblem-form, .newproblem-preview | |
337 | max-width: 90% | |
3a609580 BA |
338 | |
339 | .clickable | |
340 | cursor: pointer | |
341 | ||
3a609580 BA |
342 | .clearer |
343 | clear: both |