diff --git a/Rules b/Rules index 3bc827f..146f9c0 100644 --- a/Rules +++ b/Rules @@ -6,7 +6,8 @@ preprocess do themas.each do |thema| content = '' attributes = { - naam: thema + identifier: thema, + naam: thema.capitalize } identifier = "/themas/#{thema}" diff --git a/content/assets/navbar_icons/FAQ.svg b/content/assets/navbar_icons/faq.svg similarity index 100% rename from content/assets/navbar_icons/FAQ.svg rename to content/assets/navbar_icons/faq.svg diff --git a/content/assets/navbar_icons/Quiz.svg b/content/assets/navbar_icons/quiz.svg similarity index 100% rename from content/assets/navbar_icons/Quiz.svg rename to content/assets/navbar_icons/quiz.svg diff --git a/content/assets/navbar_icons/Ontdek Verenigingen.svg b/content/assets/navbar_icons/verenigingen.svg similarity index 100% rename from content/assets/navbar_icons/Ontdek Verenigingen.svg rename to content/assets/navbar_icons/verenigingen.svg diff --git a/content/faq.erb b/content/faq.erb index 2dff166..ed20226 100644 --- a/content/faq.erb +++ b/content/faq.erb @@ -4,7 +4,7 @@ navigable: true order: 3 ---
-

FAQ — Vaakgestelde vragen

+

FAQ — Vaakgestelde vragen

<% @items.find_all('/faq/*').each do |question| %>
diff --git a/content/stylesheets/main.css b/content/stylesheets/main.css index 0f6d107..c4b0378 100644 --- a/content/stylesheets/main.css +++ b/content/stylesheets/main.css @@ -471,67 +471,71 @@ fieldset p label input { column-gap: 0.5rem; row-gap: 0.5rem; - align-items: center; + align-items: top; justify-items: center; align-content: center; grid-template-columns: repeat(3, minmax(33%, 170px)); } .tile { - min-width: 200px; - max-width: 300px; - flex: 1 0 calc(25% - 10px); + flex-direction: column; position: relative; -} - -.tile--small { - min-width: 50px; - max-width: 50px; -} - -.tile--medium { - min-width: 150px; - max-width: 200px; -} - -.tile--blue { - background-color: var(--darkblue); -} - -.tile::before { - content: ""; - float: left; - padding-top: 100%; + width: 200px; + text-decoration: none; } .tile__image { - position: absolute; - top: 50%; - left: 50%; - transform: translate(-50%, -50%); - height: 95%; - width: auto; + width: 200px; + height: 200px; +} - transition: ease-in 0.2s; - transition-property: filter; +.tile--small { + width: 50px; +} +.tile--small .tile__image { + width: 50px; + height: 50px; +} +.tile--medium { + width: 150px; +} +.tile--medium .tile__image { + width: 150px; + height: 150px; +} + +.tile__image--blue { + background-color: var(--darkblue); +} + +.tile__image { + height: 100%; + width: 100%; + + padding: 1rem; display: flex; justify-content: center; -} -.tile__image--svg { - width: 80%; - height: auto; - - fill: var(--white); -} - -.tile__image svg { - width: 100%; + transform: scale(1); + transition: transform ease-in 0.1s; } .tile:hover .tile__image { - filter: blur(2px); + transform: scale(1.1); +} + +.tile__image--svg { + width: 100%; + height: 100%; +} + +.tile__image img, .tile__image svg { + width: auto; + height: 100%; +} +.tile__image svg { + fill: var(--white); } .tile:hover .tile__title { @@ -539,42 +543,21 @@ fieldset p label input { } .tile__title { - opacity: 0; - position: absolute; - bottom: 0; - left: 0; + color: black; width: 100%; - max-width: 100%; font-size: 1.5rem; text-align: center; font-weight: bold; - color: white; - text-shadow: 2px 2px #333; padding: 5px; - - transition: ease-in 0.2s; - transition-property: opacity; } .tile__title--medium { font-size: 1.2rem; } -.clickable { - transform: scale(1); - transition: ease-in 0.2s; - - transition-property: transform; -} - -.clickable:hover { - cursor: pointer; - transform: scale(1.05); -} - .split-2 { display: flex; flex-wrap: wrap; diff --git a/content/verenigingen.md b/content/verenigingen.md index 21fc905..1619fab 100644 --- a/content/verenigingen.md +++ b/content/verenigingen.md @@ -1,5 +1,5 @@ --- -naam: Ontdek Verenigingen +naam: Ontdek verenigingen navigable: true order: 2 --- diff --git a/layouts/partials/navbar.erb b/layouts/partials/navbar.erb index 4384048..d2409d7 100644 --- a/layouts/partials/navbar.erb +++ b/layouts/partials/navbar.erb @@ -9,7 +9,7 @@ <% for i in navigables %> @@ -27,7 +27,7 @@