minor changes in fadeout effect

This commit is contained in:
Manan Jethwani
2021-06-03 20:41:38 +05:30
committed by Emmanuel Engelhart
parent d6c62b3cd3
commit 1ccafe2d97
2 changed files with 34 additions and 21 deletions

View File

@ -45,7 +45,7 @@
position: relative;
text-align: center;
min-height: 100%;
margin: 30px 0;
margin: 0 0 15px;
}
.book {
display: inline-block;
@ -76,6 +76,9 @@
.kiwixFilter {
margin: 8px 10px;
}
.kiwixSearch, .searchButton {
margin: 0 13px 0 0;
}
.kiwixSearchForm {
margin: 8px 10px;
float: right;
@ -128,9 +131,6 @@
top: 48%;
left: 42%;
}
.shadow {
box-shadow: 0 6px 2px -3px grey;
}
.loader-spinner {
position: absolute;
top: -50%;
@ -145,6 +145,7 @@
animation: spin 1s linear infinite;
margin-top: 35px;
margin-bottom: -35px;
z-index: 2;
}
/* Safari */
@-webkit-keyframes spin {
@ -161,7 +162,8 @@
width: 100%;
}
.fadeOut {
position: absolute;
position: fixed;
display: none;
bottom: 0;
left: 0;
z-index: 1;
@ -169,6 +171,10 @@
height: 80px;
width: 100%;
}
.spacer {
height: 20px;
background: transparent;
}
</style>
<script src="{{root}}/skin/isotope.pkgd.min.js" defer></script>
<script src="{{root}}/skin/categoryList.js"></script>
@ -186,7 +192,7 @@
</select>
<form id='kiwixSearchForm' class='kiwixSearchForm'>
<input type="text" name="q" id="searchFilter" class='kiwixSearch'>
<input type="submit" value="Submit"/>
<input type="submit" class="searchButton" value="Search"/>
</form>
</div>
<div class="kiwixHomeBody">
@ -194,6 +200,7 @@
<div id="fadeOut" class="fadeOut"></div>
</div>
<div class="loader"><div class="loader-spinner"></div></div>
<div class="spacer"></div>
<div id="kiwixfooter">Powered by <a href="https://kiwix.org">Kiwix</a></div>
</body>
</html>