From b31a89867522d309aa268d6e0eddd30a86e7f1ae Mon Sep 17 00:00:00 2001
From: Luca Junge <LucaJunge97@gmail.com>
Date: Mon, 10 Apr 2023 10:30:17 +0200
Subject: [PATCH] added draft mode to drafts and added new model preview card

---
 package.json                                  |  2 +-
 src/_includes/card.njk                        |  9 ++++++
 src/_includes/model-preview.njk               | 13 ++++++++
 src/css/tailwind.css                          | 10 ++++--
 src/index.njk                                 | 10 ++----
 src/models/models.njk                         | 10 ++----
 src/posts/awesome-open-source-tools/index.md  | 32 +++++++++++++++++++
 src/posts/configuring-eleventy/index.md       |  1 +
 src/posts/godot-debugger/index.md             |  7 ++--
 .../index.md                                  |  1 +
 10 files changed, 72 insertions(+), 23 deletions(-)
 create mode 100644 src/_includes/card.njk
 create mode 100644 src/_includes/model-preview.njk
 create mode 100644 src/posts/awesome-open-source-tools/index.md

diff --git a/package.json b/package.json
index fe504be..044845c 100644
--- a/package.json
+++ b/package.json
@@ -15,7 +15,7 @@
   },
   "keywords": [],
   "author": "Luca Junge",
