smallsolar
/
libkiwix
mirror of https://github.com/kiwix/libkiwix.git
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

Center tiles on welcome page 

This change centers tiles on welcome page to give a more consistent whitespace look on both sides.
For this, the layout in Isotope JS is changed to masonry.
This commit is contained in:
Nikhil Tanwar 2022-06-29 15:02:24 +05:30 committed by Kelson
parent dfc6cad9c2
commit 2b6da38c46
4 changed files with 20 additions and 18 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

22
static/skin/index.css
View File

@ -31,7 +31,7 @@ body {
font-size: 1.6rem; font-size: 1.6rem;
color: #333333; color: #333333;
font-family: poppins; font-family: poppins;
margin: 10px 0 -5px; margin: -10px 0 -5px;
position: relative; position: relative;
top: -10px; top: -10px;
left: 13px; left: 13px;
@ -129,9 +129,12 @@ body {
} }
.kiwixHomeBody { .kiwixHomeBody {
padding: 20px 15vw; padding: 20px 0;
min-height: calc(100vh - 170px); min-height: calc(100vh - 170px);
position: relative; position: relative;
display: flex;
flex-direction: column;
align-items: center;
} }
.tagFilterLabel { .tagFilterLabel {
@ -157,6 +160,8 @@ body {
.book__list { .book__list {
position: relative; position: relative;
margin: 0 auto;
padding-top: 20px;
} }
.book { .book {
@ -440,13 +445,16 @@ body {
@media screen and (max-width: 1100px) { @media screen and (max-width: 1100px) {
.kiwixHomeBody { .kiwixHomeBody {
padding: 20px 10vw;
min-height: calc(100vh - 170px); min-height: calc(100vh - 170px);
} }
.kiwixNav__filters { .kiwixNav__filters {
grid-template-columns: repeat(4, 1fr); grid-template-columns: repeat(4, 1fr);
} }
.book__wrapper {
margin: 10px;
}
} }
@media screen and (max-width: 590px) { @media screen and (max-width: 590px) {
@ -475,10 +483,4 @@ body {
.kiwixNav__filters { .kiwixNav__filters {
grid-template-columns: 1fr; grid-template-columns: 1fr;
} }
} }
@media screen and (max-width: 340px) {
.kiwixHomeBody {
padding: 20px 5vw;
}
}

7
static/skin/index.js
View File

@ -449,10 +449,9 @@
} }
}, },
sortBy: 'weight', sortBy: 'weight',
layoutMode: 'cellsByRow', layoutMode: 'masonry',
cellsByRow: { masonry: {
columnWidth: '.book', fitWidth: true
rowHeight: '.book'
} }
}); });
footer = document.getElementById('kiwixfooter'); footer = document.getElementById('kiwixfooter');

5
static/templates/index.html
View File

@ -63,8 +63,9 @@
</form> </form>
</div> </div>
<div class="kiwixHomeBody"> <div class="kiwixHomeBody">
<h3 class="kiwixHomeBody__results"></h3> <div class="book__list">
<div class="book__list"></div> <h3 class="kiwixHomeBody__results"></h3>
</div>
<div id="fadeOut" class="fadeOut"></div> <div id="fadeOut" class="fadeOut"></div>
</div> </div>
<div class="loader" style="position: absolute; top: 50%"><div class="loader-spinner"></div></div> <div class="loader" style="position: absolute; top: 50%"><div class="loader-spinner"></div></div>

4
test/server.cpp
View File

@ -179,12 +179,12 @@ R"EXPECTEDRESULT( src="/ROOT/skin/jquery-ui/external/jquery/jquery.js?cache
src="/ROOT/skin/jquery-ui/jquery-ui.min.js?cacheid=d927c2ff" src="/ROOT/skin/jquery-ui/jquery-ui.min.js?cacheid=d927c2ff"
href="/ROOT/skin/jquery-ui/jquery-ui.min.css?cacheid=e1de77b3" href="/ROOT/skin/jquery-ui/jquery-ui.min.css?cacheid=e1de77b3"
href="/ROOT/skin/jquery-ui/jquery-ui.theme.min.css?cacheid=2a5841f9" href="/ROOT/skin/jquery-ui/jquery-ui.theme.min.css?cacheid=2a5841f9"
href="/ROOT/skin/index.css?cacheid=a1acc52f" href="/ROOT/skin/index.css?cacheid=dff64da8"
src: url("/ROOT/skin/fonts/Poppins.ttf?cacheid=af705837") format("truetype"); src: url("/ROOT/skin/fonts/Poppins.ttf?cacheid=af705837") format("truetype");
src: url("/ROOT/skin/fonts/Roboto.ttf?cacheid=84d10248") format("truetype"); src: url("/ROOT/skin/fonts/Roboto.ttf?cacheid=84d10248") format("truetype");
<script src="/ROOT/skin/isotope.pkgd.min.js?cacheid=2e48d392" defer></script> <script src="/ROOT/skin/isotope.pkgd.min.js?cacheid=2e48d392" defer></script>
<script src="/ROOT/skin/iso6391To3.js?cacheid=ecde2bb3"></script> <script src="/ROOT/skin/iso6391To3.js?cacheid=ecde2bb3"></script>
<script type="text/javascript" src="/ROOT/skin/index.js?cacheid=e99ed2dd" defer></script> <script type="text/javascript" src="/ROOT/skin/index.js?cacheid=ce2c8253" defer></script>
)EXPECTEDRESULT" )EXPECTEDRESULT"
}, },
{ {