Game Time Master
27 |
29 |
48 |
84 |
140 |
147 |
157 |
175 |
176 |
177 |
178 |
181 |
186 |
247 |
257 |
248 | 
Request a game
250 | 
Report incorrect times
251 | 
Changelog
252 | 
GitHub
253 | 
Email
254 | 
Buy me a coffee
255 |
256 | Links
249 |Request a game
250 | Report incorrect times
251 | Changelog
252 | GitHub
253 | Email
254 | Buy me a coffee
255 |
258 |
263 |
264 |
265 | Your local time:
259 |Time
260 |Date
261 |Region/Timezone
262 |
266 |
287 |
288 |
289 |
267 |
273 |
268 | ![]()
269 |
270 |
271 |
272 |
274 |
283 |
286 |
275 |
278 | Local Reset Time:
276 |Time Until Reset:
277 |
279 |
282 | Server Reset Time:
280 |Current Server Time:
281 |
290 |
312 |
313 |
314 |
315 |
317 |
318 |
319 |
320 |
325 |
291 |
297 |
292 | 
293 |
294 |
295 |
296 |
293 |
298 |
307 |
311 |
299 |
302 | Local Reset Time:
300 |Time Until Reset:
301 |
303 |
306 | Server Reset Time:
304 |Current Server Time:
305 |
326 |
327 |
328 |
329 |
330 |
331 |
332 |
334 |
335 |
336 |
337 |
338 |
339 |
340 |
--------------------------------------------------------------------------------
/menu-icons/add.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/cicerakes/Game-Time-Master/a91138a0a430d09e9d103552c7cf2a23e2e54b6c/menu-icons/add.png
--------------------------------------------------------------------------------
/menu-icons/changelog.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/cicerakes/Game-Time-Master/a91138a0a430d09e9d103552c7cf2a23e2e54b6c/menu-icons/changelog.png
--------------------------------------------------------------------------------
/menu-icons/email.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/cicerakes/Game-Time-Master/a91138a0a430d09e9d103552c7cf2a23e2e54b6c/menu-icons/email.png
--------------------------------------------------------------------------------
/menu-icons/export.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/cicerakes/Game-Time-Master/a91138a0a430d09e9d103552c7cf2a23e2e54b6c/menu-icons/export.png
--------------------------------------------------------------------------------
/menu-icons/game.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/cicerakes/Game-Time-Master/a91138a0a430d09e9d103552c7cf2a23e2e54b6c/menu-icons/game.png
--------------------------------------------------------------------------------
/menu-icons/github.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/cicerakes/Game-Time-Master/a91138a0a430d09e9d103552c7cf2a23e2e54b6c/menu-icons/github.png
--------------------------------------------------------------------------------
/menu-icons/import.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/cicerakes/Game-Time-Master/a91138a0a430d09e9d103552c7cf2a23e2e54b6c/menu-icons/import.png
--------------------------------------------------------------------------------
/menu-icons/ko-fi.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/cicerakes/Game-Time-Master/a91138a0a430d09e9d103552c7cf2a23e2e54b6c/menu-icons/ko-fi.png
--------------------------------------------------------------------------------
/menu-icons/report.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/cicerakes/Game-Time-Master/a91138a0a430d09e9d103552c7cf2a23e2e54b6c/menu-icons/report.png
--------------------------------------------------------------------------------
/moment-precise-range.js:
--------------------------------------------------------------------------------
1 | /*
2 | * Copyright (c) 2014 Rob Dawson.
3 | * Licensed under the MIT License.
4 | * For more details see here: https://github.com/codebox/moment-precise-range/blob/master/LICENSE.md.
5 | */
6 | if (typeof moment === "undefined" && typeof require === 'function') {
7 | var moment = require('moment');
8 | }
9 |
10 | (function(moment) {
11 | var STRINGS = {
12 | nodiff: '',
13 | year: 'year',
14 | years: 'years',
15 | month: 'month',
16 | months: 'months',
17 | day: 'day',
18 | days: 'days',
19 | hour: 'hour',
20 | hours: 'hours',
21 | minute: 'minute',
22 | minutes: 'minutes',
23 | second: 'second',
24 | seconds: 'seconds',
25 | delimiter: ' '
26 | };
27 |
28 | function pluralize(num, word) {
29 | return num + ' ' + STRINGS[word + (num === 1 ? '' : 's')];
30 | }
31 |
32 | function buildStringFromValues(yDiff, mDiff, dDiff, hourDiff, minDiff, secDiff){
33 | var result = [];
34 |
35 | if (yDiff) {
36 | result.push(pluralize(yDiff, 'year'));
37 | }
38 | if (mDiff) {
39 | result.push(pluralize(mDiff, 'month'));
40 | }
41 | if (dDiff) {
42 | result.push(pluralize(dDiff, 'day'));
43 | }
44 | if (hourDiff) {
45 | result.push(pluralize(hourDiff, 'hour'));
46 | }
47 | if (minDiff) {
48 | result.push(pluralize(minDiff, 'minute'));
49 | }
50 | if (secDiff) {
51 | result.push(pluralize(secDiff, 'second'));
52 | }
53 |
54 | return result.join(STRINGS.delimiter);
55 | }
56 |
57 | function buildValueObject(yDiff, mDiff, dDiff, hourDiff, minDiff, secDiff, firstDateWasLater) {
58 | return {
59 | "years" : yDiff,
60 | "months" : mDiff,
61 | "days" : dDiff,
62 | "hours" : hourDiff,
63 | "minutes" : minDiff,
64 | "seconds" : secDiff,
65 | "firstDateWasLater" : firstDateWasLater
66 | }
67 | }
68 | moment.fn.preciseDiff = function(d2, returnValueObject) {
69 | return moment.preciseDiff(this, d2, returnValueObject);
70 | };
71 |
72 | moment.preciseDiff = function(d1, d2, returnValueObject) {
73 | var m1 = moment(d1), m2 = moment(d2), firstDateWasLater;
74 |
75 | m1.add(m2.utcOffset() - m1.utcOffset(), 'minutes'); // shift timezone of m1 to m2
76 |
77 | if (m1.isSame(m2)) {
78 | if (returnValueObject) {
79 | return buildValueObject(0, 0, 0, 0, 0, 0, false);
80 | } else {
81 | return STRINGS.nodiff;
82 | }
83 | }
84 | if (m1.isAfter(m2)) {
85 | var tmp = m1;
86 | m1 = m2;
87 | m2 = tmp;
88 | firstDateWasLater = true;
89 | } else {
90 | firstDateWasLater = false;
91 | }
92 |
93 | var yDiff = m2.year() - m1.year();
94 | var mDiff = m2.month() - m1.month();
95 | var dDiff = m2.date() - m1.date();
96 | var hourDiff = m2.hour() - m1.hour();
97 | var minDiff = m2.minute() - m1.minute();
98 | var secDiff = m2.second() - m1.second();
99 |
100 | if (secDiff < 0) {
101 | secDiff = 60 + secDiff;
102 | minDiff--;
103 | }
104 | if (minDiff < 0) {
105 | minDiff = 60 + minDiff;
106 | hourDiff--;
107 | }
108 | if (hourDiff < 0) {
109 | hourDiff = 24 + hourDiff;
110 | dDiff--;
111 | }
112 | if (dDiff < 0) {
113 | var daysInLastFullMonth = moment(m2.year() + '-' + (m2.month() + 1), "YYYY-MM").subtract(1, 'M').daysInMonth();
114 | if (daysInLastFullMonth < m1.date()) { // 31/01 -> 2/03
115 | dDiff = daysInLastFullMonth + dDiff + (m1.date() - daysInLastFullMonth);
116 | } else {
117 | dDiff = daysInLastFullMonth + dDiff;
118 | }
119 | mDiff--;
120 | }
121 | if (mDiff < 0) {
122 | mDiff = 12 + mDiff;
123 | yDiff--;
124 | }
125 |
126 | if (returnValueObject) {
127 | return buildValueObject(yDiff, mDiff, dDiff, hourDiff, minDiff, secDiff, firstDateWasLater);
128 | } else {
129 | return buildStringFromValues(yDiff, mDiff, dDiff, hourDiff, minDiff, secDiff);
130 | }
131 |
132 |
133 | };
134 | }(moment));
135 |
--------------------------------------------------------------------------------
/style.css:
--------------------------------------------------------------------------------
1 | a {
2 | color: #673ab7;
3 | }
4 |
5 | body {
6 | font-family: 'Source Sans Pro', sans-serif;
7 | background: #eee;
8 | color: #111;
9 | font-size: 20px;
10 | }
11 |
12 | h1, h2, h3, h4, h5 {
13 | font-family: 'Open Sans', sans-serif;
14 | font-weight: 600;
15 | }
16 |
17 | header {
18 | background: #7e56c1;
19 | height: 65px;
20 | width: 100%;
21 | position: fixed;
22 | box-shadow: 0 3px 8px 0 rgba(0,0,0,0.3);
23 | z-index: 4;
24 | }
25 |
26 | header h1 {
27 | display: inline;
28 | color: #fff;
29 | font-size: 1.6em;
30 | position: relative;
31 | top: -3px;
32 | }
33 |
34 | input[type='radio'] {
35 | accent-color: #673ab7;
36 | }
37 |
38 | input[type='file'] {
39 | background: none !important;
40 | }
41 |
42 | textarea {
43 | width: 100%;
44 | min-height: 4em;
45 | }
46 |
47 | hr {
48 | border: 1px solid #d2d2d2;
49 | }
50 |
51 | .btn {
52 | border-radius: 4px;
53 | cursor: pointer;
54 | font-weight: bold;
55 | padding: .4em .7em;
56 | text-transform: uppercase;
57 | }
58 |
59 | .btn-low {
60 | background: transparent;
61 | border: none;
62 | color: #673ab7;
63 | }
64 |
65 | .btn-med {
66 | background: transparent;
67 | border: 1px solid #d2d2d2;
68 | color: #673ab7;
69 | }
70 |
71 | .btn-low:hover, .btn-low:focus, .btn-med:hover, .btn-med:focus {
72 | background: rgba(126, 86, 193, .15);
73 | }
74 |
75 | .btn-high {
76 | background-color: #673ab7;
77 | border: none;
78 | color: #fff !important;
79 | }
80 |
81 | .btn-high:hover {
82 | background: #5d34a8;
83 | }
84 |
85 | .menu-btn {
86 | font-size: 2em;
87 | position: relative;
88 | margin: .2em;
89 | background: transparent;
90 | color: #fff;
91 | height: 50px;
92 | width: 50px;
93 | border: none;
94 | z-index: 5;
95 | border-radius: 30px;
96 | outline: none;
97 | cursor: pointer;
98 | transition: .1s;
99 | }
100 |
101 | .menu-btn:hover {
102 | background: rgba(77,43,144,.3);
103 | }
104 |
105 | #outside-menu {
106 | width: 0;
107 | height: 0;
108 | position: fixed;
109 | z-index: 2;
110 | }
111 |
112 | #menu {
113 | width: 15em;
114 | display: block;
115 | position: fixed;
116 | margin-left: -16em;
117 | top: 65px;
118 | bottom: 0;
119 | padding: 0 0 1em;
120 | background: #eee;
121 | box-shadow: 0 0 10px 0 rgba(0,0,0,0.3);
122 | transition: .2s ease-out;
123 | z-index: 3;
124 | overflow-y: auto;
125 | }
126 |
127 | #menu a, #menu p, #menu label, button.menu-item {
128 | background-color: transparent;
129 | color: #111;
130 | text-decoration: none;
131 | display: list-item;
132 | list-style-type: none;
133 | margin: .3em;
134 | padding: .3em;
135 | }
136 |
137 | #menu label {
138 | max-height: 23px;
139 | cursor: pointer;
140 | user-select: none;
141 | }
142 |
143 | #menu p {
144 | padding-bottom: 0;
145 | }
146 |
147 | #menu a, #game-filter-settings label.option-name, button.menu-item {
148 | border-radius: 4px;
149 | }
150 |
151 | #menu a:hover, #game-filter-settings label.option-name:hover, button.menu-item:hover {
152 | background: rgba(0, 0, 0, .04);
153 | }
154 |
155 | button.menu-item {
156 | border: none;
157 | cursor: pointer;
158 | text-align: left;
159 | width: 96%;
160 | }
161 |
162 | .menu-section {
163 | margin: .4em .8em;
164 | border-bottom: 1px solid #d2d2d2;
165 | padding-bottom: .2em;
166 | overflow: hidden;
167 | transition: .2s;
168 | }
169 |
170 | .menu-section.collapsed .game-parent, .menu-section.collapsed .game-parent button, .menu-section.collapsed .game-parent label {
171 | z-index: -1;
172 | }
173 |
174 | .section-heading {
175 | font-size: 14px;
176 | font-weight: normal;
177 | color: #555;
178 | margin: .7em .95em 0;
179 | }
180 |
181 | .section-toggle-arrow {
182 | position: relative;
183 | width: 10px;
184 | height: 10px;
185 | padding: 0;
186 | background: transparent;
187 | border-top: none;
188 | border-left: none;
189 | border-right: 2px solid #aaa;
190 | border-bottom: 2px solid #aaa;
191 | outline: none;
192 | cursor: pointer;
193 | float: right;
194 | transition: .2s;
195 | z-index: 4;
196 | }
197 |
198 | .section-heading + .section-toggle-arrow {
199 | top: -10px;
200 | right: 10px;
201 | background: transparent;
202 | transform: rotate(225deg);
203 | }
204 |
205 | .section-heading + .section-toggle-arrow + label {
206 | position: absolute;
207 | margin: -1.5em 0 0 0 !important;
208 | padding: .5em !important;
209 | width: 85%;
210 | height: 23px;
211 | z-index: 4;
212 | }
213 |
214 | .menu-icon {
215 | height: 1em;
216 | margin-right: .5em;
217 | vertical-align: bottom;
218 | }
219 |
220 | .game-parent {
221 | margin-bottom: 0 !important;
222 | }
223 |
224 | .game-parent .section-toggle-arrow {
225 | top: 5px;
226 | transform: rotate(45deg);
227 | }
228 |
229 | .game-parent .section-toggle-arrow + label {
230 | position: absolute;
231 | margin: -1.65em 0 0 1.1em !important;
232 | width: 73%;
233 | height: 23px;
234 | z-index: 4;
235 | }
236 |
237 | #game-filter-settings input {
238 | margin-right: 5px;
239 | display: none;
240 | }
241 |
242 | #game-filter-settings input + .option-name::before {
243 | content: "";
244 | display: inline-block;
245 | width: 16px;
246 | height: 16px;
247 | background: transparent;
248 | position: relative;
249 | top: 3px;
250 | left: -3px;
251 | margin: 0 !important;
252 | border-radius: 3px;
253 | border: 1px solid #777;
254 | transition: .2s;
255 | cursor: pointer;
256 | }
257 |
258 | #game-filter-settings input + .option-name::after {
259 | border-radius: 3px;
260 | background: transparent;
261 | color: #fff;
262 | display: block;
263 | position: relative;
264 | top: -18px;
265 | font-size: 15px;
266 | transition: .2s;
267 | cursor: pointer;
268 | visibility: hidden;
269 | }
270 |
271 | #game-filter-settings input:checked + .option-name::before, #game-filter-settings input:indeterminate + .option-name::before {
272 | background-color: #7e57c2;
273 | border-color: #7e57c2;
274 | }
275 |
276 | #game-filter-settings input:checked + .option-name::after {
277 | content: "✓";
278 | visibility: visible;
279 | }
280 |
281 | #game-filter-settings input:indeterminate + .option-name::after {
282 | content: "—";
283 | font-weight: bold;
284 | top: -20px;
285 | visibility: visible;
286 | }
287 |
288 | #game-filter-settings[style="height: 36px;"] label:nth-of-type(2) {
289 | margin-top: 1em;
290 | transition-delay: .2s;
291 | }
292 |
293 | #game-filter-settings.collapsed .option-name {
294 | display: none;
295 | }
296 |
297 | .game-children {
298 | width: 90%;
299 | margin-left: 9%;
300 | height: 0;
301 | overflow: hidden;
302 | transition: .2s;
303 | }
304 |
305 | #filter-search-box {
306 | border-radius: 3px;
307 | border: none;
308 | position: relative;
309 | width: 25%;
310 | top: 12px;
311 | right: .6em;
312 | float: right;
313 | outline: none;
314 | padding: .5em;
315 | box-shadow: 0 1px 9px 1px rgba(0,0,0,.3);
316 | transition: .3s;
317 | }
318 |
319 | #filter-search-box:focus {
320 | box-shadow: 0 1px 9px 2px rgba(0,0,0,.5);
321 | }
322 |
323 | #filter-search-open {
324 | float: right;
325 | display: none;
326 | margin: .2em;
327 | }
328 |
329 | #current-local {
330 | margin: auto;
331 | text-align: center;
332 | padding-top: 80px;
333 | }
334 |
335 | #current-local h2 {
336 | margin: 0;
337 | }
338 |
339 | #current-local p {
340 | margin-block-start: .2em;
341 | margin-block-end: .2em;
342 | }
343 |
344 | #current-local-time {
345 | font-size: 2em;
346 | }
347 |
348 | #results-container {
349 | padding-top: 1em;
350 | width:97%;
351 | margin: auto;
352 | display: flex;
353 | flex-wrap: wrap;
354 | justify-content: center;
355 | }
356 |
357 | .game-container {
358 | margin: auto;
359 | padding: 1em 1em 2.7em;
360 | margin: .5em;
361 | width: 25%;
362 | background: #f8f8f8;
363 | box-shadow: 0 2px 7px 0 rgba(0,0,0,0.4);
364 | text-align: initial;
365 | border-radius: 4px;
366 | position: relative;
367 | }
368 |
369 | .game-header, .game-times {
370 | display: table;
371 | width: 100%;
372 | }
373 |
374 | .game-header h3 {
375 | display: table-cell;
376 | font-size: 1.4em;
377 | padding-right: .3em;
378 | }
379 |
380 | .game-header h4 {
381 | display: table-cell;
382 | text-align: right;
383 | color: #555;
384 | font-size: 18px;
385 | }
386 |
387 | .game-icon {
388 | display: table-cell;
389 | width: 40px;
390 | vertical-align: top;
391 | padding-right: 6px;
392 | }
393 |
394 | .game-icon img {
395 | width: 35px;
396 | border-radius: 6px;
397 | }
398 |
399 | .game-times p:nth-of-type(odd) {
400 | font-weight: bold;
401 | margin-block-end: 5px;
402 | }
403 |
404 | .game-times p:nth-of-type(even) {
405 | margin-block-start: 5px;
406 | margin-block-end: 0;
407 | }
408 |
409 | .game-times div {
410 | width: 49%;
411 | display: table-cell;
412 | }
413 |
414 | .local-times {
415 | padding-right: .3em;
416 | }
417 |
418 | .server-times {
419 | padding-left: .3em;
420 | }
421 |
422 | .option-name {
423 | width: 91%;
424 | text-overflow: ellipsis;
425 | overflow: hidden;
426 | white-space: nowrap;
427 | }
428 |
429 | .game-parent span {
430 | width: 85%;
431 | overflow: hidden;
432 | text-overflow: ellipsis;
433 | white-space: nowrap;
434 | display: inline-block;
435 | }
436 |
437 | .game-parent::before {
438 | top: -1px !important;
439 | }
440 |
441 | .game-parent::after {
442 | top: -22px !important;
443 | }
444 |
445 | #game-filter-settings input:indeterminate + .game-parent::after {
446 | top: -24px !important;
447 | }
448 |
449 | #main-settings .option-name {
450 | overflow: visible;
451 | max-height: 46px;
452 | white-space: normal;
453 | }
454 |
455 | #main-settings span {
456 | width: 80%;
457 | display: inline-block;
458 | }
459 |
460 | .switch {
461 | position: relative;
462 | width: 38px;
463 | height: 18px;
464 | padding: 0 !important;
465 | top: 2px;
466 | float: right;
467 | margin: 0 !important;
468 | }
469 |
470 | .switch input {
471 | display: none;
472 | }
473 |
474 | .slider {
475 | width: 100% !important;
476 | position: absolute;
477 | cursor: pointer;
478 | top: 0;
479 | left: 0;
480 | right: 0;
481 | bottom: 0;
482 | background-color: #999;
483 | border-radius: 14px;
484 | transition: .2s;
485 | }
486 |
487 | .slider:before {
488 | position: absolute;
489 | content: "";
490 | height: 24px;
491 | width: 24px;
492 | left: -6px;
493 | bottom: -3px;
494 | background-color: #fff;
495 | border-radius: 50%;
496 | transition: .2s;
497 | box-shadow: 0 0 5px 1px rgba(0,0,0,.2);
498 | }
499 |
500 | input:checked + .slider {
501 | background-color: #4d2b90;
502 | }
503 |
504 | input:checked + .slider:before {
505 | -webkit-transform: translateX(26px);
506 | -ms-transform: translateX(26px);
507 | transform: translateX(26px);
508 | background-color: #b084f4;
509 | }
510 |
511 | .game-container .buttons {
512 | position: absolute;
513 | bottom: 0;
514 | margin-bottom: .6em;
515 | }
516 |
517 | .buttons .btn:not(:first-of-type) {
518 | margin-left: .5em;
519 | }
520 |
521 | .buttons .btn-med {
522 | padding: .2em .5em;
523 | }
524 |
525 | #dialog-holder-bg {
526 | background: rgba(0, 0, 0, .7);
527 | position: fixed;
528 | display: none;
529 | justify-content: center;
530 | align-items: flex-start;
531 | width: 100%;
532 | height: 100%;
533 | z-index: 1;
534 | }
535 |
536 | .dialog {
537 | background: #eee;
538 | border-radius: 4px;
539 | box-shadow: 0 0 20px 10px rgba(0,0,0,0.2);
540 | margin-top: 100px;
541 | max-height: calc(93vh - 65px);
542 | overflow-y: auto;
543 | padding: 1.5em;
544 | }
545 |
546 | .dialog h2 {
547 | font-size: 1.4em;
548 | margin-block-start: 0;
549 | }
550 |
551 | .dialog input[type="text"], .dialog input[type="time"], .dialog select, .dialog textarea {
552 | border: 1px solid #999;
553 | border-radius: 3px;
554 | padding: .2em;
555 | }
556 |
557 | .dialog input[type="text"]:focus, .dialog input[type="time"]:focus, .dialog select:focus, .dialog textarea:focus {
558 | outline: none;
559 | border: 2px solid #673ab7
560 | }
561 |
562 | form label, form span {
563 | display: inline-block;
564 | font-size: 22px;
565 | margin-bottom: .3em;
566 | }
567 |
568 | .form-close-btn {
569 | background-color: transparent;
570 | border: none;
571 | border-radius: 30px;
572 | color: #757575;
573 | cursor: pointer;
574 | float: right;
575 | font-size: 28px;
576 | margin: -.4em -.3em;
577 | padding: .2em;
578 | height: 40px;
579 | width: 40px;
580 | }
581 |
582 | .form-close-btn:hover {
583 | background: rgba(126, 86, 193, .15);
584 | }
585 |
586 | .form-info {
587 | color: #333;
588 | }
589 |
590 | .form-info p:first-child {
591 | margin-block-start: 0;
592 | }
593 |
594 | .form-section {
595 | margin-bottom: 1.5em;
596 | }
597 |
598 | .dialog-btns {
599 | display: flex;
600 | justify-content: flex-end;
601 | flex-wrap: wrap;
602 | }
603 |
604 | .dialog-btns button {
605 | margin: 1em 0 0 1em;
606 | }
607 |
608 | .more-info-btn {
609 | font-size: 16px;
610 | padding: 0.3em 0.5em;
611 | }
612 |
613 | #dupe-notif-table th, #dupe-notif-table td {
614 | padding-right: 1em;
615 | }
616 |
617 | @media (max-width: 1500px) {
618 | .game-container {
619 | width: 30%;
620 | }
621 | }
622 |
623 | @media (max-width: 1200px) {
624 | .game-container {
625 | width: 40%;
626 | }
627 |
628 | #filter-search-box:focus {
629 | width: 40%;
630 | }
631 | }
632 |
633 | @media (max-width: 768px) {
634 | .game-container {
635 | width: 90%;
636 | }
637 |
638 | #filter-search-open {
639 | display: block;
640 | }
641 |
642 | #filter-search-box {
643 | width: 0%;
644 | display: none;
645 | }
646 |
647 | #filter-search-box:focus {
648 | width: 85%;
649 | }
650 |
651 | #filter-search-box:focus + h1 {
652 | display: none;
653 | }
654 |
655 | #filter-search-box:focus + #filter-search-open {
656 | display: none;
657 | }
658 | }
659 |
660 | @media (max-width: 620px) {
661 | #filter-search-box:focus {
662 | width: 78%;
663 | }
664 |
665 | header h1 {
666 | font-size: 1.2em;
667 | top: -6px;
668 | }
669 |
670 | .dialog-btns button {
671 | width: 100%;
672 | margin-left: 0;
673 | }
674 |
675 | form {
676 | margin-top: 63px !important;
677 | width: 100%;
678 | }
679 |
680 | #add-custom-form input[type="text"], #add-custom-form select {
681 | width: 100%;
682 | }
683 | }
684 |
685 | @media (max-width: 360px) {
686 | header h1 {
687 | font-size: 1em;
688 | }
689 |
690 | #filter-search-box:focus {
691 | width: 75%;
692 | }
693 | }
694 |
695 | @media (min-width: 380px) {
696 | .menu-btn {
697 | margin: .2em .6em .2em .2em;
698 | }
699 | }
700 |
701 | .dark {
702 | background: #111;
703 | color: #eee;
704 | }
705 |
706 | .dark ::-webkit-scrollbar, .dark::-webkit-scrollbar {
707 | background: #1d1d1d;
708 | }
709 |
710 | .dark ::-webkit-scrollbar-track, .dark::-webkit-scrollbar-track {
711 | background: #1d1d1d;
712 | }
713 |
714 | .dark ::-webkit-scrollbar-thumb, .dark::-webkit-scrollbar-thumb {
715 | background: rgba(255,255,255,0.07);
716 | }
717 |
718 | .dark ::-webkit-scrollbar-thumb:hover, .dark::-webkit-scrollbar-thumb:hover {
719 | background:rgba(255,255,255,0.1);
720 | }
721 |
722 | .dark ::-webkit-scrollbar-thumb:active, .dark::-webkit-scrollbar-thumb:active {
723 | background:rgba(126,86,193,0.3);
724 | }
725 |
726 | .dark ::-webkit-scrollbar-corner {
727 | background-color:#323232;
728 | }
729 |
730 | .dark a {
731 | color: #9575cd;
732 | }
733 |
734 | .dark header {
735 | background: #322646;
736 | }
737 |
738 | .dark #menu {
739 | background: #242424;
740 | }
741 |
742 | .dark #menu a, .dark #menu p, .dark #menu label, .dark button.menu-item {
743 | color: #eee;
744 | }
745 |
746 | .dark #menu a:hover, .dark #game-filter-settings label.option-name:hover, .dark button.menu-item:hover {
747 | background: rgba(255, 255, 255, .04);
748 | }
749 |
750 | .dark .section-toggle-arrow {
751 | border-color: #686868;
752 | }
753 |
754 | .dark .menu-section {
755 | border-color: #404040;
756 | }
757 |
758 | .dark .section-heading {
759 | color: #aaa;
760 | }
761 |
762 | .dark .game-container {
763 | background: #1d1d1d;
764 | }
765 |
766 | .dark .game-header h4 {
767 | color: #aaa;
768 | }
769 |
770 | .dark .btn {
771 | color: #9575cd;
772 | }
773 |
774 | .dark .btn-med {
775 | border-color: #404040;
776 | }
777 |
778 | .dark .dialog {
779 | background: #242424;
780 | }
781 |
782 | .dark input, .dark select, .dark textarea {
783 | background: #2c2c2c;
784 | color: #eee;
785 | }
786 |
787 | .dark input[type="time"]::-webkit-calendar-picker-indicator{
788 | filter: invert(90%);
789 | }
790 |
791 | .dark .form-info {
792 | color: #ccc;
793 | }
794 |
795 | .dark .red-text {
796 | color: #ff4646;
797 | }
798 |
799 | .dark hr {
800 | border-color: #404040;
801 | }
802 |
803 | .compact .server-times {
804 | display: none;
805 | }
806 |
807 | .compact .local-times {
808 | display: grid;
809 | width: 100%;
810 | grid-template-columns: 50% 50%;
811 | padding-right: 0;
812 | }
813 |
814 | .compact .local-times p {
815 | margin-block-start: .5em;
816 | margin-block-end: .2em;
817 | }
818 |
819 | .compact .local-times p:nth-of-type(even) {
820 | grid-row-start: 2;
821 | margin: 0;
822 | }
823 |
824 | .hide-buttons-hidden .game-container {
825 | padding: 1em;
826 | }
827 |
828 | .hide-buttons-hidden .game-container .buttons {
829 | display: none;
830 | }
831 |
832 | .hidden {
833 | display: none;
834 | }
835 |
836 | .red-text {
837 | color: #d90000;
838 | }
--------------------------------------------------------------------------------