Added Responsiveness
This commit is contained in:
parent
7db0836bc8
commit
44b0c0182b
@ -153,12 +153,12 @@ nav li a:focus::after{
|
||||
#banner {
|
||||
height: 100%;
|
||||
/* width: 50%; */
|
||||
width: 500px;
|
||||
width: 380px;
|
||||
margin: auto;
|
||||
font-size: 20px;
|
||||
display: inline-flex;
|
||||
position: relative;
|
||||
justify-content: center;
|
||||
justify-content: left;
|
||||
overflow: hidden;
|
||||
align-items: center;
|
||||
}
|
||||
@ -171,7 +171,14 @@ nav li a:focus::after{
|
||||
|
||||
#timer {
|
||||
color: rgb(184, 184, 184);
|
||||
animation: blinking 2s infinite;
|
||||
animation: blinking 3s infinite;
|
||||
background-color: rgb(57, 57, 57);
|
||||
border-radius: 10px;
|
||||
padding: 2px 5px;
|
||||
}
|
||||
|
||||
.tooltip-nav {
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
@keyframes blinking {
|
||||
@ -179,13 +186,13 @@ nav li a:focus::after{
|
||||
opacity: 1;
|
||||
}
|
||||
50% {
|
||||
opacity: 0.7;
|
||||
opacity: 0.8;
|
||||
}
|
||||
100% {
|
||||
opacity: 1;
|
||||
}
|
||||
}
|
||||
@keyframes headline {
|
||||
/* @keyframes headline {
|
||||
0% {
|
||||
transform: translateX(600px);
|
||||
}
|
||||
@ -195,7 +202,7 @@ nav li a:focus::after{
|
||||
100% {
|
||||
transform: translateX(-600px);
|
||||
}
|
||||
}
|
||||
} */
|
||||
|
||||
/* .notification {
|
||||
position: absolute;
|
||||
@ -223,7 +230,7 @@ nav li a:focus::after{
|
||||
}
|
||||
|
||||
/* Responsive Functions */
|
||||
@media (max-width: 1250px) {
|
||||
@media (max-width: 1150px) {
|
||||
#banner {
|
||||
display: none;
|
||||
}
|
||||
@ -272,6 +279,15 @@ nav li a:focus::after{
|
||||
height: 300px !important;
|
||||
width: 300px !important;
|
||||
}
|
||||
#banner {
|
||||
display: inline-flex;
|
||||
width: 300px;
|
||||
}
|
||||
}
|
||||
@media (max-width: 750px) {
|
||||
#banner {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
@media (max-width: 500px) {
|
||||
#event, #rules, #prizes, #team {
|
||||
@ -295,19 +311,18 @@ nav li a:focus::after{
|
||||
transform: scale(0.9);
|
||||
}
|
||||
}
|
||||
@media (max-height: 500px) {
|
||||
@media (max-height: 600px) {
|
||||
#logo {
|
||||
height: 200px !important;
|
||||
width: 200px !important;
|
||||
transform: scale(0.8);
|
||||
}
|
||||
#header-subtitle-date {
|
||||
height: 25px;
|
||||
font-size: 15px;
|
||||
transform: translateY(-50px);
|
||||
}
|
||||
#header-subtitle-spots {
|
||||
height: 25px;
|
||||
font-size: 15px;
|
||||
padding: 3px !important;
|
||||
#spots-container {
|
||||
transform: translateY(-50px);
|
||||
}
|
||||
#line-header {
|
||||
transform: translateY(-50px);
|
||||
}
|
||||
#entrance-arrow {
|
||||
visibility: hidden;
|
||||
@ -1780,7 +1795,7 @@ section {
|
||||
}
|
||||
}
|
||||
|
||||
abbr[title] {
|
||||
.tooltip {
|
||||
text-decoration: underline dotted;
|
||||
cursor: help;
|
||||
}
|
||||
|
||||
BIN
img/.DS_Store
vendored
Normal file
BIN
img/.DS_Store
vendored
Normal file
Binary file not shown.
@ -62,7 +62,7 @@
|
||||
<li><a onclick="uncheck('check')" href="#team">Team</a></li>
|
||||
</ul>
|
||||
<div id="banner">
|
||||
<p id="banner-text">Next event:<br>Opening Ceremony, <span id="timer"></span></p>
|
||||
<p id="banner-text">Next event:<br>Opening Ceremony <abbr class="tooltip-nav" title="Aug 12, 4pm"><span id="timer"></span></abbr></p>
|
||||
</div>
|
||||
</div>
|
||||
</nav>
|
||||
@ -419,7 +419,7 @@
|
||||
</div>
|
||||
</article>
|
||||
<article id="map-div">
|
||||
<h2 class="map-title">Map</h2>
|
||||
<h2 class="map-title">Location</h2>
|
||||
<div id="map-container">
|
||||
<div id="map"></div>
|
||||
</div>
|
||||
@ -448,7 +448,7 @@
|
||||
<div class="rules-card" id="rules-2">
|
||||
<p class="rules-title">Do not plagiarize</p>
|
||||
<p>
|
||||
- You are allowed to use existing libraries and packages with a valid license and give credit when credit is due (required, unless under Creative Commons or <abbr title="Open-source software is computer software that is released under a license in which the copyright holder grants users the rights to use, study, change, and distribute the software and its source code to anyone and for any purpose">Open Source Licensing</abbr>)
|
||||
- You are allowed to use existing libraries and packages with a valid license and give credit when credit is due (required, unless under Creative Commons or <abbr class="tooltip" title="Open-source software is computer software that is released under a license in which the copyright holder grants users the rights to use, study, change, and distribute the software and its source code to anyone and for any purpose">Open Source Licensing</abbr>)
|
||||
<br>
|
||||
- You may also use old projects as frameworks for your product, but you cannot work on any material that is related to the hackathon before the event
|
||||
</p>
|
||||
|
||||
56
js/timer.js
56
js/timer.js
@ -1,29 +1,29 @@
|
||||
// SRC: W3Schools https://www.w3schools.com/howto/howto_js_countdown.asp
|
||||
// Set the date we're counting down to
|
||||
var countDownDate = new Date("Aug 12, 2022 16:00:00").getTime();
|
||||
|
||||
// Update the count down every 1 second
|
||||
var x = setInterval(function() {
|
||||
|
||||
// Get today's date and time
|
||||
var now = new Date().getTime();
|
||||
|
||||
// Find the distance between now and the count down date
|
||||
var distance = countDownDate - now;
|
||||
|
||||
// Time calculations for days, hours, minutes and seconds
|
||||
var days = Math.floor(distance / (1000 * 60 * 60 * 24));
|
||||
var hours = Math.floor((distance % (1000 * 60 * 60 * 24)) / (1000 * 60 * 60));
|
||||
var minutes = Math.floor((distance % (1000 * 60 * 60)) / (1000 * 60));
|
||||
var seconds = Math.floor((distance % (1000 * 60)) / 1000);
|
||||
|
||||
// Display the result in the element with id="demo"
|
||||
document.getElementById("timer").innerHTML = days + "d " + hours + "h";
|
||||
// + minutes + "m " + seconds + "s ";
|
||||
|
||||
// If the count down is finished, write some text
|
||||
if (distance < 0) {
|
||||
clearInterval(x);
|
||||
document.getElementById("timer").innerHTML = "NOW";
|
||||
}
|
||||
// SRC: W3Schools https://www.w3schools.com/howto/howto_js_countdown.asp
|
||||
// Set the date we're counting down to
|
||||
var countDownDate = new Date("Aug 12, 2022 16:00:00").getTime();
|
||||
|
||||
// Update the count down every 1 second
|
||||
var x = setInterval(function() {
|
||||
|
||||
// Get today's date and time
|
||||
var now = new Date().getTime();
|
||||
|
||||
// Find the distance between now and the count down date
|
||||
var distance = countDownDate - now;
|
||||
|
||||
// Time calculations for days, hours, minutes and seconds
|
||||
var days = Math.floor(distance / (1000 * 60 * 60 * 24));
|
||||
var hours = Math.floor((distance % (1000 * 60 * 60 * 24)) / (1000 * 60 * 60));
|
||||
var minutes = Math.floor((distance % (1000 * 60 * 60)) / (1000 * 60));
|
||||
var seconds = Math.floor((distance % (1000 * 60)) / 1000);
|
||||
|
||||
// Display the result in the element with id="demo"
|
||||
document.getElementById("timer").innerHTML = days + "d " + hours + "h";
|
||||
// + minutes + "m " + seconds + "s ";
|
||||
|
||||
// If the count down is finished, write some text
|
||||
if (distance < 0) {
|
||||
clearInterval(x);
|
||||
document.getElementById("timer").innerHTML = "NOW";
|
||||
}
|
||||
}, 1000);
|
||||
22
sitemap.xml
22
sitemap.xml
@ -1,16 +1,16 @@
|
||||
<?xml version="1.0" encoding="UTF-8"?>
|
||||
<urlset
|
||||
xmlns="http://www.sitemaps.org/schemas/sitemap/0.9"
|
||||
xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
|
||||
xsi:schemaLocation="http://www.sitemaps.org/schemas/sitemap/0.9
|
||||
http://www.sitemaps.org/schemas/sitemap/0.9/sitemap.xsd">
|
||||
<!-- created with Free Online Sitemap Generator www.xml-sitemaps.com -->
|
||||
|
||||
<?xml version="1.0" encoding="UTF-8"?>
|
||||
<urlset
|
||||
xmlns="http://www.sitemaps.org/schemas/sitemap/0.9"
|
||||
xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
|
||||
xsi:schemaLocation="http://www.sitemaps.org/schemas/sitemap/0.9
|
||||
http://www.sitemaps.org/schemas/sitemap/0.9/sitemap.xsd">
|
||||
<!-- created with Free Online Sitemap Generator www.xml-sitemaps.com -->
|
||||
|
||||
|
||||
<url>
|
||||
<loc>https://gilroyhacks.com/</loc>
|
||||
<lastmod>2022-06-13T21:30:01+00:00</lastmod>
|
||||
</url>
|
||||
|
||||
|
||||
</url>
|
||||
|
||||
|
||||
</urlset>
|
||||
Loading…
Reference in New Issue
Block a user