aykhans/series-robot-web
1
0
Fork 0
mirror of https://github.com/aykhans/series-robot-web.git synced 2025-04-21 06:13:34 +00:00
Code Issues Actions Packages Projects Releases Wiki Activity

Added scroll to table

Browse Source
This commit is contained in:
ayxan 2022-10-17 12:43:51 +04:00
parent 9ef0bc46f3
commit 6dfe4d1c5c
4 changed files with 68 additions and 43 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

10
src/series/templates/homepage.html
View File

@ -8,7 +8,7 @@
{% include 'components/message.html' %} {% include 'components/message.html' %}
<link rel="stylesheet" href="{% static 'css/homepage.css' %}"> <link rel="stylesheet" href="{% static 'css/homepage.css' %}">
<table class="table" style="margin-bottom: 1.5rem;"> <table class="table">
<thead> <thead>
<tr> <tr>
<th scope="col">Title ({{series.paginator.count}})</th> <th scope="col">Title ({{series.paginator.count}})</th>
@ -48,13 +48,14 @@
</tbody> </tbody>
</table> </table>
<div style="float: left;"> <div style="margin-bottom: 8.5rem;">
<div class="btn-new-episode">
<button type="button" class="btn btn-outline-primary"> <button type="button" class="btn btn-outline-primary">
<a href="/series/new-episodes/" style="text-decoration: none; color: inherit;">New Episodes</a> <a href="/series/new-episodes/" style="text-decoration: none; color: inherit;">New Episodes</a>
</button> </button>
</div> </div>
<div style="float: right;"> <div class="pages">
<nav aria-label="Page navigation example"> <nav aria-label="Page navigation example">
<ul class="pagination justify-content-end"> <ul class="pagination justify-content-end">
{% if series.has_previous %} {% if series.has_previous %}
@ -80,6 +81,7 @@
{% endif %} {% endif %}
</ul> </ul>
</nav> </nav>
</div>
</div> </div>
{% endblock content %} {% endblock content %}

8
src/series/templates/new_episodes.html
View File

@ -6,7 +6,8 @@
{% block content %} {% block content %}
<link rel="stylesheet" href="{% static 'css/new_episodes.css' %}"> <link rel="stylesheet" href="{% static 'css/new_episodes.css' %}">
<table class="table" style="margin-bottom: 1.5rem;"> <div class="table-div">
<table class="table">
<thead> <thead>
<tr> <tr>
<th scope="col">Title</th> <th scope="col">Title</th>
@ -24,10 +25,10 @@
</a> </a>
<br> <br>
<a class="btn mr-1 update-btn" style="padding: 0;" href="{% url 'update-series' s.slug %}"> <a class="btn mr-1 update-btn" style="padding: 0;" href="{% url 'update-series' s.slug %}">
<img src="{% static 'icons/edit.png' %}" width="21px" height="21px"> <img class="edit-icon" src="{% static 'icons/edit.png' %}" width="21px" height="21px">
</a> </a>
<a class="btn delete-btn" href="{% url 'delete-series' s.slug %}"> <a class="btn delete-btn" href="{% url 'delete-series' s.slug %}">
<img src="{% static 'icons/trash.png' %}" width="24px" height="24px"> <img class="trash-icon" src="{% static 'icons/trash.png' %}" width="24px" height="24px">
</a> </a>
</th> </th>
<td> <td>
@ -45,5 +46,6 @@
{% endfor %} {% endfor %}
</tbody> </tbody>
</table> </table>
</div>
{% endblock content %} {% endblock content %}

22
src/static/css/homepage.css
View File

@ -1,15 +1,27 @@
.table {
margin-bottom: 1.5rem;
}
.btn-new-episode {
float: left;
}
.pages {
float: right;
}
@media only screen and (max-width: 510px) { @media only screen and (max-width: 510px) {
table { table {
font-size: 90%; font-size: 87%;
} }
.edit-icon { .edit-icon {
width: 19px; width: 18px;
height: 19px; height: 18px;
} }
.trash-icon { .trash-icon {
width: 21px; width: 19px;
height: 21px; height: 19px;
} }
} }

19
src/static/css/new_episodes.css
View File

@ -1,15 +1,24 @@
.table {
margin-bottom: 1.5rem;
width: 670px;
}
.table-div {
overflow-x: scroll;
}
@media only screen and (max-width: 510px) { @media only screen and (max-width: 510px) {
table { table {
font-size: 85%; font-size: 83%;
} }
.edit-icon { .edit-icon {
width: 15px; width: 18px;
height: 15px; height: 18px;
} }
.trash-icon { .trash-icon {
width: 17px; width: 19px;
height: 17px; height: 19px;
} }
} }