feat: Migrate more to VueV3 logic, navbar improvements

Create Vue version of v2 [NEED REVIEW - Read description]

.github/workflows/build-deploy.yml

@@ -0,0 +1,56 @@
+name: Build and Deploy to GitHub Pages
+
+on:
+  push:
+    branches:
+      - v2
+  workflow_dispatch:
+
+permissions:
+  contents: read
+  pages: write
+  id-token: write
+
+concurrency:
+  group: pages
+  cancel-in-progress: true
+
+jobs:
+  build:
+    runs-on: ubuntu-latest
+
+    steps:
+      - name: Checkout source
+        uses: actions/checkout@v4
+
+      - name: Setup Node.js
+        uses: actions/setup-node@v4
+        with:
+          node-version: 24
+          cache: npm
+
+      - name: Install dependencies
+        run: npm ci
+
+      - name: Optimise images
+        run: node scripts/optimise-images.js
+
+      - name: Build project
+        run: npm run build
+
+      - name: Setup Pages
+        uses: actions/configure-pages@v5
+
+      - name: Upload build artifact
+        uses: actions/upload-pages-artifact@v3
+        with:
+          path: ./dist
+
+  deploy:
+    needs: build
+    runs-on: ubuntu-latest
+
+    steps:
+      - name: Deploy to GitHub Pages
+        id: deployment
+        uses: actions/deploy-pages@v4

.gitignore

@@ -1,5 +1,31 @@
-_site
-.sass-cache
-.jekyll-cache
-.jekyll-metadata
+# Logs
+logs
+*.log
+npm-debug.log*
+yarn-debug.log*
+yarn-error.log*
+pnpm-debug.log*
+lerna-debug.log*
+
+node_modules
+dist
+dist-ssr
+*.local
+
+# Image optimization cache
+public/assets/**/optimised
+
+# Editor directories and files
+.vite/
+.vscode/
 .idea
+.DS_Store
+*.suo
+*.ntvs*
+*.njsproj
+*.sln
+*.sw?
+.mise.toml
+
+*storybook.log
+storybook-static

404.html

@@ -1,19 +0,0 @@
----
-layout: default
-title: 404 - Page not found
----
-
-<div class="page">
-  <h1>Vabandame, lehekülge ei leitud.</h1>
-  <h1>(Viga 404)</h1>
-</div>
-
-<script>
-  // on 2016-02-01 GitHub Pages upgraded to Jekyll3, which broke all blog posts with trailing slashes
-  // and there are tons of links out there on the web to posts with a trailing slash, so can't ignore it
-  // Fix borrowed from https://github.com/daattali/daattali.github.io/blob/master/404.html#L14-L21
-  var url = location.href;
-  if(url.substr(url.length - 1) === '/') {
-    window.location = url.substr(0, url.length - 1);
-  }
-</script>

CNAME

@@ -1 +0,0 @@
-www.lapikud.ee

README.md

@@ -1,106 +1,149 @@
-# Lapikute väliveeb
+# Lapikud External Website
 
