fix(docs): fix widget margin

akveo · Jun 20, 2018 · ba5def0 · ba5def0
1 parent babbeef
commit ba5def0
Show file tree

Hide file tree

Showing 4 changed files with 32 additions and 10 deletions.
diff --git a/docs/app/blocks/components/component-block/component-block.component.ts b/docs/app/blocks/components/component-block/component-block.component.ts
@@ -10,11 +10,14 @@ import { NgdTabbedService } from '../../../@theme/services';
           <ng-container *ngIf="node.type === 'text'">
             <div *ngFor="let section of node.content" [innerHtml]="section.html"></div>
           </ng-container>
-          <ngd-live-example-block *ngIf="node.type === 'live-example'" [id]="node.content" [title]="'example'">
+          <ngd-live-example-block *ngIf="node.type === 'live-example'" [id]="node.content" [title]="'example'"
+                                  class="widget-block">
           </ngd-live-example-block>
-          <ngd-inline-example-block *ngIf="node.type === 'inline-example'" [content]="node.content">
+          <ngd-inline-example-block *ngIf="node.type === 'inline-example'" [content]="node.content"
+                                    class="widget-block">
           </ngd-inline-example-block>
-          <ngd-stacked-example-block *ngIf="node.type === 'example'" [content]="node.content">
+          <ngd-stacked-example-block *ngIf="node.type === 'example'" [content]="node.content"
+                                     class="widget-block">
           </ngd-stacked-example-block>
         </ng-container>
         <ngd-props-block [source]="source" *ngIf="hasProps(source)"></ngd-props-block>

diff --git a/docs/app/blocks/components/examples-block/examples-block.component.ts b/docs/app/blocks/components/examples-block/examples-block.component.ts
@@ -13,7 +13,8 @@ import { NgdTabbedService } from '../../../@theme/services';
     <nb-card [ngdFragment]="source.slag">
       <nb-card-body>
         <h2>{{ source.name }}</h2>
-        <ngd-stacked-example-block *ngFor="let example of source.liveExamples" [content]="example.content">
+        <ngd-stacked-example-block *ngFor="let example of source.liveExamples" [content]="example.content"
+                                   class="widget-block">
         </ngd-stacked-example-block>
       </nb-card-body>
     </nb-card>

diff --git a/docs/app/blocks/components/overview-block/overview-block.component.ts b/docs/app/blocks/components/overview-block/overview-block.component.ts
@@ -9,11 +9,14 @@ import { ChangeDetectionStrategy, Component, Input } from '@angular/core';
           <ng-container *ngIf="node.type === 'text'">
             <div *ngFor="let section of node.content" [innerHtml]="section.html"></div>
           </ng-container>
-          <ngd-live-example-block *ngIf="node.type === 'live-example'" [content]="node.content">
+          <ngd-live-example-block *ngIf="node.type === 'live-example'" [content]="node.content"
+                                  class="widget-block">
           </ngd-live-example-block>
-          <ngd-inline-example-block *ngIf="node.type === 'inline-example'" [content]="node.content">
+          <ngd-inline-example-block *ngIf="node.type === 'inline-example'" [content]="node.content"
+                                    class="widget-block">
           </ngd-inline-example-block>
-          <ngd-stacked-example-block *ngIf="node.type === 'stacked-example'" [content]="node.content">
+          <ngd-stacked-example-block *ngIf="node.type === 'stacked-example'" [content]="node.content"
+                                     class="widget-block">
           </ngd-stacked-example-block>
         </ng-container>
       </nb-card-body>

diff --git a/docs/app/documentation/page/page.component.scss b/docs/app/documentation/page/page.component.scss
@@ -30,6 +30,14 @@
 
       nb-card-body {
         padding: 2rem 1rem;
+
+        > *:last-child {
+          margin-bottom: 0!important;
+
+          *:last-child {
+            margin-bottom: 0 !important;
+          }
+        }
       }
 
       h1, h2, h3, h4, h5, h6 {
@@ -51,6 +59,10 @@
         max-width: 100%;
       }
 
+      pre {
+        margin-bottom: 2rem;
+      }
+
       code {
         background: $code-bg;
         color: $code-fg;
@@ -64,13 +76,16 @@
         border-radius: 8px;
         background: $code-block-bg;
         font-size: 0.875rem;
-        margin-bottom: 3rem;
       }
 
       /deep/ {
-        ngd-live-example-block, ngd-inline-example-block, ngd-stacked-example-block {
+        .widget-block {
           display: block;
-          margin-bottom: 3rem;
+          margin-bottom: 2rem;
+        }
+
+        ngd-styles-table-block table {
+          margin-bottom: 0;
         }
       }