]> git.immae.eu Git - github/Chocobozzz/PeerTube.git/blob - client/src/app/app.component.scss
a98e57cc3c609a4c6462960dcf5b088e1719f14a
[github/Chocobozzz/PeerTube.git] / client / src / app / app.component.scss
1 .main-row {
2 min-height: calc(100vh - #{$header-height} - #{$footer-height} - #{$footer-margin});
3 }
4
5 .title-menu-left {
6 position: fixed;
7 height: calc(100vh - #{$header-height});
8 padding: 0;
9
10 .title-menu-left-block.menu {
11 height: 100%;
12 }
13 }
14
15 .header {
16 height: $header-height;
17
18 .fake-title-block {
19 display: inline-block;
20 }
21
22 .top-left-block {
23 z-index: 100;
24 background-color: #fff;
25 border-right: 1px solid $header-border-color;
26 height: $header-height;
27 line-height: $header-height;
28 margin-top: 0;
29 margin-bottom: 0;
30 display: flex;
31 position: fixed;
32 padding: 0;
33
34 &.border-bottom {
35 border-bottom: 1px solid $header-border-color;
36 }
37
38 .hamburger-block {
39 margin-right: 15px;
40 margin-left: 15px;
41
42 .glyphicon {
43 cursor: pointer;
44 position: relative;
45 top: 4px;
46 }
47 }
48
49 #peertube-title {
50
51 a {
52 color: inherit !important;
53 display: block;
54 background: url(/assets/logo.png) no-repeat;
55 background-size: contain;
56 background-position: center;
57 height: 100%;
58 margin: auto;
59 width: 135px;
60
61 &:hover {
62 color: inherit !important;
63 text-decoration: none !important;
64 }
65 }
66 }
67
68 @media screen and (max-width: 500px) {
69 #peertube-title {
70 display: none;
71 }
72
73 .hamburger-block {
74 width: 100%;
75 text-align: center;
76 }
77 }
78
79 @media screen and (min-width: 500px) and (max-width: 600px) {
80 #peertube-title a {
81 width: 80px;
82 }
83 }
84
85 @media screen and (min-width: 600px) and (max-width: 700px) {
86 #peertube-title a {
87 width: 100px;
88 }
89 }
90
91 @media screen and (min-width: 1000px) {
92 #peertube-title a {
93 width: 120px;
94 }
95 }
96
97 @media screen and (min-width: 1000px) {
98 #peertube-title a {
99 width: 120px;
100 }
101 }
102
103 @media screen and (min-width: 1200px) {
104 padding-left: 15px;
105
106 .hamburger-block {
107 margin-right: 15px;
108 }
109
110 #peertube-title a {
111 width: 135px;
112 }
113 }
114
115 @media screen and (min-width: 1600px) {
116 .hamburger-block {
117 margin-right: 20px;
118 }
119
120 #peertube-title a {
121 width: 180px;
122 }
123 }
124 }
125
126 my-search {
127 position: fixed;
128 z-index: 1000;
129 // Fix col-md-* padding
130 padding: 0;
131 }
132
133 .search-col {
134 height: 100%;
135 margin-left: -15px;
136 padding: 0;
137 }
138 }
139
140 footer {
141 border-top: 1px solid $footer-border-color;
142 padding: 10px 0;
143 text-align: center;
144 font-size: 11px;
145 margin-top: $footer-margin;
146 height: $footer-height;
147 }