AA: Grunt build the recently updated home/landing page

This commit is contained in:
Andrew Abogado 2015-02-11 23:39:29 +08:00
parent 24fdafe499
commit af3a77448d
25 changed files with 464 additions and 532 deletions

View file

@ -31,9 +31,10 @@
<!-- Collect the nav links, forms, and other content for toggling --> <!-- Collect the nav links, forms, and other content for toggling -->
<div id="nav-menu" class="navbar-collapse navbar-left collapse"> <div id="nav-menu" class="navbar-collapse navbar-left collapse">
<ul class="nav navbar-nav navbar-menu"> <ul class="nav navbar-nav navbar-menu">
<li class="active"><a href="dashboard.html">Dashboard</a></li>
<li><a href="owners.html">Owners</a></li> <li><a href="owners.html">Owners</a></li>
<li><a href="pets.html">Pets</a></li> <li><a href="pets.html">Pets</a></li>
<li><a href="vets.html">Vets</a></li> <li><a href="vets.html">Veterinarians</a></li>
</ul> </ul>
</div><!-- /.navbar-collapse --> </div><!-- /.navbar-collapse -->
<ul class="nav navbar-profile"> <ul class="nav navbar-profile">
@ -44,7 +45,7 @@
<li><a href="#"><span class="glyphicon glyphicon-plus" aria-hidden="true"></span></a></li> <li><a href="#"><span class="glyphicon glyphicon-plus" aria-hidden="true"></span></a></li>
<li class="dropdown"> <li class="dropdown">
<a href="#" class="dropdown-toggle img-profile" data-toggle="dropdown" role="button" aria-expanded="false"> <a href="#" class="dropdown-toggle img-profile" data-toggle="dropdown" role="button" aria-expanded="false">
<img class="img-circle" src="../images/avatar.jpg" width="30" height="30"> <img class="img-circle img-circle-small" src="../images/avatar.jpg" width="30" height="30">
</a> </a>
<ul class="dropdown-menu navbar-dropdown-menu"> <ul class="dropdown-menu navbar-dropdown-menu">
<li><a href="#">View Profile</a></li> <li><a href="#">View Profile</a></li>
@ -60,15 +61,27 @@
</nav> </nav>
<!-- Welcome --> <!-- Welcome -->
<header class="sections sections-narrow sections-light"> <header class="sections sections-tight sections-light">
<div class="container"> <div class="container">
<div class="media media-welcome">
<div class="media-left"> <div class="media">
<img src="../images/avatar.jpg" class="img-circle media-object" width="90" height="90"> <div class="pull-right stats stats-md">
<ul>
<li>12<span>Vets Around</span></li>
<li>5<span>Your Tasks</span></li>
<li>8<span>Appointments</span></li>
</ul>
</div> </div>
<div class="media-body"> <div class="media-body">
<h4 class="h3">Welcome, John Doe</h4> <div class="media">
<p>When youre ready, you may start adding a new <a href="#">pet owner</a> or <a href="#">continue browsing</a>.</p> <div class="media-left">
<img src="../images/avatar.jpg" class="img-circle img-circle-medium media-object" width="80" height="80">
</div>
<div class="media-body">
<h4 class="h3">Welcome back, John Doe</h4>
<p>Todays date is <strong>12th February 2014</strong></p>
</div>
</div>
</div> </div>
</div> </div>
</div> </div>
@ -77,13 +90,14 @@
<!-- Owners --> <!-- Owners -->
<section id="owners" class="sections sections-narrow"> <section id="owners" class="sections sections-narrow">
<div class="container"> <div class="container">
<h2 class="sub-header">Browse Owners</h2> <a class="btn btn-primary pull-right" href="owners.html">See All Owners <span class="glyphicon glyphicon-chevron-right" aria-hidden="true"></span></a>
<h2 class="sub-header">Latest Pet Owners</h2>
<div class="row thumbnail-wrapper"> <div class="row thumbnail-wrapper">
<div class="col-md-3"> <div class="col-md-3">
<div class="thumbnail"> <div class="thumbnail">
<img src="../images/owner-default.png" class="img-circle" alt="Generic placeholder image"> <a href="owner_details.html"><img src="../images/owner-default.png" class="img-circle" alt="Generic placeholder image"></a>
<div class="caption"> <div class="caption">
<h3 class="caption-heading">Eduardo Rodriguez</h3> <h3 class="caption-heading"><a href="owners.html">Eduardo Rodriguez</a></h3>
<p class="caption-meta">2693 Commerce St., McFarland</p> <p class="caption-meta">2693 Commerce St., McFarland</p>
<p class="caption-meta"><span class="glyphicon glyphicon-phone-alt"></span> +6085558763</p> <p class="caption-meta"><span class="glyphicon glyphicon-phone-alt"></span> +6085558763</p>
</div> </div>
@ -160,19 +174,14 @@
</div> </div>
</div> </div>
</div> </div>
<!-- /row -->
<div class="row">
<div class="col-md-4 col-md-offset-4">
<p><a class="btn btn-default btn-block" href="owners.html">See All Owners</a></p>
</div>
</div>
</div> </div>
</section> </section>
<!-- Pets --> <!-- Pets -->
<section id="pets" class="sections sections-narrow"> <section id="pets" class="sections sections-narrow">
<div class="container"> <div class="container">
<h2 class="sub-header">Pets</h2> <a class="btn btn-primary pull-right" href="pets.html">See All Pets <span class="glyphicon glyphicon-chevron-right" aria-hidden="true"></span></a>
<h2 class="sub-header">Latest Pets</h2>
<div class="row thumbnail-wrapper"> <div class="row thumbnail-wrapper">
<div class="col-md-3"> <div class="col-md-3">
<div class="thumbnail"> <div class="thumbnail">
@ -215,18 +224,13 @@
</div> </div>
</div> </div>
</div> </div>
<!-- /row -->
<div class="row">
<div class="col-md-4 col-md-offset-4">
<p><a class="btn btn-default btn-block" href="/pets">See All Pets</a></p>
</div>
</div>
</div> </div>
</section> </section>
<!-- Vets --> <!-- Vets -->
<section id="owners" class="sections"> <section id="owners" class="sections">
<div class="container"> <div class="container">
<a class="btn btn-primary pull-right" href="vets.html">See All Veterinarians <span class="glyphicon glyphicon-chevron-right" aria-hidden="true"></span></a>
<h2 class="sub-header">Veterinarians</h2> <h2 class="sub-header">Veterinarians</h2>
<div class="row thumbnail-wrapper"> <div class="row thumbnail-wrapper">
<div class="col-md-3"> <div class="col-md-3">
@ -270,12 +274,6 @@
</div> </div>
</div> </div>
</div> </div>
<!-- /row -->
<div class="row">
<div class="col-md-4 col-md-offset-4">
<p><a class="btn btn-default btn-block" href="/vets">See All Veterinarians</a></p>
</div>
</div>
</div> </div>
</section> </section>
@ -289,16 +287,6 @@
<script src="scripts/vendor.js"></script> <script src="scripts/vendor.js"></script>
<!-- Google Analytics: change UA-XXXXX-X to be your site's ID. -->
<script>
(function(b,o,i,l,e,r){b.GoogleAnalyticsObject=l;b[l]||(b[l]=
function(){(b[l].q=b[l].q||[]).push(arguments)});b[l].l=+new Date;
e=o.createElement(i);r=o.getElementsByTagName(i)[0];
e.src='//www.google-analytics.com/analytics.js';
r.parentNode.insertBefore(e,r)}(window,document,'script','ga'));
ga('create','UA-XXXXX-X');ga('send','pageview');
</script>
<script src="scripts/main.js"></script> <script src="scripts/main.js"></script>
</body> </body>
</html> </html>

