Projekt

Obecné

Profil

Stáhnout (11.6 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 34c0b905 rizir01
8 c4f6e57a Adam Mištera
    .head-title h1 {
9 c38f4c3a zabran
        color: $theme-color-one;
10 83496d8e zabran
        font-weight: $font-weight-one;
11 c4f6e57a Adam Mištera
        font-size: 60pt;
12 83496d8e zabran
        //font-weight: bold;
13 c4f6e57a Adam Mištera
        letter-spacing: 3px;
14
    }
15 34c0b905 rizir01
16 c4f6e57a Adam Mištera
    .carousel {
17
        .carousel-inner {
18 d668e889 Adam Mištera
            .museum-logo {
19
                display: flex;
20
                justify-content: center;
21
                position: absolute;
22
                top: 5%;
23
                width: 100%;
24
                z-index: 1;
25
            }
26
27
            .social-logo {
28
                text-align: center;
29
                justify-content: space-between;
30
                flex-wrap: nowrap;
31
                position: absolute;
32
                top: 25%;
33
                padding-left: 25px;
34
                width: 100%;
35
                z-index: 1;
36
            }
37
38
            .carousel-button {
39
                bottom: 10%;
40
                left: 50%;
41
                transform: translateX(-50%);
42
                position: absolute;
43
                z-index: 1;
44
            }
45
46
            .carousel-item {
47
                height: 100vh;
48
                min-height: 350px;
49
                background: no-repeat center center scroll;
50
                -webkit-background-size: cover;
51
                -moz-background-size: cover;
52
                -o-background-size: cover;
53
                background-size: cover;
54 c4f6e57a Adam Mištera
            }
55
        }
56
57
        .carousel-caption {
58 d668e889 Adam Mištera
            top: 50%;
59
            bottom: auto;
60
            transform: translateY(-50%);
61 c4f6e57a Adam Mištera
            background-color:  rgba(239, 218, 179, 0.5);
62
        }
63
    }
64 3b97c440 zabran
65 2b1ca67d zabran
    /////////text types
66
    //většina běžných textů
67
    .text {
68 83496d8e zabran
        font-weight: $font-weight-one;
69 2b1ca67d zabran
        font-size: 8pt;
70
        line-height: 9pt;
71
    }
72
73
    //text inputu a název artefaktů
74
    .text2{
75 83496d8e zabran
        font-weight: $font-weight-two;
76 2b1ca67d zabran
        font-size: 8pt;
77
    }
78
79
    //název "kaplicky" a "choose a few" v categories (tam má jinou barvu)
80
    .kaplicky{
81
        color: $theme-color-one;
82
        font-size: 11pt;
83 83496d8e zabran
        font-weight: $font-weight-three;
84 2b1ca67d zabran
        letter-spacing: 3pt;
85
    }
86
87
    //autor artefaktu
88
    .text-author{
89 83496d8e zabran
        font-weight: $font-weight-one;
90 2b1ca67d zabran
        font-size: 7pt;
91
        color: $theme-color-four;
92
    }
93
94
    //počet lajků
95
    .text-number{
96 83496d8e zabran
        font-weight: $font-weight-two;
97 2b1ca67d zabran
        font-size: 5pt;
98
        color: $theme-color-four;
99
    }
100
101
    //notes u metadat, about v about, text levého menu
102
    .text-headline{
103 83496d8e zabran
        font-weight: $font-weight-two;
104 2b1ca67d zabran
        font-size: 12pt;
105
        color: $theme-color-four;
106
    }
107
108
    //název metadata, text pravého menu
109
    .text-page{
110 83496d8e zabran
        font-weight: $font-weight-two;
111 2b1ca67d zabran
        font-size: 7pt;
112
    }
113
114 aee27358 zabran
    ////color pro změnu jen barvy
115
    .black{
116
        color: $theme-color-five;
117
    }
118
    .white{
119
        color: $theme-color-one;
120
    }
121
    .colored{
122
        color: $theme-color-four;
123
    }
124
125 2b1ca67d zabran
126
    ////login
127 3b397a49 zabran
    .auth{
128 3b97c440 zabran
        .card{
129
            border: none;
130
            text-align: center;
131
            font-size: 8pt;
132
        }
133 3b397a49 zabran
134
        .col-form-label{
135
            text-align: left;
136 c0265e9e zabran
            padding-top: 0;
137
            padding-bottom: 0;
138 3b397a49 zabran
        }
139
        .form-control{
140 c0265e9e zabran
            padding: 0;
141 3b397a49 zabran
            height: 17pt;
142 c0265e9e zabran
            border-radius: 0;
143 3b397a49 zabran
        }
144 3b97c440 zabran
    }
145
146 5481d358 Adam Mištera
    .card-body {
147 c38f4c3a zabran
    	background-color: $theme-color-five;
148 83496d8e zabran
    	font-weight: $font-weight-one;
149 c38f4c3a zabran
    	color: $theme-color-four;
150 5481d358 Adam Mištera
	}
151
152
	.form-control {
153 c38f4c3a zabran
    	background-color: $theme-color-five;
154 5481d358 Adam Mištera
    	margin-top: -1px;
155 c38f4c3a zabran
    	border-top-color: $theme-color-five;
156
    	border-left-color: $theme-color-five;
157
    	border-right-color: $theme-color-five;
158
    	border-bottom-color: 0.5pt $theme-color-one;
159
    	color: $theme-color-one;
160 3b97c440 zabran
        box-shadow: none;
161
        font-size: 8pt;
162 4bb8ff64 zabran
163
        &:active, &:focus, &:visited{
164
            background-color: $theme-color-five;
165
            margin-top: -1px;
166
            border-top-color: $theme-color-five;
167
            border-left-color: $theme-color-five;
168
            border-right-color: $theme-color-five;
169
            border-bottom-color: 0.5pt $theme-color-one;
170
            color: $theme-color-one;
171
            box-shadow: none;
172
        }
173
174 5481d358 Adam Mištera
	}
175 4bb8ff64 zabran
    .form-control.is-invalid{
176
        box-shadow: none;
177
        border-color: $theme-color-four;
178
        background-image: none;
179
        &:active, &:focus, &:visited{
180
            box-shadow: none;
181
            border-color: $theme-color-four;
182
        }
183
    }
184 34c0b905 rizir01
185 c4f6e57a Adam Mištera
    .button-square {
186 d668e889 Adam Mištera
        font-size: 8pt;
187 c38f4c3a zabran
        background-color: $theme-color-five;
188
        color: $theme-color-one;
189
        border: 0.5pt solid $theme-color-one;
190 c4f6e57a Adam Mištera
        border-radius: 0;
191 2696c864 Adam Mištera
        width: 6.5rem;
192
        height: 2rem;
193 83496d8e zabran
        font-weight: $font-weight-one;
194 2696c864 Adam Mištera
195
        &:active, &:focus, &:visited {
196
            outline: none;
197
            box-shadow: none;
198
        }
199 c4f6e57a Adam Mištera
    }
200 34c0b905 rizir01
201 aee27358 zabran
    //spendlik
202
    .pin-left:before {
203
        content: '';
204
        position: relative;
205
        height: 0.35433rem;
206
        width: 0.35433rem;
207
        background-color: $theme-color-one;
208
        border-radius: 50%;
209
        display: inline-block;
210
        top: -0.35433rem;
211
        left: -0.2rem;
212
    }
213
214
    .pin-left {
215
        border-left: .5pt solid $theme-color-four;
216
        display: inline-block;
217 8075a85b zabran
        margin: 10rem 50px 0px -5rem;
218
        position: fixed;
219
        top: 0;
220
        bottom: 0;
221 aee27358 zabran
        text-align: left;
222
        width: 100%;
223 83496d8e zabran
        .text{
224
            margin-left: 0.5rem;
225
        }
226
        p{
227 c0265e9e zabran
            margin-top: 0;
228
            margin-bottom: 0;
229 83496d8e zabran
        }
230 aee27358 zabran
    }
231
232 b711d297 zabran
    li{
233
        list-style-type: none;
234
    }
235
236 c4f6e57a Adam Mištera
    .button-image {
237
        background-color: transparent;
238
        border-color: transparent;
239
240
        &:before {
241
            content: "";
242
            width: 100px;
243
            height: 100px;
244
            display: inline-block;
245
            margin-right: 5px;
246
            vertical-align: text-top;
247
            background-color: transparent;
248
            background-position : center center;
249
            background-repeat:no-repeat;
250
        }
251
    }
252 34c0b905 rizir01
253 b56b3d9b Adam Mištera
    .artefacts-area {
254 084eca03 Adam Mištera
255 b56b3d9b Adam Mištera
        h5 {
256
            color: $theme-color-two;
257 83496d8e zabran
            font-weight: $font-weight-two;
258 b56b3d9b Adam Mištera
            line-height: 20pt;
259
            font-size: 21pt;
260
        }
261 084eca03 Adam Mištera
262 b56b3d9b Adam Mištera
        h6 {
263
            color: $theme-color-two;
264
            font-size: 14pt;
265 83496d8e zabran
            //font-weight: lighter;
266
            font-weight: $font-weight-one;
267 b56b3d9b Adam Mištera
        }
268 084eca03 Adam Mištera
269 b56b3d9b Adam Mištera
        img {
270
            border: transparent;
271
            border-radius: 1px;
272
        }
273 084eca03 Adam Mištera
274 b56b3d9b Adam Mištera
        .card {
275
            margin: 10px;
276
            border: none !important;
277
        }
278 084eca03 Adam Mištera
279 b56b3d9b Adam Mištera
        .left_panel_info {
280
            margin-top: 15px;
281
            margin-left: -10px;
282
            max-width: 250px;
283
        }
284
285
        .right_panel_info {
286
            margin-top: 15px;
287
            margin-right: -15px;
288
        }
289
290
        .card-cus-bottom {
291
            background-color: $theme-color-five;
292
        }
293
294
        .inter_info {
295
            &:before {
296
                background-image: url(../images/interface/Button_Info_50.png);
297
                width: 60px;
298
                height: 60px;
299
            }
300
        }
301
302
        .inter_like {
303
            display: none;
304
            &:before {
305
                background-image : url(../images/interface/Hearth_Empty_50.png);
306
                width: 60px;
307
                height: 60px;
308
            }
309
        }
310
311
        .inter_like_filled {
312
            &:before {
313
                background-image : url(../images/interface/Hearth_Filled_50.png);
314
                width: 60px;
315
                height: 60px;
316
            }
317
        }
318
319
        .inter_info, .inter_like, .inter_like_filled {
320
            padding: 0;
321
            &:focus, &:active, &:hover {
322
                background-color: transparent !important;
323
                border-color: transparent !important;
324
                outline: none !important;
325
                box-shadow: none !important;
326
            };
327
        }
328
    }
329 34c0b905 rizir01
330 c0265e9e zabran
    /*.content {
331 977060b9 rizir01
        position: relative;
332 31d75014 rizir01
333 977060b9 rizir01
        //Circle style button
334
        .btn-circle.rounded-circle {
335
            padding: 6px 0px;
336
            font-size: 16px;
337
            text-align: center;
338
        }
339
        .btn-categories
340 c38f4c3a zabran
        {
341 977060b9 rizir01
            position: absolute;
342
            border-width: 5px;
343
            background-color: $theme-color-five;
344 c38f4c3a zabran
            border-color: $theme-color-four;
345 977060b9 rizir01
            color:$theme-color-four;
346 c4f6e57a Adam Mištera
            outline: none !important;
347
            box-shadow: none !important;
348 977060b9 rizir01
            font-weight: $font-weight-two;
349
350
            &:active
351
            {
352
                background-color: $theme-color-three;
353
                border-color: $theme-color-four;
354
                outline: none !important;
355
                box-shadow: none !important;
356
                color:$theme-color-five;
357
            }
358
        }
359 c0265e9e zabran
    }*/
360 977060b9 rizir01
361 6c518068 rizir01
    //CATEGORIES - TILES
362
    .btn.btn-dark.cat-tile
363
    {
364
        //STYLING
365
        border-color: $theme-color-four;
366
        border-radius: 0;
367
        border-style: solid;
368
        border-width: 2px;
369
        color: $theme-color-four;
370
        background-color: $theme-color-five;
371
        text-align: center;
372
        outline: none !important;
373
        box-shadow: none !important;
374
375
        //FONT
376
        font-size: 8mm;
377
        word-wrap: break-word;
378
379
        //SPACING
380
        margin: 10pt 32pt;
381
        height: 40mm;
382
        width: 86%;
383
384
        &:active, &:focus
385 977060b9 rizir01
        {
386 6c518068 rizir01
            background-color: $theme-color-three;
387
            border-color: $theme-color-four;
388
            outline: none !important;
389
            box-shadow: none !important;
390
            color: $theme-color-five;
391 c4f6e57a Adam Mištera
        }
392 6c518068 rizir01
    }
393 c38f4c3a zabran
394 6c518068 rizir01
    //CATEGORIES - enter button
395
    .btn.button-square.cat-enter-butt
396
    {
397
        position: fixed;
398
        bottom: 8%;
399
        right: 40%;
400
        display: none;
401 c4f6e57a Adam Mištera
    }
402 34c0b905 rizir01
}
403
404 8075a85b zabran
.arrow{
405 8baafb46 zabran
    position: absolute;
406
    width: 0;
407
    height: 0;
408 8075a85b zabran
    margin: 2rem;
409
    cursor:pointer;
410
    border: 0.59055rem solid transparent;
411
}
412
413
.arrow-left {
414
    margin-left: 80%;
415
416
    border-right:0.59055rem solid $theme-color-five;
417
    background-color: $theme-color-four !important;
418 8baafb46 zabran
}
419
420 8075a85b zabran
.arrow-right {
421 8baafb46 zabran
    border-left:0.59055rem solid $theme-color-four;
422 8075a85b zabran
423
    position: fixed;
424
    z-index: 1;
425
    top: 0;
426
    left: 0;
427 8baafb46 zabran
}
428
429 1c3121fe zabran
.sidenav {
430
    height: 100%;
431 c0265e9e zabran
    //width: 0;
432 b711d297 zabran
    width: 250px;
433 1c3121fe zabran
    position: fixed;
434
    z-index: 1;
435
    top: 0;
436
    left: 0;
437 8075a85b zabran
    background-color: $theme-color-four;
438 1c3121fe zabran
    overflow-x: hidden;
439
    transition: 0.5s;
440
}
441
442
.sidenav a {
443
    text-decoration: none;
444 8075a85b zabran
    color: $theme-color-five;
445 1c3121fe zabran
    display: block;
446
    transition: 0.3s;
447
}
448
449
.sidenav a:hover {
450 8075a85b zabran
    color: $theme-color-four;
451 8baafb46 zabran
    background-color: $theme-color-one;
452 1c3121fe zabran
}
453
454
@media screen and (max-height: 450px) {
455
    .sidenav a {font-size: 18px;}
456
}
457
458 c0265e9e zabran
@media (max-width: 990px) {}//Ponecháno pro případ, že se bude měnit login
459 8075a85b zabran
460
@media (max-width: 770px) {
461 aee27358 zabran
    body {
462
        .pin-left {
463 8075a85b zabran
            margin-left: -33vw;
464
            margin-top: 12rem;
465
            //left: 20vw;
466 aee27358 zabran
        }
467
    }
468
}
469
470 34c0b905 rizir01
@media only screen and (max-width: 540px)
471
{
472 b711d297 zabran
    .sidenav{
473
        width: 0;
474
    }
475 34c0b905 rizir01
    .head-title.text-center h1
476
    {
477 6c518068 rizir01
        font-size: 23pt;
478
        padding-top: 50pt;
479
        margin-left: 36pt;
480
        white-space: nowrap;
481
482 34c0b905 rizir01
    }
483
484 c0265e9e zabran
    /*.btn-circle.rounded-circle.btn-sm
485 34c0b905 rizir01
    {
486
        width: 90px;
487
        height: 90px;
488
    }
489
490
    .btn-circle.rounded-circle.btn-dm
491
    {
492
        width: 130px;
493
        height: 130px;
494
    }
495
496
    .btn-circle.rounded-circle.btn-xl
497
    {
498
        width: 180px;
499
        height: 180px;
500 c0265e9e zabran
    }*/
501 d668e889 Adam Mištera
502
    body{
503
        .carousel {
504
            .carousel-inner {
505
                .social-logo {
506
                    padding-left: 30px;
507
                    top: 20%;
508
                }
509
            }
510
        }
511
    }
512
}
513
514
@media (min-width: 330px) and (max-height: 900px)
515
{
516
    body{
517
        .carousel {
518
            .carousel-inner {
519
                .social-logo {
520
                    top: 25%;
521
                }
522
            }
523
        }
524
    }
525
}