Added Google Maps
This commit is contained in:
parent
23f1028f69
commit
dd88dee4e7
@ -132,11 +132,6 @@ nav li a:focus::after{
|
|||||||
}
|
}
|
||||||
|
|
||||||
/* Responsive Functions */
|
/* Responsive Functions */
|
||||||
@media (max-width: 1156px) {
|
|
||||||
#signup-header {
|
|
||||||
margin-top: 20px;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
@media (max-width: 880px) {
|
@media (max-width: 880px) {
|
||||||
#photo-release-container {
|
#photo-release-container {
|
||||||
transform: scale(0.8);
|
transform: scale(0.8);
|
||||||
@ -739,6 +734,7 @@ section {
|
|||||||
margin-top: 30px;
|
margin-top: 30px;
|
||||||
margin-left: 0;
|
margin-left: 0;
|
||||||
text-align: left;
|
text-align: left;
|
||||||
|
margin-bottom: 20px;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
@media (max-width: 480px) {
|
@media (max-width: 480px) {
|
||||||
@ -982,6 +978,29 @@ section {
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
#map-article {
|
||||||
|
margin: 20px 100px;
|
||||||
|
}
|
||||||
|
|
||||||
|
#map-title {
|
||||||
|
font-size: 25px;
|
||||||
|
margin-bottom: 10px;
|
||||||
|
}
|
||||||
|
|
||||||
|
#google-maps {
|
||||||
|
border-radius: 10px;
|
||||||
|
padding: 3px;
|
||||||
|
height: 500px;
|
||||||
|
border: 1px solid white;
|
||||||
|
}
|
||||||
|
|
||||||
|
#map {
|
||||||
|
border: 0;
|
||||||
|
border-radius: 10px;
|
||||||
|
width: 100%;
|
||||||
|
height: 100%;
|
||||||
|
}
|
||||||
|
|
||||||
#rules-description {
|
#rules-description {
|
||||||
margin: 10px 20px;
|
margin: 10px 20px;
|
||||||
font-size: 18px;
|
font-size: 18px;
|
||||||
@ -1261,6 +1280,15 @@ section {
|
|||||||
border: 0px solid rgb(54, 54, 54);
|
border: 0px solid rgb(54, 54, 54);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@keyframes card-pullout {
|
||||||
|
0% {
|
||||||
|
transform: rotate3d(0, 1, 0, 0deg);
|
||||||
|
}
|
||||||
|
100% {
|
||||||
|
transform: rotate3d(0, 1, 0, 360deg);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
.team-entry:hover {
|
.team-entry:hover {
|
||||||
transform: scale(1.01);
|
transform: scale(1.01);
|
||||||
border: 1px solid rgb(54, 54, 54);
|
border: 1px solid rgb(54, 54, 54);
|
||||||
@ -1270,6 +1298,7 @@ section {
|
|||||||
.team-picture {
|
.team-picture {
|
||||||
width: auto;
|
width: auto;
|
||||||
height: auto;
|
height: auto;
|
||||||
|
animation: card-pullout ease 2s;
|
||||||
}
|
}
|
||||||
|
|
||||||
.team-picture img {
|
.team-picture img {
|
||||||
|
@ -257,6 +257,12 @@
|
|||||||
</div>
|
</div>
|
||||||
</article>
|
</article>
|
||||||
</div>
|
</div>
|
||||||
|
<article id="map-article">
|
||||||
|
<h2 id="map-title">Event Location</h2>
|
||||||
|
<div id="google-maps">
|
||||||
|
<iframe id="map" src="https://www.google.com/maps/embed?pb=!1m18!1m12!1m3!1d3186.195428202165!2d-121.5748893844308!3d37.00513386383601!2m3!1f0!2f0!3f0!3m2!1i1024!2i768!4f13.1!3m3!1m2!1s0x8091e3b7411b6c7b%3A0x23a4a857b416c1de!2sGilroy%20Library!5e0!3m2!1sen!2sus!4v1654314375400!5m2!1sen!2sus" allowfullscreen="" loading="lazy" referrerpolicy="no-referrer-when-downgrade"></iframe>
|
||||||
|
</div>
|
||||||
|
</article>
|
||||||
</section>
|
</section>
|
||||||
<section id="rules">
|
<section id="rules">
|
||||||
<h2 class="topic">Rules</h2>
|
<h2 class="topic">Rules</h2>
|
||||||
|
@ -46,6 +46,7 @@ const observer = new IntersectionObserver(entries => {
|
|||||||
observer.observe(document.querySelector('#event-main-box'));
|
observer.observe(document.querySelector('#event-main-box'));
|
||||||
observer.observe(document.querySelector('#timeline'));
|
observer.observe(document.querySelector('#timeline'));
|
||||||
observer.observe(document.querySelector('#signup-article'));
|
observer.observe(document.querySelector('#signup-article'));
|
||||||
|
observer.observe(document.querySelector('#map-article'));
|
||||||
observer.observe(document.querySelector('#rules-description'));
|
observer.observe(document.querySelector('#rules-description'));
|
||||||
observer.observe(document.querySelector('#guidelines'));
|
observer.observe(document.querySelector('#guidelines'));
|
||||||
observer.observe(document.querySelector('#code-of-conduct'));
|
observer.observe(document.querySelector('#code-of-conduct'));
|
||||||
|
Loading…
Reference in New Issue
Block a user