Housekeeping

components/01_Atoms/checkbox/_checkbox.scss

@@ -1,12 +1,16 @@
 .LP-Form{
     .LP-Form__Checkbox{
-            display: none;
+        display: none;
+		
+		&:checked + .LP-Form__CheckBox__CheckMark {
+			background-color: $-light-brown;
+		}
     }   
 
     .LP-Form__CheckBox__CheckMark{
         height: 1em;
         width: 1em;
-        border: 1px solid black;
+        border: 1px solid $-grey;
         padding: 0 calc(.5em + 2px);
         margin-right: .7em;
     }

components/01_Atoms/checkbox/checkbox.hbs

@@ -1,3 +1,7 @@
 <form class="LP-Form">
-    <label for="wurstwasser" class="LP-Form__Label"><span class="LP-Form__CheckBox__CheckMark"></span><input id="wurstwasser" type="checkbox" class="LP-Form__Checkbox"/>Check me</label>
+    <label for="wurstwasser" class="LP-Form__Label">
+		<input id="wurstwasser" type="checkbox" class="LP-Form__Checkbox"/>
+		<span class="LP-Form__CheckBox__CheckMark"></span>
+		Check me
+	</label>
 </form>

components/01_Atoms/input/input.hbs

@@ -4,7 +4,6 @@
     {{#if disabled}}
         disabled="disabled"
     {{/if}}
-    />
     {{#if message}}
     <span class="LP-Input__Message">{{message}}</span>
     {{/if}}

components/01_Atoms/link/_link.scss

@@ -6,8 +6,4 @@
         color: $-grey;
 		text-decoration: underline;
     }
-}
+}
-
-.LP-Link__IconWrapper{
-    display: inline;
-}

components/01_Atoms/link/link--iconized.hbs

@@ -0,0 +1,10 @@
+<a href="{{url}}" class="LP-Link">
+	<span class="RV-Iconized">
+		<span class="RV-Iconized__Text">
+			Iconized Text
+		</span>
+		<span class="RV-Iconized__Icon RV-Iconized__Icon--medium RV-Iconized__Icon--right">
+			<img src="/icons/debug.png"/>
+		</span>
+	</span>
+</a>

components/01_Atoms/link/link.hbs

@@ -1,3 +1 @@
-<p class="LP-Paragraph">
+<a href="{{url}}" class="LP-Link"><span class="LP-Link__Text">{{text}}</span></a>
-	<a href="{{url}}" class="LP-Link"><span class="LP-Link__Text">{{text}}</span></a>
-</p>

components/01_Atoms/tag/_tag.scss

@@ -3,10 +3,17 @@
     background-color: $-beige;
     border-radius: 2px;
     width: max-content;
-    @include RV-FlexRow__Container;
+    @include RV-Flex;
     height: min-content;
     gap: 3px;
     transition: background .3s;
+	
+	.LP-Link {
+		color: $-grey;
+		&:hover {
+			text-decoration: none;
+		}
+	}
 
     &__Remove {
         .RV-Iconized__Icon {

components/02_Molecules/_molecules.scss

@@ -1,6 +1,6 @@
-@import 'textSection/textSection';
+//@import 'textSection/textSection';
-@import 'placeTeaser/placeTeaser';
+//@import 'placeTeaser/placeTeaser';
-@import 'tagList/tagList';
+//@import 'tagList/tagList';
-@import 'navigation/navigation';
+//@import 'navigation/navigation';
-@import 'messageList/messageList';
+//@import 'messageList/messageList';
-@import 'userInfo/userInfo';
+//@import 'userInfo/userInfo';

components/02_Molecules/userInfo/_userInfo.scss

@@ -15,7 +15,7 @@
             padding: 0;
             margin: 0;
             text-align: center;
-            padding: $-spacing-small / 2;
+            padding: $-spacing-small;
             font-size: 25px;
         }
     }
@@ -26,7 +26,7 @@
             font-size: 18px;
         }
 
-        padding: $-spacing-small / 2;
+        padding: $-spacing-small;
 
         .LP-UserInfo__Key {
             padding-right: $-spacing-medium;

components/03_Organisms/_organisms.scss

@@ -1,9 +1,9 @@
-@import 'header/header';
+//@import 'header/header';
-@import 'placeGrid/placeGrid';
+//@import 'placeGrid/placeGrid';
-@import 'placeList/placeList';
+//@import 'placeList/placeList';
-@import 'linkList/linkList';
+//@import 'linkList/linkList';
-@import 'footer/footer';
+//@import 'footer/footer';
-@import 'form/form';
+//@import 'form/form';
-@import 'imageGrid/imageGrid';
+//@import 'imageGrid/imageGrid';
-@import 'osmMap/osmMap';
+//@import 'osmMap/osmMap';
-@import 'userProfile/userProfile';
+//@import 'userProfile/userProfile';

components/03_Organisms/linkList/_linkList.scss

@@ -1,7 +1,5 @@
 .LP-LinkList{
-	@include RV-FlexGrid(300px, 3em);
+	@include RV-Grid;
-	@include RV-ElementList;
-	@include RV-Spacing__Inner--small;
 	align-items: center;
 
     .LP-LinkList__Item{
@@ -11,7 +9,7 @@
 		transition: background .3s, color .5s;
 
 		@include RV-Alignment--verticalCenter;
-		@include RV-FlexRow__Container;
+		@include RV-Flex;
 
 		.LP-LinkList__ItemHover {
 			opacity: 0.5;

components/04_Templates/_templates.scss

@@ -1,3 +1,3 @@
-@import 'home/home';
+//@import 'home/home';
-@import 'placeDetail/placeDetail';
+//@import 'placeDetail/placeDetail';
-@import 'codex/codex';
+//@import 'codex/codex';

components/05_Pages/_pages.scss

@@ -1 +1 @@
-@import 'place/place';
+//@import 'place/place';

components/main.scss

@@ -1,4 +1,4 @@
-@import './rcss.bundled.scss';
+@import 'rcss.bundled';
 
 // Include primary fonts in regular, italic and bold each.
 @font-face {
@@ -197,4 +197,4 @@ body {
 @import '04_Templates/templates';
 @import '05_Pages/pages';
 
-@import './tagify';
+//@import './tagify';

package.json

@@ -11,7 +11,7 @@
         "sass-loader": "^10.0.5"
     },
     "scripts": {
-        "sass": "node-sass -w components/main.scss -o public/ --recursive",
+        "sass": "sass components/main.scss public/main.css --watch",
         "styleguide": "fractal start --sync",
         "suite": "npm run sass & npm run styleguide"
     }