Projekt

Obecné

Profil

Stáhnout (32.2 KB) Statistiky
| Větev: | Tag: | Revize:
1 4bb8ff64 zabran
// Variables
2
@import 'variables';
3 1c3121fe zabran
4 c4f6e57a Adam Mištera
body {
5 c38f4c3a zabran
    background-color: $theme-color-five;
6 83496d8e zabran
    font-family: $font-family-one;
7 d79e27be Marek Lovčí
    padding-top: 5.1rem;
8 34c0b905 rizir01
9 c4f6e57a Adam Mištera
    .head-title h1 {
10 c38f4c3a zabran
        color: $theme-color-one;
11 83496d8e zabran
        font-weight: $font-weight-one;
12 c4f6e57a Adam Mištera
        font-size: 60pt;
13 83496d8e zabran
        //font-weight: bold;
14 c4f6e57a Adam Mištera
        letter-spacing: 3px;
15
    }
16 34c0b905 rizir01
17 c4f6e57a Adam Mištera
    .carousel {
18 d79e27be Marek Lovčí
        margin-top: - 5.1rem;
19
20 c4f6e57a Adam Mištera
        .carousel-inner {
21 d668e889 Adam Mištera
            .museum-logo {
22
                display: flex;
23
                justify-content: center;
24
                position: absolute;
25
                top: 5%;
26
                width: 100%;
27
                z-index: 1;
28 f5ea2a43 Adam Mištera
29
                img {
30
                    width: 7.5rem;
31
                }
32 d668e889 Adam Mištera
            }
33
34
            .social-logo {
35
                text-align: center;
36 f5ea2a43 Adam Mištera
                justify-content: space-around;
37 d668e889 Adam Mištera
                flex-wrap: nowrap;
38
                position: absolute;
39
                top: 25%;
40
                padding-left: 25px;
41
                width: 100%;
42
                z-index: 1;
43 f5ea2a43 Adam Mištera
44
                img {
45
                    width: 2.0625rem;
46
                }
47 d668e889 Adam Mištera
            }
48
49
            .carousel-button {
50
                bottom: 10%;
51
                left: 50%;
52
                transform: translateX(-50%);
53
                position: absolute;
54
                z-index: 1;
55
            }
56
57
            .carousel-item {
58
                height: 100vh;
59
                min-height: 350px;
60
                background: no-repeat center center scroll;
61
                -webkit-background-size: cover;
62
                -moz-background-size: cover;
63
                -o-background-size: cover;
64
                background-size: cover;
65 c4f6e57a Adam Mištera
            }
66
        }
67
68
        .carousel-caption {
69 d668e889 Adam Mištera
            top: 50%;
70
            bottom: auto;
71 8bb7ed68 Marek Lovčí
            padding-left: 1rem;
72
            padding-right: 1rem;
73 d668e889 Adam Mištera
            transform: translateY(-50%);
74 d79e27be Marek Lovčí
            background-color: rgba(239, 218, 179, 0.5);
75 c4f6e57a Adam Mištera
        }
76
    }
77 3b97c440 zabran
78 2b1ca67d zabran
    /////////text types
79
    //většina běžných textů
80
    .text {
81 83496d8e zabran
        font-weight: $font-weight-one;
82 2b1ca67d zabran
        font-size: 8pt;
83
        line-height: 9pt;
84
    }
85
86
    //text inputu a název artefaktů
87 d79e27be Marek Lovčí
    .text2 {
88 83496d8e zabran
        font-weight: $font-weight-two;
89 2b1ca67d zabran
        font-size: 8pt;
90
    }
91
92
    //název "kaplicky" a "choose a few" v categories (tam má jinou barvu)
93 d79e27be Marek Lovčí
    .kaplicky {
94 2b1ca67d zabran
        color: $theme-color-one;
95
        font-size: 11pt;
96 83496d8e zabran
        font-weight: $font-weight-three;
97 2b1ca67d zabran
        letter-spacing: 3pt;
98
    }
99
100
    //autor artefaktu
101 d79e27be Marek Lovčí
    .text-author {
102 83496d8e zabran
        font-weight: $font-weight-one;
103 2b1ca67d zabran
        font-size: 7pt;
104
        color: $theme-color-four;
105
    }
106
107
    //počet lajků
108 d79e27be Marek Lovčí
    .text-number {
109 83496d8e zabran
        font-weight: $font-weight-two;
110 2b1ca67d zabran
        font-size: 5pt;
111
        color: $theme-color-four;
112
    }
113
114
    //notes u metadat, about v about, text levého menu
115 d79e27be Marek Lovčí
    .text-headline {
116 83496d8e zabran
        font-weight: $font-weight-two;
117 2b1ca67d zabran
        font-size: 12pt;
118
        color: $theme-color-four;
119
    }
120
121 79e22cad zabran
    //notes u metadat, about v about, text levého menu
122
    .text-headline-desktop {
123
        font-weight: $font-weight-two;
124
        font-size: 24pt;
125
        color: $theme-color-four;
126
    }
127
128 2b1ca67d zabran
    //název metadata, text pravého menu
129 d79e27be Marek Lovčí
    .text-page {
130 83496d8e zabran
        font-weight: $font-weight-two;
131 2b1ca67d zabran
        font-size: 7pt;
132
    }
133
134 aee27358 zabran
    ////color pro změnu jen barvy
135 d79e27be Marek Lovčí
    .black {
136 aee27358 zabran
        color: $theme-color-five;
137
    }
138 d79e27be Marek Lovčí
139
    .white {
140 aee27358 zabran
        color: $theme-color-one;
141
    }
142 d79e27be Marek Lovčí
143
    .colored {
144 aee27358 zabran
        color: $theme-color-four;
145
    }
146
147 2b1ca67d zabran
148
    ////login
149 d79e27be Marek Lovčí
    .auth {
150
        .card {
151 3b97c440 zabran
            border: none;
152
            text-align: center;
153
            font-size: 8pt;
154
        }
155 3b397a49 zabran
156 d79e27be Marek Lovčí
        .col-form-label {
157 3b397a49 zabran
            text-align: left;
158 c0265e9e zabran
            padding-top: 0;
159
            padding-bottom: 0;
160 3b397a49 zabran
        }
161 d79e27be Marek Lovčí
162
        .form-control {
163 c0265e9e zabran
            padding: 0;
164 3b397a49 zabran
            height: 17pt;
165 c0265e9e zabran
            border-radius: 0;
166 d79e27be Marek Lovčí
167
            &:focus {
168 a37ca88b zabran
                //border-color: $theme-color-one;
169
                border-top-color: $theme-color-five;
170
                border-left-color: $theme-color-five;
171
                border-right-color: $theme-color-five;
172
                border-bottom-color: 0.5pt $theme-color-one;
173 7929abb4 zabran
                -webkit-box-shadow: none;
174
                box-shadow: none;
175
            }
176
        }
177 3b97c440 zabran
    }
178
179 76a0a13d zabran
    //Oprava barev pro Chrom
180
    input:-webkit-autofill {
181 d79e27be Marek Lovčí
        -webkit-box-shadow: 0 0 0 50px $theme-color-five inset !important;
182 76a0a13d zabran
        -webkit-text-fill-color: $theme-color-one;
183 7929abb4 zabran
        background-color: $theme-color-five !important;
184
        //outline: none !important;
185 d79e27be Marek Lovčí
        &:active, &:focus, &:visited, &:hover {
186
            -webkit-box-shadow: 0 0 0 50px $theme-color-five inset !important;
187 76a0a13d zabran
            -webkit-text-fill-color: $theme-color-one;
188 7929abb4 zabran
            background-color: $theme-color-five !important;
189
            //outline: none !important;
190 76a0a13d zabran
        }
191
    }
192
193 5481d358 Adam Mištera
    .card-body {
194 d79e27be Marek Lovčí
        background-color: $theme-color-five;
195
        font-weight: $font-weight-one;
196
        color: $theme-color-four;
197
    }
198
199
    .form-control {
200
        background-color: $theme-color-five;
201
        margin-top: -1px;
202
        border-top-color: $theme-color-five;
203
        border-left-color: $theme-color-five;
204
        border-right-color: $theme-color-five;
205
        border-bottom-color: 0.5pt $theme-color-one;
206
        color: $theme-color-one;
207 3b97c440 zabran
        box-shadow: none;
208
        font-size: 8pt;
209 7929abb4 zabran
        outline: none;
210 4bb8ff64 zabran
211 d79e27be Marek Lovčí
        &:active, &:focus, &:visited, &:hover {
212 7929abb4 zabran
            outline: none;
213 4bb8ff64 zabran
            background-color: $theme-color-five;
214
            margin-top: -1px;
215
            border-top-color: $theme-color-five;
216
            border-left-color: $theme-color-five;
217
            border-right-color: $theme-color-five;
218
            border-bottom-color: 0.5pt $theme-color-one;
219
            color: $theme-color-one;
220
            box-shadow: none;
221
        }
222
223 d79e27be Marek Lovčí
    }
224
225
    .form-control.is-invalid {
226 4bb8ff64 zabran
        box-shadow: none;
227
        border-color: $theme-color-four;
228
        background-image: none;
229 d79e27be Marek Lovčí
230
        &:active, &:focus, &:visited {
231 4bb8ff64 zabran
            box-shadow: none;
232
            border-color: $theme-color-four;
233
        }
234
    }
235 34c0b905 rizir01
236 c4f6e57a Adam Mištera
    .button-square {
237 d668e889 Adam Mištera
        font-size: 8pt;
238 c38f4c3a zabran
        background-color: $theme-color-five;
239
        color: $theme-color-one;
240
        border: 0.5pt solid $theme-color-one;
241 c4f6e57a Adam Mištera
        border-radius: 0;
242 7b6d8d72 Adam Mištera
        padding: 0.4675rem 2.475rem;
243 83496d8e zabran
        font-weight: $font-weight-one;
244 2696c864 Adam Mištera
245 eeaf2e21 zabran
        &:active, &:focus, &:visited, &:hover {
246 2696c864 Adam Mištera
            outline: none;
247
            box-shadow: none;
248 eeaf2e21 zabran
            color: $theme-color-one;
249
        }
250 d79e27be Marek Lovčí
251
        &:hover {
252 eeaf2e21 zabran
            color: $theme-color-four;
253 2696c864 Adam Mištera
        }
254 c4f6e57a Adam Mištera
    }
255 34c0b905 rizir01
256 aee27358 zabran
    //spendlik
257
    .pin-left:before {
258
        content: '';
259
        position: relative;
260
        height: 0.35433rem;
261
        width: 0.35433rem;
262
        background-color: $theme-color-one;
263
        border-radius: 50%;
264
        display: inline-block;
265
        top: -0.35433rem;
266
        left: -0.2rem;
267
    }
268
269
    .pin-left {
270
        border-left: .5pt solid $theme-color-four;
271 8075a85b zabran
        position: fixed;
272
        bottom: 0;
273 aee27358 zabran
        text-align: left;
274 d79e27be Marek Lovčí
275
        // center fixed div
276
        left: 50%;
277
        transform: translateX(-50%);
278
        width: 70%;
279
280
        .text {
281 83496d8e zabran
            margin-left: 0.5rem;
282 d79e27be Marek Lovčí
            margin-bottom: 0.2rem; // looks fugly without margin
283 83496d8e zabran
        }
284 d79e27be Marek Lovčí
285
        p {
286 c0265e9e zabran
            margin-top: 0;
287
            margin-bottom: 0;
288 83496d8e zabran
        }
289 aee27358 zabran
    }
290
291 d79e27be Marek Lovčí
    li {
292 b711d297 zabran
        list-style-type: none;
293
    }
294
295 c4f6e57a Adam Mištera
    .button-image {
296
        background-color: transparent;
297
        border-color: transparent;
298
299
        &:before {
300
            content: "";
301
            width: 100px;
302
            height: 100px;
303
            display: inline-block;
304
            margin-right: 5px;
305
            vertical-align: text-top;
306
            background-color: transparent;
307 d79e27be Marek Lovčí
            background-position: center center;
308
            background-repeat: no-repeat;
309 c4f6e57a Adam Mištera
        }
310
    }
311 34c0b905 rizir01
312 8bb7ed68 Marek Lovčí
    .fav-cat-mybooks {
313
        color: $theme-color-two;
314 b4965c0b rizir01
        text-align: center;
315
        font-size: 1.9rem;
316
    }
317
318 8bb7ed68 Marek Lovčí
    .fav-cat-nofav {
319 b4965c0b rizir01
        text-align: center;
320 8bb7ed68 Marek Lovčí
        color: $theme-color-three;
321 b4965c0b rizir01
        background-color: $theme-color-five;
322
        border-color: $theme-color-three;
323
    }
324
325 70f69b41 Adam Mištera
    .artefacts-area, .artefact-area {
326 084eca03 Adam Mištera
327 b56b3d9b Adam Mištera
        h5 {
328
            color: $theme-color-two;
329 b4965c0b rizir01
            //font-weight: $font-weight-two;
330
            text-overflow: ellipsis;
331
            overflow: hidden;
332
            white-space: nowrap;
333
            line-height: 0.9rem;
334
            font-size: 1.1rem;
335 b56b3d9b Adam Mištera
        }
336 084eca03 Adam Mištera
337 b56b3d9b Adam Mištera
        h6 {
338
            color: $theme-color-two;
339 b4965c0b rizir01
            font-size: 0.9rem;
340 83496d8e zabran
            //font-weight: lighter;
341
            font-weight: $font-weight-one;
342 b56b3d9b Adam Mištera
        }
343 084eca03 Adam Mištera
344 b56b3d9b Adam Mištera
        img {
345
            border: transparent;
346
            border-radius: 1px;
347
        }
348 084eca03 Adam Mištera
349 b56b3d9b Adam Mištera
        .card {
350
            margin: 10px;
351
            border: none !important;
352
        }
353 084eca03 Adam Mištera
354 b56b3d9b Adam Mištera
        .left_panel_info {
355
            margin-top: 15px;
356 8bb7ed68 Marek Lovčí
            max-width: 70%; //250px
357 b56b3d9b Adam Mištera
        }
358
359
        .right_panel_info {
360
            margin-top: 15px;
361 b4965c0b rizir01
        }
362
363 8bb7ed68 Marek Lovčí
        .likes_text {
364 b4965c0b rizir01
            text-align: center;
365 b56b3d9b Adam Mištera
        }
366
367
        .card-cus-bottom {
368
            background-color: $theme-color-five;
369 b4965c0b rizir01
            padding-right: 0;
370
            padding-left: 0;
371 b56b3d9b Adam Mištera
        }
372
373
        .inter_info {
374
            &:before {
375 b4965c0b rizir01
                //background-image: url(../images/interface/Button_Info_50.png);
376
                background-image: url(../images/interface/Button_Info.svg);
377
                //width: 60px;
378
                //height: 60px;
379 8bb7ed68 Marek Lovčí
                width: 8vw;
380
                height: 8vw;
381 b56b3d9b Adam Mištera
            }
382
        }
383
384
        .inter_like {
385
            display: none;
386 d79e27be Marek Lovčí
387 b56b3d9b Adam Mištera
            &:before {
388 b4965c0b rizir01
                //background-image: url(../images/interface/Hearth_Empty_50.png);
389
                background-image: url(../images/interface/Heart_Empty.svg);
390
                //width: 60px;
391
                //height: 60px;
392 8bb7ed68 Marek Lovčí
                width: 8vw;
393
                height: 8vw;
394 b56b3d9b Adam Mištera
            }
395
        }
396
397
        .inter_like_filled {
398
            &:before {
399 b4965c0b rizir01
                //background-image: url(../images/interface/Hearth_Filled_50.png);
400
                background-image: url(../images/interface/Heart_Filled.svg);
401
                //width: 60px;
402
                //height: 60px;
403 8bb7ed68 Marek Lovčí
                width: 8vw;
404
                height: 8vw;
405 b56b3d9b Adam Mištera
            }
406
        }
407
408
        .inter_info, .inter_like, .inter_like_filled {
409
            padding: 0;
410 d79e27be Marek Lovčí
411 b56b3d9b Adam Mištera
            &:focus, &:active, &:hover {
412
                background-color: transparent !important;
413
                border-color: transparent !important;
414
                outline: none !important;
415
                box-shadow: none !important;
416 d79e27be Marek Lovčí
            }
417
        ;
418 b56b3d9b Adam Mištera
        }
419
    }
420 34c0b905 rizir01
421 bfa73340 Adam Mištera
    // Artefact area
422 70f69b41 Adam Mištera
    .artefact-area {
423
424
        .card-cus-bottom {
425
            .left_panel_info, .right_panel_info {
426
                margin: 0.9375rem 0 0 0;
427
            }
428
429
            .right_panel_info {
430
                .float-right {
431
                    margin-right: -0.35rem;
432
                }
433
            }
434
        }
435
436
        .artefact-name {
437
            font-weight: $font-weight-two;
438
            font-size: 8pt;
439
            line-height: 10pt;
440
            margin-bottom: 0;
441
        }
442
443
        .artefact-author {
444
            font-size: 7pt;
445
            line-height: 8pt;
446
        }
447
448
        .inter_like {
449
            display: block;
450
451
            &:before {
452 bfa73340 Adam Mištera
                background-image: url(../images/interface/Heart_Empty.svg);
453
                width: 1.563rem;
454
                height: 1.25rem;
455 b4965c0b rizir01
456 bfa73340 Adam Mištera
            }
457
        }
458
459
        .inter_like_filled {
460
            &:before {
461 d79e27be Marek Lovčí
                background-image: url(../images/interface/Heart_Filled.svg);
462 bfa73340 Adam Mištera
                width: 1.563rem;
463
                height: 1.25rem;
464 70f69b41 Adam Mištera
            }
465
        }
466
467
        .inter_info {
468
469
            padding-right: 1rem;
470 d79e27be Marek Lovčí
471 70f69b41 Adam Mištera
            &:before {
472 bfa73340 Adam Mištera
                background-image: url(../images/interface/Button_Info.svg);
473
                width: 1.875rem;
474
                height: 1.875rem;
475 70f69b41 Adam Mištera
            }
476
        }
477
478
        .artefact-likes {
479
            font-weight: $font-weight-two;
480
            font-size: 5pt;
481
            padding-right: 0.25rem;
482
        }
483
    }
484
485 3e4f999e Adam Mištera
    // Metadata area
486 3c062db9 Adam Mištera
    .metadata-area {
487
488
        h2 {
489 1bcdcb05 Adam Mištera
            color: $theme-color-two;
490 3c062db9 Adam Mištera
            font-weight: $font-weight-two;
491
            font-size: 12pt;
492
        }
493
494 3e4f999e Adam Mištera
        .arrow-down {
495 3dfc8d9f Adam Mištera
            position: fixed;
496 3e4f999e Adam Mištera
            top: 0.25rem;
497
            right: 0;
498
            margin: 2rem;
499
            width: 0;
500
            height: 0;
501
            border-left: 0.59055rem solid transparent;
502
            border-right: 0.59055rem solid transparent;
503
            border-top: 0.59055rem solid $theme-color-two;
504 3c062db9 Adam Mištera
        }
505
506
        .pin-horizontal {
507 3e4f999e Adam Mištera
            color: $theme-color-two;
508
            border-bottom: .042rem solid $theme-color-two;
509 3c062db9 Adam Mištera
            display: inline-block;
510 26e128a8 Adam Mištera
            margin: 2.75rem 3.125rem 0 0;
511 3e4f999e Adam Mištera
512 d79e27be Marek Lovčí
            &:after {
513 3c062db9 Adam Mištera
                content: '';
514 d79e27be Marek Lovčí
                background-color: #ddd1b9;
515 3c062db9 Adam Mištera
                position: relative;
516
                height: .5rem;
517
                width: .5rem;
518
                border-radius: 50%;
519 d79e27be Marek Lovčí
                display: block;
520
                margin-left: auto;
521
                top: .25rem;
522 3c062db9 Adam Mištera
            }
523
524 3e4f999e Adam Mištera
            .metadata {
525
                position: relative;
526
                display: flex;
527
                align-items: baseline;
528
529
                span {
530
                    font-weight: $font-weight-two;
531
                }
532
533
                .arrow-down {
534
                    position: relative;
535
                    top: 0;
536
                    right: 0;
537
                    width: 0;
538
                    height: 0;
539
                    border-left: 0.25rem solid transparent;
540
                    border-right: 0.25rem solid transparent;
541
                    border-top: 0.25rem solid $theme-color-two;
542
                    margin: 0 0.5rem 0 0.5rem;
543
                }
544 3c062db9 Adam Mištera
            }
545 3e4f999e Adam Mištera
        }
546
547
        .white-pin {
548
            color: $theme-color-one;
549
            border-bottom: .042rem solid $theme-color-one;
550 3c062db9 Adam Mištera
551 3e4f999e Adam Mištera
            &:before {
552
                content: '';
553
                background-color: $theme-color-one;
554
            }
555 3c062db9 Adam Mištera
556 3e4f999e Adam Mištera
            .metadata {
557
                .arrow-down {
558
                    border-top: 0.25rem solid $theme-color-one;
559
                }
560
            }
561 3c062db9 Adam Mištera
        }
562
563
        .metadata-text {
564 3e4f999e Adam Mištera
            font-size: 8pt;
565 3c062db9 Adam Mištera
            color: $theme-color-one;
566
            padding-top: 10px;
567
            padding-left: 25px;
568
            padding-right: 25px;
569
570
            .artefact-info {
571
                color: $theme-color-two;
572
                margin-top: 10px;
573
574
                .artefact-name {
575 3e4f999e Adam Mištera
                    font-weight: $font-weight-two;
576 3c062db9 Adam Mištera
                    font-size: 8pt;
577
                }
578
579
                .artefact-author {
580 3e4f999e Adam Mištera
                    font-weight: $font-weight-one;
581 3c062db9 Adam Mištera
                    font-size: 7pt;
582
                }
583 3e4f999e Adam Mištera
584 1bcdcb05 Adam Mištera
                .inter_like {
585
586
                    &:before {
587
                        background-image: url(../images/interface/Heart_Empty.svg);
588
                        width: 3.125rem;
589
                        height: 3.125rem;
590
                        margin-right: 0;
591
                    }
592
593
                    &:hover, &:focus, &:active {
594
                        background-color: transparent !important;
595
                        border-color: transparent !important;
596
                        outline: none !important;
597
                        box-shadow: none !important;
598
                    }
599
                }
600
601 3e4f999e Adam Mištera
                .inter_like_filled {
602
603
                    &:before {
604 d79e27be Marek Lovčí
                        background-image: url(../images/interface/Heart_Filled.svg);
605 26e128a8 Adam Mištera
                        width: 3.125rem;
606
                        height: 3.125rem;
607
                        margin-right: 0;
608 3e4f999e Adam Mištera
                    }
609
610
                    &:hover, &:focus, &:active {
611
                        background-color: transparent !important;
612
                        border-color: transparent !important;
613
                        outline: none !important;
614
                        box-shadow: none !important;
615
                    }
616
                }
617 3c062db9 Adam Mištera
            }
618
        }
619
    }
620
621 bfa73340 Adam Mištera
    // Modal
622
    .modal {
623
        font-weight: $font-weight-one;
624
        color: $theme-color-two;
625
        font-size: 8pt;
626
627
        .modal-header {
628
            border-bottom: 1px solid $theme-color-two;
629
630
            .close {
631
                color: $theme-color-two;
632
                text-shadow: none;
633
            }
634
        }
635
636
        .modal-content {
637
            background-color: $theme-color-five;
638
        }
639
640
        .modal-footer {
641
            border-top: 1px solid $theme-color-two;
642
643
            .btn {
644
                background-color: $theme-color-two;
645
                color: $theme-color-five;
646
647
            }
648
        }
649
    }
650
651
    .image-modal {
652
        .close {
653
            font-size: 24pt;
654
            color: $theme-color-two;
655
            text-shadow: none;
656
            position: absolute;
657
            top: 1rem;
658
            right: 0.125rem;
659
            opacity: 1;
660
            cursor: pointer;
661
            pointer-events: initial;
662
        }
663
    }
664
665 c0265e9e zabran
    /*.content {
666 977060b9 rizir01
        position: relative;
667 31d75014 rizir01
668 977060b9 rizir01
        //Circle style button
669
        .btn-circle.rounded-circle {
670
            padding: 6px 0px;
671
            font-size: 16px;
672
            text-align: center;
673
        }
674
        .btn-categories
675 c38f4c3a zabran
        {
676 977060b9 rizir01
            position: absolute;
677
            border-width: 5px;
678
            background-color: $theme-color-five;
679 c38f4c3a zabran
            border-color: $theme-color-four;
680 977060b9 rizir01
            color:$theme-color-four;
681 c4f6e57a Adam Mištera
            outline: none !important;
682
            box-shadow: none !important;
683 977060b9 rizir01
            font-weight: $font-weight-two;
684
685
            &:active
686
            {
687
                background-color: $theme-color-three;
688
                border-color: $theme-color-four;
689
                outline: none !important;
690
                box-shadow: none !important;
691
                color:$theme-color-five;
692
            }
693
        }
694 c0265e9e zabran
    }*/
695 977060b9 rizir01
696 6c518068 rizir01
    //CATEGORIES - TILES
697 d79e27be Marek Lovčí
    .btn.btn-dark.cat-tile {
698 6c518068 rizir01
        //STYLING
699
        border-color: $theme-color-four;
700
        border-radius: 0;
701
        border-style: solid;
702
        border-width: 2px;
703
        color: $theme-color-four;
704
        background-color: $theme-color-five;
705
        text-align: center;
706
        outline: none !important;
707
        box-shadow: none !important;
708
709 25ec2fab Marek Lovčí
        //TEXT OVERFLOW
710
        overflow: hidden;
711
        text-overflow: ellipsis;
712
713 6c518068 rizir01
        //FONT
714 25ec2fab Marek Lovčí
        font-size: 22pt;
715 6c518068 rizir01
716
        //SPACING
717 8bb7ed68 Marek Lovčí
        padding: 4rem 1rem;
718 6c518068 rizir01
719 d79e27be Marek Lovčí
        &:active, &:focus {
720 6c518068 rizir01
            background-color: $theme-color-three;
721
            border-color: $theme-color-four;
722
            outline: none !important;
723
            box-shadow: none !important;
724
            color: $theme-color-five;
725 c4f6e57a Adam Mištera
        }
726 6c518068 rizir01
    }
727 c38f4c3a zabran
728 eadc983d rizir01
    .btn-dark:not(:disabled):not(.disabled).active{
729
        background-color: $theme-color-four;
730
        color:white;
731
        border-color: $theme-color-five;
732
    }
733
734 fb354d59 rizir01
    //CATEGORY/{id} -h2 title NO ARTEFACTS
735 d79e27be Marek Lovčí
    .category-h2 {
736 fb354d59 rizir01
        color: $theme-color-four;
737 c4f6e57a Adam Mištera
    }
738 c74e9df8 rizir01
739
    //CATEGORIES - Choose a topic TITLE
740 8bb7ed68 Marek Lovčí
    .head-title.text-center.cat-main-topic {
741 c74e9df8 rizir01
742 8bb7ed68 Marek Lovčí
        h1 {
743 c74e9df8 rizir01
            font-size: 1.9rem;
744
        }
745
    }
746 9635619e rizir01
747 eadc983d rizir01
    //CATEGORIES - Main menu
748
    .cat-main-menu{
749
        font-size: 1.75rem;
750
        text-align: center;
751
        margin-bottom: 30pt;
752
753
        a,a:visited{
754
            color: $theme-color-two;
755
            text-decoration: none;
756
        }
757
758
        a:hover{
759
            color: $theme-color-four;
760
        }
761
762
    }
763
764
    //CATEGORIES - Wrapper around Enter button
765
    .cat-wrapper{
766
        margin:auto;
767
        display:block;
768
        //align-content: center;
769
        //margin:auto;
770
        //display:block;
771
    }
772
773
    //CATEGORIES - Enter button
774
    .btn.button-square.cat-enter-butt {
775 dd70ef95 zabran
        //font-size: 8pt;
776
        //background-color: grey;
777
        //color: $theme-color-one;
778
       // border: 0.5pt solid $theme-color-one;
779 eadc983d rizir01
        border-radius: 0;
780
        bottom: 5%;
781
        position: fixed;
782
        left: 50%;
783
        transform: translateX(-50%);
784 dd70ef95 zabran
        //width: 6.5rem;
785
        //height: 2rem;
786
        //font-weight: $font-weight-one;
787 eadc983d rizir01
788
        &:active, &:focus, &:visited, &:hover {
789
            outline: none;
790
            box-shadow: none;
791
            color: $theme-color-one;
792
        }
793
794
        &:hover {
795
            color: $theme-color-four;
796
        }
797
    }
798
799 9635619e rizir01
    //VERIFY - main text
800
    .ver-text{
801
802
        margin-top: 20pt    ;
803
804
        h2{
805
            text-align: center;
806
            color:$theme-color-two;
807
        }
808
    }
809 34c0b905 rizir01
}
810
811 d79e27be Marek Lovčí
.top-bar {
812 927fb559 zabran
    background-color: $theme-color-five;
813 693a0a6d zabran
    min-height: 5rem;
814 927fb559 zabran
    position: fixed;
815
    width: 100%;
816
    top: 0;
817 d79e27be Marek Lovčí
    z-index: 2;
818 8bb7ed68 Marek Lovčí
819 54610fab zabran
    .shadow {
820
        box-shadow: none;
821
    }
822 8baafb46 zabran
}
823
824 1c3121fe zabran
.sidenav {
825
    height: 100%;
826 79e22cad zabran
    width: 0;
827
    //width: 250px;
828 1c3121fe zabran
    position: fixed;
829 d79e27be Marek Lovčí
    z-index: 4;
830 1c3121fe zabran
    top: 0;
831
    left: 0;
832 8075a85b zabran
    background-color: $theme-color-four;
833 1c3121fe zabran
    overflow-x: hidden;
834
    transition: 0.5s;
835
}
836
837
.sidenav a {
838
    text-decoration: none;
839 8075a85b zabran
    color: $theme-color-five;
840 1c3121fe zabran
    display: block;
841
    transition: 0.3s;
842 d79e27be Marek Lovčí
843
    &:hover {
844 927fb559 zabran
        color: $theme-color-four;
845
        background-color: $theme-color-one;
846
    }
847 d79e27be Marek Lovčí
848
    &:active, &:focus, .active {
849 927fb559 zabran
        color: $theme-color-one;
850
        background-color: $theme-color-four;
851
    }
852 1c3121fe zabran
}
853
854 8bb7ed68 Marek Lovčí
.bar-desktop {
855 79e22cad zabran
    display: flex;
856
    align-items: center;
857 c9a0c0b2 zabran
    text-align: center;
858
    min-width: 100%;
859 693a0a6d zabran
    padding-top: 2rem;
860
    padding-bottom: 2rem;
861 79e22cad zabran
}
862
863 54610fab zabran
.down {
864
    position: absolute;
865
    z-index: 5;
866
    bottom: 0;
867
    left: 0;
868
    width: 100%;
869
    margin-bottom: 3rem;
870
}
871
872 8bb7ed68 Marek Lovčí
.menu-item {
873
    padding: 0.25rem 1rem;
874 54610fab zabran
    width: 100%;
875
    border: 0;
876 8bb7ed68 Marek Lovčí
877
    &:active, &.active, &:focus {
878 79e22cad zabran
        color: $theme-color-one;
879 d7feebff zabran
        //background-color: $theme-color-five;
880 79e22cad zabran
        border: none;
881
        outline: none;
882
        box-shadow: none;
883
    }
884 1c3121fe zabran
}
885
886 d79e27be Marek Lovčí
.logo-kaplicky {
887
    text-align: center;
888 79e22cad zabran
    display: none;
889 8bb7ed68 Marek Lovčí
890
    &:active, &.active, &:focus {
891 79e22cad zabran
        outline: none;
892
        box-shadow: none;
893
    }
894 927fb559 zabran
}
895
896 8bb7ed68 Marek Lovčí
.navbar {
897 c9a0c0b2 zabran
    padding: unset;
898
}
899
900 749ca4c4 Marek Lovčí
.vertical-center {
901 d79e27be Marek Lovčí
    margin-top: -5.1rem; // fixed navbar correction
902 749ca4c4 Marek Lovčí
    min-height: 100vh;
903
    display: flex;
904
    align-items: center;
905
}
906
907
.error {
908
    color: $theme-color-one;
909
    font-size: xx-large;
910
    display: block;
911
    text-align: center;
912
}
913
914 d79e27be Marek Lovčí
// login and registration alert bottom margin
915
.al {
916
    margin-bottom: 3rem;
917
}
918
919 df15f2e5 Marek Lovčí
.js-cookie-consent {
920
    position: fixed;
921
    z-index: 9999;
922
    text-align: center;
923
    width: 100%;
924
    bottom: 0px;
925
    padding: 10px;
926
    background: $theme-color-four;
927
}
928
929
.js-cookie-consent-agree {
930
    font-size: 8pt;
931
    background-color: $theme-color-five;
932
    color: $theme-color-one;
933
    border: 0.5pt solid $theme-color-one;
934
    border-radius: 0;
935
    padding: 0.5rem 2rem;
936
    font-weight: $font-weight-one;
937
938
    &:active, &:focus, &:visited, &:hover {
939
        outline: none;
940
        box-shadow: none;
941
        color: $theme-color-one;
942
    }
943
944
    &:hover {
945
        color: $theme-color-four;
946
    }
947
}
948
949
.cookie-consent__message {
950
    padding: 1rem;
951
    display: inline-block;
952
}
953
954 0218d5c7 Adam Mištera
// books component
955
.books-component {
956
957
    .book-area {
958
        .card-cus-bottom {
959
960
            display: flex;
961
            justify-content: space-between;
962
            align-items: baseline;
963
964
            .book-arrow {
965
                &:after {
966
                    content: '';
967
                    bottom: 3rem;
968
                    position: absolute;
969
                    border-top: 1.25rem solid transparent;
970
                    border-bottom: 1.25rem solid transparent;
971
                }
972
            }
973
974
            .book-arrow-left {
975
                &:after {
976
                    left: 25%;
977
                    border-right: 1.25rem solid $theme-color-two;
978
                }
979
            }
980
981
            .book-arrow-right {
982 8bb7ed68 Marek Lovčí
                &:after {
983
                    right: 25%;
984
                    border-left: 1.25rem solid $theme-color-two;
985
                }
986 0218d5c7 Adam Mištera
            }
987
988
            .likes {
989
                display: flex;
990
                flex-direction: column;
991
                align-items: center;
992
993
                .inter_like, .inter_like_filled {
994
                    margin: 0 auto;
995 8bb7ed68 Marek Lovčí
996 0218d5c7 Adam Mištera
                    &:before {
997
                        margin-right: 0;
998
                        height: 5rem;
999
                        width: 5rem;
1000
                    }
1001
                }
1002
1003
                .artefact-likes {
1004
                    font-size: 12pt;
1005
                    padding: 0;
1006
                }
1007
            }
1008
        }
1009
    }
1010
1011
    .info-area {
1012
        color: $theme-color-two;
1013
        margin-top: 0.625rem;
1014
        padding-left: 5rem;
1015
1016
        /* could be use to hide overflowing notes
1017
        max-height: 80vh;
1018
        overflow-y: scroll;
1019
        scrollbar-width: none;
1020
        -ms-overflow-style: none;
1021
1022
        &::-webkit-scrollbar {
1023
            width: 0 !important
1024
        } */
1025
1026
        h3 {
1027
            font-weight: $font-weight-two;
1028
        }
1029
1030
        .switch-view {
1031
            float: right;
1032
            color: $theme-color-one;
1033
            cursor: pointer;
1034
        }
1035
1036
        .artefact-notes {
1037
            display: none;
1038
            color: $theme-color-two;
1039
1040
            .pin-horizontal {
1041
                border-bottom: .042rem solid $theme-color-two;
1042
                display: inline-block;
1043
                margin: 2.75rem 2rem 0 0;
1044
1045
                &:after {
1046
                    content: '';
1047
                    background-color: #ddd1b9;
1048
                    position: relative;
1049
                    height: .5rem;
1050
                    width: .5rem;
1051
                    border-radius: 50%;
1052
                    display: block;
1053
                    margin-left: auto;
1054
                    top: .25rem;
1055
                }
1056
1057
                .metadata {
1058
                    position: relative;
1059
                    display: flex;
1060
                    align-items: baseline;
1061
1062
                    span {
1063
                        font-size: 12pt;
1064
                        font-weight: $font-weight-two;
1065
                    }
1066
1067
                    .arrow-down {
1068
                        position: relative;
1069
                        top: 0;
1070
                        right: 0;
1071
                        width: 0;
1072
                        height: 0;
1073
                        border-left: 0.25rem solid transparent;
1074
                        border-right: 0.25rem solid transparent;
1075
                        border-top: 0.25rem solid $theme-color-two;
1076
                        margin: 0 0.5rem 0 0.5rem;
1077
                    }
1078
                }
1079
            }
1080
1081
            .white-pin {
1082
                color: $theme-color-one;
1083
                border-bottom: .042rem solid $theme-color-one;
1084
1085
                &:before {
1086
                    content: '';
1087
                    background-color: $theme-color-one;
1088
                }
1089
1090
                .metadata {
1091
                    .arrow-down {
1092
                        border-top: 0.25rem solid $theme-color-one;
1093
                    }
1094
                }
1095
            }
1096
1097
            .metadata-text {
1098
                font-size: 12pt;
1099
                color: $theme-color-one;
1100
                padding-top: 10px;
1101
                padding-left: 25px;
1102
                padding-right: 25px;
1103
1104
                .inter_like {
1105
1106
                    &:before {
1107
                        background-image: url(../images/interface/Heart_Empty.svg);
1108
                        width: 5rem;
1109
                        height: 5rem;
1110
                    }
1111
1112
                    &:hover, &:focus, &:active {
1113
                        background-color: transparent !important;
1114
                        border-color: transparent !important;
1115
                        outline: none !important;
1116
                        box-shadow: none !important;
1117
                    }
1118
                }
1119
1120
                .inter_like_filled {
1121
1122
                    &:before {
1123
                        background-image: url(../images/interface/Heart_Filled.svg);
1124
                        width: 5rem;
1125
                        height: 5rem;
1126
                    }
1127
1128
                    &:hover, &:focus, &:active {
1129
                        background-color: transparent !important;
1130
                        border-color: transparent !important;
1131
                        outline: none !important;
1132
                        box-shadow: none !important;
1133
                    }
1134
                }
1135
            }
1136
        }
1137
1138
        .inter_info {
1139
1140
            float: right;
1141
            color: $theme-color-one;
1142
            padding-right: 1rem;
1143
1144
            &:before {
1145
                background-image: url(../images/interface/Button_Info_White.svg);
1146
                width: 1.875rem;
1147
                height: 1.875rem;
1148
            }
1149
1150
            &:hover, &:focus, &:active {
1151
                background-color: transparent !important;
1152
                border-color: transparent !important;
1153
                outline: none !important;
1154
                box-shadow: none !important;
1155
            }
1156
        }
1157
    }
1158
}
1159
1160 df15f2e5 Marek Lovčí
@media (max-width: 610px) {
1161
    .js-cookie-consent-agree {
1162
        margin-bottom: 1rem;
1163
    }
1164
}
1165
1166 1c3121fe zabran
@media screen and (max-height: 450px) {
1167 d79e27be Marek Lovčí
    .sidenav a {
1168
        font-size: 18px;
1169
    }
1170 54610fab zabran
    .down {
1171
        bottom: unset;
1172
        margin-bottom: unset;
1173
    }
1174 1c3121fe zabran
}
1175
1176 c9a0c0b2 zabran
@media (min-width: 1300px) {
1177
    .bar-desktop {
1178
        margin-left: 8vw;
1179
        margin-right: 8vw;
1180
        min-width: 84vw;
1181
    }
1182 d79e27be Marek Lovčí
}
1183 8075a85b zabran
1184 c9a0c0b2 zabran
@media (max-width: 990px) {
1185 aee27358 zabran
}
1186
1187 c9a0c0b2 zabran
@media (max-width: 770px) {
1188 8bb7ed68 Marek Lovčí
    .logo-kaplicky {
1189
        margin: 0 auto;
1190 79e22cad zabran
        display: block;
1191
    }
1192
    .arrow {
1193
        position: absolute;
1194
        width: 0;
1195
        height: 0;
1196
        margin: 2rem;
1197
        cursor: pointer;
1198
        border: 0.59055rem solid transparent;
1199 8bb7ed68 Marek Lovčí
1200
        &:active, &.active, &:focus {
1201 79e22cad zabran
            outline: none;
1202
            box-shadow: none;
1203
        }
1204
    }
1205
    .arrow-left {
1206
        margin-left: 80%;
1207 6c518068 rizir01
1208 79e22cad zabran
        border-right: 0.59055rem solid $theme-color-five;
1209
        background-color: $theme-color-four !important;
1210 34c0b905 rizir01
    }
1211 79e22cad zabran
    .arrow-right {
1212
        border-left: 0.59055rem solid $theme-color-four;
1213 6c518068 rizir01
1214 79e22cad zabran
        position: fixed;
1215
        z-index: 3;
1216
        top: 0;
1217
        left: 0;
1218 34c0b905 rizir01
    }
1219 8bb7ed68 Marek Lovčí
    .bar-desktop {
1220 79e22cad zabran
        display: none;
1221
    }
1222 8bb7ed68 Marek Lovčí
    .menu-item:active, .menu-item.active {
1223 79e22cad zabran
        color: $theme-color-five;
1224
        background-color: $theme-color-one;
1225
    }
1226 0218d5c7 Adam Mištera
    .books-component {
1227 8bb7ed68 Marek Lovčí
        .info-area {
1228 0218d5c7 Adam Mištera
            padding-left: 1.5625rem;
1229
        }
1230
    }
1231 c9a0c0b2 zabran
}
1232
1233
@media only screen and (max-width: 540px) {
1234
    .sidenav {
1235
        width: 0;
1236
    }
1237
    .head-title.text-center h1 {
1238
        font-size: 23pt;
1239
        padding-top: 50pt;
1240
        white-space: nowrap;
1241
    }
1242 79e22cad zabran
1243 34c0b905 rizir01
1244 c0265e9e zabran
    /*.btn-circle.rounded-circle.btn-sm
1245 34c0b905 rizir01
    {
1246
        width: 90px;
1247
        height: 90px;
1248
    }
1249
1250
    .btn-circle.rounded-circle.btn-dm
1251
    {
1252
        width: 130px;
1253
        height: 130px;
1254
    }
1255
1256
    .btn-circle.rounded-circle.btn-xl
1257
    {
1258
        width: 180px;
1259
        height: 180px;
1260 c0265e9e zabran
    }*/
1261 d668e889 Adam Mištera
1262 d79e27be Marek Lovčí
    body {
1263 d668e889 Adam Mištera
        .carousel {
1264
            .carousel-inner {
1265
                .social-logo {
1266
                    padding-left: 30px;
1267
                    top: 20%;
1268
                }
1269
            }
1270
        }
1271
    }
1272
}
1273
1274 d79e27be Marek Lovčí
@media (min-width: 330px) and (max-height: 900px) {
1275
    body {
1276 d668e889 Adam Mištera
        .carousel {
1277
            .carousel-inner {
1278
                .social-logo {
1279
                    top: 25%;
1280
                }
1281
            }
1282
        }
1283
    }
1284
}
1285 f5ea2a43 Adam Mištera
1286
@media (min-width: 1024px) {
1287
1288
    body {
1289 8bb7ed68 Marek Lovčí
        .kaplicky {
1290 f5ea2a43 Adam Mištera
            text-align: left !important;
1291 a37ca88b zabran
            //font-size: 24pt;
1292
            font-size: 30pt;
1293 f5ea2a43 Adam Mištera
            line-height: 24pt;
1294 a37ca88b zabran
            margin-bottom: 3rem;
1295
            //margin-left: 1rem;
1296 f5ea2a43 Adam Mištera
        }
1297
1298 e76ffdbe zabran
        .pin-left:before {
1299
            height: 1.125rem;
1300
            width: 1.125rem;
1301
            top: -1.125rem;
1302
            left: -0.56rem;
1303
        }
1304
        .pin-left{
1305
            // center fixed div
1306
            left: 75%;
1307
            transform: translateX(-50%);
1308
            width: 70%;
1309
        }
1310
1311 f5ea2a43 Adam Mištera
        .text {
1312
            text-align: left;
1313
            font-size: 18pt;
1314
            line-height: 26pt;
1315
        }
1316 a37ca88b zabran
        .text2 {
1317
            text-align: left;
1318
            font-size: 18pt;
1319
            line-height: 26pt;
1320
        }
1321 f5ea2a43 Adam Mištera
1322
        .carousel {
1323
            .carousel-inner {
1324
                .social-logo {
1325
                    justify-content: center;
1326
                    top: 90%;
1327
1328
                    .logo {
1329
                        margin-left: 10rem;
1330
1331
                        img {
1332
                            width: 3.125rem;
1333
                        }
1334
1335
                        &:first-child {
1336
                            margin-left: 0;
1337
                        }
1338
                    }
1339
                }
1340 8bb7ed68 Marek Lovčí
1341 f5ea2a43 Adam Mištera
                .carousel-button {
1342 c6265547 Adam Mištera
                    bottom: 15%;
1343 f5ea2a43 Adam Mištera
                }
1344
            }
1345
1346 8bb7ed68 Marek Lovčí
            .carousel-caption {
1347 c6265547 Adam Mištera
                padding: 3.75rem 6.25rem 5em;
1348 f5ea2a43 Adam Mištera
1349
                h2 {
1350
                    margin-bottom: 1rem;
1351
                }
1352
            }
1353
        }
1354
1355
        .button-square {
1356
            font-size: 18pt;
1357 7b6d8d72 Adam Mištera
            padding: 0.28125rem 3.7rem;
1358 f5ea2a43 Adam Mištera
        }
1359
    }
1360
}
1361 c6265547 Adam Mištera
1362
@media (min-width: 1575px) {
1363
    body {
1364
        .carousel {
1365
            .carousel-inner {
1366
                .carousel-button {
1367
                    bottom: 20%;
1368
                }
1369
            }
1370
        }
1371
    }
1372
}