Simplify website

assets/styles/_helpers.scss

@@ -5,12 +5,4 @@
   align-content: center;
   justify-content: space-around;
   flex-direction: row;
-
-  @media all and (max-width: 1400px) {
-    margin-top: 4rem;
-  }
-
-  @media screen and (max-width: 800px) {
-    margin-top: 2rem;
-  }
 }

assets/styles/components/_featured-project.scss

@@ -1,46 +0,0 @@
-.project {
-  display: flex;
-  flex-direction: row;
-  padding: 2rem 15rem;
-  background-color: #313131;
-
-  @media all and (max-width: 1400px) {
-    padding: 1rem;
-  }
-
-  @media screen and (max-width: 800px) {
-    flex-direction: column;
-
-    .project__image {
-      margin: 0;
-      text-align: center;
-    }
-  }
-
-  &:nth-child(2n + 1) {
-    background-color: #3e3e3e;
-  }
-
-  &__image {
-    max-width: 25rem;
-
-    &--left {
-      margin-right: 1.5rem;
-    }
-
-    &--right {
-      margin-left: 1.5rem;
-    }
-
-    img {
-      width: 100%;
-    }
-  }
-
-  &__infobox {
-    font-size: 1.2em;
-    display: flex;
-    flex-direction: column;
-    flex-grow: 1;
-  }
-}

assets/styles/components/_icon-link-list.scss

@@ -1,11 +1,7 @@
 .icon-list {
   text-align: left;
-  min-width: 200px;
   margin: 0 1.5rem;
-
+  font-size: 1.5rem;
-  @media screen and (max-width: 1100px) {
-    flex-basis: 400px;
-  }
 
   ul {
     list-style: none;
@@ -26,4 +22,13 @@
     color: #fff;
     margin-right: 0.25rem;
   }
+
+  h2 {
+    text-align: center;
+    font-size: 1.5rem;
+  }
+
+  @media screen and (max-width: 800px) {
+    font-size: 1.25rem;
+  }
 }

assets/styles/components/_section.scss

@@ -11,11 +11,15 @@
 
   .section-header {
     overflow: hidden;
-    padding: 20px;
+    padding: 0.75rem;
     background-color: #383838;
     border-bottom: 5px solid #252525;
     text-transform: uppercase;
     text-align: center;
+
+    & > h1 {
+      font-size: 1.75rem;
+    }
   }
 
   .section-content {
@@ -28,11 +32,11 @@
     overflow: auto;
     flex-grow: 1;
     min-height: calc(100vh - 80px);
-    padding: 0 20%;
+    padding: 1rem 20%;
     font-size: 1.5rem;
 
     @media screen and (max-width: 800px) {
-      padding: 0 2rem;
+      padding: 1rem;
     }
   }
 }

assets/styles/components/index.scss

@@ -1,5 +1,4 @@
 @use 'language-list';
 @use 'section';
 @use 'icon-link-list';
-@use 'featured-project';
 @use 'blog';

assets/styles/index.scss

@@ -16,10 +16,21 @@ body {
 }
 
 body {
-  font-family: system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto,
+  font-family:
-    Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif;
+    system-ui,
+    -apple-system,
+    BlinkMacSystemFont,
+    'Segoe UI',
+    Roboto,
+    Oxygen,
+    Ubuntu,
+    Cantarell,
+    'Open Sans',
+    'Helvetica Neue',
+    sans-serif;
 }
 
+p,
 h1,
 h2,
 h3,
