Better responsiveness
This commit is contained in:
parent
a0b74b7d17
commit
bf72fc524f
@ -149,6 +149,7 @@ nav ul li {
|
|||||||
top: 16px;
|
top: 16px;
|
||||||
font-size: 20px;
|
font-size: 20px;
|
||||||
margin: auto;
|
margin: auto;
|
||||||
|
min-width: 310px;
|
||||||
}
|
}
|
||||||
|
|
||||||
#banner-text {
|
#banner-text {
|
||||||
@ -314,7 +315,7 @@ nav ul li {
|
|||||||
}
|
}
|
||||||
#banner {
|
#banner {
|
||||||
display: inline-flex;
|
display: inline-flex;
|
||||||
width: 300px;
|
width: 310px;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
@media (max-width: 750px) {
|
@media (max-width: 750px) {
|
||||||
|
@ -159,6 +159,7 @@ nav ul li {
|
|||||||
top: 16px;
|
top: 16px;
|
||||||
font-size: 20px;
|
font-size: 20px;
|
||||||
margin: auto;
|
margin: auto;
|
||||||
|
min-width: 310px;
|
||||||
}
|
}
|
||||||
|
|
||||||
#banner-text {
|
#banner-text {
|
||||||
@ -218,6 +219,11 @@ nav ul li {
|
|||||||
}
|
}
|
||||||
|
|
||||||
/* Responsive Functions */
|
/* Responsive Functions */
|
||||||
|
@media (max-width: 1400px) {
|
||||||
|
#banner {
|
||||||
|
width: 50%;
|
||||||
|
}
|
||||||
|
}
|
||||||
@media (max-width: 1150px) {
|
@media (max-width: 1150px) {
|
||||||
#banner {
|
#banner {
|
||||||
display: none;
|
display: none;
|
||||||
@ -263,13 +269,9 @@ nav ul li {
|
|||||||
background-position: unset !important;
|
background-position: unset !important;
|
||||||
background-size: unset !important;
|
background-size: unset !important;
|
||||||
}
|
}
|
||||||
#logo {
|
|
||||||
height: 300px !important;
|
|
||||||
width: 300px !important;
|
|
||||||
}
|
|
||||||
#banner {
|
#banner {
|
||||||
display: inline-flex;
|
display: inline-flex;
|
||||||
width: 300px;
|
width: 310px;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
@media (max-width: 750px) {
|
@media (max-width: 750px) {
|
||||||
@ -420,20 +422,6 @@ nav ul li {
|
|||||||
transition: 0.5s;
|
transition: 0.5s;
|
||||||
}
|
}
|
||||||
|
|
||||||
#entrance-arrow {
|
|
||||||
width: 50px;
|
|
||||||
height: 50px;
|
|
||||||
position: absolute;
|
|
||||||
bottom: 10px;
|
|
||||||
float: bottom;
|
|
||||||
animation: bounce 3s infinite;
|
|
||||||
}
|
|
||||||
|
|
||||||
#entrance-arrow:hover {
|
|
||||||
font-size: 17px;
|
|
||||||
transition: 0.1s;
|
|
||||||
}
|
|
||||||
|
|
||||||
#header-gradient {
|
#header-gradient {
|
||||||
width: 100%;
|
width: 100%;
|
||||||
height: 100%;
|
height: 100%;
|
||||||
@ -452,15 +440,6 @@ nav ul li {
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
@keyframes fadeInAnimation {
|
|
||||||
0% {
|
|
||||||
opacity: 0;
|
|
||||||
}
|
|
||||||
100% {
|
|
||||||
opacity: 1;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
/* Main Section */
|
/* Main Section */
|
||||||
main {
|
main {
|
||||||
width: 100%;
|
width: 100%;
|
||||||
@ -492,7 +471,7 @@ section {
|
|||||||
|
|
||||||
#license-list {
|
#license-list {
|
||||||
display: flex;
|
display: flex;
|
||||||
flex-flow: column;
|
flex-flow: column wrap;
|
||||||
width: 100%;
|
width: 100%;
|
||||||
height: auto;
|
height: auto;
|
||||||
margin: auto;
|
margin: auto;
|
||||||
@ -507,6 +486,7 @@ section {
|
|||||||
height: auto;
|
height: auto;
|
||||||
padding: 10px;
|
padding: 10px;
|
||||||
text-align: left;
|
text-align: left;
|
||||||
|
overflow-wrap: break-word;
|
||||||
}
|
}
|
||||||
|
|
||||||
/* Utilities */
|
/* Utilities */
|
||||||
|
@ -50,7 +50,7 @@
|
|||||||
<img id="nav-logo" src="img/Gilroy Hacks Logo [Summer-wide-2].png" alt="logo"/>
|
<img id="nav-logo" src="img/Gilroy Hacks Logo [Summer-wide-2].png" alt="logo"/>
|
||||||
</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="index.html#timeline">Opening Ceremony</a> in
|
||||||
<abbr class="tooltip-nav" title="Aug 12, 4pm"><span id="timer"></span></abbr>
|
<abbr class="tooltip-nav" title="Aug 12, 4pm"><span id="timer"></span></abbr>
|
||||||
<!-- <span id="nav-tooltip" data-text="Aug 12, 4pm"></span> -->
|
<!-- <span id="nav-tooltip" data-text="Aug 12, 4pm"></span> -->
|
||||||
</p>
|
</p>
|
||||||
@ -60,12 +60,12 @@
|
|||||||
<label for="check" class="checkbtn">
|
<label for="check" class="checkbtn">
|
||||||
<img src="img/bars.png" loading="lazy" height="17" width="25" alt="Bars"/>
|
<img src="img/bars.png" loading="lazy" height="17" width="25" alt="Bars"/>
|
||||||
</label>
|
</label>
|
||||||
<a onclick="check('01'); save();" target="_blank" href="https://forms.gle/coK7q43RwBV2f15i7"><div id="sign-up">SIGN UP</div></a>
|
<a target="_blank" href="https://forms.gle/coK7q43RwBV2f15i7"><div id="sign-up">SIGN UP</div></a>
|
||||||
<ul id="navList">
|
<ul id="navList">
|
||||||
<li><a class="navlink" onclick="uncheck('check')" href="#event">Event</a></li>
|
<li><a class="navlink" href="index.html#event">Event</a></li>
|
||||||
<li><a class="navlink" onclick="uncheck('check')" href="#rules">Rules</a></li>
|
<li><a class="navlink" href="index.html#rules">Rules</a></li>
|
||||||
<li><a class="navlink" onclick="uncheck('check')" href="#prizes">Prizes</a></li>
|
<li><a class="navlink" href="index.html#prizes">Prizes</a></li>
|
||||||
<li><a class="navlink" onclick="uncheck('check')" href="#team">Team</a></li>
|
<li><a class="navlink" href="index.html#team">Team</a></li>
|
||||||
</ul>
|
</ul>
|
||||||
</div>
|
</div>
|
||||||
</nav>
|
</nav>
|
||||||
@ -243,8 +243,8 @@
|
|||||||
<article id="footer-links">
|
<article id="footer-links">
|
||||||
<h3>Links</h3><br>
|
<h3>Links</h3><br>
|
||||||
<ul>
|
<ul>
|
||||||
<li><a class="link" onclick="check('02'); save()" target="_blank" href="https://discord.gg/nkTDKMcYbr" title="Discord Invite Link">Discord</a></li>
|
<li><a class="link" target="_blank" href="https://discord.gg/nkTDKMcYbr" title="Discord Invite Link">Discord</a></li>
|
||||||
<li><a class="link" onclick="check('01'); save();" target="_blank" href="https://forms.gle/coK7q43RwBV2f15i7">Signup Form</a></li>
|
<li><a class="link" target="_blank" href="https://forms.gle/coK7q43RwBV2f15i7">Signup Form</a></li>
|
||||||
<li><a class="link" target="_blank" href="https://sccl.bibliocommons.com/events/62acbe100685eb4200c37c48" title="Gilroy Library Event">Library Event Entry</a></li>
|
<li><a class="link" target="_blank" href="https://sccl.bibliocommons.com/events/62acbe100685eb4200c37c48" title="Gilroy Library Event">Library Event Entry</a></li>
|
||||||
<li><a class="link" href="licenses.html" title="Licenses">Licenses</a></li>
|
<li><a class="link" href="licenses.html" title="Licenses">Licenses</a></li>
|
||||||
<li><a class="link" target="_blank" href="mailto:tech@gilroyhacks.com" title="Email">Email Us</a></li>
|
<li><a class="link" target="_blank" href="mailto:tech@gilroyhacks.com" title="Email">Email Us</a></li>
|
||||||
|
Loading…
Reference in New Issue
Block a user