View file

@ -1,237 +0,0 @@
<!doctype html>
<html class="no-js">
<head>
<meta charset="utf-8">
<title>Pet Clinic - Discover Pet Owners on your Neigborhood</title>
<meta name="description" content="">
<meta name="viewport" content="width=device-width">
<link rel="shortcut icon" href="/favicon.ico">
<!-- Place favicon.ico and apple-touch-icon.png in the root directory -->
<link rel="stylesheet" href="styles/main.css">
</head>
<body>
<!--[if lt IE 10]>
<p class="browsehappy">You are using an <strong>outdated</strong> browser. Please <a href="http://browsehappy.com/">upgrade your browser</a> to improve your experience.</p>
<![endif]-->
<nav class="navbar navbar-inverse navbar-fixed-top">
<div class="container">
<div class="navbar-header">
<button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#navbar" aria-expanded="false" aria-controls="navbar">
<span class="sr-only">Toggle navigation</span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
<a class="navbar-brand" href="/">Pet Clinic</a>
</div>
<div id="navbar" class="navbar-collapse collapse pull-right">
<ul class="nav navbar-nav">
<li><a href="discover.html" class="active">Discover</a></li>
<li><a href="#vet">Veterinarians</a></li>
<li><a href="#about">About</a></li>
</ul>
</div><!--/.navbar-collapse -->
</div>
</nav>
<!-- Main jumbotron for a primary marketing message or call to action -->
<div class="jumbotron jumbotron-tertiary">
<div class="container">
<div class="jumbotron-headline">
<div class="jumbotron-headline-cell">
<h1>Discover Pet Owners</h1>
<p>Helping you discover pet owners near you and connect.</p>
<div class="row">
<div class="col-md-6 col-md-offset-2">
<input type="text" class="form-control input-lg" placeholder=".col-md-8">
</div>
<div class="col-md-2">
<button type="submit" class="btn btn-primary btn-lg btn-block">Discover</button>
</div>
</div>
</div>
</div>
</div>
</div>
<!-- Featured veterinarians -->
<section id="veterianarians" class="sections">
<div class="container">
<div class="nav-tabs-filter">
<a href="#add_owner" role="button" class="btn btn-primary pull-right">Register Now - It's Free!</a>
<ul class="nav nav-tabs">
<li role="presentation" class="active"><a href="#">Newest</a></li>
<li role="presentation"><a href="#">Popular</a></li>
<li role="presentation" class="dropdown open">
<a class="dropdown-toggle" data-toggle="dropdown" href="#" role="button" aria-expanded="false">
Dropdown <span class="caret"></span>
</a>
<ul class="dropdown-menu" role="menu">
<li><a href="#">McFarland</a></li>
<li><a href="#">Sun Prairie</a></li>
<li><a href="#">Madison</a></li>
<li><a href="#">New York</a></li>
<li><a href="#">Madison</a></li>
</ul>
</li>
</ul>
</div>
<div class="row">
<div class="col-md-3">
<div class="thumbnail">
<a href="show.html"><a href="show.html"><img src="http://placehold.it/600x600" alt="Generic placeholder image"></a></a>
<div class="caption">
<a href="show.html"><a href="show.html"><h3>Thumbnail label</h3></a></a>
<p>Even the all-powerful Pointing has no control about the blind texts it is an almost unorthographic life One day however a small line of blind text by the name of Lorem Ipsum.</p>
</div>
</div>
</div>
<div class="col-md-3">
<div class="thumbnail">
<a href="show.html"><a href="show.html"><img src="http://placehold.it/600x600" alt="Generic placeholder image"></a></a>
<div class="caption">
<a href="show.html"><a href="show.html"><h3>Thumbnail label</h3></a></a>
<p>Mountains, she had a last view back on the skyline of her hometown Bookmarksgrove, the headline of Alphabet Village and the subline of her own road, the Line Lane.</p>
</div>
</div>
</div>
<div class="col-md-3">
<div class="thumbnail">
<a href="show.html"><img src="http://placehold.it/600x600" alt="Generic placeholder image"></a>
<div class="caption">
<a href="show.html"><h3>Thumbnail label</h3></a>
<p>Even the all-powerful Pointing has no control about the blind texts it is an almost unorthographic life One day however a small line of blind text by the name of Lorem Ipsum.</p>
</div>
</div>
</div>
<div class="col-md-3">
<div class="thumbnail">
<a href="show.html"><img src="http://placehold.it/600x600" alt="Generic placeholder image"></a>
<div class="caption">
<a href="show.html"><h3>Thumbnail label</h3></a>
<p>Mountains, she had a last view back on the skyline of her hometown Bookmarksgrove, the headline of Alphabet Village and the subline of her own road, the Line Lane.</p>
</div>
</div>
</div>
<div class="col-md-3">
<div class="thumbnail">
<a href="show.html"><img src="http://placehold.it/600x600" alt="Generic placeholder image"></a>
<div class="caption">
<a href="show.html"><h3>Thumbnail label</h3></a>
<p>Even the all-powerful Pointing has no control about the blind texts it is an almost unorthographic life One day however a small line of blind text by the name of Lorem Ipsum.</p>
</div>
</div>
</div>
<div class="col-md-3">
<div class="thumbnail">
<a href="show.html"><img src="http://placehold.it/600x600" alt="Generic placeholder image"></a>
<div class="caption">
<a href="show.html"><h3>Thumbnail label</h3></a>
<p>Mountains, she had a last view back on the skyline of her hometown Bookmarksgrove, the headline of Alphabet Village and the subline of her own road, the Line Lane.</p>
</div>
</div>
</div>
<div class="col-md-3">
<div class="thumbnail">
<a href="show.html"><img src="http://placehold.it/600x600" alt="Generic placeholder image"></a>
<div class="caption">
<a href="show.html"><h3>Thumbnail label</h3></a>
<p>Even the all-powerful Pointing has no control about the blind texts it is an almost unorthographic life One day however a small line of blind text by the name of Lorem Ipsum.</p>
</div>
</div>
</div>
<div class="col-md-3">
<div class="thumbnail">
<a href="show.html"><img src="http://placehold.it/600x600" alt="Generic placeholder image"></a>
<div class="caption">
<a href="show.html"><h3>Thumbnail label</h3></a>
<p>Mountains, she had a last view back on the skyline of her hometown Bookmarksgrove, the headline of Alphabet Village and the subline of her own road, the Line Lane.</p>
</div>
</div>
</div>
</div>
<div class="row">
<div class="col-md-4 col-md-offset-4">
<p><a class="btn btn-primary btn-lg btn-block" href="#">Show More »</a></p>
</div>
</div>
</div>
</section>
<!-- Make an appointment call to action -->
<section id="appointment" class="jumbotron jumbotron-secondary">
<div class="container">
<div class="jumbotron-headline">
<div class="jumbotron-headline-cell">
<h2>Over 40,000 pet owners trust us. Register now. It's <strong>Free</strong> forever!</h2>
<p>Use it as a starting point to create something more unique.</p>
<form class="form-inline">
<div class="form-group">
<label class="sr-only" for="clientName">Your Name</label>
<input type="text" class="form-control input-lg" id="clientName" placeholder="Your name">
</div><div class="form-group">
<label class="sr-only" for="emailAddress">Email Address</label>
<input type="email" class="form-control input-lg" id="emailAddress" placeholder="Your email">
</div>
<div class="form-group">
<label class="sr-only" for="clientNumber">Contact Number</label>
<input type="text" class="form-control input-lg" id="clientNumber" placeholder="Your contact number">
</div>
<button type="submit" class="btn btn-primary btn-lg">Get Started - It's Free!</button>
</form>
</div>
</div>
</div>
</section>
<!-- Contact details -->
<section id="add_owner" class="sections sections-narrow">
<div class="container">
<!-- Three columns of text below the carousel -->
<div class="row">
<div class="col-lg-4">
<h3>Business Hours</h3>
<p>Donec sed odio dui. Etiam porta sem malesuada magna mollis euismod. Nullam id dolor id nibh ultricies vehicula ut id elit. Morbi leo risus, porta ac consectetur ac, vestibulum at eros. Praesent commodo cursus magna.</p>
</div><!-- /.col-lg-4 -->
<div class="col-lg-4">
<h3>Our Location</h3>
<p>Duis mollis, est non commodo luctus, nisi erat porttitor ligula, eget lacinia odio sem nec elit. Cras mattis consectetur purus sit amet fermentum. Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh.</p>
</div><!-- /.col-lg-4 -->
<div class="col-lg-4">
<h3>Questions or comments</h3>
<p>Cras mattis consectetur purus sit amet fermentum. </p>
<p>
<a href="mailto:youremail@yourdomain.com" type="submit" class="btn btn-default">Drop us a line</a>
</p>
</div><!-- /.col-lg-4 -->
</div><!-- /.row -->
</div>
</section>
<!-- Footer -->
<footer class="footer">
<div class="container">
<p class="pull-right">Tell your friends: <a href="#">Facebook</a>, <a href="#">Twitter</a>, <a href="#">Google+</a></p>
<p>© 2015 Pet Clinic, A Spring Framework Demonstration</p>
</div>
</footer>
<script src="scripts/vendor.js"></script>
<!-- Google Analytics: change UA-XXXXX-X to be your site's ID. -->
<script>
(function(b,o,i,l,e,r){b.GoogleAnalyticsObject=l;b[l]||(b[l]=
function(){(b[l].q=b[l].q||[]).push(arguments)});b[l].l=+new Date;
e=o.createElement(i);r=o.getElementsByTagName(i)[0];
e.src='//www.google-analytics.com/analytics.js';
r.parentNode.insertBefore(e,r)}(window,document,'script','ga'));
ga('create','UA-XXXXX-X');ga('send','pageview');
</script>
<script src="scripts/main.js"></script>
</body>
</html>