-Tegu on [Jekyll](https://jekyllrb.com/) peale ehitatud uhiuue lehega
+![Built with Vue](https://img.shields.io/badge/Vue-3-42B883?logo=vuedotjs&logoColor=white)
+![Built with Vite](https://img.shields.io/badge/Vite-646CFF?logo=vite&logoColor=white)
+![Deployed on GitHub Pages](https://img.shields.io/badge/Deployed-GitHub%20Pages-222?logo=github)
 
-# Development plan
+Welcome! This is the public-facing website for Lapikud. It's a learning project. If something breaks, that's totally fine. You just get to learn more about git.
 
-Materials are on `Google Drive > Lapikud > Tarkvara > Väliveeb`
+Materials and design files are on **Google Drive → Lapikud → Tarkvara → Väliveeb**
 
-# Contribution guide
+---
 
-## 1. Create Issues
+## 🙋 How to help
 
-Easiest way to help would be to create issues about things that are missing and wrong
+You don't need to write code to contribute!
 
-## 2. Fork this repo and create a pull request
+### Option 1 — Report something
+Found a bug, typo, or something missing? [Open an issue](https://github.com/Lapikud/lapikud.github.io/issues) and describe what's wrong. That's already super helpful.
 
-Fork this repo to your own account and create a pull request for changes you have done in there
+### Option 2 — Fix something yourself
+1. **Fork** this repo (button in the top right on GitHub — it copies the project to your account)
+2. Make your changes
+3. Open a **pull request** back to this repo
 
-# How to setup development environment
+---
 
-Windows:
+## 🛠️ Setting up your dev environment
 
-0. Install the Windows Subsystem for Linux
+### What you need first
 
-    Install Ubuntu
+- [Node.js](https://nodejs.org/) — v20.19 or higher; use the current **LTS version** when possible
 
-    https://docs.microsoft.com/en-us/windows/wsl/install-win10
+> Node.js comes with `npm` included, so you don't need to install that separately.
 
-1. Install Ruby
+---
 
-        sudo apt install build-essential ruby ruby-dev dh-autoreconf
+### Don't have a code editor yet?
 
-2. Install Jekyll
+If you don't have a preferred code editor, [VSCode](https://code.visualstudio.com/) is a solid choice. Download and install it, and you're good to go.
 
-        sudo gem install jekyll
+---
 
-3. Clone repo
+### Windows? Set up WSL first (recommended)
 
+WSL lets you run Linux commands on Windows, which makes everything smoother.
+
+<details>
+<summary>📋 WSL setup steps</summary>
+
+**Step 1** — Enable WSL. Run these two commands in PowerShell as Administrator (this enables the necessary Windows features):
+
+```bash
+dism.exe /online /enable-feature /featurename:Microsoft-Windows-Subsystem-Linux /all /norestart
+dism.exe /online /enable-feature /featurename:VirtualMachinePlatform /all /norestart
+```
+
+**Step 2** — Set WSL to version 2 (the better one):
+
+```bash
+wsl --set-default-version 2
+```
+
+**Step 3** — Install [Ubuntu from the Microsoft Store](https://apps.microsoft.com/store/detail/ubuntu/9NBLGGH4MSV6)
+
+> ⚠️ If WSL doesn't work, check that **Virtualization** is enabled on your machine: open Task Manager → Performance tab → look for "Virtualization: Enabled"
+
+</details>
+
+---
+
+### Installation
+
+**1. Clone the repo** — this downloads the project to your computer:
+
+```bash
 git clone https://github.com/Lapikud/lapikud.github.io.git
-
-4. Serve the page (Use bash if on Windows)
-
 cd lapikud.github.io
-        jekyll serve --host 0.0.0.0
+```
 
-5. Image converter usage (requires imagemagick)
+**2. Install dependencies** — this installs the exact package versions recorded by the project:
 
-    No one wants to download 5MB images that are then shown in a 100x100px box.
+```bash
+npm ci
+```
 
-    **Always resize images before committing them!**
+**3. Optimise images** — the optimised image variants are not stored in the repo, so you need to generate them locally before running the site:
 
-        sudo apt-get install imagemagick
-        sh convert-past-management-images.sh
+```bash
+npm run optimise
+```
 
-MacOS:
+> You only need to run this once after cloning, and again whenever you add or change images in any `original/` folder.
 
-0. Install Homebrew if you don't have it already
+**4. Start the dev server** — this runs the site locally so you can see your changes live:
 
-    If you're using Bash, write `/bin/bash` instead of `/bin/zsh`.
+```bash
+npm run dev
+```
 
-        /bin/zsh -c "$(curl -fsSL https://raw.githubusercontent.com/Homebrew/install/HEAD/install.sh)"
+Then open the URL it gives you (usually `http://localhost:5173`) in your browser. 🎉
 
-1. Install the latest stable version of Ruby
+---
 
-        brew install ruby
+## 🧭 How the project fits together
 
-    Also configure your shell environment.
-    If you're using Bash, replace `.zshrc` with `.bash_profile`.
+The site is a Vue 3 single-page application built with Vite. Vue starts in `src/main.js`, which mounts `src/App.vue`. The app keeps its intentionally small custom router and translation system rather than introducing larger framework plugins.
 
-        if [ -d "/usr/local/opt/ruby/bin" ]; then
-            export PATH=/usr/local/opt/ruby/bin:$PATH
-            export PATH=`gem environment gemdir`/bin:$PATH
-        fi
+- `src/routes/` contains the page components and the bilingual public route table.
+- `src/components/` contains reusable UI building blocks; layout primitives live in `src/components/layout/`.
+- `src/layout/` contains the site-wide navigation and footer.
+- `src/lib/` contains routing, translations, image-path helpers, and the shared YAML loader.
+- `src/lib/locales/{est,en}/` contains escaped JSON translation data for each language.
+- `public/_data/` contains editable YAML for members, mentors, workshops, projects, partners, and pricing.
+- `public/assets/` contains source assets; generated image variants remain ignored.
+- `.storybook/` and `src/stories/` provide isolated Vue component previews.
 
-    Check that Ruby is working.
+Page components use Vue's `<script setup>` syntax and Composition API primitives such as `ref` and `computed`. Use `usePageText("PageName")` for page translations, `loadYaml(path, fallback)` for YAML-backed content, and the exported `navigate()` helper for programmatic internal navigation.
 
-        ruby -v
+Useful commands:
 
-2. Install the latest Jekyll gem
+```bash
+npm run dev             # start the local site
+npm run build           # create a production build
+npm run storybook       # preview components in Storybook
+npm run build-storybook # verify the static Storybook build
+npm run optimise        # regenerate local image variants
+```
 
-        sudo gem install jekyll
+---
 
-3. Clone repo
+## 🖼️ Adding images
 
-        git clone https://github.com/Lapikud/lapikud.github.io.git
+Place your original image files (PNG, JPG, etc.) into the appropriate `public/assets/{category}/original/` folder, then run:
 
-4. Serve the page
+```bash
+npm run optimise
+```
 
-        cd lapikud.github.io
-        jekyll serve --host 0.0.0.0
+The script will generate optimised WebP and JPG variants automatically. **Do not commit anything inside `optimised/` folders** — those are generated and ignored by git.
 
-5. Image converter usage (requires imagemagick)
+> SVGs don't need optimising — just place them directly where they're needed, no `original/` folder required.
 
-    No one wants to download 5MB images that are then shown in a 100x100px box.
+---
 
-    **Always resize images before committing them!**
+## 🚀 Deployment
 
-        brew install imagemagick
-        sh convert-past-management-images.sh
+Nothing to do here — GitHub automatically builds and deploys the site whenever something is pushed to the `v2` branch. The optimised images are generated as part of the build, so you don't need to worry about that either.
 
-# Deploy
-
-Push to master branch and wait for deployment, it could take up to 2h for the page to update.
-You can check the progress by clicking on the [environment](https://github.com/Lapikud/lapikud.github.io/deployments) link
-
-![Deployments link](https://i.imgur.com/26jnh6k.png)
+It usually takes **2–5 minutes**. You can watch it happen in the [Actions tab](https://github.com/Lapikud/lapikud.github.io/actions).

_config.yml

@@ -1,8 +0,0 @@
-title: Talllinna Tehnikaülikooli Tarkvaraarenduse klubi Lapikud
-email: about@lapikud.ee
-description: > # this means to ignore newlines until "baseurl:"
-  MTÜ Lapikud on Tallinna Tehnikaülikooli Tarkvaraarendusklubi, mis ühendab endisi ja praegusi IT huvilisi Tallinna Tehnikaülikooli üliõpilasi. Organisatsioon loodi 2002 aastal informaatika tudengite poolt, kelle erialatunnuseks oli "LAP". Targad mehed otsustasid, et järelikult on nad "Lapikud".
-url: "http://lapikud.ee" # the base hostname & protocol for your site, e.g. http://example.com
-instagram_username: lapikud
-github_username:  lapikud
-future: false

_includes/footer.html

@@ -1,36 +0,0 @@
-<footer class="main-footer">
-  <section class="container">
-    <div class="row">
-      <div class="column footer-contact">
-        <h3>MTÜ Lapikud</h3>
-          <p>Aadress: Akadeemia tee 5, 12616 Tallinn, Eesti</p>
-          <p>E-post: <a href="mailto:lapikud@lapikud.ee">lapikud@lapikud.ee</a></p>
-          <p>Telefon: <a href="tel:+372 58 160 799">+372 58 160 799</a></p>
-          <p>Messenger: <a href="https://m.me/Lapikud">m.me/Lapikud</a></p>
-          <p>Reg. kood: 801 67 145</p>
-        <p>Swedbank EE812200221019551756</p>
-      </div>
-      <div class="column footer-nav">
-        <h3>Navigatsioon</h3>
-        <ul>
-          <li><a href="/">Esileht</a></li>
-          {% include main_nav.html %}
-        </ul>
-      </div>
-      <div class="column footer-nav">
-        <h3>Jälgi meid!</h3>
-        <ul>
-          <li><a href="https://www.instagram.com/lapikud/">Instagram</a></li>
-          <li><a href="https://www.facebook.com/Lapikud/">Facebook</a></li>
-          <li><a href="https://github.com/Lapikud/">GitHub</a></li>
-          <li><a href="https://github.com/Lapikud/lapikud.github.io">Source Code</a></li>
-        </ul>
-      </div>
-    </div>
-    <div class="row">
-      <div class="column footer-copyright">
-        <a href="https://lapikud.ee">&copy; 2025 MTÜ Lapikud</a>
-      </div>
-    </div>
-  </section>
-</footer>

_includes/head.html

@@ -1,30 +0,0 @@
-<meta charset="utf-8">
-<meta http-equiv="X-UA-Compatible" content="IE=edge">
-<meta name="viewport" content="width=device-width, initial-scale=1">
-
-<title>{{ page.title }}</title>
-
-<link rel="apple-touch-icon" sizes="180x180" href="/assets/favicon/apple-touch-icon.png?v=LbyW42We5z">
-<link rel="icon" type="image/png" sizes="32x32" href="/assets/favicon/favicon-32x32.png?v=LbyW42We5z">
-<link rel="icon" type="image/png" sizes="16x16" href="/assets/favicon/favicon-16x16.png?v=LbyW42We5z">
-<link rel="manifest" href="/assets/favicon/site.webmanifest?v=LbyW42We5z">
-<link rel="mask-icon" href="/assets/favicon/safari-pinned-tab.svg?v=LbyW42We5z" color="#f58120">
-<link rel="shortcut icon" href="/assets/favicon/favicon.ico?v=LbyW42We5z">
-<meta name="msapplication-TileColor" content="#da532c">
-<meta name="msapplication-config" content="/assets/favicon/browserconfig.xml?v=LbyW42We5z">
-<meta name="theme-color" content="#ffffff">
-
-<link rel="stylesheet" href="//fonts.googleapis.com/css?family=Lato:300,300italic,400,400italic,700,700italic">
-<link rel="stylesheet" href="//cdnjs.cloudflare.com/ajax/libs/normalize/7.0.0/normalize.min.css" />
-<link rel="stylesheet" href="//cdnjs.cloudflare.com/ajax/libs/milligram/1.3.0/milligram.min.css">
-<link rel="stylesheet" href="{{ "/assets/main.css" | relative_url }}?{{ site.time | date: "%s" }}">
-<link rel="canonical" href="{{ page.url | replace:'index.html','' | absolute_url }}">
-
-<!-- leaflet js styles for map support -->
-<link rel="stylesheet" href="https://unpkg.com/leaflet@1.3.3/dist/leaflet.css"
-      integrity="sha512-Rksm5RenBEKSKFjgI3a41vrjkw4EVPlJ3+OiI65vTjIdo9brlAacEuKOiQ5OFh7cOI1bkDwLqdLw3Zg0cRJAAQ=="
-      crossorigin=""/>
-
-{% if jekyll.environment == 'production' and site.google_analytics %}
-{% include google-analytics.html %}
-{% endif %}

_includes/header.html

@@ -1,19 +0,0 @@
-<!-- header.scss -->
-<nav class="navigation">
-  <a href="/" {% if page.url == '/' %}style="display: none;"{% endif %}>
-	<img id="header-logo" class="logo" src="{{ "/assets/logo.svg " | relative_url }}">
-  </a>
-
-  <div class="menu">
-    <a href="#" class="float-right" id="main-menu-button">
-      <svg class="logo" height="32" width="32" viewBox="0 0 768 1024" xmlns="http://www.w3.org/2000/svg">
-        <path d="M0 192v128h768v-128h-768z m0 384h768v-128h-768v128z m0 256h768v-128h-768v128z" />
-      </svg>
-    </a>
-
-    <ul id="main-menu">
-      {% include main_nav.html %}
-    </ul>
-  </div>
-
-</nav>

_includes/main_nav.html

@@ -1,6 +0,0 @@
-<li><a href="/student">Tudengile</a></li>
-<li><a href="/mentors">Mentorid</a></li>
-<li><a href="/helpdesk">Helpdesk</a></li>
-<li><a href="/ourwork">Ettevõttele</a></li>
-<li><a href="/aboutus">Lapikutest</a></li>
-<li><a href="/contact">Kontakt</a></li>

_includes/scripts.html

@@ -1,9 +0,0 @@
-<!-- facebook widget thing support -->
-<div id="fb-root"></div>
-<script>(function(d, s, id) {
-    var js, fjs = d.getElementsByTagName(s)[0];
-    if (d.getElementById(id)) return;
-    js = d.createElement(s); js.id = id;
-    js.src = 'https://connect.facebook.net/en_US/sdk.js#xfbml=1&version=v3.1';
-    fjs.parentNode.insertBefore(js, fjs);
-}(document, 'script', 'facebook-jssdk'));</script>

_layouts/default.html

@@ -1,7 +0,0 @@
-<!doctype html>
-{% include head.html %}
-{% include header.html %}
-{{ content }}
-{% include footer.html %}
-{% include scripts.html %}
-</html>

_layouts/post.html

@@ -1,10 +0,0 @@
----
-layout: default
----
-
-<div class="page">
-    {%- assign date_format = "%F" -%}
-    <h1>{{ page.title | escape }}</h1>
-    <h5> {{ page.date | date: date_format }}</h5>
-  {{ content }}
-</div>

_sass/contact.scss

@@ -1,113 +0,0 @@
-#contact {
-
-  h2 {
-    margin-top : 1.5rem;
-  }
-
-  #helpdesk {
-    display         : flex;
-    justify-content : center;
-    align-items     : center;
-
-    #helpdesk-banner-container {
-      background : black;
-      padding    : 3rem;
-    }
-
-    #helpdesk-banner {
-      display : block;
-      width   : 100%;
-      height  : auto;
-    }
-    #helpdesk-banner-container, #helpdesk-info {
-      flex   : 1;
-      margin : 0 2rem;
-    }
-  }
-
-  #management {
-
-    #container {
-      display         : flex;
-      flex-direction  : row;
-      flex-wrap       : wrap;
-      justify-content : center;
-
-      .person {
-        margin-left   : 2rem;
-        margin-right  : 2rem;
-        margin-bottom : 5rem;
-
-        img {
-          display : block;
-          width   : 100%;
-          height  : auto;
-        }
-
-        * {
-          margin : 0.2rem 0;
-        }
-      }
-
-    }
-  }
-
-  #main-wrapper {
-    width           : 100%;
-    display         : flex;
-    flex-direction  : row;
-    flex-wrap       : wrap;
-    justify-content : center;
-    align-items     : center;
-  }
-
-  #maparea {
-    margin        : 0 2rem;
-    min-width     : 44.55%;
-    flex          : 1;
-
-    #map {
-      width      : 100%;
-      float      : right;
-      margin     : 0 auto;
-      height     : 60vh;
-      max-height : 300px;
-    }
-  }
-
-  #main {
-    margin            : 0 2rem;
-
-
-    h4{
-      padding-bottom  : 5px;
-    }
-  }
-
-  * {
-    margin            : 0.2rem 0;
-  }
-
-}
-@media (max-width : 900px) {
-
-  #contact {
-    #helpdesk {
-      flex-direction : column;
-
-      #helpdesk-banner-container {
-        margin : 2rem 0;
-      }
-      #helpdesk-info {
-        margin : 0;
-      }
-    }
-    #main-wrapper{
-      #maparea{
-        flex-direction: column;
-        margin: 2rem;
-      }
-    }
-  }
-}
-

