Skip to content

Commit 51589c3

Browse files
RudiThoeniRudiThoeni
committed
some fixes
1 parent 1b2e42a commit 51589c3

1 file changed

Lines changed: 255 additions & 0 deletions

File tree

‎src/assets/css/styles.css‎

Lines changed: 255 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,255 @@
1+
.full-height {
2+
/* height: 100%; */
3+
}
4+
5+
.content {
6+
padding: 0;
7+
}
8+
9+
header {
10+
display: flex;
11+
justify-content: space-between;
12+
align-items: center;
13+
}
14+
15+
h1 {
16+
font-size: 5em;
17+
padding: 25px;
18+
margin: 0;
19+
}
20+
21+
h2 {
22+
font-size: 2.3em;
23+
}
24+
25+
h2 small {
26+
font-size: 65%;
27+
line-height: 1;
28+
font-weight: bold;
29+
color: #8c8c8c;
30+
}
31+
32+
h1.title {
33+
padding: 5px;
34+
font-size: 48px;
35+
}
36+
37+
.slideshow-container {
38+
position: relative;
39+
padding: 15px;
40+
/* background-color: #3c763d; */
41+
min-height: 85vh;
42+
border-radius: 15px;
43+
}
44+
45+
.line {
46+
background-color: white;
47+
margin: 0;
48+
margin-bottom: 15px;
49+
padding: 0 25px;
50+
position: relative;
51+
display: block;
52+
height: 17vh;
53+
border-radius: 15px;
54+
}
55+
56+
.line > div {
57+
height: 100%;
58+
display: flex;
59+
align-items: center;
60+
overflow: hidden;
61+
}
62+
63+
body {
64+
/* font-family: "Source Sans Pro", sans-serif; */
65+
width: 100%;
66+
text-align: center;
67+
color: #000;
68+
font-size: 16px;
69+
margin: 0;
70+
min-height: 100vh;
71+
height: 100%;
72+
padding-bottom: 20px;
73+
}
74+
75+
body > div {
76+
width: 100%;
77+
}
78+
79+
.location {
80+
color: #fff;
81+
/* background-color: black; */
82+
padding: 10px 26px;
83+
margin-left: 20px;
84+
margin-right: 20px;
85+
margin-top: 5px;
86+
margin-bottom: 5px;
87+
font-size: 1.6em;
88+
font-weight: bold;
89+
max-width: 70%;
90+
/* min-width: 50%; */
91+
border-radius: 15px;
92+
}
93+
94+
.location a {
95+
color: #000000;
96+
}
97+
98+
.description {
99+
text-align: left;
100+
}
101+
102+
a {
103+
color: #000;
104+
text-decoration: underline;
105+
}
106+
107+
a.room {
108+
color: #ffffff;
109+
}
110+
111+
.noi-logo {
112+
width: 155px;
113+
margin: 20px;
114+
}
115+
116+
strong {
117+
font-weight: 600;
118+
}
119+
120+
.starts-in {
121+
text-align: right;
122+
font-size: 2em;
123+
line-height: 1;
124+
justify-content: right;
125+
min-width: 20%;
126+
}
127+
128+
.starts-in strong {
129+
font-size: 1.25em;
130+
}
131+
132+
.starts-in small {
133+
color: #8c8c8c;
134+
}
135+
136+
.footer {
137+
padding-top: 20px;
138+
bottom: 0;
139+
left: 0;
140+
width: 100%;
141+
text-align: right;
142+
z-index: 100001;
143+
}
144+
.footer-text {
145+
color: white;
146+
}
147+
148+
#current-date-time {
149+
font-size: 48px;
150+
}
151+
152+
#date {
153+
padding-right: 30px;
154+
font-size: 48px;
155+
}
156+
157+
#time {
158+
padding-right: 10px;
159+
font-size: 28px;
160+
color: #b2b5b6;
161+
font-weight: bold;
162+
vertical-align: middle;
163+
}
164+
165+
@media screen and (min-width: 320px) and (max-width: 812px) {
166+
h1 {
167+
font-size: 2.6em;
168+
}
169+
170+
h1.title {
171+
display: none;
172+
}
173+
174+
header {
175+
display: block;
176+
}
177+
178+
header .pull-left,
179+
header .pull-right {
180+
float: none !important;
181+
}
182+
183+
.line {
184+
font-size: 12px;
185+
padding: 0;
186+
height: auto;
187+
}
188+
189+
body {
190+
overflow: auto;
191+
padding-top: 2vh;
192+
}
193+
194+
.clock {
195+
font-size: 1em;
196+
}
197+
198+
.slideshow-container {
199+
height: max-content;
200+
}
201+
}
202+
203+
@media screen and (min-width: 320px) and (max-width: 812px) and (orientation: portrait) {
204+
.location {
205+
max-width: none;
206+
margin: 0 40px;
207+
}
208+
209+
.line > div {
210+
display: block;
211+
}
212+
213+
.starts-in {
214+
padding: 15px;
215+
}
216+
217+
.starts-in,
218+
.description {
219+
text-align: center;
220+
}
221+
222+
.slideshow-container {
223+
height: max-content;
224+
}
225+
}
226+
227+
@media screen and (min-width: 992px) and (max-height: 901px) and (orientation: landscape) {
228+
body {
229+
font-size: 10px;
230+
}
231+
}
232+
233+
@media screen and (max-width: 1441px) and (max-height: 901px) and (orientation: landscape) {
234+
body {
235+
font-size: 12px;
236+
}
237+
}
238+
239+
@media screen and (max-width: 1280px) and (min-height: 1024px) and (orientation: landscape) {
240+
body {
241+
font-size: 16px;
242+
}
243+
}
244+
245+
@media screen and (max-width: 1600px) and (min-height: 900px) and (orientation: landscape) {
246+
body {
247+
font-size: 14px;
248+
}
249+
}
250+
251+
@media screen and (max-width: 992px) and (min-width: 812px) and (orientation: landscape) {
252+
body {
253+
font-size: 8px;
254+
}
255+
}

0 commit comments

Comments
 (0)