feat: features responsive layout

tomastrajan · May 24, 2017 · fd427a3 · fd427a3
1 parent 63365b8
commit fd427a3
Showing 1 changed file with 16 additions and 5 deletions.
diff --git a/src/app/static/features/features.component.html b/src/app/static/features/features.component.html
@@ -5,7 +5,7 @@ <h1 class="main-heading">Features</h1>
     </div>
   </div>
   <div class="row align-items-end">
-    <div class="col-sm-6 col-md-4">
+    <div class="col-md-6 col-lg-4">
       <md-card>
         <md-card-title>Angular</md-card-title>
         <md-card-subtitle>Modern powerful framework</md-card-subtitle>
@@ -19,7 +19,7 @@ <h1 class="main-heading">Features</h1>
         </md-card-actions>
       </md-card>
     </div>
-    <div class="col-sm-6 col-md-4">
+    <div class="col-md-6 col-lg-4">
       <md-card>
         <md-card-title>ngRx</md-card-title>
         <md-card-subtitle>One way data flow powered by RxJS Observables</md-card-subtitle>
@@ -30,7 +30,7 @@ <h1 class="main-heading">Features</h1>
         </md-card-actions>
       </md-card>
     </div>
-    <div class="col-sm-6 col-md-4">
+    <div class="col-md-6 col-lg-4">
       <md-card>
         <md-card-title>Angular Material</md-card-title>
         <md-card-subtitle>Material design component library</md-card-subtitle>
@@ -44,7 +44,7 @@ <h1 class="main-heading">Features</h1>
         </md-card-actions>
       </md-card>
     </div>
-    <div class="col-sm-6 col-md-4">
+    <div class="col-md-6 col-lg-4">
       <md-card>
         <md-card-title>Themes</md-card-title>
         <md-card-subtitle>Flexible theming support for provided and custom components</md-card-subtitle>
@@ -55,7 +55,7 @@ <h1 class="main-heading">Features</h1>
         </md-card-actions>
       </md-card>
     </div>
-    <div class="col-sm-6 col-md-4">
+    <div class="col-md-6 col-lg-4">
       <md-card>
         <md-card-title>Bootstrap</md-card-title>
         <md-card-subtitle>Responsive layout from battle tested, world most famous UI library</md-card-subtitle>
@@ -69,5 +69,16 @@ <h1 class="main-heading">Features</h1>
         </md-card-actions>
       </md-card>
     </div>
+    <div class="col-md-6 col-lg-4">
+      <md-card>
+        <md-card-title>Lazy loading</md-card-title>
+        <md-card-subtitle>Faster startup time with lazy loaded feature modules</md-card-subtitle>
+        <md-card-actions>
+          <a md-button href="https://angular.io/docs/ts/latest/guide/router.html#!#lazy-loading-route-config" target="_blank">
+            <i class="fa fa-book fa-lg"></i> Docs
+          </a>
+        </md-card-actions>
+      </md-card>
+    </div>
   </div>
 </div>