_sass/footer.scss

@@ -1,42 +0,0 @@
-.main-footer {
-  background: #fcfcfc;
-  padding: 2rem 0;
-  margin-top: 5rem;
-
-  .container {
-    max-width: 80rem;
-  }
-  
-  .footer-contact {
-    margin-bottom: 2rem;
-    p {
-      margin: 0.2rem 0;
-    }
-  }
-
-  .footer-copyright {
-    text-align: center;
-    a {
-      display: inline-block;
-      padding: 1rem;
-    }
-  }
-
-  .footer-nav {
-    flex-shrink: 1.5;
-    ul {
-      list-style-type: none;
-
-      li {
-        margin: 0;
-        padding: 0;
-        a {
-          padding: .5rem .2rem;
-          display: inline-block;
-          width: 100%;
-        }
-      }
-
-    }
-  }
-}

_sass/header.scss

@@ -1,101 +0,0 @@
-.navigation {
-    margin-top: .5rem;
-    margin-left: auto;
-    margin-right: auto;
-    margin-bottom: 5rem;
-    padding: 1rem 2rem;
-    height: 50px;
-    background: #ffffff;
-    color: #f0941d;
-    max-width: 112.0rem;
-
-    .logo {
-        height: 32px;
-        vertical-align: middle;
-        display: inline;
-    }
-
-    #header-logo {
-        height : 8rem;
-    }
-
-
-    .menu {
-        display: inline;
-
-        @media (max-width: 40.0rem) {
-            ul, &:active ul {
-                display: none;
-                position: absolute;
-                top: 45px;
-                right: 20px;
-                z-index: 10;
-                background: #fff;
-                border: 1px solid #DDDDDD;
-                width: 20rem;
-                margin: 0;
-                padding: 0.5rem 0;
-
-                li {
-                    display: block;
-                    margin: 0;
-                    padding: 0;
-                    a {
-                        width: 100%;
-                        display: block;
-                        text-align: center;
-                        padding: 1rem 2rem;
-                    }
-                }
-            }
-
-            &:hover ul {
-                display: inline-block;
-            }
-
-            #main-menu-button svg {
-                fill: #000000
-            }
-
-            #main-menu-button:hover svg {
-                fill: $color-secondary;
-            }
-
-            #main-menu-button:active svg {
-                fill: $color-primary;
-            }
-        }
-    }
-
-    @media (min-width: 40.1rem) {
-        #main-menu-button {
-            display: none;
-        }
-
-        .menu ul {
-            margin: 0;
-            display: inline-block;
-            float: right;
-
-            li {
-                display: inline-block;
-                margin: 0;
-                padding: 0;
-                a {
-                    padding: 1rem;
-                }
-            }
-
-            .register-button {
-                border: 0.1rem solid $color-primary;
-                border-radius: .4rem;
-
-                &:hover {
-                    color: #ffffff;
-                    background-color: $color-secondary;
-                    border-color: $color-secondary;
-                }
-            }
-        }
-    }
-}

