Added Tooltips

This commit is contained in:
James Dinh 2022-07-21 18:27:04 -07:00
parent 0ed6a483dc
commit 772062103b
2 changed files with 32 additions and 4 deletions

View File

@ -1301,6 +1301,18 @@ section {
transform-origin: left; transform-origin: left;
} }
#facebook::after {
content: 'Facebook';
right: -34px;
color: rgb(255, 208, 137)
}
#instagram::after {
content: 'Instagram';
right: -35px;
color: rgb(255, 208, 137)
}
#sponsor-heading { #sponsor-heading {
margin: 30px 0 0; margin: 30px 0 0;
} }
@ -1492,6 +1504,14 @@ section {
border-radius: 10px; border-radius: 10px;
position: relative; position: relative;
z-index: 1; z-index: 1;
align-items: center;
}
/* Workshops */
.flex-container {
display: flex;
flex-flow: row wrap;
} }
#rules-description { #rules-description {

View File

@ -73,7 +73,7 @@
</a> </a>
<div id="banner"> <div id="banner">
<p id="banner-text"><a class="navlink" id="timer-link" href="#timeline">Opening Ceremony</a> in <p id="banner-text"><a class="navlink" id="timer-link" href="#timeline">Opening Ceremony</a> in
<span id="timer"></span> <span id="timer">---</span>
</p> </p>
</div> </div>
<div id="nav-links-container"> <div id="nav-links-container">
@ -461,12 +461,20 @@
<article id="map-div"> <article id="map-div">
<h2 class="map-title">Location</h2> <h2 class="map-title">Location</h2>
<div id="map-container"> <div id="map-container">
<div id="map"></div> <div id="map">Gilroy Library<br>350 W 6th St, Gilroy, CA 95020</div>
</div> </div>
</article> </article>
</div> </div>
</article> </article>
</section> </section>
<section id="workshops">
<h2 class="topic">Workshops</h2>
<hr class="line">
(under construction)
<div class="flex-container">
</div>
</section>
<section id="rules"> <section id="rules">
<h2 class="topic">Rules</h2> <h2 class="topic">Rules</h2>
<hr class="line"> <hr class="line">
@ -761,8 +769,8 @@
Gilroy Hacks is a student-led organization focused on promoting community engagement and improving STEM exposure for local middle/high school students. Gilroy Hacks is a student-led organization focused on promoting community engagement and improving STEM exposure for local middle/high school students.
</p> </p>
<div id="socials"> <div id="socials">
<div><a target="_blank" href="https://www.facebook.com/profile.php?id=100082498013066" title="Facebook"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="#ffffff"><path d="M12 0c6.627 0 12 5.373 12 12s-5.373 12-12 12S0 18.627 0 12 5.373 0 12 0zm4 7.278V4.5h-2.286c-2.1 0-3.428 1.6-3.428 3.889v1.667H8v2.777h2.286V19.5h2.857v-6.667h2.286L16 10.056h-2.857V8.944c0-1.11.572-1.666 1.714-1.666H16z"/></svg></a></div> <div><a class="tooltip" id="facebook" target="_blank" href="https://www.facebook.com/profile.php?id=100082498013066" title="Facebook"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="#ffffff"><path d="M12 0c6.627 0 12 5.373 12 12s-5.373 12-12 12S0 18.627 0 12 5.373 0 12 0zm4 7.278V4.5h-2.286c-2.1 0-3.428 1.6-3.428 3.889v1.667H8v2.777h2.286V19.5h2.857v-6.667h2.286L16 10.056h-2.857V8.944c0-1.11.572-1.666 1.714-1.666H16z"/></svg></a></div>
<div class="socials-icon"><a target="_blank" href="https://www.instagram.com/gilroyhacks/" title="Instagram"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="#ffffff"><path d="M12 0c6.6274 0 12 5.3726 12 12s-5.3726 12-12 12S0 18.6274 0 12 5.3726 0 12 0zm3.115 4.5h-6.23c-2.5536 0-4.281 1.6524-4.3805 4.1552L4.5 8.8851v6.1996c0 1.3004.4234 2.4193 1.2702 3.2359.7582.73 1.751 1.1212 2.8818 1.1734l.2633.006h6.1694c1.3004 0 2.389-.4234 3.1754-1.1794.762-.734 1.1817-1.7576 1.2343-2.948l.0056-.2577V8.8851c0-1.2702-.4234-2.3589-1.2097-3.1452-.7338-.762-1.7575-1.1817-2.9234-1.2343l-.252-.0056zM8.9152 5.8911h6.2299c.9072 0 1.6633.2722 2.2076.8166.4713.499.7647 1.1758.8103 1.9607l.0063.2167v6.2298c0 .9375-.3327 1.6936-.877 2.2077-.499.4713-1.176.7392-1.984.7806l-.2237.0057H8.9153c-.9072 0-1.6633-.2722-2.2076-.7863-.499-.499-.7693-1.1759-.8109-2.0073l-.0057-.2306V8.885c0-.9073.2722-1.6633.8166-2.2077.4712-.4713 1.1712-.7392 1.9834-.7806l.2242-.0057h6.2299-6.2299zM12 8.0988c-2.117 0-3.871 1.7238-3.871 3.871A3.8591 3.8591 0 0 0 12 15.8408c2.1472 0 3.871-1.7541 3.871-3.871 0-2.117-1.754-3.871-3.871-3.871zm0 1.3911c1.3609 0 2.4798 1.119 2.4798 2.4799 0 1.3608-1.119 2.4798-2.4798 2.4798-1.3609 0-2.4798-1.119-2.4798-2.4798 0-1.361 1.119-2.4799 2.4798-2.4799zm4.0222-2.3589a.877.877 0 1 0 0 1.754.877.877 0 0 0 0-1.754z"/></svg></a></div> <div class="socials-icon"><a class="tooltip" id="instagram" target="_blank" href="https://www.instagram.com/gilroyhacks/" title="Instagram"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="#ffffff"><path d="M12 0c6.6274 0 12 5.3726 12 12s-5.3726 12-12 12S0 18.6274 0 12 5.3726 0 12 0zm3.115 4.5h-6.23c-2.5536 0-4.281 1.6524-4.3805 4.1552L4.5 8.8851v6.1996c0 1.3004.4234 2.4193 1.2702 3.2359.7582.73 1.751 1.1212 2.8818 1.1734l.2633.006h6.1694c1.3004 0 2.389-.4234 3.1754-1.1794.762-.734 1.1817-1.7576 1.2343-2.948l.0056-.2577V8.8851c0-1.2702-.4234-2.3589-1.2097-3.1452-.7338-.762-1.7575-1.1817-2.9234-1.2343l-.252-.0056zM8.9152 5.8911h6.2299c.9072 0 1.6633.2722 2.2076.8166.4713.499.7647 1.1758.8103 1.9607l.0063.2167v6.2298c0 .9375-.3327 1.6936-.877 2.2077-.499.4713-1.176.7392-1.984.7806l-.2237.0057H8.9153c-.9072 0-1.6633-.2722-2.2076-.7863-.499-.499-.7693-1.1759-.8109-2.0073l-.0057-.2306V8.885c0-.9073.2722-1.6633.8166-2.2077.4712-.4713 1.1712-.7392 1.9834-.7806l.2242-.0057h6.2299-6.2299zM12 8.0988c-2.117 0-3.871 1.7238-3.871 3.871A3.8591 3.8591 0 0 0 12 15.8408c2.1472 0 3.871-1.7541 3.871-3.871 0-2.117-1.754-3.871-3.871-3.871zm0 1.3911c1.3609 0 2.4798 1.119 2.4798 2.4799 0 1.3608-1.119 2.4798-2.4798 2.4798-1.3609 0-2.4798-1.119-2.4798-2.4798 0-1.361 1.119-2.4799 2.4798-2.4799zm4.0222-2.3589a.877.877 0 1 0 0 1.754.877.877 0 0 0 0-1.754z"/></svg></a></div>
</div> </div>
<hr id="footer-line"> <hr id="footer-line">
<p id="footer-copyright"> <p id="footer-copyright">