Add more descriptions

6 files changed, 28 insertions, 6 deletions

diff --git a/docs/stories.html b/docs/stories.html
index 7e7362f..cb673af 100644
--- a/docs/stories.html
+++ b/docs/stories.html
@@ -20,6 +20,10 @@
     </nav>
     <main>
         
+<h2>My Stories</h2>
+<p class="works-description">
+Despite my linguistic difficulties to express myself, my love for story telling is present in a few mediums. Most of my writings are German and somewhere on the fantasy-magical realism spectrum. Feedback and criticism is welcomed!
+</p>
 <div class="works-filter">
     <form>
         <label for="language-select">Language: </label>
@@ -36,7 +40,7 @@
         <a href=".&#x2F;stories&#x2F;das_schweigende_spiegelbild.pdf" class="work-card" download>
             <div class="title-and-description">
                 <h3>Das schweigende Spiegelbild</h3>
-                <p>Em pariatur mollit ex esse exercitation amet. Nisi anim cupidatat excepteur officia.</p>
+                <p>Das Spiegelbild verzweifelt in seiner Hilflosigkeit gegenüber seinem Ich.</p>
             </div>
             <div class="info">
                 <span>2 Pages</span>
@@ -48,7 +52,7 @@
         <a href=".&#x2F;stories&#x2F;mit_gutem_gewissen.pdf" class="work-card" download>
             <div class="title-and-description">
                 <h3>Mit gutem Gewissen</h3>
-                <p>Lorem ipsum dolor sit amet, officia excepteur.</p>
+                <p>Der gefährliche Zauber von Leon wird von seinem wegweisenden Freund durchschaut. Kann er ihn stoppen?</p>
             </div>
             <div class="info">
                 <span>7 Pages</span>
diff --git a/docs/style.css b/docs/style.css
index 8e2258b..9112739 100644
--- a/docs/style.css
+++ b/docs/style.css
@@ -131,6 +131,13 @@ h3 {
   padding: 0.2em;
 }
 
+.works-description {
+  margin: 2em 1em;
+  padding: 1em;
+  border: 1px solid #333;
+  font-size: 0.9em;
+}
+
 table {
   border-collapse: collapse;
   width: 100%;
diff --git a/docs/style.css.map b/docs/style.css.map
index 168ef92..7611b99 100644
--- a/docs/style.css.map
+++ b/docs/style.css.map
@@ -1 +1 @@
-{"version":3,"sourceRoot":"","sources":["../sass/style.scss"],"names":[],"mappings":"AAKA;EACI;EACA;EACA;EAMA;;AALA;EACI;EACA;EACA;;;AAKR;EACI,kBAlBe;EAmBf,OAjBS;EAkBT;EACA;;;AAGJ;EACI;EACA;;AACA;EACI;EACA;;;AAIR;EACI;EACA;EACA;EACA;;;AAGJ;EACI;EACA;EACA;EACA;EACA,kBA7Ce;;;AAiDnB;EACI;EACA;;AACA;EACI;EACA;EACA;;AACA;EAJJ;IAKQ;;;AAEJ;EAPJ;IAQQ;;;;AAKZ;EACI;EACA;EACA,kBAnEQ;;;AAsEZ;EACI;EACA;;AACA;EACI,cAxEO;EAyEP;;;AAGR;EACI;EACA,OA9EW;;;AAkFf;EACI;EACA,kBAtFQ;EAuFR;EACA;EACA;EAIA;EACA;EACA;;AALA;EANJ;IAOQ;;;AAKJ;EACI;EACA;;AACA;EACI,kBArGO;EAsGP;EACA;EACA;;AAGR;EACI;;;AAIR;EACI;EACA;;AACA;EAHJ;IAIQ;;;AAEJ;EACI;EACA,OAtHK;;AAwHT;EACI,kBA1HI;EA2HJ,OAzHO;EA0HP;EACA;EACA;;;AAIR;EACI;EACA;EACA;;AAEI;EACI;EACA,kBAzIA;EA0IA;EACA;EACA;;AAGA;EACI;EACA,kBAlJG;EAmJH","file":"style.css"}
\ No newline at end of file
+{"version":3,"sourceRoot":"","sources":["../sass/style.scss"],"names":[],"mappings":"AAKA;EACI;EACA;EACA;EAMA;;AALA;EACI;EACA;EACA;;;AAKR;EACI,kBAlBe;EAmBf,OAjBS;EAkBT;EACA;;;AAGJ;EACI;EACA;;AACA;EACI;EACA;;;AAIR;EACI;EACA;EACA;EACA;;;AAGJ;EACI;EACA;EACA;EACA;EACA,kBA7Ce;;;AAiDnB;EACI;EACA;;AACA;EACI;EACA;EACA;;AACA;EAJJ;IAKQ;;;AAEJ;EAPJ;IAQQ;;;;AAKZ;EACI;EACA;EACA,kBAnEQ;;;AAsEZ;EACI;EACA;;AACA;EACI,cAxEO;EAyEP;;;AAIR;EACI;EACA,OA/EW;;;AAkFf;EACI;EACA,kBAtFQ;EAuFR;EACA;EACA;EAIA;EACA;EACA;;AALA;EANJ;IAOQ;;;AAKJ;EACI;EACA;;AACA;EACI,kBArGO;EAsGP;EACA;EACA;;AAGR;EACI;;;AAIR;EACI;EACA;;AACA;EAHJ;IAIQ;;;AAEJ;EACI;EACA,OAtHK;;AAwHT;EACI,kBA1HI;EA2HJ,OAzHO;EA0HP;EACA;EACA;;;AAIR;EACI;EACA;EACA;EACA;;;AAGJ;EACI;EACA;EACA;;AAEI;EACI;EACA,kBAhJA;EAiJA;EACA;EACA;;AAGA;EACI;EACA,kBAzJG;EA0JH","file":"style.css"}
\ No newline at end of file
diff --git a/sass/style.scss b/sass/style.scss
index 27a6125..cc11d16 100644
--- a/sass/style.scss
+++ b/sass/style.scss
@@ -77,12 +77,12 @@ a {
         color: lighten($color: $font-color, $amount: 10);
     }
 }
