Merge pull request #2 from topsinoty/refactor/move-to-vue

Refactor/move to vue

.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
-.idea
+# 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

.storybook/main.js

@@ -0,0 +1,10 @@
+/** @type { import('@storybook/vue3-vite').StorybookConfig } */
+const config = {
+  stories: ['../src/**/*.stories.js'],
+  framework: {
+    name: '@storybook/vue3-vite',
+    options: {},
+  },
+};
+
+export default config;

.storybook/preview.js

@@ -0,0 +1,13 @@
+/** @type { import('@storybook/vue3-vite').Preview } */
+const preview = {
+  parameters: {
+    controls: {
+      matchers: {
+       color: /(background|color)$/i,
+       date: /Date$/i,
+      },
+    },
+  },
+};
+
+export default preview;

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

LICENSE

@@ -1,21 +1,21 @@
-MIT License
-
-Copyright (c) 2018 Lapikud
-
-Permission is hereby granted, free of charge, to any person obtaining a copy
-of this software and associated documentation files (the "Software"), to deal
-in the Software without restriction, including without limitation the rights
-to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
-copies of the Software, and to permit persons to whom the Software is
-furnished to do so, subject to the following conditions:
-
-The above copyright notice and this permission notice shall be included in all
-copies or substantial portions of the Software.
-
-THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
-IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
-FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
-AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
-LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
-OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
-SOFTWARE.
+MIT License
+
+Copyright (c) 2018 Lapikud
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.

README.md

@@ -1,106 +1,149 @@
-# Lapikute väliveeb
-
-Tegu on [Jekyll](https://jekyllrb.com/) peale ehitatud uhiuue lehega
-
-# Development plan
-
-Materials are on `Google Drive > Lapikud > Tarkvara > Väliveeb`
-
-# Contribution guide
-
-## 1. Create Issues
-
-Easiest way to help would be to create issues about things that are missing and wrong
-
-## 2. Fork this repo and create a pull request
-
-Fork this repo to your own account and create a pull request for changes you have done in there
-
-# How to setup development environment
-
-Windows:
-
-0. Install the Windows Subsystem for Linux
-
-    Install Ubuntu
-
-    https://docs.microsoft.com/en-us/windows/wsl/install-win10
-
-1. Install Ruby
-
-        sudo apt install build-essential ruby ruby-dev dh-autoreconf
-
-2. Install Jekyll
-
-        sudo gem install jekyll
-
-3. Clone repo
-
-        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)
-
-    No one wants to download 5MB images that are then shown in a 100x100px box.
-
-    **Always resize images before committing them!**
-
-        sudo apt-get install imagemagick
-        sh convert-past-management-images.sh
-
-MacOS:
-
-0. Install Homebrew if you don't have it already
-
-    If you're using Bash, write `/bin/bash` instead of `/bin/zsh`.
-
-        /bin/zsh -c "$(curl -fsSL https://raw.githubusercontent.com/Homebrew/install/HEAD/install.sh)"
-
-1. Install the latest stable version of Ruby
-
-        brew install ruby
-
-    Also configure your shell environment.
-    If you're using Bash, replace `.zshrc` with `.bash_profile`.
-    
-        if [ -d "/usr/local/opt/ruby/bin" ]; then
-            export PATH=/usr/local/opt/ruby/bin:$PATH
-            export PATH=`gem environment gemdir`/bin:$PATH
-        fi
-
-    Check that Ruby is working.
-
-        ruby -v
-
-2. Install the latest Jekyll gem
-
-        sudo gem install jekyll
-
-3. Clone repo
-
-        git clone https://github.com/Lapikud/lapikud.github.io.git
-
-4. Serve the page
-
-        cd lapikud.github.io
-        jekyll serve --host 0.0.0.0
-
-5. Image converter usage (requires imagemagick)
-
-    No one wants to download 5MB images that are then shown in a 100x100px box.
-    
-    **Always resize images before committing them!**
-    
-        brew install imagemagick
-        sh convert-past-management-images.sh
-
-# 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)
+# Lapikud External Website
+
+![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)
+
+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 and design files are on **Google Drive → Lapikud → Tarkvara → Väliveeb**
+
+---
+
+## 🙋 How to help
+
+You don't need to write code to contribute!
+
+### 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.
+
+### 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
+
+---
+
+## 🛠️ Setting up your dev environment
+
+### What you need first
+
+- [Node.js](https://nodejs.org/) — v20.19 or higher; use the current **LTS version** when possible
+
+> Node.js comes with `npm` included, so you don't need to install that separately.
+
+---
+
+### Don't have a code editor yet?
+
+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.
+
+---
+
+### 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
+cd lapikud.github.io
+```
+
+**2. Install dependencies** — this installs the exact package versions recorded by the project:
+
+```bash
+npm ci
+```
+
+**3. Optimise images** — the optimised image variants are not stored in the repo, so you need to generate them locally before running the site:
+
+```bash
+npm run optimise
+```
+
+> You only need to run this once after cloning, and again whenever you add or change images in any `original/` folder.
+
+**4. Start the dev server** — this runs the site locally so you can see your changes live:
+
+```bash
+npm run dev
+```
+
+Then open the URL it gives you (usually `http://localhost:5173`) in your browser. 🎉
+
+---
+
+## 🧭 How the project fits together
+
+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.
+
+- `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.
+
+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.
+
+Useful commands:
+
+```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
+```
+
+---
+
+## 🖼️ Adding images
+
+Place your original image files (PNG, JPG, etc.) into the appropriate `public/assets/{category}/original/` folder, then run:
+
+```bash
+npm run optimise
+```
+
+The script will generate optimised WebP and JPG variants automatically. **Do not commit anything inside `optimised/` folders** — those are generated and ignored by git.
+
+> SVGs don't need optimising — just place them directly where they're needed, no `original/` folder required.
+
+---
+
+## 🚀 Deployment
+
+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.
+
+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,115 +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;
-        display       : flex;
-        flex-direction: column;
-        align-items   : center;
-
-        img {
-          display : block;
-          width   : 150px;
-          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