Binary file not shown.

Before

Width:  |  Height:  |  Size: 15 KiB

After

Width:  |  Height:  |  Size: 15 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 354 B

Binary file not shown.

After

Width:  |  Height:  |  Size: 790 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 4.1 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 128 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 197 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 130 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 4.2 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 905 B

Binary file not shown.

Before

Width:  |  Height:  |  Size: 1.3 KiB

After

Width:  |  Height:  |  Size: 1.7 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 330 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 12 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 14 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 12 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 12 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 13 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 11 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 14 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 11 KiB

View file

@ -15,243 +15,228 @@
<p class="browsehappy">You are using an <strong>outdated</strong> browser. Please <a href="http://browsehappy.com/">upgrade your browser</a> to improve your experience.</p> <p class="browsehappy">You are using an <strong>outdated</strong> browser. Please <a href="http://browsehappy.com/">upgrade your browser</a> to improve your experience.</p>
<![endif]--> <![endif]-->
<nav class="navbar navbar-default navbar-static-top">
<div class="container-fluid">
<!-- Brand and toggle get grouped for better mobile display -->
<div class="navbar-header pull-left">
<a class="navbar-brand" href="/dashboard.html">
<img alt="Pet Clinic Brand" height="27" width="auto" src="images/logo.png">
</a>
</div>
<ul class="nav navbar-links pull-right">
<li>
<a href="#appointment" class="js-scroll-nav">Get started</a>
</li>
<li>
<a href="#">Login</a>
</li>
</ul>
</div>
</div><!-- /.container-fluid -->
</nav>
<!-- Main jumbotron for a primary marketing message or call to action --> <!-- Main jumbotron for a primary marketing message or call to action -->
<div class="jumbotron"> <div class="jumbotron jumbotron-welcome">
<div class="container"> <div class="container">
<header>
<a class="navbar-brand navbar-brand-nopadding pull-left" href="/">
<img alt="Pet Clinic Brand" height="27" width="auto" src="images/logo-brand.png">
</a>
<a class="btn btn-default btn-inverse pull-right" href="#">Sign In</a>
</header>
<div class="jumbotron-headline"> <div class="jumbotron-headline">
<div class="jumbotron-headline-cell"> <div class="jumbotron-headline-cell">
<h1>Pet care for the People who love them</h1> <h1>Pet care for the People who love them</h1>
<p>PetClinic is here to enhance people's relationships with their pets</p> <p>PetClinic is here to enhance people's relationships with their pets</p>
<p><a class="btn btn-primary btn-lg js-scroll-nav" href="#veterianarians" role="button">Learn more</a></p> <p>
<a class="btn btn-cta js-scroll-nav" href="#appointment" role="button">Make an Appointment</a>
<a class="btn btn-cta btn-inverse js-scroll-nav" href="#services" role="button">Learn More</a>
</p>
<a href="#services" class="scroll-down js-scroll-nav">Scroll Down</a>
</div> </div>
</div> </div>
</div> </div>
<video loop="loop" preload="auto" class="jumbotron-video" autoplay muted> <video loop="loop" preload="auto" class="jumbotron-video" autoplay muted>
<source src="videos/hero-bird.mp4" type="video/mp4"> <source src="videos/hero.mp4" type="video/mp4">
</video> </video>
</div> </div>
<!-- Companies -->
<section class="sections sections-narrow sections-companies">
<img src="images/client-logos.png" alt="Client logos">
</section>
<!-- Services 1 section -->
<section id="services" class="sections sections-services">
<div class="container">
<div class="row">
<div class="col-md-6 col-md-push-6">
<img class="img-circle img-circle-auto pull-right" src="images/image-service-1.png" alt="Service 1">
</div>
<div class="col-md-6 col-md-pull-6">
<h3 class="section-heading">Everything you need to manage you clients and their pets</h3>
<p class="section-desc">PetClinic is everything you need for an effective management. A small river named Duden flows by their place and supplies it with the necessary regelialia. It is a paradisematic country, in which roasted parts of sentences fly into your mouth.</p>
</div>
</div>
</div>
</section>
<!-- Services 2 section -->
<section id="services2" class="sections sections-services">
<div class="container">
<div class="row">
<div class="col-md-6">
<img class="img-circle img-circle-auto" src="images/image-service-2.png" alt="Service 2">
</div>
<div class="col-md-6">
<h3 class="section-heading">Customized thats just right for you </h3>
<p class="section-desc">Our scalable system is configured to suit your need. The Big Oxmox advised her not to do so, because there were thousands of bad Commas, wild Question Marks and devious Semikoli, but the Little Blind Text didnt listen.</p>
</div>
</div>
</div>
</section>
<!-- Services 3 section -->
<section id="services3" class="sections sections-services">
<div class="container">
<div class="row">
<div class="col-md-6 col-md-push-6">
<img class="img-circle img-circle-auto pull-right" src="images/image-service-3.png" alt="Service 3">
</div>
<div class="col-md-6 col-md-pull-6">
<h3 class="section-heading">Access anywhere even on-the-go</h3>
<p class="section-desc">Whether youre on your desk or on mobile, PetClinic is available wherever you may be. She packed her seven versalia, put her initial into the belt and made herself on the way. When she reached the first hills of the Italic Mountains.</p>
</div>
</div>
</div>
</section>
<!-- Featured veterinarians --> <!-- Featured veterinarians -->
<section class="sections"> <section class="sections">
<div class="container"> <div class="container">
<div class="row"> <div class="row">
<div class="col-md-8 col-md-offset-2"> <div class="col-md-8 col-md-offset-2">
<div class="text-center"> <div class="text-center">
<h3 id="veterianarians" class="section-heading">Our Veterinarians</h3> <h3 id="veterianarians" class="section-heading">Our awesome veterinarians</h3>
<p class="section-desc">A small river named Duden flows by their place and supplies it with the necessary regelialia. It is a paradisematic country, in which roasted parts of sentences fly into your mouth.</p> <p class="section-desc">We believe in a diverse range of personel to bring creative skills, thoughts, and ideas to the table. Be cool, we awesome, be with us today, really ok?</p>
</div> </div>
</div> </div>
</div> </div>
<div class="row"> <div class="row">
<div class="col-md-6"> <div class="col-md-3">
<div class="thumbnail"> <div class="thumbnail thumbnail-noborder">
<img src="images/600x345.gif" alt="Generic placeholder image"> <img src="images/vet1.jpg" alt="Vet 1" class="img-circle">
<div class="caption"> <div class="caption">
<h3>Thumbnail label</h3> <h3 class="caption-heading">James Carter</h3>
<p>Far far away, behind the word mountains, far from the countries Vokalia and Consonantia, there live the blind texts. </p> <p class="caption-meta caption-meta-uppercase">Radiology</p>
</div> </div>
</div> </div>
</div> </div>
<div class="col-md-3"> <div class="col-md-3">
<div class="thumbnail"> <div class="thumbnail thumbnail-noborder">
<img src="images/600x600.gif" alt="Generic placeholder image"> <img src="images/vet2.jpg" alt="Vet 2" class="img-circle">
<div class="caption"> <div class="caption">
<h3>Thumbnail label</h3> <h3 class="caption-heading">Carlos Estaban</h3>
<p>Even the all-powerful Pointing has no control about the blind texts it is an almost unorthographic life One day however a small line of blind text by the name of Lorem Ipsum.</p> <p class="caption-meta caption-meta-uppercase">Radiology</p>
</div> </div>
</div> </div>
</div> </div>
<div class="col-md-3"> <div class="col-md-3">
<div class="thumbnail"> <div class="thumbnail thumbnail-noborder">
<img src="images/600x600.gif" alt="Generic placeholder image"> <img src="images/vet3.jpg" alt="Vet 3" class="img-circle">
<div class="caption"> <div class="caption">
<h3>Thumbnail label</h3> <h3 class="caption-heading">Helen Leary</h3>
<p>Mountains, she had a last view back on the skyline of her hometown Bookmarksgrove, the headline of Alphabet Village and the subline of her own road, the Line Lane.</p> <p class="caption-meta caption-meta-uppercase">Surgery</p>
</div>
</div>
</div>
</div>
<!-- /row -->
<div class="row">
<div class="col-md-3">
<div class="thumbnail">
<img src="images/600x600.gif" alt="Generic placeholder image">
<div class="caption">
<h3>Thumbnail label</h3>
<p>Even the all-powerful Pointing has no control about the blind texts it is an almost unorthographic life One day however a small line of blind text by the name of Lorem Ipsum.</p>
</div> </div>
</div> </div>
</div> </div>
<div class="col-md-3"> <div class="col-md-3">
<div class="thumbnail"> <div class="thumbnail thumbnail-noborder">
<img src="images/600x600.gif" alt="Generic placeholder image"> <img src="images/vet4.jpg" alt="Vet 4" class="img-circle">
<div class="caption"> <div class="caption">
<h3>Thumbnail label</h3> <h3 class="caption-heading">Linda Douglas</h3>
<p>Mountains, she had a last view back on the skyline of her hometown Bookmarksgrove, the headline of Alphabet Village and the subline of her own road, the Line Lane.</p> <p class="caption-meta caption-meta-uppercase">Dentistry surgery</p>
</div> </div>
</div> </div>
</div> </div>
<div class="col-md-6"> <div class="col-md-3">
<div class="thumbnail"> <div class="thumbnail thumbnail-noborder">
<img src="images/600x345.gif" alt="Generic placeholder image"> <img src="images/vet5.jpg" alt="Vet 5" class="img-circle">
<div class="caption"> <div class="caption">
<h3>Thumbnail label</h3> <h3 class="caption-heading">Sharon Jenkins</h3>
<p>The Big Oxmox advised her not to do so, because there were thousands of bad Commas, wild Question Marks and devious Semikoli.</p> <p class="caption-meta caption-meta-uppercase">Surgery</p>
</div> </div>
</div> </div>
</div> </div>
</div> <div class="col-md-3">
<!-- /row --> <div class="thumbnail thumbnail-noborder">
<div class="row"> <img src="images/vet6.jpg" alt="Vet 6" class="img-circle">
<div class="col-md-4 col-md-offset-4"> <div class="caption">
<p><a class="btn btn-primary btn-lg btn-block" href="/veterinarians">View More »</a></p> <h3 class="caption-heading">Rafael Ortega</h3>
<p class="caption-meta caption-meta-uppercase">Radiology</p>
</div> </div>
</div> </div>
</div> </div>
</section> <div class="col-md-3">
<div class="thumbnail thumbnail-noborder">
<!-- Services 1 section --> <img src="images/vet7.jpg" alt="Vet 7" class="img-circle">
<section id="services" class="sections"> <div class="caption">
<div class="container"> <h3 class="caption-heading">Henry Stevens</h3>
<div class="row"> <p class="caption-meta caption-meta-uppercase">Surgery</p>
<div class="col-md-6">
<img class="img-thumbnail" src="images/560x250.gif" alt="Generic placeholder image">
</div>
<div class="col-md-6">
<h3 class="section-heading">Services One</h3>
<p class="section-desc">A small river named Duden flows by their place and supplies it with the necessary regelialia. It is a paradisematic country, in which roasted parts of sentences fly into your mouth.</p>
<p>
<a class="btn btn-primary" href="/business">Learn more »</a>
</p>
</div> </div>
</div> </div>
</div> </div>
</section> <div class="col-md-3">
<div class="thumbnail thumbnail-noborder">
<!-- Services 2 section --> <img src="images/vet8.jpg" alt="Vet 8" class="img-circle">
<section id="services2" class="sections"> <div class="caption">
<div class="container"> <h3 class="caption-heading">Jenkins Helen</h3>
<div class="row"> <p class="caption-meta caption-meta-uppercase">Radiology</p>
<div class="col-md-6">
<h3 class="section-heading">Services Two</h3>
<p class="section-desc">A small river named Duden flows by their place and supplies it with the necessary regelialia. It is a paradisematic country, in which roasted parts of sentences fly into your mouth.</p>
<p>
<a class="btn btn-primary" href="/business">Learn more »</a>
</p>
</div>
<div class="col-md-6">
<img class="img-thumbnail" src="images/560x250.gif" alt="Generic placeholder image">
</div> </div>
</div> </div>
</div> </div>
</section>
<!-- Services 3 section -->
<section id="services3" class="sections">
<div class="container">
<div class="row">
<div class="col-md-6">
<img class="img-thumbnail" src="images/560x250.gif" alt="Generic placeholder image">
</div>
<div class="col-md-6">
<h3 class="section-heading">Services Three</h3>
<p class="section-desc">A small river named Duden flows by their place and supplies it with the necessary regelialia. It is a paradisematic country, in which roasted parts of sentences fly into your mouth.</p>
<p>
<a class="btn btn-primary" href="/business">Learn more »</a>
</p>
</div>
</div> </div>
</div> </div>
</section> </section>
<!-- Testimonials --> <!-- Testimonials -->
<section id="testimonials" class="sections"> <section id="testimonials" class="sections sections-testimonials">
<div class="container"> <div class="container">
<div class="row"> <div class="row">
<div class="col-md-8 col-md-offset-2"> <div class="col-md-8 col-md-offset-2 text-center">
<div class="text-center"> <h3 class="section-heading">Our happy customers say</h3>
<h3 class="section-heading">What our customers are saying.</h3> <img class="img-circle img-circle-medium" src="images/veterinarian-default.jpg" alt="Generic placeholder image">
<p class="section-desc">Even the all-powerful Pointing has no control about the blind texts it is an almost unorthographic life One day however a small line of blind text by the name of Lorem Ipsum decided to leave for the far World of Grammar.</p> <h4 class="section-title">Betty Davis, Dogs Associations Inc.</h4>
<p>It is a paradisematic country, in which roasted parts of sentences fly into your mouth. Even the all-powerful Pointing has no control about the blind texts it is an almost unorthographic life.</p>
<ol class="carousel-indicators carousel-indicators-static">
<li data-target="#myCarousel" data-slide-to="0" class="active"></li>
<li data-target="#myCarousel" data-slide-to="1" class=""></li>
<li data-target="#myCarousel" data-slide-to="2" class=""></li>
</ol>
</div> </div>
</div> </div>
</div>
<div class="row">
<div class="col-lg-4 text-center">
<img class="img-circle" src="images/140x140.gif" alt="Generic placeholder image">
<h4>Client One</h4>
<p>Donec sed odio dui. Etiam porta sem malesuada magna mollis euismod. Nullam id dolor id nibh ultricies vehicula ut id elit. Morbi leo risus, porta ac consectetur ac, vestibulum at eros. Praesent commodo cursus magna.</p>
</div><!-- /.col-lg-4 -->
<div class="col-lg-4 text-center">
<img class="img-circle" src="images/140x140.gif" alt="Generic placeholder image">
<h4>Client Two</h4>
<p>Duis mollis, est non commodo luctus, nisi erat porttitor ligula, eget lacinia odio sem nec elit. Cras mattis consectetur purus sit amet fermentum. Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh.</p>
</div><!-- /.col-lg-4 -->
<div class="col-lg-4 text-center">
<img class="img-circle" src="images/140x140.gif" alt="Generic placeholder image">
<h4>Client Three</h4>
<p>Donec sed odio dui. Cras justo odio, dapibus ac facilisis in, egestas eget quam. Vestibulum id ligula porta felis euismod semper. Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus.</p>
</div><!-- /.col-lg-4 -->
</div>
</div> </div>
</section> </section>
<!-- Client logos --> <!-- Numbers -->
<section id="companies" class="sections sections-narrow"> <section id="companies" class="sections sections-numbers">
<div class="container text-center"> <div class="container text-center">
<div class="row"> <div class="row">
<div class="col-md-8 col-md-offset-2"> <div class="col-md-3">
<div class="text-center"> <div class="stats-numbers">
<h3 class="h4">Trusted by some of the world's smartest companies</h3> <span class="glyphicon glyphicon-user" aria-hidden="true"></span>
<p class="stats-number">1325</p>
<span class="stats-label">Pet Owners</span>
</div> </div>
</div> </div>
<div class="col-md-3">
<div class="stats-numbers">
<span class="glyphicon glyphicon-leaf" aria-hidden="true"></span>
<p class="stats-number">2325</p>
<span class="stats-label">Pets</span>
</div> </div>
<div class="row">
<div class="col-lg-2">
<img src="images/100x40.gif" alt="Companies placeholder image">
</div> </div>
<div class="col-lg-2"> <div class="col-md-3">
<img src="images/100x40.gif" alt="Companies placeholder image"> <div class="stats-numbers">
<span class="glyphicon glyphicon-calendar" aria-hidden="true"></span>
<p class="stats-number">903</p>
<span class="stats-label">Pet Visits</span>
</div> </div>
<div class="col-lg-2">
<img src="images/100x40.gif" alt="Companies placeholder image">
</div> </div>
<div class="col-lg-2"> <div class="col-md-3">
<img src="images/100x40.gif" alt="Companies placeholder image"> <div class="stats-numbers">
<span class="glyphicon glyphicon-plus" aria-hidden="true"></span>
<p class="stats-number">24</p>
<span class="stats-label">Veterinarians</span>
</div> </div>
<div class="col-lg-2">
<img src="images/100x40.gif" alt="Companies placeholder image">
</div>
<div class="col-lg-2">
<img src="images/100x40.gif" alt="Companies placeholder image">
</div> </div>
</div> </div>
</div> </div>
</section> </section>
<!-- Make an appointment call to action --> <!-- Make an appointment call to action -->
<section id="appointment" class="jumbotron jumbotron-secondary jumbotron-pattern jumbotron-appointment"> <section id="appointment" class="jumbotron jumbotron-secondary jumbotron-appointment">
<div class="container"> <div class="container">
<div class="jumbotron-headline"> <div class="jumbotron-headline">
<div class="jumbotron-headline-cell"> <div class="jumbotron-headline-cell">
@ -270,7 +255,7 @@
<label class="sr-only" for="clientNumber">Contact Number</label> <label class="sr-only" for="clientNumber">Contact Number</label>
<input type="text" class="form-control input-lg" id="clientNumber" placeholder="Your contact number"> <input type="text" class="form-control input-lg" id="clientNumber" placeholder="Your contact number">
</div> </div>
<button type="submit" class="btn btn-primary btn-lg">Get an Appointment</button> <button type="submit" class="btn btn-cta">Get an Appointment</button>
</form> </form>
</div> </div>
</div> </div>
@ -284,41 +269,52 @@
<div class="container"> <div class="container">
<!-- Three columns of text below the carousel --> <!-- Three columns of text below the carousel -->
<div class="row"> <div class="row">
<div class="col-lg-4"> <div class="col-md-3">
<h3 class="h4">Business Hours</h3> <h3 class="h5">Company Information</h3>
<p>Donec sed odio dui. Etiam porta sem malesuada magna mollis euismod. Nullam id dolor id nibh ultricies vehicula ut id elit. Morbi leo risus, porta ac consectetur ac, vestibulum at eros. Praesent commodo cursus magna.</p> <ul class="list-unstyled">
</div><!-- /.col-lg-4 --> <li><a href="#">About Us</a></li>
<div class="col-lg-4"> <li><a href="#">Updtes</a></li>
<h3 class="h4">Our Location</h3> <li><a href="#">Privacy Policy</a></li>
<p>Duis mollis, est non commodo luctus, nisi erat porttitor ligula, eget lacinia odio sem nec elit. Cras mattis consectetur purus sit amet fermentum. Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh.</p> <li><a href="#">Terms of Services</a></li>
</div><!-- /.col-lg-4 --> <ul>
<div class="col-lg-4"> </div>
<h3 class="h4">Questions or comments</h3> <div class="col-md-3">
<h3 class="h5">Wanna talk?</h3>
<ul class="list-unstyled">
<li>Call us at (203) 420-0234</li>
<li>Email us to info@petclinic.com</li>
<li>We respond to emails within one business day. Hours: Mon - Fri from 9am - 7pm ET</li>
<ul>
</div>
<div class="col-md-3">
<h3 class="h5">Follow Us</h3>
<ul class="list-unstyled">
<li><a href="#">Facebook</a></li>
<li><a href="#">Twitter</a></li>
<li><a href="#">Google Plus</a></li>
<ul>
</div>
<div class="col-md-3">
<h3 class="h5">Questions or comments</h3>
<p>Cras mattis consectetur purus sit amet fermentum. </p> <p>Cras mattis consectetur purus sit amet fermentum. </p>
<p> <p>
<a href="mailto:youremail@yourdomain.com" type="submit" class="btn btn-primary">Drop us a line</a> <a href="mailto:youremail@yourdomain.com" type="submit" class="btn btn-primary">Drop us a line</a>
</p> </p>
</div><!-- /.col-lg-4 -->
</div><!-- /.row -->
</div> </div>
</div>
<div class="colophon container">
<p class="pull-right">Tell your friends: <a href="#">Facebook</a>, <a href="#">Twitter</a>, <a href="#">Google+</a></p>
<p>© 2015 Pet Clinic, A Spring Framework Demonstration</p>
</div> </div>
</footer> </footer>
<script src="scripts/vendor.js"></script> <div class="colophon">
<div class="container">
<p class="pull-left">
<img src="images/logo-footer.png" class="logo-footer"> © 2015 Pet Clinic, A Spring Framework Demonstration.
</p>
<p class="pull-right">Design by Andrew Abogado. See the Colophon for details on the design and code.</p>
</div>
</div>
<!-- Google Analytics: change UA-XXXXX-X to be your site's ID. --> <script src="scripts/vendor.js"></script>
<script>
(function(b,o,i,l,e,r){b.GoogleAnalyticsObject=l;b[l]||(b[l]=
function(){(b[l].q=b[l].q||[]).push(arguments)});b[l].l=+new Date;
e=o.createElement(i);r=o.getElementsByTagName(i)[0];
e.src='//www.google-analytics.com/analytics.js';
r.parentNode.insertBefore(e,r)}(window,document,'script','ga'));
ga('create','UA-XXXXX-X');ga('send','pageview');
</script>
<script src="scripts/main.js"></script> <script src="scripts/main.js"></script>
</body> </body>