-  "license": "GPL-3.0-or-later",
+  "license": "MIT",
   "devDependencies": {
     "@11ty/eleventy": "^1.0.2",
     "autoprefixer": "^10.4.13",
diff --git a/src/_includes/card.njk b/src/_includes/card.njk
new file mode 100644
index 0000000..af08174
--- /dev/null
+++ b/src/_includes/card.njk
@@ -0,0 +1,9 @@
+<a href="{{ post.url }}" class="group rounded-lg flex flex-col items-center text-gray-100  lg:flex-row lg:max-w-xl">
+  <div class="bg-gray-700 group-hover:bg-gray-300 transition ease-in-out rounded-t-lg lg:rounded-none lg:rounded-l-lg overflow-hidden self-stretch">
+    <img class="object-contain object-center group-hover:scale-110 transition ease-in-out" src="{{ post.url }}thumbnail.png" alt="{{post.data.alt}}">
+  </div>
+  <div class="w-full h-full self-center py-3 px-4 leading-normal bg-gray-600 rounded-b-lg lg:rounded-b-none lg:rounded-r-lg">
+    <h5 class="text-2xl font-bold tracking-tight text-gray-100">{{post.data.title}}</h5>
+    <p class="mb-3 font-normal text-gray-200">{{post.data.alt}}</p>
+  </div>
+</a>
diff --git a/src/_includes/model-preview.njk b/src/_includes/model-preview.njk
new file mode 100644
index 0000000..1961010
--- /dev/null
+++ b/src/_includes/model-preview.njk
@@ -0,0 +1,13 @@
+<a href="{{ post.url }}"class="group relative rounded-lg text-gray-100">
+
+  <!-- A container for the preview -->
+  <div class="model-image-container flex bg-gray-700 rounded-lg overflow-hidden">
+    <img class="m-2 border-t-3 object-contain w-full h-full group-hover:scale-110 transition ease-in-out" src="{{ post.url }}thumbnail.png" alt="{{post.data.alt}}">
+  </div>
+
+  <!-- The model title and description -->
+  <div class="model-info text-gray-100 backdrop-blur-sm p-5 pb-16 absolute bottom-0 left-0 right-0 bg-black/40 group-hover:bg-black/50 transition ease-in-out rounded-b-lg">
+    <h5 class="text-2xl font-bold">{{post.data.title}}</h5>
+    <p>{{post.data.alt}}</p>
+  </div>
+</a>
diff --git a/src/css/tailwind.css b/src/css/tailwind.css
index a14b971..bafb2a2 100644
--- a/src/css/tailwind.css
+++ b/src/css/tailwind.css
@@ -4,10 +4,14 @@
 
 @layer base {
   h1 {
-    @apply text-2xl;
-    @apply font-bold;
+    @apply mb-2 text-2xl font-bold;
   }
+
   h2 {
-    @apply text-xl;
+    @apply mb-1 text-xl;
+  }
+
+  ul {
+    @apply ml-4 list-inside list-disc;
   }
 }
diff --git a/src/index.njk b/src/index.njk
index fdb34fb..98a8f9d 100644
--- a/src/index.njk
+++ b/src/index.njk
@@ -26,14 +26,8 @@ title: luca-junge.de
     <i class="fa fa-angle-down mr-1"></i>MODELS</span>
 </div>
 
-<ul class="grid gap-5 grid-cols-2 grid-rows-2 lg:grid-cols-3 lg:grid-rows-3">
+<ul class="grid gap-5 grid-cols-1 grid-rows-1 md:grid-cols-2 md:grid-rows-2 lg:grid-cols-3 lg:grid-rows-3">
   {% for post in collections.model %}
-    <a href="{{ post.url }}" class="flex flex-col items-center text-gray-100 bg-gray-700  rounded-lg lg:flex-row lg:max-w-xl hover:bg-gray-300 transition ease-in-out">
-      <img class="object-cover w-full rounded-t-lg lg:h-auto lg:w-48 lg:rounded-none lg:rounded-l-lg" src="{{ post.url }}thumbnail.png" alt="{{post.data.alt}}">
-      <div class="w-full h-full self-center py-3 px-4 leading-normal bg-gray-600 rounded-b-lg lg:rounded-b-none lg:rounded-r-lg">
-        <h5 class="text-2xl font-bold tracking-tight text-gray-100">{{post.data.title}}</h5>
-        <p class="mb-3 font-normal text-gray-200">{{post.data.alt}}</p>
-      </div>
-    </a>
+    {% include "model-preview.njk" %}
   {% endfor %}
 </ul>
diff --git a/src/models/models.njk b/src/models/models.njk
index 6ae82cc..6d20172 100644
--- a/src/models/models.njk
+++ b/src/models/models.njk
@@ -3,14 +3,8 @@ layout: post.njk
 title: Alle 3D-Modelle
 eleventyExcludeFromCollections: true
 ---
-<ul class="grid gap-5 grid-cols-2 grid-rows-2 lg:grid-cols-3 lg:grid-rows-3">
+<ul class="grid gap-5 ml-0 grid-cols-1 grid-rows-1 md:grid-cols-2 md:grid-rows-2 lg:grid-cols-3 lg:grid-rows-3">
   {% for post in collections.model %}
-    <a href="{{ post.url }}" class="flex flex-col items-center text-gray-100 bg-gray-700  rounded-lg lg:flex-row lg:max-w-xl hover:bg-gray-300 transition ease-in-out">
-      <img class="object-cover w-full rounded-t-lg lg:h-auto lg:w-48 lg:rounded-none lg:rounded-l-lg" src="{{ post.url }}thumbnail.png" alt="{{post.data.alt}}">
-      <div class="w-full h-full self-center py-3 px-4 leading-normal bg-gray-600 rounded-b-lg lg:rounded-b-none lg:rounded-r-lg">
-        <h5 class="text-2xl font-bold tracking-tight text-gray-100">{{post.data.title}}</h5>
-        <p class="mb-3 font-normal text-gray-200">{{post.data.alt}}</p>
-      </div>
-    </a>
+    {% include "model-preview.njk" %}
   {% endfor %}
 </ul>
diff --git a/src/posts/awesome-open-source-tools/index.md b/src/posts/awesome-open-source-tools/index.md
new file mode 100644
index 0000000..1eb917d
--- /dev/null
+++ b/src/posts/awesome-open-source-tools/index.md
@@ -0,0 +1,32 @@
+---
+title: Awesome Open Source tools
+---
+
+Here's a list of open source tools that are almost too good to be true.
+
+## Design
+
+### Penpot
+
+Penpot can be found [here](https://github.com/penpot/penpot)
+
+## GameDev
+
+- Godot
+- Aseprite
+
+## Modelling
+
+- Blender
+
+## Texturing
+
+- Material Maker
+- Blender
+- Aseprite
+
+## Editing and Typing
+
+- Typst
+
+## Other notable mentions
diff --git a/src/posts/configuring-eleventy/index.md b/src/posts/configuring-eleventy/index.md
index e737e45..93afa9f 100644
--- a/src/posts/configuring-eleventy/index.md
+++ b/src/posts/configuring-eleventy/index.md
@@ -1,5 +1,6 @@
 ---
 title: Configuring Eleventy
+draft: true
 ---
 
 # Was ist Eleventy?
diff --git a/src/posts/godot-debugger/index.md b/src/posts/godot-debugger/index.md
index 861a9cf..98af561 100644
--- a/src/posts/godot-debugger/index.md
+++ b/src/posts/godot-debugger/index.md
@@ -1,7 +1,8 @@
 ---
-title: My Godot Debugger Plugin
+title: Godot 4.0 Debugger Plugin
+draft: true
 ---
 
-# Todo
+# Why I created this plugin
 
-Todo
+ToDo
diff --git a/src/posts/meshlab-blender-decimation-workflow/index.md b/src/posts/meshlab-blender-decimation-workflow/index.md
index 0a86b51..7f8b74b 100644
--- a/src/posts/meshlab-blender-decimation-workflow/index.md
+++ b/src/posts/meshlab-blender-decimation-workflow/index.md
@@ -1,5 +1,6 @@
 ---
 title: How to automate decimating meshes with MeshLab and Blender
+draft: true
 ---
 
 # ToDo