Skip to content

Commit 9130b0c

Browse files
OpenSourceSimonOpenSourceSimon
committed
Added beginning of settings page
1 parent 91ec043 commit 9130b0c

5 files changed

Lines changed: 602 additions & 197 deletions

File tree

‎index.html‎

Lines changed: 76 additions & 74 deletions
Original file line numberDiff line numberDiff line change
@@ -5,94 +5,96 @@
55
<meta name="viewport" content="width=device-width, initial-scale=1">
66
<title>Blank Tab</title>
77
<script src="jquery.min.js"></script>
8-
<style>
8+
<style>
99

10-
body, html {
11-
height: 100%;
12-
margin: 0;
13-
}
10+
body, html {
11+
height: 100%;
12+
margin: 0;
13+
}
1414

15-
#bgimg {
16-
height: 100%;
17-
background-position: center;
18-
background-size: cover;
19-
position: relative;
20-
color: white;
21-
font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif;
22-
}
23-
.topleft {
24-
position: absolute;
25-
top: 0;
26-
left: 16px;
27-
}
15+
#bgimg {
16+
height: 100%;
17+
background-position: center;
18+
background-size: cover;
19+
position: relative;
20+
color: white;
21+
font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif;
22+
}
2823

29-
.middle {
30-
width: 100%;
31-
position: absolute;
32-
top: 45%;
33-
left: 50%;
34-
transform: translate(-50%, -50%);
35-
text-align: center;
36-
}
37-
.bottom{
38-
top: 95%;
39-
font-size: "20px";
40-
}
41-
.orignal_image{
42-
position: absolute;
43-
top: 95%;
44-
}
24+
.topleft {
25+
position: absolute;
26+
top: 0;
27+
left: 16px;
28+
}
4529

30+
.middle {
31+
width: 100%;
32+
position: absolute;
33+
top: 45%;
34+
left: 50%;
35+
transform: translate(-50%, -50%);
36+
text-align: center;
37+
}
4638

39+
.bottom {
40+
top: 95%;
41+
font-size: 20px;
42+
}
4743

48-
#myVideo {
49-
position: fixed;
50-
right: 0;
51-
bottom: 0;
52-
min-width: 100%;
53-
min-height: 100%;
54-
}
44+
.orignal_image {
45+
position: absolute;
46+
top: 95%;
47+
}
5548

56-
/* Add some content at the bottom of the video/page */
57-
.content {
58-
position: fixed;
59-
bottom: 0;
60-
background: rgba(0, 0, 0, 0.5);
61-
color: #f1f1f1;
62-
width: 100%;
63-
padding: 20px;
64-
}
6549

66-
/* Style the button used to pause/play the video */
67-
#myBtn {
68-
width: 200px;
69-
font-size: 18px;
70-
padding: 10px;
71-
border: none;
72-
background: #000;
73-
color: #fff;
74-
cursor: pointer;
75-
}
50+
#myVideo {
51+
position: fixed;
52+
right: 0;
53+
bottom: 0;
54+
min-width: 100%;
55+
min-height: 100%;
56+
}
7657

77-
#myBtn:hover {
78-
background: #ddd;
79-
color: black;
80-
}
58+
/* Add some content at the bottom of the video/page */
59+
.content {
60+
position: fixed;
61+
bottom: 0;
62+
background: rgba(0, 0, 0, 0.5);
63+
color: #f1f1f1;
64+
width: 100%;
65+
padding: 20px;
66+
}
8167

68+
/* Style the button used to pause/play the video */
69+
#myBtn {
70+
width: 200px;
71+
font-size: 18px;
72+
padding: 10px;
73+
border: none;
74+
background: #000;
75+
color: #fff;
76+
cursor: pointer;
77+
}
8278

83-
</style>
79+
#myBtn:hover {
80+
background: #ddd;
81+
color: black;
82+
}
83+
84+
85+
</style>
8486

8587
</head>
8688
<body>
87-
<script defer src="index.js"></script>
89+
<script defer src="index.js"></script>
8890
<div id="bgimg">
89-
<video muted loop id="myVideo"></video>
90-
<div class="middle">
91-
<span style="font-size: 20vh;font-weight: 100;text-shadow: 0 0 2px gray;" id="time"></span><br>
92-
<span style=" font-size: 5vh;font-weight: 200;text-shadow: 0 0 2px gray;" id="date"></span><br><br>
93-
</div>
94-
<div class="middle bottom" id="quote">
95-
</div>
96-
</div>
91+
<video muted loop id="myVideo"></video>
92+
<div class="middle">
93+
<span style="font-size: 20vh;font-weight: 100;text-shadow: 0 0 2px gray;" id="time"></span><br>
94+
<span style=" font-size: 5vh;font-weight: 200;text-shadow: 0 0 2px gray;" id="date"></span><br><br>
95+
</div>
96+
<div class="middle bottom" id="quote">
97+
</div>
98+
</div>
9799
</body>
98100
</html>

0 commit comments

Comments
 (0)