@@ -38,6 +49,10 @@ a {
 }
 
 footer {
+  display: flex;
+  flex-direction: column;
+  padding: 1rem 0;
+  gap: 1rem;
   overflow: hidden;
   background-color: $gray-1;
   color: #fff;

components/featured-project.vue

@@ -1,41 +0,0 @@
-<template>
-  <div class="project">
-    <div class="project__image project__image--left" v-if="variant === 'left'">
-      <a :href="image" target="_blank"><img :src="thumb" :alt="title" /></a>
-    </div>
-
-    <div class="project__infobox">
-      <div class="project__info-title">
-        <h2>
-          <a :href="href" target="_blank">{{ title }}</a>
-        </h2>
-      </div>
-      <div class="project__info-body">
-        <slot></slot>
-      </div>
-    </div>
-
-    <div
-      class="project__image project__image--right"
-      v-if="variant === 'right'"
-    >
-      <a :href="image" target="_blank"><img :src="thumb" :alt="title" /></a>
-    </div>
-  </div>
-</template>
-
-<script setup lang="ts">
-const props = defineProps<{
-  variant: 'left' | 'right';
-  title: string;
-  href: string;
-  image: string;
-}>();
-
-const thumb = computed(() => {
-  const split = props.image.split('/');
-  const last = split.length - 1;
-  split[last] = `thumb_${split[last]}`;
-  return split.join('/');
-});
-</script>

components/icon-link-list.vue

@@ -1,6 +1,5 @@
 <template>
   <div class="icon-list">
-    <h2>{{ title }}</h2>
     <ul>
       <li v-for="item in list">
         <NuxtLink
@@ -21,5 +20,5 @@ interface LinkList {
   blank?: boolean;
 }
 
-const props = defineProps<{ list: LinkList[]; title: string }>();
+defineProps<{ list: LinkList[] }>();
 </script>

nuxt.config.ts

@@ -33,7 +33,6 @@ export default defineNuxtConfig({
       link: [
         { rel: 'me', href: 'https://social.lunasqu.ee/diamond' },
         { rel: 'me', href: 'https://fosstodon.org/@evertprants' },
-        { rel: 'me', href: 'https://bsky.app/profile/lunasqu.ee' },
       ],
     },
   },

package.json

@@ -9,14 +9,14 @@
   },
   "devDependencies": {
     "@types/marked": "^6.0.0",
-    "marked": "^15.0.0",
+    "marked": "^15.0.6",
-    "nuxt": "^3.14.159",
+    "nuxt": "^3.15.3",
-    "prettier": "^3.3.3",
+    "prettier": "^3.4.2",
-    "yaml": "^2.6.0"
+    "yaml": "^2.7.0"
   },
   "dependencies": {
     "feed": "^4.2.2",
-    "highlight.js": "^11.10.0",
+    "highlight.js": "^11.11.1",
-    "sass": "^1.80.6"
+    "sass": "^1.83.4"
   }
 }

pages/index.vue

@@ -18,16 +18,10 @@
               scientific fields. I like to tell everyone that I use Arch Linux -
               sorry not sorry.
             </p>
-            <p>
-              I can pretty much code in any language and use any library with
-              the help of documentation and instructional materials, so the
-              <q>Programming</q> list is not entirely comprehensive.
-            </p>
           </div>
 
           <div class="gridbox">
-            <IconLinkList :list="linksList" title="Links" />
+            <IconLinkList :list="linksList" />
-            <IconLinkList :list="socialLinks" title="Socials" />
           </div>
 
           <LanguageList />
@@ -39,6 +33,11 @@
 
 <script setup lang="ts">
 const linksList = [
+  {
+    href: 'https://git.icynet.eu/evert',
+    icon: 'icon-gitea',
+    name: 'Gitea',
+  },
   {
     name: 'Blog (inactive)',
     icon: 'icon-rss-box',
@@ -61,24 +60,6 @@ const linksList = [
     href: 'https://icynet.eu/',
     blank: true,
   },
-];
-
-const socialLinks = [
-  {
-    href: 'https://git.icynet.eu/evert',
-    icon: 'icon-gitea',
-    name: 'Gitea (personal projects)',
-  },
-  {
-    href: 'https://bsky.app/profile/lunasqu.ee',
-    icon: 'icon-bluesky',
-    name: 'Bluesky',
-  },
-  {
-    href: 'https://social.lunasqu.ee/diamond',
-    icon: 'icon-pleroma',
-    name: 'Akkoma (aka Mastodon)',
-  },
   {
     href: 'https://github.com/LunaSquee',
     icon: 'icon-github-circled',