NunoSempere/calibre-web
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Flex display to fix columns issue

Browse Source
This commit is contained in:
cbartondock 2020-10-16 13:41:48 -04:00
parent 1d83a6a898
commit 1be07a42df
8 changed files with 18 additions and 9 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

11
cps/static/css/style.css
View File

@ -107,6 +107,11 @@ a, .danger,.book-remove, .editable-empty, .editable-empty:hover { color: #45b29d
text-decoration: none; text-decoration: none;
} }
.row.display-flex {
display: flex;
flex-wrap: wrap;
}
.container-fluid img { .container-fluid img {
display: block; display: block;
max-width: 100%; max-width: 100%;
@ -116,7 +121,11 @@ a, .danger,.book-remove, .editable-empty, .editable-empty:hover { color: #45b29d
.container-fluid .discover{ margin-bottom: 50px; } .container-fluid .discover{ margin-bottom: 50px; }
.container-fluid .new-books { border-top: 1px solid #ccc; } .container-fluid .new-books { border-top: 1px solid #ccc; }
.container-fluid .new-books h2 { margin: 50px 0 0 0; } .container-fluid .new-books h2 { margin: 50px 0 0 0; }
.container-fluid .book { margin-top: 20px; } .container-fluid .book {
margin-top: 20px;
display: flex;
flex-direction: column;
}
.container-fluid .book .cover { .container-fluid .book .cover {
height: 225px; height: 225px;

2
cps/templates/author.html
View File

@ -34,7 +34,7 @@
<div id="all" class="btn btn-primary">{{_('All')}}</div> <div id="all" class="btn btn-primary">{{_('All')}}</div>
</div--> </div-->
</div> </div>
<div class="row"> <div class="row display-flex">
{% if entries[0] %} {% if entries[0] %}
{% for entry in entries %} {% for entry in entries %}
<div id="books" class="col-sm-3 col-lg-2 col-xs-6 book"> <div id="books" class="col-sm-3 col-lg-2 col-xs-6 book">

2
cps/templates/discover.html
View File

@ -2,7 +2,7 @@
{% block body %} {% block body %}
<div class="discover load-more"> <div class="discover load-more">
<h2>{{title}}</h2> <h2>{{title}}</h2>
<div class="row"> <div class="row display-flex">
{% for entry in entries %} {% for entry in entries %}
<div class="col-sm-3 col-lg-2 col-xs-6 book"> <div class="col-sm-3 col-lg-2 col-xs-6 book">
<div class="cover"> <div class="cover">

2
cps/templates/grid.html
View File

@ -23,7 +23,7 @@
</div> </div>
{% if entries[0] %} {% if entries[0] %}
<div id="list" class="row"> <div id="list" class="row display-flex">
{% for entry in entries %} {% for entry in entries %}
<div class="col-sm-3 col-lg-2 col-xs-6 book sortable" {% if entry[0].sort %}data-name="{{entry[0].series[0].name}}"{% endif %} data-id="{% if entry[0].series[0].name %}{{entry[0].series[0].name}}{% endif %}"> <div class="col-sm-3 col-lg-2 col-xs-6 book sortable" {% if entry[0].sort %}data-name="{{entry[0].series[0].name}}"{% endif %} data-id="{% if entry[0].series[0].name %}{{entry[0].series[0].name}}{% endif %}">
<div class="cover"> <div class="cover">

4
cps/templates/index.html
View File

@ -3,7 +3,7 @@
{% if g.user.show_detail_random() %} {% if g.user.show_detail_random() %}
<div class="discover random-books"> <div class="discover random-books">
<h2 class="random-books">{{_('Discover (Random Books)')}}</h2> <h2 class="random-books">{{_('Discover (Random Books)')}}</h2>
<div class="row"> <div class="row display-flex">
{% for entry in random %} {% for entry in random %}
<div class="col-sm-3 col-lg-2 col-xs-6 book" id="books_rand"> <div class="col-sm-3 col-lg-2 col-xs-6 book" id="books_rand">
<div class="cover"> <div class="cover">
@ -73,7 +73,7 @@
</div--> </div-->
</div> </div>
<div class="row"> <div class="row display-flex">
{% if entries[0] %} {% if entries[0] %}
{% for entry in entries %} {% for entry in entries %}
<div class="col-sm-3 col-lg-2 col-xs-6 book" id="books"> <div class="col-sm-3 col-lg-2 col-xs-6 book" id="books">

2
cps/templates/search.html
View File

@ -35,7 +35,7 @@
</div> </div>
{% endif %} {% endif %}
<div class="row"> <div class="row display-flex">
{% for entry in entries %} {% for entry in entries %}
<div class="col-sm-3 col-lg-2 col-xs-6 book"> <div class="col-sm-3 col-lg-2 col-xs-6 book">
<div class="cover"> <div class="cover">

2
cps/templates/shelf.html
View File

@ -12,7 +12,7 @@
<a id="order_shelf" href="{{ url_for('shelf.order_shelf', shelf_id=shelf.id) }}" class="btn btn-primary">{{ _('Change order') }} </a> <a id="order_shelf" href="{{ url_for('shelf.order_shelf', shelf_id=shelf.id) }}" class="btn btn-primary">{{ _('Change order') }} </a>
{% endif %} {% endif %}
{% endif %} {% endif %}
<div class="row"> <div class="row display-flex">
{% for entry in entries %} {% for entry in entries %}
<div class="col-sm-3 col-lg-2 col-xs-6 book"> <div class="col-sm-3 col-lg-2 col-xs-6 book">

2
cps/templates/shelfdown.html
View File

@ -29,7 +29,7 @@
{% block body %} {% block body %}
<div class="discover"> <div class="discover">
<h2>{{title}}</h2> <h2>{{title}}</h2>
<div class="row"> <div class="row display-flex">
{% for entry in entries %} {% for entry in entries %}
<div class="col-sm-3 col-lg-2 col-xs-6 book"> <div class="col-sm-3 col-lg-2 col-xs-6 book">