From 039bb7d42796e5c3b3ef3008944f1d76dce0a539 Mon Sep 17 00:00:00 2001
From: reverend <reverend@reverend2048.de>
Date: Fri, 7 Aug 2020 11:24:00 +0200
Subject: [PATCH] Sync

---
 .../02_Molecules/navigation/_navigation.scss  |  9 ++++--
 .../navigation/navigation.config.json         |  7 +++-
 .../02_Molecules/navigation/navigation.hbs    |  3 ++
 .../02_Molecules/textSection/textSection.hbs  |  8 +++--
 .../placeOverview/placeOverview.hbs           | 18 ++++++-----
 components/05_Pages/_pages.scss               | 22 -------------
 .../placeDetail/placeDetail.config.json       | 23 ++++++++++++-
 .../05_Pages/placeDetail/placeDetail.hbs      | 12 +++----
 components/_preview.hbs                       |  2 +-
 components/{components.scss => main.scss}     | 22 +++++++++++++
 package.json                                  |  2 +-
 public/{components.css => main.css}           | 32 ++++++++++---------
 12 files changed, 101 insertions(+), 59 deletions(-)
 rename components/{components.scss => main.scss} (71%)
 rename public/{components.css => main.css} (99%)

diff --git a/components/02_Molecules/navigation/_navigation.scss b/components/02_Molecules/navigation/_navigation.scss
index 66391a5..3212a8f 100644
--- a/components/02_Molecules/navigation/_navigation.scss
+++ b/components/02_Molecules/navigation/_navigation.scss
@@ -45,6 +45,10 @@
                 margin-bottom: 10px;
                 padding-left: 25px;
 
+				&--additional{
+					background-color: #ccc;
+				}
+
 				.LP-Link{
 					line-height: 1em;
 				}
@@ -57,9 +61,10 @@
                     border-right: 2px solid $-light-brown;
                     position: relative;
                     background-color: $-beige;
-                    color: $-wine-red;
+					color: $-wine-red;
                 }
-            }
+			}
+
         }
     }
 }