_sass/helpdesk.scss

@@ -1,152 +0,0 @@
-#helpdesk-page {
-
-  #helpdesk-banner {
-    background      : black;
-    display         : flex;
-    flex-direction  : row;
-    flex            : 1;
-    justify-content : center;
-    align-items     : center;
-    text-align      : center;
-    margin          : 3rem auto;
-    padding         : 2rem;
-
-    h1, h3 {
-      color       : white;
-      font-weight : 400;
-    }
-
-    .emphasis-text-bold {
-      font-weight : bold;
-    }
-
-    .emphasis-text-color {
-      color : $color-primary;
-    }
-
-    #helpdesk-logo {
-      display : block;
-      width   : 100%;
-      height  : auto;
-    }
-
-    #helpdesk-logo-container {
-      flex    : 1;
-      padding : 25px;
-
-    }
-
-    #banner-text {
-      flex : 2;
-    }
-
-  }
-
-  #maparea {
-    display         : flex;
-    align-items     : center;
-    justify-content : center;
-
-    .siema, #map {
-      width      : 50%;
-      max-height : 300px;
-      margin     : 20px;
-    }
-    #map {
-      height     : 60vh;
-      max-height : 300px;
-    }
-
-    .siema {
-      .carousel-image-container {
-        display         : flex;
-        justify-content : center;
-        align-items     : center;
-        img {
-          max-height : 300px;
-          width      : 100%;
-          height     : auto;
-          object-fit : scale-down;
-        }
-      }
-    }
-  }
-
-  #pricing {
-    margin-bottom : 2rem;
-    p {
-      margin      : 1rem auto;
-      font-weight : bold;
-    }
-    table {
-      width : auto;
-
-      th td {
-        font-weight : bold;
-      }
-      tr:first-child {
-        max-width : 40%;
-      }
-    }
-  }
-
-  #location {
-    h4 {
-      margin : 0.1rem auto;
-    }
-  }
-
-  #contact {
-    display        : flex;
-    flex-direction : row;
-
-    .subtext {
-      opacity : 0.7;
-    }
-
-    #opening-times, #contact-methods {
-      flex    : 1;
-      padding : 15px;
-    }
-
-    #contact-methods {
-      h4 {
-        margin : 0.1rem auto;
-      }
-    }
-  }
-}
-
-@media (max-width : 900px) {
-  #helpdesk-page {
-    #helpdesk-banner {
-      flex-direction : column;
-    }
-
-    table {
-      tr:first-child {
-        max-width : 30%;
-
-      }
-      td, th {
-        padding : 0.5rem 0.5rem;
-      }
-    }
-
-    #maparea {
-      flex-direction : column;
-      .siema, #map {
-        width : 100%;
-      }
-    }
-
-    #contact {
-      flex-direction : column;
-    }
-  }
-
-}
-
-
-
-