View file

@ -2,7 +2,7 @@
<html class="no-js"> <html class="no-js">
<head> <head>
<meta charset="utf-8"> <meta charset="utf-8">
<title>Pet Clinic - Dashboard</title> <title>Pet Clinic - Owner Details</title>
<meta name="description" content=""> <meta name="description" content="">
<meta name="viewport" content="width=device-width"> <meta name="viewport" content="width=device-width">
<link rel="shortcut icon" href="/favicon.ico"> <link rel="shortcut icon" href="/favicon.ico">
@ -31,7 +31,8 @@
<!-- Collect the nav links, forms, and other content for toggling --> <!-- Collect the nav links, forms, and other content for toggling -->
<div id="nav-menu" class="navbar-collapse navbar-left collapse"> <div id="nav-menu" class="navbar-collapse navbar-left collapse">
<ul class="nav navbar-nav navbar-menu"> <ul class="nav navbar-nav navbar-menu">
<li><a href="owners.html">Owners</a></li> <li><a href="dashboard.html">Dashboard</a></li>
<li class="active"><a href="owners.html">Owners</a></li>
<li><a href="pets.html">Pets</a></li> <li><a href="pets.html">Pets</a></li>
<li><a href="vets.html">Vets</a></li> <li><a href="vets.html">Vets</a></li>
</ul> </ul>
@ -86,10 +87,11 @@
</header> </header>
<!-- Owners --> <!-- Owners -->
<section id="ownersInfo" class="sections sections-narrow"> <section id="ownersInfo" class="sections sections-no-padding sections-darker">
<div class="container"> <div class="container">
<div class="row"> <div class="row">
<div class="col-md-9"> <div class="col-md-9 col-border-right">
<div class="section-inner-padding">
<a href="#" class="btn btn-primary pull-right" data-toggle="modal" data-target="#editOwnerModal"><span class="glyphicon glyphicon-edit" aria-hidden="true"></span> Edit Owner</a> <a href="#" class="btn btn-primary pull-right" data-toggle="modal" data-target="#editOwnerModal"><span class="glyphicon glyphicon-edit" aria-hidden="true"></span> Edit Owner</a>
<h2 class="h3 sub-header">Owner Information</h2> <h2 class="h3 sub-header">Owner Information</h2>
<form class="form-inline form-inline-display"> <form class="form-inline form-inline-display">
@ -131,7 +133,9 @@
</div> </div>
</form> </form>
</div> </div>
</div>
<div class="col-md-3"> <div class="col-md-3">
<div class="section-inner-padding">
<h2 class="h3 sub-header">Owner Activities</h2> <h2 class="h3 sub-header">Owner Activities</h2>
<!-- List group --> <!-- List group -->
<ul class="list-group"> <ul class="list-group">
@ -148,6 +152,7 @@
</div> </div>
</div> </div>
</div> </div>
</div>
</section> </section>
<!-- Pets --> <!-- Pets -->
@ -194,14 +199,14 @@
</section> </section>
<!-- Pets --> <!-- Pets -->
<section id="pets" class="sections sections-bottom-nav sections-light"> <section id="pets" class="sections sections-bottom-nav sections-darker">
<div class="container"> <div class="container">
<ul class="pager pull-left"> <ul class="pager pager-link pull-left">
<li><a href="#"><span class="glyphicon glyphicon-arrow-left" aria-hidden="true"></span> Back to Owners List</a></li> <li><a href="owners.html"><span class="glyphicon glyphicon-arrow-left" aria-hidden="true"></span> Back to Owners List</a></li>
</ul> </ul>
<ul class="pager pull-right"> <ul class="pager pager-link pull-right">
<li><a href="#"><span class="glyphicon glyphicon-chevron-left" aria-hidden="true"></span> Carlos Estaban</a></li> <li><a href="owner_details.html"><span class="glyphicon glyphicon-chevron-left" aria-hidden="true"></span> Carlos Estaban</a></li>
<li><a href="#">Jean Coleman <span class="glyphicon glyphicon-chevron-right" aria-hidden="true"></span></a></li> <li><a href="owner_details.html">Jean Coleman <span class="glyphicon glyphicon-chevron-right" aria-hidden="true"></span></a></li>
</ul> </ul>
</div> </div>
</section> </section>

