steve
/
mybuddy
mirror of https://github.com/snachodog/mybuddy.git
1
0
Fork 0
Code Issues 3 Packages Projects 1 Releases Wiki Activity

Tweak Child list table styles.

This commit is contained in:
Christopher Charbonneau Wells 2017-11-18 06:48:59 -05:00
parent ebf42acf87
commit eff1320a5e
3 changed files with 25 additions and 7 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
babybuddy/static_src/scss/icons.scss
View File

@ -16,6 +16,10 @@
@extend .fa-plus; @extend .fa-plus;
} }
.icon-camera {
@extend .fa-camera;
}
.icon-chevron-left { .icon-chevron-left {
@extend .fa-chevron-left; @extend .fa-chevron-left;
} }

14
core/static_src/scss/core.scss
View File

@ -4,6 +4,20 @@
} }
} }
#view-child-list {
.picture-column {
text-align: center;
width: 65px;
min-width: 65px;
}
.child-list {
th, td {
vertical-align: middle;
}
}
}
@include media-breakpoint-up(md) { @include media-breakpoint-up(md) {
#view-child { #view-child {
.child-detail-column { .child-detail-column {

14
core/templates/core/child_list.html
View File

@ -11,10 +11,10 @@
<h1>Children</h1> <h1>Children</h1>
{% include 'babybuddy/filter.html' %} {% include 'babybuddy/filter.html' %}
<div class="table-responsive"> <div class="table-responsive">
<table class="table table-striped table-hover"> <table class="table table-striped table-hover child-list">
<thead class="thead-inverse"> <thead class="thead-inverse">
<tr> <tr>
<th><i class="fa fa-camera" aria-hidden="true"></i></th> <th class="picture-column"><i class="icon icon-camera" aria-hidden="true"></i></th>
<th>First Name</th> <th>First Name</th>
<th>Last Name</th> <th>Last Name</th>
<th>Birth Date</th> <th>Birth Date</th>
@ -24,7 +24,7 @@
<tbody> <tbody>
{% for child in object_list %} {% for child in object_list %}
<tr> <tr>
<td> <td class="picture-column">
{% if child.picture %} {% if child.picture %}
{% thumbnail child.picture 40x40 upscale crop as thumb %} {% thumbnail child.picture 40x40 upscale crop as thumb %}
<img src="{{ thumb.url }}" class="img-fluid rounded-circle" /> <img src="{{ thumb.url }}" class="img-fluid rounded-circle" />
@ -32,12 +32,12 @@
<img src="{% static 'babybuddy/img/core/child-placeholder.png' %}" width="40" height="40" class="img-fluid rounded-circle" /> <img src="{% static 'babybuddy/img/core/child-placeholder.png' %}" width="40" height="40" class="img-fluid rounded-circle" />
{% endif %} {% endif %}
</td> </td>
<th scope="row" class="align-middle"> <th scope="row">
<a href="{% url 'child' child.slug %}">{{ child.first_name }}</a> <a href="{% url 'child' child.slug %}">{{ child.first_name }}</a>
</th> </th>
<td class="align-middle">{{ child.last_name }}</td> <td>{{ child.last_name }}</td>
<td class="align-middle">{{ child.birth_date }}</td> <td>{{ child.birth_date }}</td>
<td class="text-center align-middle"> <td class="text-center">
<div class="btn-group btn-group-sm" role="group" aria-label="Actions"> <div class="btn-group btn-group-sm" role="group" aria-label="Actions">
{% if perms.core.change_child %} {% if perms.core.change_child %}