diff --git a/components/02_Molecules/navigation/navigation.config.json b/components/02_Molecules/navigation/navigation.config.json
index 58fb85c..0cdbb35 100644
--- a/components/02_Molecules/navigation/navigation.config.json
+++ b/components/02_Molecules/navigation/navigation.config.json
@@ -1,5 +1,10 @@
 {
-    "title": "Navigation",
+	"title": "Navigation",
+	"context": {
+		"additionalItems": [
+			"Hello"
+		]
+	},
     "variants": [
         {
             "name": "Sidebar",
diff --git a/components/02_Molecules/navigation/navigation.hbs b/components/02_Molecules/navigation/navigation.hbs
index 0f30891..39fe107 100644
--- a/components/02_Molecules/navigation/navigation.hbs
+++ b/components/02_Molecules/navigation/navigation.hbs
@@ -1,5 +1,8 @@
 <nav class="LP-Menu LP-Menu{{modifier}}">
     <ul class="LP-Menu__List">
+		{{#each additionalItems}}
+			<li class="LP-Menu__Item LP-Menu__Item--additional">{{> @link text=this}}</li>
+		{{/each}}
         <li class="LP-Menu__Item">{{> @link text='Home'}}</li>
         <li class="LP-Menu__Item">{{> @link text='About'}}</li>
         <li class="LP-Menu__Item">{{> @link text='Contact'}}</li>
diff --git a/components/02_Molecules/textSection/textSection.hbs b/components/02_Molecules/textSection/textSection.hbs
index ec3dd13..a4447d5 100644
--- a/components/02_Molecules/textSection/textSection.hbs
+++ b/components/02_Molecules/textSection/textSection.hbs
@@ -1,4 +1,8 @@
 <article class="LP-TextSection">
-    {{> @headline headline=headline}}
-    {{> @paragraph text=text}}
+	<header class="LP-TextSection__Headline">
+    	{{> @headline headline=headline}}
+	</header>
+    <div class="LP-TextSection__Text">
+		{{> @paragraph text=text}}
+	</div>
 </article>
\ No newline at end of file
diff --git a/components/04_Templates/placeOverview/placeOverview.hbs b/components/04_Templates/placeOverview/placeOverview.hbs
index 221990d..b90b8be 100644
--- a/components/04_Templates/placeOverview/placeOverview.hbs
+++ b/components/04_Templates/placeOverview/placeOverview.hbs
@@ -1,18 +1,20 @@
 <article class="LP-PlaceOverview">
     <div class="LP-PlaceOverview__Info">
-        <div class="LP-PlaceOveriew__Image">
+					<header class="LP-Place">
+				{{> @headline--main headline='Kokerei Wiescherhöfen'}}
+			</header>
+        <figure class="LP-PlaceOveriew__Image">
             {{> @image source='/images/Bildschirmfoto_von_2020-07-13_20-15-00.png'}}
-        </div>
-        <article class="LP-PlaceOverView__Description">
+        </figure>
+        <div class="LP-PlaceOverView__Description">
             <div class="LP-TextSection">
-            {{> @headline--main headline='Kokerei Wiescherhöfen'}}
             {{> @paragraph text='Do you see any Teletubbies in here? Do you see a slender plastic tag clipped to my shirt with my name printed on it? Do you see a little Asian child with a blank expression on his face sitting outside on a mechanical helicopter that shakes when you put quarters in it? No? Well, thats what you see at a toy store. And you must think youre in a toy store, because youre here shopping for an infant named Jeb. My moneys in that office, right? If she start giving me some bullshit about it aint there, and we got to go someplace else and get it, Im gonna shoot you in the head then and there. Then Im gonna shoot that bitch in the kneecaps, find out where my goddamn money is. She gonna tell me too. Hey, look at me when Im talking to you, motherfucker. You listen: we go in there, and that nigga Winston or anybody else is in there, you the first motherfucker to get shot. You understand?
 
-Do you see any Teletubbies in here? Do you see a slender plastic tag clipped to my shirt with my name printed on it? Do you see a little Asian child with a blank expression on his face sitting outside on a mechanical helicopter that shakes when you put quarters in it? No? Well, thats what you see at a toy store. And you must think youre in a toy store, because youre here shopping for an infant named Jeb.Do you see any Teletubbies in here? Do you see a slender plastic tag clipped to my shirt with my name printed on it? Do you see a little Asian child with a blank expression on his face sitting outside on a mechanical helicopter that shakes when you put quarters in it? No? Well, thats what you see at a toy store. And you must think youre in a toy store, because youre here shopping for an infant named Jeb. My moneys in that office, right? If she start giving me some bullshit about it aint there, and we got to go someplace else and get it, Im gonna shoot you in the head then and there. Then Im gonna shoot that bitch in the kneecaps, find out where my goddamn money is. She gonna tell me too. Hey, look at me when Im talking to you, motherfucker. You listen: we go in there, and that nigga Winston or anybody else is in there, you the first motherfucker to get shot. You understand?
+			Do you see any Teletubbies in here? Do you see a slender plastic tag clipped to my shirt with my name printed on it? Do you see a little Asian child with a blank expression on his face sitting outside on a mechanical helicopter that shakes when you put quarters in it? No? Well, thats what you see at a toy store. And you must think youre in a toy store, because youre here shopping for an infant named Jeb.Do you see any Teletubbies in here? Do you see a slender plastic tag clipped to my shirt with my name printed on it? Do you see a little Asian child with a blank expression on his face sitting outside on a mechanical helicopter that shakes when you put quarters in it? No? Well, thats what you see at a toy store. And you must think youre in a toy store, because youre here shopping for an infant named Jeb. My moneys in that office, right? If she start giving me some bullshit about it aint there, and we got to go someplace else and get it, Im gonna shoot you in the head then and there. Then Im gonna shoot that bitch in the kneecaps, find out where my goddamn money is. She gonna tell me too. Hey, look at me when Im talking to you, motherfucker. You listen: we go in there, and that nigga Winston or anybody else is in there, you the first motherfucker to get shot. You understand?
 
-Do you see any Teletubbies in here? Do you see a slender plastic tag clipped to my shirt with my name printed on it? Do you see a little Asian child with a blank expression on his face sitting outside on a mechanical helicopter that shakes when you put quarters in it? No? Well, thats what you see at a toy store. And you must think youre in a toy store, because youre here shopping for an infant named Jeb.'}}
-</div>
-        </article>
+			Do you see any Teletubbies in here? Do you see a slender plastic tag clipped to my shirt with my name printed on it? Do you see a little Asian child with a blank expression on his face sitting outside on a mechanical helicopter that shakes when you put quarters in it? No? Well, thats what you see at a toy store. And you must think youre in a toy store, because youre here shopping for an infant named Jeb.'}}
+			</div>
+        </div>
     </div>
     <article>
         {{> @headline headline='Sicherheitsmaßnahmen'}}
diff --git a/components/05_Pages/_pages.scss b/components/05_Pages/_pages.scss
index 62710e4..c9c9f07 100644
--- a/components/05_Pages/_pages.scss
+++ b/components/05_Pages/_pages.scss
@@ -1,23 +1 @@
-$-sidebar-width: 250px;
-
-.LP-Main{
-    display: table;
-    flex-direction: row-reverse;
-    height: calc(100% - 61px);
-
-    .LP-Main__Content{
-        display: table-cell;
-         width: calc(100% -300px);
-         min-height: 1px;
-         padding: 25px;
-    }
-
-    .LP-Main__Sidebar{
-        display: table-cell;
-        width: $-sidebar-width;
-        flex-grow: 0;
-        height: 100%;
-    }
-}
-
 @import 'placeDetail/placeDetail';
\ No newline at end of file
diff --git a/components/05_Pages/placeDetail/placeDetail.config.json b/components/05_Pages/placeDetail/placeDetail.config.json
index 9e26dfe..120cd14 100644
--- a/components/05_Pages/placeDetail/placeDetail.config.json
+++ b/components/05_Pages/placeDetail/placeDetail.config.json
@@ -1 +1,22 @@
-{}
\ No newline at end of file
+{
+	"title": "PlaceDetail",
+	"context": {
+		"tags": [
+			"Kamera",
+			"Wachhund",
+			"Zaun",
+			"Security"
+		],
+		"images": [
+            "/images/Bildschirmfoto_von_2020-07-13_11-03-07.png",
+            "/images/photo_2020-05-02_18-11-21.jpg",
+            "/images/Bildschirmfoto_von_2020-07-13_20-15-00.png",
+            "/images/photo_2020-05-02_18-11-21.jpg",
+            "/images/Bildschirmfoto_von_2020-07-13_11-03-07.png"
+		],
+		"additionalItems": [
+			"Edit Place",
+			"Delete Place"
+		]
+	}
+}
\ No newline at end of file
diff --git a/components/05_Pages/placeDetail/placeDetail.hbs b/components/05_Pages/placeDetail/placeDetail.hbs
index e35661d..36e86c2 100644
--- a/components/05_Pages/placeDetail/placeDetail.hbs
+++ b/components/05_Pages/placeDetail/placeDetail.hbs
@@ -1,9 +1,9 @@
 {{> @header}}
-<article class="LP-Main">
-    <section class="LP-Main__Sidebar">
+<div class="LP-Main">
+    <aside class="LP-Main__Sidebar">
         {{> @navigation modifier='--sidebar'}}
-    </section>
-    <section class="LP-Main__Content">
+    </aside>
+    <main class="LP-Main__Content">
         {{> @placeoverview}}
-    </section>
-</article>
\ No newline at end of file
+    </main>
+</div>
\ No newline at end of file
diff --git a/components/_preview.hbs b/components/_preview.hbs
index a85fc91..2fd5ffd 100644
--- a/components/_preview.hbs
+++ b/components/_preview.hbs
@@ -2,7 +2,7 @@
 <html lang="en">
     <head>
         <meta charset="UTF-8">
-        <link rel="stylesheet" href="{{ path '/components.css' }}">
+        <link rel="stylesheet" href="{{ path '/main.css' }}">
         <title>Preview</title>
     </head>
     <body>
diff --git a/components/components.scss b/components/main.scss
similarity index 71%
rename from components/components.scss
rename to components/main.scss
index 4fae633..f8a74eb 100644
--- a/components/components.scss
+++ b/components/main.scss
@@ -31,6 +31,8 @@ $-viewport-extra-small: 450px;
 $-viewport-medium: 750px;
 $-viewport-normal: 1000px;
 
+$-sidebar-width: 250px;
+
 html{
   height:100%;
   margin: 0;
@@ -42,6 +44,26 @@ body{
   margin: 0;
 }
 
+.LP-Main{
+    display: table;
+    flex-direction: row-reverse;
+    height: calc(100% - 61px);
+
+    .LP-Main__Content{
+        display: table-cell;
+         width: calc(100% -300px);
+         min-height: 1px;
+         padding: 25px;
+    }
+
+    .LP-Main__Sidebar{
+        display: table-cell;
+        width: $-sidebar-width;
+        flex-grow: 0;
+        height: 100%;
+    }
+}
+
 @import '01_Atoms/atoms';
 @import '02_Molecules/molecules';
 @import '03_Organisms/organisms';
diff --git a/package.json b/package.json
index b202406..e93bb00 100644
--- a/package.json
+++ b/package.json
@@ -8,7 +8,7 @@
         "sass": "^1.26.10"
     },
     "scripts": {
-        "sass": "node-sass -w components/components.scss -o public/ --recursive",
+		"sass": "node-sass -w components/main.scss -o public/ --recursive",
         "styleguide": "fractal start --sync",
         "suite": "npm run sass & npm run styleguide"
     }
diff --git a/public/components.css b/public/main.css
similarity index 99%
rename from public/components.css
rename to public/main.css
index 307f3dc..42de708 100644
--- a/public/components.css
+++ b/public/main.css
@@ -15,6 +15,21 @@ body {
   height: 100%;
   margin: 0; }
 
+.LP-Main {
+  display: table;
+  flex-direction: row-reverse;
+  height: calc(100% - 61px); }
+  .LP-Main .LP-Main__Content {
+    display: table-cell;
+    width: calc(100% -300px);
+    min-height: 1px;
+    padding: 25px; }
+  .LP-Main .LP-Main__Sidebar {
+    display: table-cell;
+    width: 250px;
+    flex-grow: 0;
+    height: 100%; }
+
 .LP-Link {
   color: #565656;
   text-decoration: none;
@@ -275,6 +290,8 @@ body {
         text-align: left;
         margin-bottom: 10px;
         padding-left: 25px; }
+        .LP-Menu--sidebar .LP-Menu__List .LP-Menu__Item--additional {
+          background-color: #ccc; }
         .LP-Menu--sidebar .LP-Menu__List .LP-Menu__Item .LP-Link {
           line-height: 1em; }
         .LP-Menu--sidebar .LP-Menu__List .LP-Menu__Item:last-child {
@@ -518,18 +535,3 @@ body {
     height: auto;
     margin: 0;
     padding: 0; } }
-
-.LP-Main {
-  display: table;
-  flex-direction: row-reverse;
-  height: calc(100% - 61px); }
-  .LP-Main .LP-Main__Content {
-    display: table-cell;
-    width: calc(100% -300px);
-    min-height: 1px;
-    padding: 25px; }
-  .LP-Main .LP-Main__Sidebar {
-    display: table-cell;
-    width: 250px;
-    flex-grow: 0;
-    height: 100%; }