_sass/history.scss

@@ -1,75 +0,0 @@
-#history {
-
-  .management-for-year {
-    display        : flex;
-    flex-direction : column;
-
-    .year {
-      display         : flex;
-      flex-direction  : row;
-      justify-content : center;
-      flex-wrap       : wrap;
-
-      .person {
-        display        : flex;
-        flex-direction : column;
-        align-items    : center;
-        margin         : 0 2rem;
-
-        h5 {
-          margin-top : 0.5rem;
-        }
-        .img-container {
-          height          : 150px;
-          width           : 150px;
-          display         : flex;
-          justify-content : center;
-          align-items     : center;
-          overflow        : hidden;
-
-          img {
-            width  : 150px;
-            height : auto;
-          }
-
-        }
-
-      }
-    }
-  }
-
-}
-
-@media (max-width : 900px) {
-
-  #history {
-
-    h1 {
-      font-size : 4rem;
-    }
-
-    .management-for-year {
-      .year {
-        flex-direction : column;
-
-        .person {
-          .img-container {
-            height : 200px;
-            width  : 200px;
-
-            img {
-              height : auto;
-              width  : 200px;
-
-            }
-          }
-
-          h5 {
-            font-size : 2.3rem;
-          }
-        }
-      }
-    }
-  }
-
-}

