ADD: more Cards examples

1 files changed, 53 insertions, 1 deletions

diff --git a/index.html b/index.html
index 4b2101d..3626bc0 100644
--- a/index.html
+++ b/index.html
@@ -852,7 +852,11 @@
                     </div>
                 </div>
                 <div class="column">
-
+                    <div class="input-group">
+                        <span class="input-group-addon addon-lg">slack.com/</span>
+                        <input type="text" class="form-input input-lg" placeholder="site name" />
+                        <button class="btn btn-primary input-group-btn btn-lg">Submit</button>
+                    </div>
                 </div>
             </div>
             <section class="notes">
@@ -2356,6 +2360,54 @@
                         <div class="card-image">
                             <img class="img-responsive" src="demo/img/osx-yosemite-2.jpg" />
                         </div>
+                        <div class="card-footer">
+                            <a href="#" class="btn btn-primary">Search</a>
+                            <a href="#" class="btn btn-link">Share</a>
+                        </div>
+                    </div>
+                </div>
+            </div>
+            <div class="columns">
+                <div class="column col-4 col-xs-12">
+                    <div class="card">
+                        <div class="card-image">
+                            <img class="img-responsive" src="demo/img/osx-el-capitan.jpg" />
+                        </div>
+                        <div class="card-footer">
+                            <a href="#" class="btn btn-primary">Buy</a>
+                            <a href="#" class="btn btn-link">Share</a>
+                        </div>
+                        <div class="card-body">
+                            <strong>Surface Studio</strong>. Turn your desk into a Studio. Surface Studio is designed for the creative process.
+                        </div>
+
+                    </div>
+                </div>
+                <div class="column col-4 col-xs-12">
+                    <div class="card">
+                        <div class="card-header">
+                            <h4 class="card-title">Apple</h4>
+                            <h6 class="card-meta">Hardware and software</h6>
+                        </div>
+                        <div class="card-body">
+                            To make a contribution to the world by making tools for the mind that advance humankind.
+                        </div>
+                        <div class="card-image">
+                            <img class="img-responsive" src="demo/img/osx-yosemite.jpg" />
+                        </div>
+                    </div>
+                </div>
+                <div class="column col-4 col-xs-12">
+                    <div class="card">
+                        <div class="card-header">
+                            <h4 class="card-title">Google I/O</h4>
+                        </div>
+                        <div class="card-body">
+                            An immersive, three-day experience focused on exploring the next generation of technology, mobile and beyond.
+                        </div>
+                        <div class="card-footer">
+                            <a href="#" class="btn btn-primary">Add to calendar</a>
+                        </div>
                     </div>
                 </div>
             </div>