Update rule table styling

This commit is contained in:
Sonny 2020-07-26 19:41:17 +02:00
parent 6a13c58712
commit fd16478909
3 changed files with 21 additions and 23 deletions

View file

@ -21,7 +21,7 @@
</section>
<section class="section form__section">
<table class="table rules-table">
<table class="table rules-table" border="0" cellspacing="0">
<thead class="table__header rules-table__header">
<tr class="table__row rules-table__row">
<th class="table__heading rules-table__heading--select">
@ -32,20 +32,27 @@
<th class="table__heading rules-table__heading--url">{% trans "URL" %}</th>
<th class="table__heading rules-table__heading--succeeded">{% trans "Successfuly ran" %}</th>
<th class="table__heading rules-table__heading--enabled">{% trans "Enabled" %}</th>
<th class="table__heading rules-table__heading--link"></th>
</tr>
</thead>
<tbody class="table__body">
{% for rule in rules %}
<tr class="table__row rules-table__row">
<tr class="table__row {% if not rule.succeeded %}table__row--error {% endif %}rules-table__row">
<td class="table__item rules-table__item">
{% with rule|id_for_label:"rules" as id_for_label %}
{% include "components/form/checkbox.html" with name="rules" value=rule.pk id=id_for_label id_for_label=id_for_label %}
{% endwith %}
</td>
<td class="table__item rules-table__item" title="{{ rule.name }}">{{ rule.name }}</td>
<td class="table__item rules-table__item" title="{{ rule.category.name }}">{{ rule.category.name }}</td>
<td class="table__item rules-table__item" title="{{ rule.url }}">{{ rule.url }}</td>
<td class="table__item rules-table__item" title="{{ rule.name }}">
<a class="link" href="{{ rule.update_url }}">{{ rule.name }}</a>
</td>
<td class="table__item rules-table__item" title="{{ rule.category.name }}">
{% if rule.category %}
<a class="link" href="{% url 'news:core:category-update' pk=rule.category.pk %}">{{ rule.category.name }}</a>
{% endif %}
</td>
<td class="table__item rules-table__item" title="{{ rule.url }}">
<a class="link" href="{{ rule.url }}" target="_blank" rel="noopener noreferrer">{{ rule.url }}</a>
</td>
<td class="table__item rules-table__item">
{% if rule.succeeded %}
<i class="gg-check"></i>
@ -60,9 +67,6 @@
<i class="gg-play-pause"></i>
{% endif %}
</td>
<td class="table__item rules-table__item">
<a class="link" href="{{ rule.update_url }}"><i class="gg-pen"></i></a>
</td>
</tr>
{% endfor %}
</tbody>

View file

@ -5,7 +5,7 @@
}
&--name {
width: 20%;
width: 25%;
}
&--category {
@ -23,16 +23,5 @@
&--enabled {
width: 10%;
}
&--link {
width: 5%;
}
}
& .link {
display: flex;
justify-content: center;
padding: 10px;
}
}

View file

@ -2,6 +2,7 @@
.table {
table-layout: fixed;
background-color: $white;
width: 90%;
padding: 20px;
@ -13,11 +14,15 @@
@extend .h1;
}
&__row {
&--error {
background-color: lighten($error-red, 25%);
}
}
&__item {
padding: 10px 0;
border-bottom: 1px solid $border-gray;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;