_article.css.scss in styleus-0.0.8

- old
+ new
@@ -2,49 +2,71 @@
   @include box-sizing(border-box);
   padding-left: 1em;
   padding-right: 1em;
 }
 
+@mixin text-content-padding {
+  padding-left: 0.5em;
+}
+
 .__sg_article {
-  @include border-radius(3px);
-  @include box-shadow(0 2px 3px 0 #cdcdcd);
   @include component;
   @include default-side-margin;
-  background: $content_background;
-  margin-bottom: 1em;
-  min-height: 3em;
-  padding-top: 1em;
 
-  > h3 {
-    @include ambient-headline;
-    @include article-side-padding;
-    margin-bottom: 0.5em;
-    text-align: right;
-    color: #ccc;
-  }
+  header {
+    @include component;
+    margin-top: 1.5em;
+    margin-bottom: 0.3em;
 
-  .__sg_component, .CodeRay, .__code_note {
-    @include article-side-padding;
+    > h3 {
+      @include ambient-headline;
+      @include text-content-padding;
+      color: #222;
+      line-height: 1.8em;
+    }
   }
 
-  .__sg_component {
-    padding-top: 0.3em;
-    padding-bottom: 1em;
+  .__documentation {
+    @include floating-text-font;
+    @include text-content-padding;
+    margin-bottom: 0.5em;
   }
 
-  .__code_note {
-    @include background(linear-gradient(bottom, #b5b5b5, #e4e4e4));
-    @include border-radius(6px 0 0 0);
-    @include ambient-font;
-    border-top: 1px solid #cacaca;
-    border-bottom: 1px solid #999;
-    text-align: center;
-    //margin-top: 0.5em;
-    line-height: 1.5em;
-  }
+  .__code_partials {
+    @include border-radius(3px);
+    @include box-shadow(0 2px 3px 0 #cdcdcd);
+    position: relative;
+    top: 0; left: 0;
 
-  .CodeRay {
-    @include border-radius(0 0 3px 3px);
+    background: $content_background;
+    margin-bottom: 1em;
+    min-height: 3em;
+    padding-top: 1em;
+
+    .__sg_component, .CodeRay, .__code_note {
+      @include article-side-padding;
+    }
+
+    .__sg_component {
+      padding-top: 0.3em;
+      padding-bottom: 1em;
+    }
+
+    .__code_note {
+      @include background(linear-gradient(bottom, #b5b5b5, #e4e4e4));
+      @include border-radius(6px 0 0 0);
+      @include ambient-font;
+      border-top: 1px solid #cacaca;
+      border-bottom: 1px solid #999;
+      text-align: center;
+      //margin-top: 0.5em;
+      line-height: 1.5em;
+    }
+
+    .CodeRay {
+      @include border-radius(0 0 3px 3px);
+    }
+
   }
 }
 
 // hide highligthed code for default, if js is enabled
 .js {