_sass/home.scss

@@ -1,104 +0,0 @@
-.home {
-
-  @media (max-width : 900px) {
-    h1 {
-      font-size : 3.6rem;
-    }
-  }
-
-  .logo_container {
-    display         : flex;
-    flex-direction  : row;
-    flex-wrap       : wrap;
-    align-items     : center;
-    justify-content : center;
-    text-align      : center;
-    margin          : 4rem 0;
-
-    #logo {
-      max-width : 60rem;
-      width     : 100%;
-      padding   : 50px 90px;
-    }
-  }
-
-  .lg-icon-container {
-    justify-content : flex-start;
-    align-content   : flex-start;
-    align-items     : flex-start;
-    margin          : 0;
-    margin-top      : 4rem;
-    display:flex;
-
-    a {
-      flex-direction  : row;
-      justify-content : center;
-      align-items     : center;
-      align-content   : flex-start;
-      text-align      : center;
-      margin          : auto;
-      flex   : 2;
-
-      .lg-icon {
-        fill   : #f0941d;
-        width  : 10rem;
-        height : 10rem;
-        flex   : 1;
-      }
-
-      .regularText {
-        color: #1e1e1e;
-      }
-    }
-
-    @media (min-width : 40.0rem) {
-      .column {
-        flex-direction  : column;
-        justify-content : flex-start;
-        align-items     : center;
-        align-content   : flex-start;
-        text-align      : center;
-      }
-    }
-  }
-  .description {
-    margin-top : 1em;
-  }
-  @media (min-width : 40.0rem) {
-    .description {
-      margin-top : 3em;
-    }
-  }
-
-  .partners {
-    #partners-container {
-      display         : flex;
-      flex-wrap       : wrap;
-      justify-content : space-evenly;
-      align-items     : center;
-
-      a {
-        color : #1e1e1e;
-        img {
-          max-width  : 300px;
-          max-height : 150px;
-          width      : 100%;
-          height     : auto;
-          object-fit : scale-down;
-          margin     : 1rem auto;
-        }
-        h4 {
-          text-align : center;
-        }
-      }
-    }
-
-    @media (max-width : 900px) {
-      #partners-container {
-
-        flex-direction : column
-      }
-    }
-  }
-
-}

