mirror of
https://github.com/BobbyWibowo/lolisafe.git
synced 2024-12-14 16:36:21 +00:00
Updated
Added new option "Uploads history order" into homepage's config tab. When set to "Newer files on top", this will use flex-direction CSS property to reverse sort the uploads history. Added new entires to todo.md. Bumped v1 version string.
This commit is contained in:
Bobby Wibowo
parent
a362d63e25
commit
4d308206c7
2
dist/css/home.css
vendored
2
dist/css/home.css
vendored
@ -1,2 +1,2 @@
|
||||
#b{width:200px;height:200px;border-radius:100%;display:inline-block;margin-bottom:40px;vertical-align:top;-webkit-animation-delay:.5s;animation-delay:.5s;-webkit-animation-duration:1.5s;animation-duration:1.5s;-webkit-animation-fill-mode:both;animation-fill-mode:both;-webkit-animation-name:floatUp;animation-name:floatUp;-webkit-animation-timing-function:cubic-bezier(0,.71,.29,1);animation-timing-function:cubic-bezier(0,.71,.29,1);box-shadow:0 20px 60px rgba(10,10,10,.05),0 5px 10px rgba(10,10,10,.1),0 1px 1px rgba(10,10,10,.2)}#b img.logo{max-height:200px}#dropzone *{pointer-events:none}#panel,#tokenContainer{display:none}#maxSize{font-size:1rem}.dz-preview .dz-details{display:flex}.dz-preview .dz-details .dz-filename,.dz-preview .dz-details .dz-size{flex:1}.dz-preview .dz-error-mark,.dz-preview .dz-success-mark,.dz-preview img{display:none}@-webkit-keyframes floatUp{0%{opacity:0;box-shadow:0 0 0 rgba(10,10,10,0),0 0 0 rgba(10,10,10,0),0 0 0 rgba(10,10,10,0);transform:scale(.86)}25%{opacity:1}67%{box-shadow:0 0 0 rgba(10,10,10,0),0 5px 10px rgba(10,10,10,.1),0 1px 1px rgba(10,10,10,.2);transform:scale(1)}to{box-shadow:0 20px 60px rgba(10,10,10,.05),0 5px 10px rgba(10,10,10,.1),0 1px 1px rgba(10,10,10,.2);transform:scale(1)}}@keyframes floatUp{0%{opacity:0;box-shadow:0 0 0 rgba(10,10,10,0),0 0 0 rgba(10,10,10,0),0 0 0 rgba(10,10,10,0);transform:scale(.86)}25%{opacity:1}67%{box-shadow:0 0 0 rgba(10,10,10,0),0 5px 10px rgba(10,10,10,.1),0 1px 1px rgba(10,10,10,.2);transform:scale(1)}to{box-shadow:0 20px 60px rgba(10,10,10,.05),0 5px 10px rgba(10,10,10,.1),0 1px 1px rgba(10,10,10,.2);transform:scale(1)}}.uploads>div{-webkit-animation:fadeInOpacity .5s;animation:fadeInOpacity .5s;margin:1rem}.uploads>div:first-child{margin-top:1.5rem}.uploads.nojs{margin-bottom:0}.uploads .field>.icon:not(.icon-block){color:#3794d2}.uploads .field>.icon.icon-block{color:#da4453}.uploads progress{margin-top:.5rem;margin-bottom:1rem}.uploads img{max-width:200px}.name{font-size:1rem;color:#bdc3c7}.link>a,.name{word-break:break-all}.clipboard-mobile{margin-top:5px}#albumDiv{-webkit-animation:fadeInOpacity .5s;animation:fadeInOpacity .5s}#albumDiv .control{text-align:inherit}#linksColumn{margin-top:-.25rem;margin-left:-.25rem;margin-right:-.25rem;-webkit-animation:fadeInOpacity .5s;animation:fadeInOpacity .5s}#linksColumn .column{padding:.25rem}#linksColumn>span{padding:0 .3rem;color:#7f8c8d}.git-commit a{display:inline-block;word-break:break-all}#tabs{margin-bottom:1rem;-webkit-animation:fadeInOpacity .5s;animation:fadeInOpacity .5s}#tabs ul{border-bottom:1px solid #898b8d}#tabs li a{color:#bdc3c7;border-bottom-color:#898b8d}#tabs.is-boxed li.is-active a{color:#3794d2;background:#232629;border-color:#898b8d #898b8d #232629}#tabs.is-boxed li:not(.is-active) a:hover{background:#4d4d4d}.tab-content{margin-bottom:-.75rem;-webkit-animation:fadeInOpacity .5s;animation:fadeInOpacity .5s}.tab-content .label{color:#bdc3c7;font-weight:400}#tab-config.tab-content form{margin-bottom:.75rem}#urlMaxSize{font-weight:700}.render{position:fixed;right:0;bottom:0;font-size:1rem;color:#bdc3c7;cursor:pointer}.render.button{border-bottom-left-radius:0;border-bottom-right-radius:0;right:1%;opacity:.25;transition:opacity .25s}.render.button:hover{opacity:1}
|
||||
#b{width:200px;height:200px;border-radius:100%;display:inline-block;margin-bottom:40px;vertical-align:top;-webkit-animation-delay:.5s;animation-delay:.5s;-webkit-animation-duration:1.5s;animation-duration:1.5s;-webkit-animation-fill-mode:both;animation-fill-mode:both;-webkit-animation-name:floatUp;animation-name:floatUp;-webkit-animation-timing-function:cubic-bezier(0,.71,.29,1);animation-timing-function:cubic-bezier(0,.71,.29,1);box-shadow:0 20px 60px rgba(10,10,10,.05),0 5px 10px rgba(10,10,10,.1),0 1px 1px rgba(10,10,10,.2)}#b img.logo{max-height:200px}#dropzone *{pointer-events:none}#panel,#tokenContainer{display:none}#maxSize{font-size:1rem}.dz-preview .dz-details{display:flex}.dz-preview .dz-details .dz-filename,.dz-preview .dz-details .dz-size{flex:1}.dz-preview .dz-error-mark,.dz-preview .dz-success-mark,.dz-preview img{display:none}@-webkit-keyframes floatUp{0%{opacity:0;box-shadow:0 0 0 rgba(10,10,10,0),0 0 0 rgba(10,10,10,0),0 0 0 rgba(10,10,10,0);transform:scale(.86)}25%{opacity:1}67%{box-shadow:0 0 0 rgba(10,10,10,0),0 5px 10px rgba(10,10,10,.1),0 1px 1px rgba(10,10,10,.2);transform:scale(1)}to{box-shadow:0 20px 60px rgba(10,10,10,.05),0 5px 10px rgba(10,10,10,.1),0 1px 1px rgba(10,10,10,.2);transform:scale(1)}}@keyframes floatUp{0%{opacity:0;box-shadow:0 0 0 rgba(10,10,10,0),0 0 0 rgba(10,10,10,0),0 0 0 rgba(10,10,10,0);transform:scale(.86)}25%{opacity:1}67%{box-shadow:0 0 0 rgba(10,10,10,0),0 5px 10px rgba(10,10,10,.1),0 1px 1px rgba(10,10,10,.2);transform:scale(1)}to{box-shadow:0 20px 60px rgba(10,10,10,.05),0 5px 10px rgba(10,10,10,.1),0 1px 1px rgba(10,10,10,.2);transform:scale(1)}}.uploads.is-reversed{display:flex;flex-direction:column-reverse}.uploads>div{-webkit-animation:fadeInOpacity .5s;animation:fadeInOpacity .5s;margin:1rem}.uploads.is-reversed>div{flex:0 0 auto}.uploads>div:first-child{margin-top:1.5rem}.uploads.nojs{margin-bottom:0}.uploads>div>.icon:not(.icon-block){color:#3794d2}.uploads>div>.icon.icon-block{color:#da4453}.uploads progress{margin-top:.5rem;margin-bottom:1rem}.uploads img{max-width:200px}.name{font-size:1rem;color:#bdc3c7}.link>a,.name{word-break:break-all}.clipboard-mobile{margin-top:5px}#albumDiv{-webkit-animation:fadeInOpacity .5s;animation:fadeInOpacity .5s}#albumDiv .control{text-align:inherit}#linksColumn{margin-top:-.25rem;margin-left:-.25rem;margin-right:-.25rem;-webkit-animation:fadeInOpacity .5s;animation:fadeInOpacity .5s}#linksColumn .column{padding:.25rem}#linksColumn>span{padding:0 .3rem;color:#7f8c8d}.git-commit a{display:inline-block;word-break:break-all}#tabs{margin-bottom:1rem;-webkit-animation:fadeInOpacity .5s;animation:fadeInOpacity .5s}#tabs ul{border-bottom:1px solid #898b8d}#tabs li a{color:#bdc3c7;border-bottom-color:#898b8d}#tabs.is-boxed li.is-active a{color:#3794d2;background:#232629;border-color:#898b8d #898b8d #232629}#tabs.is-boxed li:not(.is-active) a:hover{background:#4d4d4d}.tab-content{margin-bottom:-.75rem;-webkit-animation:fadeInOpacity .5s;animation:fadeInOpacity .5s}.tab-content .label{color:#bdc3c7;font-weight:400}#tab-config.tab-content form{margin-bottom:.75rem}#urlMaxSize{font-weight:700}.render{position:fixed;right:0;bottom:0;font-size:1rem;color:#bdc3c7;cursor:pointer}.render.button{border-bottom-left-radius:0;border-bottom-right-radius:0;right:1%;opacity:.25;transition:opacity .25s}.render.button:hover{opacity:1}
|
||||
/*# sourceMappingURL=home.css.map */
|
||||
|
||||
2
dist/css/home.css.map
vendored
2
dist/css/home.css.map
vendored
File diff suppressed because one or more lines are too long
2
dist/js/home.js
vendored
2
dist/js/home.js
vendored
File diff suppressed because one or more lines are too long
2
dist/js/home.js.map
vendored
2
dist/js/home.js.map
vendored
File diff suppressed because one or more lines are too long
@ -89,11 +89,20 @@
|
||||
}
|
||||
}
|
||||
|
||||
.uploads.is-reversed {
|
||||
display: flex;
|
||||
flex-direction: column-reverse
|
||||
}
|
||||
|
||||
.uploads > div {
|
||||
animation: fadeInOpacity 0.5s;
|
||||
margin: 1rem
|
||||
}
|
||||
|
||||
.uploads.is-reversed > div {
|
||||
flex: 0 0 auto
|
||||
}
|
||||
|
||||
.uploads > div:first-child {
|
||||
margin-top: 1.5rem
|
||||
}
|
||||
@ -102,11 +111,11 @@
|
||||
margin-bottom: 0
|
||||
}
|
||||
|
||||
.uploads .field > .icon:not(.icon-block) {
|
||||
.uploads > div > .icon:not(.icon-block) {
|
||||
color: #3794d2
|
||||
}
|
||||
|
||||
.uploads .field > .icon.icon-block {
|
||||
.uploads > div > .icon.icon-block {
|
||||
color: #da4453
|
||||
}
|
||||
|
||||
|
||||
@ -4,6 +4,7 @@ const lsKeys = {
|
||||
token: 'token',
|
||||
chunkSize: 'chunkSize',
|
||||
parallelUploads: 'parallelUploads',
|
||||
uploadsHistoryOrder: 'uploadsHistoryOrder',
|
||||
fileLength: 'fileLength',
|
||||
uploadAge: 'uploadAge'
|
||||
}
|
||||
@ -24,6 +25,7 @@ const page = {
|
||||
album: null,
|
||||
|
||||
parallelUploads: null,
|
||||
uploadsHistoryOrder: null,
|
||||
fileLength: null,
|
||||
uploadAge: null,
|
||||
|
||||
@ -591,11 +593,19 @@ page.prepareUploadConfig = () => {
|
||||
const siBytes = localStorage[lsKeys.siBytes] !== '0'
|
||||
if (!siBytes) document.querySelector('#siBytes').value = '0'
|
||||
|
||||
const olderOnTop = localStorage[lsKeys.uploadsHistoryOrder] !== '0'
|
||||
if (!olderOnTop) {
|
||||
document.querySelector('#uploadsHistoryOrder').value = '0'
|
||||
const uploadFields = document.querySelectorAll('.tab-content > .uploads')
|
||||
for (let i = 0; i < uploadFields.length; i++)
|
||||
uploadFields[i].classList.add('is-reversed')
|
||||
}
|
||||
|
||||
document.querySelector('#saveConfig').addEventListener('click', () => {
|
||||
if (!form.checkValidity())
|
||||
return
|
||||
|
||||
const prefKeys = ['siBytes', 'uploadAge']
|
||||
const prefKeys = ['siBytes', 'uploadsHistoryOrder', 'uploadAge']
|
||||
for (let i = 0; i < prefKeys.length; i++) {
|
||||
const value = form.elements[prefKeys[i]].value
|
||||
if (value !== 'default' && value !== fallback[prefKeys[i]])
|
||||
|
||||
2
todo.md
2
todo.md
@ -14,6 +14,8 @@ Normal priority:
|
||||
* [*] Use Gatsby logo for link to [blog.fiery.me](https://blog.fiery.me/) on the homepage.
|
||||
* [ ] Auto-detect missing columns in `database/db.js`.
|
||||
* [*] Better error message when server is down.
|
||||
* [ ] Show expiry date in thumbs view.
|
||||
* [ ] Add Select all checkbox somewhere in thumbs view.
|
||||
|
||||
Low priority:
|
||||
|
||||
|
||||
@ -16,7 +16,7 @@
|
||||
v3: CSS and JS files (libs such as bulma, lazyload, etc).
|
||||
v4: Renders in /public/render/* directories (to be used by render.js).
|
||||
#}
|
||||
{% set v1 = "23xR9kTFtk" %}
|
||||
{% set v1 = "JxzI0kN09F" %}
|
||||
{% set v2 = "hiboQUzAzp" %}
|
||||
{% set v3 = "fFS2CGH95j" %}
|
||||
{% set v4 = "S3TAWpPeFS" %}
|
||||
|
||||
@ -169,6 +169,18 @@
|
||||
</div>
|
||||
<p class="help"></p>
|
||||
</div>
|
||||
<div class="field">
|
||||
<label class="label">Uploads history order</label>
|
||||
<div class="control is-expanded">
|
||||
<div class="select is-fullwidth">
|
||||
<select id="uploadsHistoryOrder">
|
||||
<option value="default">Older files on top (default)</option>
|
||||
<option value="0">Newer files on top</option>
|
||||
</select>
|
||||
</div>
|
||||
</div>
|
||||
<p class="help">Newer files on top only works in <a href="https://caniuse.com/#feat=mdn-css_properties_flex-direction" target="_blank" rel="noopener">these browsers</a>.</p>
|
||||
</div>
|
||||
<div class="field">
|
||||
<p class="control is-expanded">
|
||||
<button id="saveConfig" type="submit" class="button is-danger is-fullwidth">
|
||||
|
||||
Loading…
Reference in New Issue
Block a user