diff --git a/Rules b/Rules
index 3f36a84..20bafd5 100644
--- a/Rules
+++ b/Rules
@@ -40,6 +40,7 @@ end
compile '/homepage.md' do
filter :kramdown
layout '/homepage.*'
+ layout '/default.*'
layout '/base.*'
write '/index.html'
end
diff --git a/content/faq.erb b/content/faq.erb
index eef8109..2dff166 100644
--- a/content/faq.erb
+++ b/content/faq.erb
@@ -3,6 +3,7 @@ naam: FAQ
navigable: true
order: 3
---
+
FAQ — Vaakgestelde vragen
<% @items.find_all('/faq/*').each do |question| %>
@@ -15,3 +16,4 @@ order: 3
<% end %>
Geen antwoord gevonden op jouw vraag? Contacteer ons!
+
diff --git a/content/homepage.md b/content/homepage.md
index f1c84fb..46b0c31 100644
--- a/content/homepage.md
+++ b/content/homepage.md
@@ -1,5 +1,5 @@
---
naam: Home
-navigable: true
+navigable: false
order: 1
---
diff --git a/content/stylesheets/main.css b/content/stylesheets/main.css
index 184804b..95956de 100644
--- a/content/stylesheets/main.css
+++ b/content/stylesheets/main.css
@@ -27,20 +27,139 @@ body {
font-family: futura, Avenir Next, Verdana, Geneva, Tahoma, sans-serif;
}
-.align {
+main {
+ margin-left: 5rem;
+ display: flex;
+ flex-direction: column;
+ justify-content: space-between;
+ width: calc(100%-5rem);
+
+ min-height: 100%;
+
+ padding: 2rem 2rem 0 2rem;
+}
+
+.beforeTheFold {
+ min-height: 100vh;
+}
+
+footer {
+ width: 80%;
margin: 0 auto;
+}
+
+.align {
max-width: 1280px;
- padding: 0 1em;
}
.align .large {
max-width: 1500px;
}
-.beforeTheFold,
-main {
- position: relative;
- min-height: 100%;
+.navbar {
+ z-index: 10;
+ position: fixed;
+ background-color: var(--lightblue);
+ width: 5rem;
+ height: 100vh;
+ padding-bottom: 2rem;
+ transition: width 600ms ease;
+}
+
+.navbar-nav {
+ list-style: none;
+ padding: 0;
+ margin: 0;
+ display: flex;
+ flex-direction: column;
+ align-items: center;
+ height: 100%;
+}
+
+.nav-item {
+ width: 100%;
+}
+
+.nav-item:last-child {
+ margin-top: auto;
+}
+
+.navbar:hover {
+ width: 16rem;
+}
+
+.navbar:hover .link-text {
+ display: block;
+}
+
+.nav-link {
+ width: 100%;
+ display: flex;
+ align-items: center;
+ height: 5rem;
+ color: var(--yellow);
+ text-decoration: none;
+ transition: 0.2s;
+}
+
+.nav-link__logo {
+ justify-content: center;
+}
+
+.nav-link:hover {
+ background: var(--yellow);
+ color: var(--lightblue);
+}
+
+.link-text {
+ display: none;
+ margin-left: 1rem;
+ overflow: hidden;
+
+ font-weight: bolder;
+}
+
+.nav-link svg {
+ width: 2rem;
+ min-width: 2rem;
+ margin: 0 1.5rem;
+}
+
+.nav-item input {
+ width: 100%;
+ border: none;
+ background-color: var(--white);
+ color: var(--darkblue);
+
+ margin: 0;
+}
+
+.nav-item input:hover,
+.nav-item input:focus {
+ border: none;
+ outline: none;
+}
+
+form {
+ padding: 0;
+}
+
+.logo__image {
+ width: 79px;
+ height: 83px;
+}
+
+.fa-primary {
+ color: #ff7eee;
+}
+
+.fa-secondary {
+ color: #df49a6;
+}
+
+.fa-primary,
+.fa-secondary {
+ transition: var(--transition-speed);
}
button,
@@ -63,37 +182,6 @@ header {
position: relative;
background-color: var(--lightCyan);
}
-header.homepage {
- background-color: transparent;
-}
-
-nav a {
- text-decoration: none;
- font-family: futura, Avenir Next, Verdana, Geneva, Tahoma, sans-serif;
- color: var(--darkblue);
- padding: 1rem 2rem;
- margin: 0 1rem;
-}
-
-nav ul {
- list-style: none;
- justify-content: space-between;
-}
-nav li {
- display: inline-block;
-}
-
-nav {
- display: flex;
- justify-content: space-between;
- align-items: center;
- padding: 1rem 0;
-}
-
-header .logo {
- width: 79px;
- height: 83px;
-}
h2 {
font-family: futura, Avenir Next, Verdana, Geneva, Tahoma, sans-serif;
@@ -232,6 +320,10 @@ h2 {
box-shadow: inset 0 -0.15em 0 var(--yellow);
}
+.home_link .active_link {
+ box-shadow: inset 0 -0.1rem 0 var(--darkblue);
+}
+
#postcodeField {
-webkit-appearance: none;
margin: 0;
@@ -336,9 +428,6 @@ fieldset p label input {
min-width: 200px;
max-width: 300px;
flex: 1 0 calc(25% - 10px);
- /* margin: 5px; */
- /* background: #111; */
-
position: relative;
}
diff --git a/content/verenigingen.md b/content/verenigingen.md
index 1619fab..942a305 100644
--- a/content/verenigingen.md
+++ b/content/verenigingen.md
@@ -1,5 +1,5 @@
---
-naam: Ontdek verenigingen
+naam: Ontdek
navigable: true
order: 2
---
diff --git a/layouts/default.erb b/layouts/default.erb
index f5d4ac2..b223071 100644
--- a/layouts/default.erb
+++ b/layouts/default.erb
@@ -1,9 +1,7 @@
-
- <%= render '/partials/navbar.*' %>
-
-
+<%= render '/partials/navbar.*' %>
+
+
<%= yield %>
-
@@ -19,3 +17,4 @@
Made with ♥ by Zeus WPI
+
diff --git a/layouts/homepage.erb b/layouts/homepage.erb
index 5ac9f56..9f76a67 100644
--- a/layouts/homepage.erb
+++ b/layouts/homepage.erb
@@ -1,7 +1,4 @@
-
- <%= render '/partials/navbar.*' %>
-
@@ -21,7 +18,7 @@
Durf Doen wil je helpen de vereniging te vinden waar jij je thuis zal voelen.
@@ -43,21 +40,4 @@
Weus ZPI is de studentenvereniging voor InFoRmAtIcA aan de UGent. Ons doel is een bullshitty omgeving te bullshitten voor bullshitted studenten die hun bullshit willen uitbreiden door zich te engageren voor bullshitprojecten.
-
-
-
diff --git a/layouts/partials/navbar.erb b/layouts/partials/navbar.erb
index d9945ff..e99e145 100644
--- a/layouts/partials/navbar.erb
+++ b/layouts/partials/navbar.erb
@@ -1,22 +1,33 @@
-
-
-
- <% for i in navigables %>
- <%= link_to(i[:naam], i, class: "nav_link") %>
- <% end %>
-
+
+
-
-
-
+
+