_sass/members.scss

@@ -1,34 +0,0 @@
-#members {
-  #banner-container-link {
-    margin : 0 auto;
-
-    h3 {
-      padding : 1rem 4rem;
-    }
-  }
-
-  .members-container {
-    ul {
-      columns : 4;
-    }
-  }
-}
-
-@media (max-width : 900px) {
-  #members {
-    #banner-container-link {
-      margin : unset;
-
-      h3 {
-        padding : 1rem 0;
-      }
-    }
-
-    .members-container {
-      ul {
-        columns : 1;
-      }
-    }
-  }
-
-}

_sass/mentors.scss

@@ -1,76 +0,0 @@
-#mentors {
-
-  .mentor {
-    display        : flex;
-    width          : 100%;
-    flex-direction : row;
-    margin         : 4rem auto;
-
-    .photo-container {
-      flex : 1;
-
-      img {
-        display    : block;
-        height     : auto;
-        width      : 100%;
-        margin-top : 2rem;
-      }
-    }
-
-    .description {
-      flex           : 2;
-
-      display        : flex;
-      flex-direction : row;
-
-      * {
-        margin : 0.1rem 0;
-      }
-
-      h1, h4 {
-        margin : 1rem 0;
-      }
-
-      .general {
-        flex   : 2;
-        margin : 0 3rem;
-      }
-
-      .varia {
-        flex   : 3;
-        margin : 1rem 3rem 0;
-      }
-    }
-
-    .mentor-info-text {
-      flex           : 3;
-      display        : flex;
-      flex-direction : column;
-      padding-left   : 5rem;
-      padding-right  : 3rem;
-    }
-
-  }
-
-}
-
-@media (max-width : 900px) {
-  #mentors {
-    .mentor {
-      flex-direction : column;
-
-      .description {
-        flex-direction : column;
-        .general, .varia {
-          margin : 0;
-        }
-      }
-      .photo-container {
-        img {
-          max-height : 75vh;
-          max-width : 75vh;
-        }
-      }
-    }
-  }
-}

_sass/ourwork.scss

@@ -1,67 +0,0 @@
-#ourwork-banner {
-  margin : 5rem 0;
-
-  a {
-    display         : flex;
-    justify-content : center;
-  }
-
-}
-
-#ourwork-done {
-
-  .work-item {
-    padding        : 1rem;
-    margin         : 7rem 0;
-    display        : flex;
-    flex-direction : row;
-    max-height     : 75vh;
-
-    .description {
-      flex : 2;
-
-      h3 {
-        overflow      : hidden;
-        text-overflow : ellipsis;
-      }
-    }
-
-    .thumbnail {
-      flex            : 3;
-      display         : flex;
-      justify-content : center;
-      align-items     : center;
-    }
-
-    img {
-      display    : block;
-      width      : auto;
-      height     : auto;
-      max-height : 50vh;
-    }
-
-    h2, h3 {
-      text-align    : center;
-      margin-bottom : 0.3rem;
-    }
-
-  }
-}
-
-@media (max-width : 900px) {
-
-  #ourwork-done {
-
-    .work-item {
-      flex-direction : column;
-      max-height     : none;
-    }
-  }
-
-  #ourwork-banner {
-    h1 {
-      font-size : 3.6rem;
-    }
-
-  }
-}

