Skip to content

Commit

Permalink
nav fixes + new color palette
Browse files Browse the repository at this point in the history
  • Loading branch information
@moonitini
moonitini committed Oct 9, 2024
1 parent b3b6ade commit 692859f
Show file tree
Hide file tree
Showing 15 changed files with 85 additions and 73 deletions.
6 changes: 3 additions & 3 deletions src/lib/components/Button.svelte
View file
Original file line number Diff line number Diff line change
Expand Up @@ -3,7 +3,7 @@

<script lang="ts">
type TiltRange = 'left' | 'right' | 'none';
type ButtonBackgroundColors = 'blue' | 'pink' | 'gold' | 'earth-green';
type ButtonBackgroundColors = 'blue' | 'pink' | 'gold' | 'green';
export let tilt: TiltRange;
export let backgroundColor: ButtonBackgroundColors;
Expand Down Expand Up @@ -62,8 +62,8 @@
.bg-gold {
background-color: $gold;
}
.bg-earth-green {
background-color: $earth-green;
.bg-green {
background-color: $lime;
}
</style>
2 changes: 1 addition & 1 deletion src/lib/components/FaqDetails.svelte
View file
Original file line number Diff line number Diff line change
Expand Up @@ -78,7 +78,7 @@
.content {
margin-top: 2px;
background-color: $blue;
background-color: $beige;
border-radius: 0.75em 0em 0.75em 0.75em;
outline: 2px solid transparent;
Expand Down
2 changes: 1 addition & 1 deletion src/lib/components/Footer.svelte
View file
Original file line number Diff line number Diff line change
Expand Up @@ -63,7 +63,7 @@
// Blue background
&::before {
content: '';
background-color: $blue;
background-color: $beige;
position: absolute;
inset: 3px 0 0 0;
z-index: -1;
Expand Down
3 changes: 2 additions & 1 deletion src/lib/components/Header.svelte
View file
Original file line number Diff line number Diff line change
Expand Up @@ -3,7 +3,8 @@
<style lang="scss">
h2 {
font-family: 'Lilita One', sans-serif;
color: $text-pink;
// color: $text-pink;
color: $text-green;
font-size: 3.5rem;
font-weight: 400;
margin: 0.5em 0;
Expand Down
12 changes: 6 additions & 6 deletions src/lib/components/NavbarDesktop.svelte
View file
Original file line number Diff line number Diff line change
Expand Up @@ -68,18 +68,18 @@
<li class:active={activeSection == 'about'} bind:this={aboutListElement}>
<a href="#about" on:click={toggleActive}>About</a>
</li>
<li class:active={activeSection == 'schedule'}>
<!-- <li class:active={activeSection == 'schedule'}>
<a href="#schedule" on:click={toggleActive}>Schedule</a>
</li>
</li> -->
<li class:active={activeSection == 'faqs'}>
<a href="#faqs" on:click={toggleActive}>FAQs</a>
</li>
<li class:active={activeSection == 'sponsors'}>
<a href="#sponsors" on:click={toggleActive}>Sponsors</a>
</li>
<li class:active={activeSection == 'keynote'}>
<!-- <li class:active={activeSection == 'keynote'}>
<a href="#keynote" on:click={toggleActive}>Keynote</a>
</li>
</li> -->
<li class:active={activeSection == 'team'}>
<a href="#team" on:click={toggleActive}>Team</a>
</li>
Expand Down Expand Up @@ -161,7 +161,7 @@
right: 0;
.navbar {
background-color: $blue;
background-color: $lime;
box-sizing: border-box;
border: 3px solid $brown;
border-radius: 1.5em;
Expand All @@ -182,7 +182,7 @@
content: '';
position: absolute;
height: 100%;
background-color: $dark-blue;
background-color: $beige;
outline: 3px solid $brown;
border-radius: 1em;
width: var(--activeWidth);
Expand Down
17 changes: 9 additions & 8 deletions src/lib/components/NavbarMobile.svelte
View file
Original file line number Diff line number Diff line change
Expand Up @@ -59,23 +59,23 @@
<div class="navbar">
<ul>
<li class:active={activeSection == 'home'}>
<a href="#" on:click={scrollToTop}>Home</a>
<a href="#/" on:click={scrollToTop}>Home</a>
</li>
<li class:active={activeSection == 'about'}>
<a href="#about" on:click={toggleActive}>About</a>
</li>
<li class:active={activeSection == 'schedule'}>
<!-- <li class:active={activeSection == 'schedule'}>
<a href="#schedule" on:click={toggleActive}>Schedule</a>
</li>
</li> -->
<li class:active={activeSection == 'faqs'}>
<a href="#faqs" on:click={toggleActive}>FAQs</a>
</li>
<li class:active={activeSection == 'sponsors'}>
<a href="#sponsors" on:click={toggleActive}>Sponsors</a>
</li>
<li class:active={activeSection == 'keynote'}>
<!-- <li class:active={activeSection == 'keynote'}>
<a href="#keynote" on:click={toggleActive}>Keynote</a>
</li>
</li> -->
<li class:active={activeSection == 'team'}>
<a href="#team" on:click={toggleActive}>Team</a>
</li>
Expand Down Expand Up @@ -143,7 +143,8 @@
.logo {
border: none;
background-color: $green;
// background-color: $green;
background-color: $lime;
padding: 0.5em 0.75em;
font-size: 1.2rem;
border-radius: 0.5em;
Expand Down Expand Up @@ -178,7 +179,7 @@
width 300ms ease-in-out,
padding 0ms 300ms linear,
outline 0ms 300ms linear;
background-color: $blue;
background-color: $green;
padding: 0;
ul {
Expand All @@ -194,7 +195,7 @@
padding: 0.25em;
&.active {
background-color: $dark-blue;
background-color: $lime;
border: 2px solid $brown;
border-radius: 0.5em;
}
Expand Down
6 changes: 3 additions & 3 deletions src/lib/components/sections/HeroSection.svelte
View file
Original file line number Diff line number Diff line change
Expand Up @@ -14,12 +14,12 @@
<!-- [END] Organizer application links -->

<!-- [BEGIN] Hackathon application links -->
<Button
<!-- <Button
tilt="left"
backgroundColor="earth-green"
backgroundColor="lime"
href="https://docs.google.com/forms/d/e/1FAIpQLSdqOgPcH2zSmEZerORxW13PubusZdtMttMavNi4oybVytdHVg/viewform?usp=sf_link"
target="_blank">Apply to be an Organizer!</Button
>
> -->
<!-- <Button
tilt="left"
backgroundColor="blue"
Expand Down
6 changes: 3 additions & 3 deletions src/lib/components/sections/Keynote.svelte
View file
Original file line number Diff line number Diff line change
Expand Up @@ -28,7 +28,7 @@
</div>
</section> -->

<style lang="scss">
<!-- <style lang="scss">
.keynote-wrapper {
display: flex;
justify-content: center;
Expand Down Expand Up @@ -81,5 +81,5 @@
text-align: center;
}
}
}
</style>
}
</style> -->
34 changes: 17 additions & 17 deletions src/lib/components/sections/Schedule.svelte
View file
Original file line number Diff line number Diff line change
Expand Up @@ -12,23 +12,23 @@
</section> -->

<style lang="scss">
.schedule {
margin-top: 3em;
display: flex;
position: relative;
gap: 4em 3em;
// .schedule {
// margin-top: 3em;
// display: flex;
// position: relative;
// gap: 4em 3em;
@include respond-to('small') {
flex-direction: column;
}
// @include respond-to('small') {
// flex-direction: column;
// }
div {
flex: 1;
img {
border-radius: 1.2em;
border: $brown 3px solid;
width: 100%;
}
}
}
// div {
// flex: 1;
// img {
// border-radius: 1.2em;
// border: $brown 3px solid;
// width: 100%;
// }
// }
// }
</style>
4 changes: 2 additions & 2 deletions src/lib/components/sections/Slideshow.svelte
View file
Original file line number Diff line number Diff line change
Expand Up @@ -70,7 +70,7 @@
flex-flow: column;
h2 {
font-family: 'Lilita One', sans-serif;
color: $purple;
color: $text-green;
margin: 0.25em 0;
font-size: 3.5rem;
font-weight: 400;
Expand All @@ -90,7 +90,7 @@
}
&.active {
color: $text-pink;
color: $pink;
&::before {
content: '🍰';
Expand Down
30 changes: 15 additions & 15 deletions src/lib/components/sections/Sponsors.svelte
View file
Original file line number Diff line number Diff line change
Expand Up @@ -82,25 +82,25 @@
}
}
.tier-1 {
width: 15%;
background-color: $gold;
.sponsor {
max-height: 110px;
}
}
// .tier-1 {
// width: 15%;
// background-color: $gold;
// .sponsor {
// max-height: 110px;
// }
// }
.tier-2 {
width: 30%;
background-color: $blue;
.sponsor {
max-height: 110px;
}
}
// .tier-2 {
// width: 30%;
// background-color: $blue;
// .sponsor {
// max-height: 110px;
// }
// }
.tier-3 {
width: 30%;
background-color: $pink;
background-color: $lime;
.sponsor {
max-height: 35px;
}
Expand Down
2 changes: 1 addition & 1 deletion src/lib/scss/_globals.scss
View file
Original file line number Diff line number Diff line change
Expand Up @@ -19,7 +19,7 @@ section {
}

b {
color: $text-pink;
color: $text-green;
}

a {
Expand Down
16 changes: 13 additions & 3 deletions src/lib/scss/_variables.scss
View file
Original file line number Diff line number Diff line change
Expand Up @@ -4,12 +4,22 @@ $blue: #BFE2FF;
$dark-blue: #93DDFC;
$brown: #401E0A;
$light-brown: #5A3019;
$pink: #FFB5CB;
// $pink: #FFB5CB;
$pink-hover: #ff83a8;
$green: #C6EDC5;
// $green: #C6EDC5;
$earth-green: #A3CB8F;
$purple: #5F4DD2;
$gold: #FFCB77;

$pink: #EE98A3;
$beige: #E0C1A0;
$lime: #CFDF7C;
$dark-brown: #85382A;
$green: #62C34F;

$text-gray: #322E39;
$text-pink: #F30075;
// $text-pink: #F30075;
$text-pink: #EE98A3;
// $text-green: #4F5F10;
$text-green: #2B310B;
$text-brown: #85382A;
10 changes: 5 additions & 5 deletions src/routes/+layout.svelte
View file
Original file line number Diff line number Diff line change
Expand Up @@ -48,11 +48,11 @@
height: auto;
}
p {
font-family: 'Lilita One', sans-serif;
color: $brown;
font-size: 2rem;
}
// p {
// font-family: 'Lilita One', sans-serif;
// color: $brown;
// font-size: 2rem;
// }
}
}
}
Expand Down
8 changes: 4 additions & 4 deletions src/routes/+page.svelte
View file
Original file line number Diff line number Diff line change
Expand Up @@ -5,12 +5,12 @@
import HeroSection from '$lib/components/sections/HeroSection.svelte';
import About from '$lib/components/sections/About.svelte';
import Slideshow from '$lib/components/sections/Slideshow.svelte';
import Keynote from '$lib/components/sections/Keynote.svelte';
// import Keynote from '$lib/components/sections/Keynote.svelte';
import Faqs from '$lib/components/sections/Faqs.svelte';
import Sponsors from '$lib/components/sections/Sponsors.svelte';
import Team from '$lib/components/sections/Team.svelte';
import MobileNavbar from '$lib/components/NavbarMobile.svelte';
import Schedule from '$lib/components/sections/Schedule.svelte';
// import Schedule from '$lib/components/sections/Schedule.svelte';
import MemoryLane from '$lib/components/sections/MemoryLane.svelte';
</script>

Expand All @@ -32,12 +32,12 @@
<img class="divider1" src="images/divider1.png" alt="Divider" />
<Slideshow />
<img class="divider2" src="images/divider2.png" alt="Divider" />
<Schedule />
<!-- <Schedule /> -->
<div class="divider3-wrap"><img class="divider3" src="images/divider3.png" alt="Divider" /></div>
<Faqs />
<!-- <MemoryLane /> -->
<Sponsors />
<Keynote />
<!-- <Keynote /> -->
<Team />

<Footer />
Expand Down

0 comments on commit 692859f

Please sign in to comment.