]> git.immae.eu Git - github/Chocobozzz/PeerTube.git/blame - client/src/app/app.component.scss
Translated using Weblate (Galician)
[github/Chocobozzz/PeerTube.git] / client / src / app / app.component.scss
CommitLineData
8cbc40b2
C
1@use '_variables' as *;
2@use '_mixins' as *;
63c4db6d 3
fad0759c
C
4.peertube-container {
5 padding-bottom: 20px;
6}
7
67167390
C
8.main-row {
9 min-height: calc(100vh - #{$header-height} - #{$footer-height} - #{$footer-margin});
10}
11
b33f657c
C
12.sub-header-container {
13 margin-top: $header-height;
e66883b3 14 background-color: pvar(--mainBackgroundColor);
c4741804 15 width: 100%;
b33f657c
C
16}
17
ace01da3 18.root-header {
67167390 19 height: $header-height;
b33f657c 20 position: fixed;
26c6ee80 21 top: 0;
b33f657c 22 width: 100%;
e66883b3 23 background-color: pvar(--mainBackgroundColor);
b33f657c
C
24 box-shadow: 0 1px 3px rgba(0, 0, 0, 0.16);
25 display: flex;
266947e5 26}
ea9f487b 27
266947e5
C
28.top-left-block {
29 z-index: 1;
30 height: $header-height;
31 display: flex;
32 align-items: center;
33 min-width: 0;
67167390 34
266947e5
C
35 .icon {
36 @include icon(24px);
37 }
f0c5e8b6 38
266947e5 39 .icon-menu {
266947e5 40 mask-image: url('../assets/images/misc/menu.svg');
bc4c9cc1
C
41 -webkit-mask-image: url('../assets/images/misc/menu.svg');
42
43 background-color: pvar(--mainForegroundColor);
266947e5 44 margin: 0 18px 0 20px;
26c6ee80 45
266947e5
C
46 @media screen and (max-width: $mobile-view) {
47 margin: 0 10px;
48 }
49 }
50}
ef80c66c 51
ace01da3 52.root-header-right {
266947e5
C
53 height: $header-height;
54 display: flex;
55 align-items: center;
56 justify-content: flex-end;
57 white-space: nowrap;
58 flex: 1;
59}
26c6ee80 60
266947e5
C
61.peertube-title {
62 @include disable-default-a-behaviour;
3eeeb87f 63
266947e5
C
64 font-size: 20px;
65 font-weight: $font-bold;
66 color: inherit !important;
67 display: flex;
68 align-items: center;
69 overflow: hidden;
732c95cc 70 padding: 0 0 0 10px;
3daf4002 71
266947e5
C
72 .instance-name {
73 @include ellipsis;
74
75 width: 100%;
732c95cc 76
77 @media screen and (max-width: $mobile-view) {
78 display: none;
79 }
ea9f487b 80 }
ea9f487b 81
266947e5 82 .icon.icon-logo {
27bc9586
C
83 @include margin-right(0.5rem);
84
266947e5
C
85 display: inline-block;
86 width: 23px;
87 height: 24px;
266947e5 88 }
897ec54d 89}
72c33e71
C
90
91.broadcast-message {
92 min-height: 50px;
93 text-align: center;
94 margin-bottom: 0;
95 border-radius: 0;
96 display: grid;
97 grid-template-columns: 1fr 30px;
98 column-gap: 10px;
99
100 my-global-icon {
101 justify-self: center;
102 align-self: center;
103 cursor: pointer;
72c33e71
C
104 width: 20px;
105 }
72c33e71 106}