180
src/main/webapp/static/dist/owners.html vendored Normal file
View file

@ -0,0 +1,180 @@
<!doctype html>
<html class="no-js">
<head>
<meta charset="utf-8">
<title>Pet Clinic - Owners</title>
<meta name="description" content="">
<meta name="viewport" content="width=device-width">
<link rel="shortcut icon" href="/favicon.ico">
<!-- Place favicon.ico and apple-touch-icon.png in the root directory -->
<link rel="stylesheet" href="styles/main.css">
</head>
<body>
<!--[if lt IE 10]>
<p class="browsehappy">You are using an <strong>outdated</strong> browser. Please <a href="http://browsehappy.com/">upgrade your browser</a> to improve your experience.</p>
<![endif]-->
<nav class="navbar navbar-default navbar-static-top">
<div class="container-fluid">
<!-- Brand and toggle get grouped for better mobile display -->
<div class="navbar-header">
<a class="navbar-brand" href="/">
<img alt="Pet Clinic Brand" height="27" width="auto" src="images/logo.png">
</a>
<button class="navbar-toggle navbar-toggle-left collapsed" type="button" data-toggle="collapse" data-target="#nav-menu">
<span class="sr-only">Toggle navigation</span>
<span class="glyphicon glyphicon-triangle-bottom"></span>
</button>
</div>
<!-- Collect the nav links, forms, and other content for toggling -->
<div id="nav-menu" class="navbar-collapse navbar-left collapse">
<ul class="nav navbar-nav navbar-menu">
<li><a href="dashboard.html">Dashboard</a></li>
<li class="active"><a href="owners.html">Owners</a></li>
<li><a href="pets.html">Pets</a></li>
<li><a href="vets.html">Veterinarians</a></li>
</ul>
</div><!-- /.navbar-collapse -->
<ul class="nav navbar-profile">
<li class="hidden">
<button class="btn btn-default btn-primary btn-new navbar-btn" data-toggle="dropdown">Create New</button>
</li>
<li><a href="#"><span class="glyphicon glyphicon-search" aria-hidden="true"></span></a></li>
<li><a href="#"><span class="glyphicon glyphicon-plus" aria-hidden="true"></span></a></li>
<li class="dropdown">
<a href="#" class="dropdown-toggle img-profile" data-toggle="dropdown" role="button" aria-expanded="false">
<img class="img-circle img-circle-small" src="../images/avatar.jpg" width="30" height="30">
</a>
<ul class="dropdown-menu navbar-dropdown-menu">
<li><a href="#">View Profile</a></li>
<li><a href="#">Settings</a></li>
<li><a href="#">Sign Out</a></li>
<li class="divider"></li>
<li><a href="#">Help</a></li>
</ul>
</li>
</ul>
</div>
</div><!-- /.container-fluid -->
</nav>
<!-- Owners -->
<section id="owners" class="sections sections-narrow">
<div class="container">
<div class="action-items pull-right">
<div class="action-item pull-right">
View as
<div class="btn-group">
<a href="#" class="btn btn-default"><span class="glyphicon glyphicon-th" aria-hidden="true"></span></a>
<a href="#" class="btn btn-default"><span class="glyphicon glyphicon-th-list" aria-hidden="true"></span></a>
</div>
</div>
<div class="action-item pull-right">
Sort by
<div class="btn-group">
<a href="#" class="btn btn-default"><span class="glyphicon glyphicon-arrow-up" aria-hidden="true"></span></a>
<a href="#" class="btn btn-default"><span class="glyphicon glyphicon-arrow-down" aria-hidden="true"></span></a>
</div>
</div>
</div>
<h2 class="sub-header">Latest Pet Owners</h2>
<div class="row thumbnail-wrapper">
<div class="col-md-3">
<div class="thumbnail">
<a href="owner_details.html"><img src="../images/owner-default.png" class="img-circle" alt="Generic placeholder image"></a>
<div class="caption">
<h3 class="caption-heading"><a href="owners.html">Eduardo Rodriguez</a></h3>
<p class="caption-meta">2693 Commerce St., McFarland</p>
<p class="caption-meta"><span class="glyphicon glyphicon-phone-alt"></span> +6085558763</p>
</div>
<div class="action-bar">
<ul>
<li>
<a href="#"><img src="../images/pet-small.png" class="img-circle img-circle-small" alt="Generic placeholder image" height="30" width="30"></a>
</li>
<li>
<a href="#" class="btn-add-pet"><span class="glyphicon glyphicon-plus"></span></a>
</li>
</ul>
</div>
</div>
</div>
<div class="col-md-3">
<div class="thumbnail">
<img src="../images/owner-default.png" class="img-circle" alt="Generic placeholder image">
<div class="caption">
<h3 class="caption-heading">Eduardo Rodriguez</h3>
<p class="caption-meta">2693 Commerce St., McFarland</p>
<p class="caption-meta"><span class="glyphicon glyphicon-phone-alt"></span> +6085558763</p>
</div>
<div class="action-bar">
<ul>
<li>
<a href="#"><img src="../images/pet-small.png" class="img-circle img-circle-small" alt="Generic placeholder image" height="30" width="30"></a>
</li>
<li>
<a href="#" class="btn-add-pet"><span class="glyphicon glyphicon-plus"></span></a>
</li>
</ul>
</div>
</div>
</div>
<div class="col-md-3">
<div class="thumbnail">
<img src="../images/owner-default.png" class="img-circle" alt="Generic placeholder image">
<div class="caption">
<h3 class="caption-heading">Eduardo Rodriguez</h3>
<p class="caption-meta">2693 Commerce St., McFarland</p>
<p class="caption-meta"><span class="glyphicon glyphicon-phone-alt"></span> +6085558763</p>
</div>
<div class="action-bar">
<ul>
<li>
<a href="#"><img src="../images/pet-small.png" class="img-circle img-circle-small" alt="Generic placeholder image" height="30" width="30"></a>
</li>
<li>
<a href="#" class="btn-add-pet"><span class="glyphicon glyphicon-plus"></span></a>
</li>
</ul>
</div>
</div>
</div>
<div class="col-md-3">
<div class="thumbnail">
<img src="../images/owner-default.png" class="img-circle" alt="Generic placeholder image">
<div class="caption">
<h3 class="caption-heading">Eduardo Rodriguez</h3>
<p class="caption-meta">2693 Commerce St., McFarland</p>
<p class="caption-meta"><span class="glyphicon glyphicon-phone-alt"></span> +6085558763</p>
</div>
<div class="action-bar">
<ul>
<li>
<a href="#"><img src="../images/pet-small.png" class="img-circle img-circle-small" alt="Generic placeholder image" height="30" width="30"></a>
</li>
<li>
<a href="#" class="btn-add-pet"><span class="glyphicon glyphicon-plus"></span></a>
</li>
</ul>
</div>
</div>
</div>
</div>
</div>
</section>
<!-- Footer -->
<footer class="footer">
<div class="container">
<p class="pull-right">Tell your friends: <a href="#">Facebook</a>, <a href="#">Twitter</a>, <a href="#">Google+</a></p>
<p>© 2015 Pet Clinic, A Spring Framework Demonstration</p>
</div>
</footer>
<script src="scripts/vendor.js"></script>
<script src="scripts/main.js"></script>
</body>
</html>

File diff suppressed because one or more lines are too long