Spaces:
Running
Running
BraydenMoore
commited on
Commit
•
7e57aa3
1
Parent(s):
1c6395a
Update templates/index.html
Browse files- templates/index.html +1 -16
templates/index.html
CHANGED
@@ -13,7 +13,6 @@
|
|
13 |
padding-top: 3%;
|
14 |
margin-left: 5vw;
|
15 |
}
|
16 |
-
|
17 |
.pulse {
|
18 |
width: 40px;
|
19 |
height: 40px;
|
@@ -25,7 +24,6 @@
|
|
25 |
margin-left: -20px;
|
26 |
margin-top: -20px;
|
27 |
}
|
28 |
-
|
29 |
.dot {
|
30 |
border-style: solid;
|
31 |
border-width: 2px;
|
@@ -38,25 +36,21 @@
|
|
38 |
margin-left: -4.5px;
|
39 |
margin-top: -4.5px;
|
40 |
}
|
41 |
-
|
42 |
@keyframes pulse-animation {
|
43 |
0% { transform: scale(0.1); opacity: 0.4; }
|
44 |
100% { transform: scale(3); opacity: 0; }
|
45 |
}
|
46 |
-
|
47 |
.flex-container {
|
48 |
display: flex;
|
49 |
justify-content: left;
|
50 |
align-items: top;
|
51 |
}
|
52 |
-
|
53 |
.outer-container {
|
54 |
margin-left: 2%;
|
55 |
justify-content: left;
|
56 |
align-items: left;
|
57 |
max-width: 70vw;
|
58 |
}
|
59 |
-
|
60 |
.feed {
|
61 |
padding: 1%;
|
62 |
border-style: solid;
|
@@ -67,15 +61,12 @@
|
|
67 |
min-width: 50%;
|
68 |
height: 65vh;
|
69 |
}
|
70 |
-
|
71 |
-
|
72 |
.map {
|
73 |
width: 100%;
|
74 |
height: 100%;
|
75 |
object-fit: cover;
|
76 |
margin: auto;
|
77 |
}
|
78 |
-
|
79 |
.map-div {
|
80 |
padding: 1%;
|
81 |
position: relative;
|
@@ -85,7 +76,6 @@
|
|
85 |
margin-bottom: 3%;
|
86 |
box-sizing: border-box;
|
87 |
}
|
88 |
-
|
89 |
.info {
|
90 |
min-width: 30vw;
|
91 |
display: flex;
|
@@ -98,11 +88,9 @@
|
|
98 |
color: black;
|
99 |
transition: 0.5s ease-in-out;
|
100 |
}
|
101 |
-
|
102 |
a {
|
103 |
color:rgb(83, 83, 83);
|
104 |
}
|
105 |
-
|
106 |
@media only screen and (orientation: portrait) {
|
107 |
body {
|
108 |
margin-left: auto;
|
@@ -127,7 +115,6 @@
|
|
127 |
height: 65vh;
|
128 |
}
|
129 |
}
|
130 |
-
|
131 |
</style>
|
132 |
</head>
|
133 |
|
@@ -136,7 +123,7 @@
|
|
136 |
<p style="color:rgb(83, 83, 83); font-family: 'Helvetica'; font-weight: 50;"> a random unsecured camera in</p>
|
137 |
<h1 style="color:rgb(83, 83, 83); font-family: 'Helvetica'; font-weight: 50; margin-bottom: 3%;"> {{ country }}</h1>
|
138 |
<div class="flex-container">
|
139 |
-
|
140 |
<div class="info">
|
141 |
|
142 |
<h3 style="border-bottom: 1px solid yellow; color:rgb(83, 83, 83); font-family: 'Helvetica'; font-weight: 50;">{{ name }}</h3>
|
@@ -178,7 +165,6 @@
|
|
178 |
|
179 |
|
180 |
<script>
|
181 |
-
|
182 |
document.addEventListener("DOMContentLoaded", function() {
|
183 |
const feed = document.getElementById("feed");
|
184 |
feed.src = "{{ url_for('static', filename='loading.gif') }}";
|
@@ -194,7 +180,6 @@
|
|
194 |
};
|
195 |
img.src = newUrl;
|
196 |
});
|
197 |
-
|
198 |
</script>
|
199 |
</body>
|
200 |
|
|
|
13 |
padding-top: 3%;
|
14 |
margin-left: 5vw;
|
15 |
}
|
|
|
16 |
.pulse {
|
17 |
width: 40px;
|
18 |
height: 40px;
|
|
|
24 |
margin-left: -20px;
|
25 |
margin-top: -20px;
|
26 |
}
|
|
|
27 |
.dot {
|
28 |
border-style: solid;
|
29 |
border-width: 2px;
|
|
|
36 |
margin-left: -4.5px;
|
37 |
margin-top: -4.5px;
|
38 |
}
|
|
|
39 |
@keyframes pulse-animation {
|
40 |
0% { transform: scale(0.1); opacity: 0.4; }
|
41 |
100% { transform: scale(3); opacity: 0; }
|
42 |
}
|
|
|
43 |
.flex-container {
|
44 |
display: flex;
|
45 |
justify-content: left;
|
46 |
align-items: top;
|
47 |
}
|
|
|
48 |
.outer-container {
|
49 |
margin-left: 2%;
|
50 |
justify-content: left;
|
51 |
align-items: left;
|
52 |
max-width: 70vw;
|
53 |
}
|
|
|
54 |
.feed {
|
55 |
padding: 1%;
|
56 |
border-style: solid;
|
|
|
61 |
min-width: 50%;
|
62 |
height: 65vh;
|
63 |
}
|
|
|
|
|
64 |
.map {
|
65 |
width: 100%;
|
66 |
height: 100%;
|
67 |
object-fit: cover;
|
68 |
margin: auto;
|
69 |
}
|
|
|
70 |
.map-div {
|
71 |
padding: 1%;
|
72 |
position: relative;
|
|
|
76 |
margin-bottom: 3%;
|
77 |
box-sizing: border-box;
|
78 |
}
|
|
|
79 |
.info {
|
80 |
min-width: 30vw;
|
81 |
display: flex;
|
|
|
88 |
color: black;
|
89 |
transition: 0.5s ease-in-out;
|
90 |
}
|
|
|
91 |
a {
|
92 |
color:rgb(83, 83, 83);
|
93 |
}
|
|
|
94 |
@media only screen and (orientation: portrait) {
|
95 |
body {
|
96 |
margin-left: auto;
|
|
|
115 |
height: 65vh;
|
116 |
}
|
117 |
}
|
|
|
118 |
</style>
|
119 |
</head>
|
120 |
|
|
|
123 |
<p style="color:rgb(83, 83, 83); font-family: 'Helvetica'; font-weight: 50;"> a random unsecured camera in</p>
|
124 |
<h1 style="color:rgb(83, 83, 83); font-family: 'Helvetica'; font-weight: 50; margin-bottom: 3%;"> {{ country }}</h1>
|
125 |
<div class="flex-container">
|
126 |
+
<img id="feed" class="feed" src="" />
|
127 |
<div class="info">
|
128 |
|
129 |
<h3 style="border-bottom: 1px solid yellow; color:rgb(83, 83, 83); font-family: 'Helvetica'; font-weight: 50;">{{ name }}</h3>
|
|
|
165 |
|
166 |
|
167 |
<script>
|
|
|
168 |
document.addEventListener("DOMContentLoaded", function() {
|
169 |
const feed = document.getElementById("feed");
|
170 |
feed.src = "{{ url_for('static', filename='loading.gif') }}";
|
|
|
180 |
};
|
181 |
img.src = newUrl;
|
182 |
});
|
|
|
183 |
</script>
|
184 |
</body>
|
185 |
|