UI design

This commit is contained in:
Antoine Rey 2016-10-13 18:55:46 +02:00
parent 26118e66eb
commit ee2807c7c9
4 changed files with 46 additions and 25 deletions

View file

@ -26,7 +26,11 @@
<body class="container"> <body class="container">
<layout-nav></layout-nav> <layout-nav></layout-nav>
<div ng-view></div> <div class="container-fluid">
<div class="container xd-container">
<div ng-view></div>
</div>
</div>
<layout-footer></layout-footer> <layout-footer></layout-footer>
</body> </body>

View file

@ -19,36 +19,53 @@
</tr> </tr>
<tr> <tr>
<td> <td>
<a class="btn btn-info" href="#!/owners/{{$ctrl.owner.id}}/edit">Edit Owner</a> <a class="btn btn-default" href="#!/owners/{{$ctrl.owner.id}}/edit">Edit Owner</a>
</td> </td>
<td> <td>
<a href="#!/owners/{{$ctrl.owner.id}}/new-pet" class="btn btn-success">Add New Pet</a> <a href="#!/owners/{{$ctrl.owner.id}}/new-pet" class="btn btn-default">Add New Pet</a>
</td> </td>
</tr> </tr>
</table> </table>
<h2>Pets and Visits</h2> <h2>Pets and Visits</h2>
<div ng-repeat="pet in $ctrl.owner.pets"> <table class="table table-striped">
<h3> <tr ng-repeat="pet in $ctrl.owner.pets">
<a href="#!/owners/{{$ctrl.owner.id}}/pets/{{pet.id}}">{{pet.name}}</a> <td valign="top">
</h3> <dl class="dl-horizontal">
<p> <dt>Name</dt>
{{pet.birthDate | date:'yyyy MMM dd'}} - {{pet.type.name}} - <dd><a href="#!/owners/{{$ctrl.owner.id}}/pets/{{pet.id}}">{{pet.name}}</a></dd>
<a href="#!/owners/{{$ctrl.owner.id}}/pets/{{pet.id}}/visits">Add Visit</a> <dt>Birth Date</dt>
</p> <dd>{{pet.birthDate | date:'yyyy MMM dd'}}</dd>
<h4>Visits</h4> <dt>Type</dt>
<dd>{{pet.type.name}}</dd>
</dl>
</td>
<td valign="top">
<table class="table-condensed">
<thead>
<tr>
<th>Visit Date</th>
<th>Description</th>
</tr>
</thead>
<tr ng-repeat="visit in pet.visits">
<td>{{visit.date | date:'yyyy MMM dd'}}</td>
<td>{{visit.description}}</td>
</tr>
<tr>
<td>
<a href="#!/owners/{{$ctrl.owner.id}}/pets/{{pet.id}}">Edit Pet</a>
</td>
<td>
<a href="#!/owners/{{$ctrl.owner.id}}/pets/{{pet.id}}/visits">Add Visit</a>
</td>
</tr>
</table>
</td>
</tr>
</table>
<div ng-repeat="visit in pet.visits" style="margin-top: 1em;">
<h5>{{visit.date | date:'yyyy MMM dd'}}</h5>
<p style="white-space: pre-line">{{visit.description}}</p>
</div>
<p ng-if="pet.visits.length == 0">
No visit yet
</p>
<hr/>
</div>

View file

@ -32,7 +32,7 @@
</div> </div>
<div class="form-group"> <div class="form-group">
<button class="btn btn-primary" type="submit">Submit</button> <button class="btn btn-default" type="submit">Submit</button>
</div> </div>
</form> </form>

View file

@ -35,7 +35,7 @@
<div class="form-group"> <div class="form-group">
<div class="col-sm-6 col-sm-offset-2"> <div class="col-sm-6 col-sm-offset-2">
<button class="btn btn-primary" type="submit"> <button class="btn btn-default" type="submit">
Submit Submit
</button> </button>
</div> </div>