+
 h3 {
     font-weight: 500;
     color: $accent-color;
 }
 
-
 .work-card {
     padding: 2em;
     background-color: $box-color;
@@ -129,6 +129,13 @@ h3 {
     }
 }
 
+.works-description {
+    margin: 2em 1em;
+    padding: 1em;
+    border: 1px solid $box-color;
+    font-size: 0.9em;
+}
+
 table {
     border-collapse: collapse;
     width: 100%;
diff --git a/stories.json b/stories.json
index 743133d..5b88987 100644
--- a/stories.json
+++ b/stories.json
@@ -1,7 +1,7 @@
 [
     {
         "title": "Mit gutem Gewissen",
-        "description": "Lorem ipsum dolor sit amet, officia excepteur.",
+        "description": "Der gefährliche Zauber von Leon wird von seinem wegweisenden Freund durchschaut. Kann er ihn stoppen?",
         "path_to_document": "./stories/mit_gutem_gewissen.pdf",
         "number_of_pages": 7,
         "language": "German",
@@ -9,7 +9,7 @@
     },
     {
         "title": "Das schweigende Spiegelbild",
-        "description": "Em pariatur mollit ex esse exercitation amet. Nisi anim cupidatat excepteur officia.",
+        "description": "Das Spiegelbild verzweifelt in seiner Hilflosigkeit gegenüber seinem Ich.",
         "path_to_document": "./stories/das_schweigende_spiegelbild.pdf",
         "number_of_pages": 2,
         "language": "German",
diff --git a/templates/stories.html b/templates/stories.html
index 11a2fa2..d3047d9 100644
--- a/templates/stories.html
+++ b/templates/stories.html
@@ -1,6 +1,10 @@
 {% extends "base.html" %}
 {% block title %}Stories{% endblock title %}
 {% block content %}
+<h2>My Stories</h2>
+<p class="works-description">
+Despite my linguistic difficulties to express myself, my love for story telling is present in a few mediums. Most of my writings are German and somewhere on the fantasy-magical realism spectrum. Feedback and criticism is welcomed!
+</p>
 <div class="works-filter">
     <form>
         <label for="language-select">Language: </label>