Merge pull request #522 from picturepan2/0.5.5 v0.5.5

0.5.5

1 files changed, 56 insertions, 27 deletions

diff --git a/docs/src/getting-started.pug b/docs/src/getting-started.pug
index b766ba6..21d93c1 100644
--- a/docs/src/getting-started.pug
+++ b/docs/src/getting-started.pug
@@ -1,36 +1,65 @@
-extends _docs-layout.pug
+extends _layout/_docs-layout.pug
 
 block variables
+  - var slug = 'getting-started'
+  - var parent = 'getting-started'
   - var title = 'Getting started - Spectre.css CSS Framework'
-  - var description = ''
-  - var current = 'getting-started'
+  - var description = 'Spectre.css is a lightweight, responsive and modern CSS framework for faster and extensible development. Spectre provides basic styles for typography and elements, flexbox based responsive layout system, pure CSS components and utilities with best practice coding and consistent design language.'
 
 block docs-content
-  //- Introduction
-  +docs-heading('introduction', 'Introduction')
-    include contents/introduction.pug
-    
-  //- Installation
-  +docs-heading('installation', 'Installation')
-    include contents/_ad-g.pug
-    include contents/installation.pug
+  +docs-heading('getting-started', 'Getting started')
+    include _layout/_ad-g.pug
 
-  //- Custom
-  +docs-heading('custom', 'Custom version')
-    include contents/_ad-c.pug
-    include contents/custom.pug
+    p 
+      strong Spectre.css 
+      | is a lightweight, responsive and modern CSS framework for faster and extensible development.
+    p 
+      | Spectre provides basic styles for typography and elements, flexbox based responsive layout system, pure CSS components and utilities with best practice coding and consistent design language.
 
-  //- Accessibility
-  +docs-heading('accessibility', 'Accessibility')
-  
-  //- Browser support
-  +docs-heading('browsers', 'Browser support')
-    include contents/browsers.pug
+    .docs-demo.columns
+      .column.col-6.col-xs-12
+        .card
+          .card-header
+            .card-title.h5 Installation
+          .card-body
+            | How to install and use Spectre.css
+          .card-footer
+            a.btn.btn-primary(href="getting-started/installation.html") View
+              
+      .column.col-6.col-xs-12
+        .card
+          .card-header
+            .card-title.h5 Custom version
+          .card-body
+            | Customize your version of Spectre.css
+          .card-footer
+            a.btn.btn-primary(href="getting-started/custom.html") View
+        
+      .column.col-6.col-xs-12
+        .card
+          .card-header
+            .card-title.h5 Browser support
+          .card-body
+            | Browser compatibility and support
+          .card-footer
+            a.btn.btn-primary(href="getting-started/browsers.html") View
+              
+      .column.col-6.col-xs-12
+        .card
+          .card-header
+            .card-title.h5 What's new
+          .card-body
+            | Changelog and release notes
+          .card-footer
+            a.btn.btn-primary(href="getting-started/whatsnew.html") View
 
-  //- What's new
-  +docs-heading('whatsnew', 'What\'s new')
-    include contents/whatsnew.pug
-  
-  include _footer.pug
+      .column.col-6.col-xs-12
+        .card
+          .card-header
+            .card-title.h5 Accessibility
+          .card-body
+            | Coming soon
 
-    
\ No newline at end of file
+    include _layout/_ad-c.pug
+
+  include _layout/_footer.pug