_sass/shared.scss

@@ -1,22 +0,0 @@
-
-.banner {
-  background    : #f0941d;
-  color         : white;
-  font-weight   : bold;
-  padding       : 2rem;
-  border-radius : 8rem;
-}
-
-.page {
-  display        : flex;
-  flex-direction : column;
-  flex           : 1;
-  width          : 85vw;
-  max-width      : 1200px;
-  min-height     : 50vh;
-  margin         : 0 auto 0;
-}
-
-.centered-text {
-  text-align : center;
-}

_sass/statute.scss

@@ -1,12 +0,0 @@
-#statute {
-  p, ul {
-    margin-bottom: 0.5rem;
-  }
-  li {
-    margin-bottom: 0.1rem;
-  }
-
-  h4 {
-    margin-top: 2.5rem;
-  }
-}

_sass/striim.scss

@@ -1,6 +0,0 @@
-.stream {
-  .video {
-    padding: 5px;
-    flex: 1 1 400px;
-  }
-}

_sass/student.scss

@@ -1,35 +0,0 @@
-.activities-info {
-  display        : flex;
-  flex-direction : row;
-  margin         : 3rem auto;
-
-  .desc {
-    flex          : 1;
-    padding-right : 3rem;
-
-  }
-  .promo-image {
-    display     : flex;
-    align-items : center;
-    flex        : 1;
-
-    img {
-      display : block;
-      width   : 100%;
-      height  : auto;
-    }
-  }
-}
-
-@media (max-width : 900px) {
-  .activities-info {
-    flex-direction : column;
-
-    .desc {
-      padding : 0;
-      h1 {
-        font-size : 3.6rem
-      }
-    }
-  }
-}

aboutus.html

@@ -1,30 +0,0 @@
----
-layout: default
-title: Lapikutest - Lapikud
----
-<div class="page">
-
-  <h1>MTÜ Lapikud</h1>
-  <!-- three icons -->
-  <div class="row">
-    <div class="column">
-      <div>
-        <h3>Põhikiri</h3>
-        <p><a href="/statute">Meie põhikiri, millega peaksid kõik liikmed tutvuma.</a></p>
-      </div>
-    </div>
-    <div class="column">
-      <div>
-        <h3>Liikmed</h3>
-        <p><a href="/members">Kõik, kes on ning kunagi olid Lapikute liikmed.</a></p>
-      </div>
-    </div>
-    <div class="column">
-      <div>
-        <h3>Ajalugu</h3>
-        <p><a href="/history">Tutvu Lapikute ajalooga!</a></p>
-      </div>
-    </div>
-  </div>
-
-</div>

assets/main.scss

@@ -1,35 +0,0 @@
----
----
-$color-primary: #f0941d;
-$color-secondary: #ffa80d;
-
-body {
-    color: #1e1e1e;
-    font-family: 'Lato', 'Helvetica Neue', 'Helvetica', 'Arial', sans-serif;
-    font-weight: 400;
-}
-
-a, a:link, a:visited {
-    color: $color-primary;
-}
-a:active, a:hover {
-    color: $color-secondary;
-}
-
-h4 {
-    font-weight: 400;
-}
-
-@import 'header';
-@import 'footer';
-@import 'home';
-@import 'mentors';
-@import 'contact';
-@import 'helpdesk';
-@import 'ourwork';
-@import 'student';
-@import 'shared';
-@import 'statute';
-@import 'history';
-@import 'members';
-@import 'striim';

assets/mentors-images/convert-mentors-images.sh

@@ -1,11 +0,0 @@
-mkdir -p optimised
-for file in original/*; do
-    echo $file
-    base_name=$(basename $file)
-    if [[ $base_name == *"airiin"* ]] || [[ $base_name == *"lembitu"* ]] ; then
-        gravity=north
-    else
-        gravity=center
-    fi    
-    convert ${file} -resize "400x400^>" -gravity $gravity -extent 400x400  optimised/${base_name%}
-done

assets/ourwork-images/convert-ourwork-images.sh

@@ -1,8 +0,0 @@
-#!/usr/bin/env bash
-
-mkdir -p optimised
-for file in original-jpg-converted/*; do
-    echo $file
-    base_name=$(basename $file)
-    convert ${file} -resize "1000x1000>" -quality 89 optimised/${base_name}
-done

assets/past-management-images/convert-past-management-images.sh

@@ -1,6 +0,0 @@
-mkdir -p optimised
-for file in original/*; do
-    echo $file
-    base_name=$(basename $file)
-    convert ${file} -resize "200x200^>" -gravity center -crop 200x200+0+0 -quality 89 optimised/${base_name}
-done