Transitioned styling to Sass
Added new dev dependencies: bulma, gulp-sass, node-sass Updated some dependencies Various other things related to styling Bumped v1 version string and rebuilt client assetsmaster
Bobby Wibowo
parent
3c2abcfadd
commit
34d3601c30
|
|
@ -2,6 +2,7 @@
|
|||
"extends": "stylelint-config-standard",
|
||||
"rules": {
|
||||
"declaration-block-trailing-semicolon": "never",
|
||||
"function-name-case": null,
|
||||
"indentation": 2,
|
||||
"no-descending-specificity": null
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,2 +1,2 @@
|
|||
.section{background:none}@media screen and (max-width:768px){.description{text-align:center}}
|
||||
@media screen and (max-width:768px){.description{text-align:center}}
|
||||
/*# sourceMappingURL=album.css.map */
|
||||
|
|
|
|||
|
|
@ -1 +1 @@
|
|||
{"version":3,"sources":["css/album.css"],"names":[],"mappings":"AAAA,SACE,eACF,CAEA,oCACE,aACE,iBACF,CACF","file":"album.css","sourcesContent":[".section {\n background: none\n}\n\n@media screen and (max-width: 768px) {\n .description {\n text-align: center\n }\n}\n"]}
|
||||
{"version":3,"sources":["css/album.scss"],"names":[],"mappings":"AAMA,oCACE,aACE,iBACF,CAAC","file":"album.css","sourcesContent":["@charset \"utf-8\";\n\n@import \"_variables\";\n\n/** Main **/\n\n@media screen and (max-width: 768px) {\n .description {\n text-align: center\n }\n}\n"]}
|
||||
|
|
@ -1,2 +1,2 @@
|
|||
body{-webkit-animation:none;animation:none}#dashboard{-webkit-animation:fadeInOpacity .5s;animation:fadeInOpacity .5s}.section{background:none}.menu-list a{color:#209cee;border:1px solid transparent;margin-top:-1px}.menu-list a.is-active{color:#fff;background:#209cee;border-color:#209cee}.menu-list a:not(.is-active):hover{color:#209cee;background:none;border-color:#209cee}.menu-list a[disabled]{color:#7a7a7a;pointer-events:none}.menu-list a.is-loading:after{-webkit-animation:spinAround .5s linear infinite;animation:spinAround .5s linear infinite;border-radius:290486px;border-color:transparent transparent #dbdbdb #dbdbdb;border-style:solid;border-width:2px;content:"";display:block;height:1em;width:1em;right:.5em;top:calc(50% - .5em);position:absolute!important}ul#albumsContainer{border-left:0;padding-left:0}ul#albumsContainer li{border-left:2px solid #585858;padding-left:.75em}#page.fade-in,ul#albumsContainer li{-webkit-animation:fadeInOpacity .5s;animation:fadeInOpacity .5s}.pagination{margin-bottom:1.25rem}.pagination a:not([disabled]){color:#eff0f1;border-color:#eff0f1;background:none}.pagination a.pagination-link:hover,.pagination a.pagination-next:not([disabled]):hover,.pagination a.pagination-previous:not([disabled]):hover{color:#000;background-color:#eff0f1;border-color:#eff0f1}.pagination a.pagination-link.is-current{color:#000;background-color:#eff0f1}.pagination a.is-loading:hover:after,.pagination a.pagination-link.is-current.is-loading:after{border-bottom-color:#000;border-left-color:#000}li[data-action=page-ellipsis]{cursor:pointer}.label{color:#bdc3c7}.menu-list li ul{border-left-color:#898b8d}.image-container .checkbox{position:absolute;top:11px;left:11px}.image-container .controls{display:flex;position:absolute;top:11px;right:11px}.image-container .controls .button{border-radius:0}.image-container .controls .button:not(:active):not(:hover){color:#fff;background-color:rgba(0,0,0,.56078)}.no-touch .image-container .checkbox{opacity:.5}.no-touch .image-container .controls,.no-touch .image-container .details{opacity:0}.no-touch .image-container:hover .checkbox,.no-touch .image-container:hover .controls,.no-touch .image-container:hover .details{opacity:1}#page{min-width:0}.is-linethrough{text-decoration:line-through}#dashboard.is-loading #menu .menu-list a,#dashboard.is-loading [data-action]{cursor:progress}#dashboard.is-loading .column.bulk-operations [data-action],#dashboard.is-loading .column.exclusive-operations [data-action],#dashboard.is-loading .table [data-action],#dashboard.is-loading [data-action$=-help]{cursor:pointer}#statistics tr :first-child{width:50%}.expirydate{color:#bdc3c7}.table .originalname{max-width:200px;text-overflow:ellipsis;overflow:hidden}
|
||||
body{-webkit-animation:none;animation:none}#dashboard{-webkit-animation:fadeInOpacity .5s;animation:fadeInOpacity .5s}.menu-label{color:#b5b5b5}.menu-list a{color:#1f89e5;border:1px solid transparent;margin-top:-1px}.menu-list a.is-active{color:#fff;background:#1f89e5;border-color:#1f89e5}.menu-list a:not(.is-active):hover{color:#1f89e5;background:none;border-color:#1f89e5}.menu-list a[disabled]{color:#7a7a7a;pointer-events:none}.menu-list a.is-loading:after{-webkit-animation:spinAround .5s linear infinite;animation:spinAround .5s linear infinite;border-radius:290486px;border-color:transparent transparent #f5f5f5 #f5f5f5;border-style:solid;border-width:2px;content:"";display:block;height:1em;width:1em;right:.5em;top:calc(50% - .5em);position:absolute!important}.menu-list li ul{border-left:0;padding-left:0}.menu-list li ul li{border-left:2px solid #b5b5b5;padding-left:.75em}#page.fade-in,.menu-list #albumsContainer li{-webkit-animation:fadeInOpacity .5s;animation:fadeInOpacity .5s}.pagination{margin-bottom:1.25rem}.pagination-link:not([disabled]),.pagination-next:not([disabled]),.pagination-previous:not([disabled]){background-color:#000}.pagination-link:not([disabled]):hover,.pagination-next:not([disabled]):hover,.pagination-previous:not([disabled]):hover{background-color:#f5f5f5}.pagination-link[disabled],.pagination-next[disabled],.pagination-previous[disabled]{opacity:1}.pagination-link.is-current{color:#000;background-color:#f5f5f5;border-color:#f5f5f5}.pagination-link.is-current.is-loading:after{border-bottom-color:#4a4a4a;border-left-color:#4a4a4a}li[data-action=page-ellipsis]{cursor:pointer}.label{color:#ededed}#page{min-width:0}.is-linethrough{text-decoration:line-through}#dashboard.is-loading #menu .menu-list a,#dashboard.is-loading [data-action]{cursor:progress}#dashboard.is-loading .column.bulk-operations [data-action],#dashboard.is-loading .column.exclusive-operations [data-action],#dashboard.is-loading .table [data-action],#dashboard.is-loading [data-action$=-help]{cursor:pointer}#statistics tr :first-child{width:50%}.expirydate{color:#ededed}.table .originalname{max-width:200px;text-overflow:ellipsis;overflow:hidden}.image-container .checkbox{position:absolute;top:11px;left:11px}.image-container .controls{display:flex;position:absolute;top:11px;right:11px}.image-container .controls .button{border-radius:0}.image-container .controls .button:not(:active):not(:hover){color:#fff;background-color:#000}.no-touch .image-container .checkbox{opacity:.5}.no-touch .image-container .controls,.no-touch .image-container .details{opacity:0}.no-touch .image-container:hover .checkbox,.no-touch .image-container:hover .controls,.no-touch .image-container:hover .details{opacity:1}
|
||||
/*# sourceMappingURL=dashboard.css.map */
|
||||
|
|
|
|||
File diff suppressed because one or more lines are too long
|
|
@ -1,2 +1,2 @@
|
|||
#b{width:200px;height:200px;border-radius:100%;display:inline-block;margin-bottom:40px;vertical-align:top;-webkit-animation:fadeInOpacity .5s;animation:fadeInOpacity .5s}.logo{max-height:200px}.logo.is-2x{display:none}#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}.uploads{display:flex;flex-direction:column}.uploads.is-reversed{flex-direction:column-reverse}.uploads>div{-webkit-animation:fadeInOpacity .5s;animation:fadeInOpacity .5s;margin:.75rem!important}.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:#209cee}.uploads>div>.icon.icon-block{color:#da4453}.uploads .descriptive-progress{color:#bdc3c7}.uploads img{max-width:200px}.name{font-size:1rem;color:#eff0f1}.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 #585858}#tabs li a{color:#bdc3c7;border-bottom-color:#585858}#tabs.is-boxed li.is-active a{color:#209cee;background:#000;border-color:#585858 #585858 #000}#tabs.is-boxed li:not(.is-active) a:hover{background:#585858}.tab-content{margin-bottom:-.75rem;-webkit-animation:fadeInOpacity .5s;animation:fadeInOpacity .5s}#tab-config.tab-content form{margin-bottom:.75rem}#urlMaxSize{font-weight:700}input[type=file].is-fullwidth{width:100%}.render{position:fixed;right:0;bottom:0;font-size:1rem;color:#bdc3c7;cursor:pointer;-webkit-animation:floatUp 1.5s cubic-bezier(0,.71,.29,1) .5s 1 normal both;animation:floatUp 1.5s cubic-bezier(0,.71,.29,1) .5s 1 normal both}.render.button{border-bottom-left-radius:0;border-bottom-right-radius:0;right:1%;opacity:.25;transition:opacity .25s}.render.button:hover{opacity:1}#newsfeed{position:absolute;top:0;right:0;left:0;padding:1.5rem 1.5rem 0}#newsfeed .column:last-child{-webkit-animation:floatUp 1.5s cubic-bezier(0,.71,.29,1) .5s 1 normal both;animation:floatUp 1.5s cubic-bezier(0,.71,.29,1) .5s 1 normal both}#newsfeed .notification{display:block;padding:.75rem 2.25rem .75rem 1.125rem;margin-bottom:1.125rem}#newsfeed .notification>.delete{top:.75rem}#newsfeed .notification .content{font-size:.75rem}#newsfeed .news-date.is-recent-week,#newsfeed .news-title{font-weight:700}
|
||||
#b{width:200px;height:200px;border-radius:100%;display:inline-block;margin-bottom:40px;vertical-align:top;-webkit-animation:fadeInOpacity .5s;animation:fadeInOpacity .5s}.logo{max-height:200px}.logo.is-2x{display:none}#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}.uploads{display:flex;flex-direction:column}.uploads.is-reversed{flex-direction:column-reverse}.uploads>div{-webkit-animation:fadeInOpacity .5s;animation:fadeInOpacity .5s;margin:.75rem!important}.uploads>div:first-child{margin-top:1.5rem}.uploads>div>.icon:not(.icon-block){color:#1f89e5}.uploads>div>.icon.icon-block{color:#ff3860}.uploads.is-reversed>div{flex:0 0 auto}.uploads.nojs{margin-bottom:0}.uploads .descriptive-progress{color:#ededed}.uploads img{max-width:200px}.name{font-size:1rem;color:#f5f5f5}.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:#b5b5b5}.git-commit a{display:inline-block;word-break:break-all}.hero .tabs ul{border-bottom:1px solid #7a7a7a}#tabs{margin-bottom:1rem}#tabs,#tabs .tab-content{-webkit-animation:fadeInOpacity .5s;animation:fadeInOpacity .5s}#tabs .tab-content{margin-bottom:-.75rem}#tab-config.tab-content form{margin-bottom:.75rem}#urlMaxSize{font-weight:700}input[type=file].is-fullwidth{width:100%}.render{position:fixed;right:0;bottom:0;font-size:1rem;color:#ededed;cursor:pointer;-webkit-animation:floatUp 1.5s cubic-bezier(0,.71,.29,1) .5s 1 normal both;animation:floatUp 1.5s cubic-bezier(0,.71,.29,1) .5s 1 normal both}.render.button{border-bottom-left-radius:0;border-bottom-right-radius:0;right:1%;opacity:.25;transition:opacity .25s}.render.button:hover{opacity:1}#newsfeed{position:absolute;top:0;right:0;left:0;padding:1.5rem 1.5rem 0}#newsfeed .column:last-child{-webkit-animation:floatUp 1.5s cubic-bezier(0,.71,.29,1) .5s 1 normal both;animation:floatUp 1.5s cubic-bezier(0,.71,.29,1) .5s 1 normal both}#newsfeed .notification{display:block;padding:.75rem 2.25rem .75rem 1.125rem;margin-bottom:1.125rem}#newsfeed .notification>.delete{top:.75rem}#newsfeed .notification .content{font-size:.75rem}#newsfeed .news-date.is-recent-week,#newsfeed .news-title{font-weight:700}
|
||||
/*# sourceMappingURL=home.css.map */
|
||||
|
|
|
|||
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
|
|
@ -1,2 +1,2 @@
|
|||
.swal-modal{background-color:#282828}.swal-modal .field{text-align:left;text-align:initial}.swal-modal.is-expanded{width:auto;max-width:90%}.swal-text,.swal-title{color:#eff0f1}.swal-text{text-align:center}.swal-content .checkbox,.swal-content .label,.swal-content .radio{color:#eff0f1}.swal-content .checkbox:hover,.swal-content .radio:hover{color:#bdc3c7}.swal-button--confirm:not(.swal-button--danger){background-color:#209cee}.swal-button--confirm:not(.swal-button--danger):hover{background-color:#67c3ff}.swal-button--confirm:not(.swal-button--danger):focus{box-shadow:0 0 0 1px #030303,0 0 0 3px rgba(32,156,238,.29)}.swal-button--danger{background-color:#ff3860}.swal-button--danger:hover{background-color:#ff2b56}.swal-button--danger:focus{box-shadow:0 0 0 1px #030303,0 0 0 3px rgba(255,56,96,.29)}.swal-button--cancel{background-color:#00d1b2;color:#fff}.swal-button--cancel:hover{background-color:#00c4a7}.swal-button--cancel:focus{box-shadow:0 0 0 1px #030303,0 0 0 3px rgba(0,209,178,.29)}.swal-button--loading{color:transparent}.swal-icon--info{border-color:#3794d2}.swal-icon--info:after,.swal-icon--info:before{background-color:#3794d2}.swal-icon--error{border-color:#da4453}.swal-icon--error__line{background-color:#da4453}.swal-icon--warning{border-color:#f67400;-webkit-animation:pulseWarning .5s infinite alternate;animation:pulseWarning .5s infinite alternate}.swal-icon--warning__body,.swal-icon--warning__dot{background-color:#f67400;-webkit-animation:pulseWarningBody .5s infinite alternate;animation:pulseWarningBody .5s infinite alternate}@-webkit-keyframes pulseWarning{0%{border-color:#ffaa60}to{border-color:#f67400}}@keyframes pulseWarning{0%{border-color:#ffaa60}to{border-color:#f67400}}@-webkit-keyframes pulseWarningBody{0%{background-color:#ffaa60}to{background-color:#f67400}}@keyframes pulseWarningBody{0%{background-color:#ffaa60}to{background-color:#f67400}}.swal-icon--success{border-color:#27ae60}.swal-icon--success__line{background-color:#27ae60}.swal-icon--success__hide-corners{background-color:#282828}.swal-icon--success:after,.swal-icon--success:before{background:#282828}.swal-display-thumb-container{min-width:200px;min-height:200px;display:flex;align-items:center;justify-content:center}
|
||||
@-webkit-keyframes pulseWarning{0%{border-color:#ffdd57}to{border-color:#947600}}@keyframes pulseWarning{0%{border-color:#ffdd57}to{border-color:#947600}}@-webkit-keyframes pulseWarningBody{0%{background-color:#ffdd57}to{background-color:#947600}}@keyframes pulseWarningBody{0%{background-color:#ffdd57}to{background-color:#947600}}.swal-modal{background-color:#363636}.swal-modal.is-expanded{width:auto;max-width:90%}.swal-modal .field{text-align:left;text-align:initial}.swal-text,.swal-title{color:#f5f5f5}.swal-text{text-align:center}.swal-content .checkbox,.swal-content .label,.swal-content .radio{color:#f5f5f5}.swal-content .checkbox:hover,.swal-content .radio:hover{color:#ededed}.swal-button--confirm:not(.swal-button--danger){background-color:#4387f4}.swal-button--confirm:not(.swal-button--danger):hover{background-color:#0c53c6}.swal-button--confirm:not(.swal-button--danger):focus{box-shadow:0 0 0 1px #121212,0 0 0 3px #0c53c6}.swal-button--danger{background-color:#ff3860}.swal-button--danger:hover{background-color:#db002c}.swal-button--danger:focus{box-shadow:0 0 0 1px #121212,0 0 0 3px #db002c}.swal-button--cancel{background-color:#00d1b2;color:#fff}.swal-button--cancel:hover{background-color:#00947e}.swal-button--cancel:focus{box-shadow:0 0 0 1px #121212,0 0 0 3px #00947e}.swal-button--loading{color:transparent}.swal-icon--info{border-color:#4387f4}.swal-icon--info:after,.swal-icon--info:before{background-color:#4387f4}.swal-icon--error{border-color:#ff3860}.swal-icon--error__line{background-color:#ff3860}.swal-icon--warning{border-color:#ffdd57;-webkit-animation:pulseWarning .5s infinite alternate;animation:pulseWarning .5s infinite alternate}.swal-icon--warning__body,.swal-icon--warning__dot{background-color:#ffdd57;-webkit-animation:pulseWarningBody .5s infinite alternate;animation:pulseWarningBody .5s infinite alternate}.swal-icon--success{border-color:#55b978}.swal-icon--success:after,.swal-icon--success:before{background-color:#363636}.swal-icon--success__line{background-color:#55b978}.swal-icon--success__hide-corners{background-color:#363636}.swal-display-thumb-container{min-width:200px;min-height:200px;display:flex;align-items:center;justify-content:center}
|
||||
/*# sourceMappingURL=sweetalert.css.map */
|
||||
|
|
|
|||
File diff suppressed because one or more lines are too long
|
|
@ -1,2 +1,2 @@
|
|||
.image-container{flex:none;position:relative;width:224px;height:224px;margin:.75rem;padding:11px;overflow:hidden;align-items:center;border:1px solid #585858}.image-container .title{font-weight:400;word-break:break-all}.image-container .image{display:flex;height:200px;width:200px;align-items:center;justify-content:center}.image-container .image img{max-height:100%;max-width:100%;height:auto;width:auto}.image-container .details{position:absolute;left:11px;bottom:11px;right:11px;background-color:rgba(0,0,0,.56078);color:#eff0f1;padding:3px;font-size:.75rem}.image-container .details p{display:block;text-overflow:ellipsis;overflow:hidden}.image-container .details p.name{font-weight:700}
|
||||
.image-container{flex:none;position:relative;width:224px;height:224px;margin:.75rem;padding:11px;overflow:hidden;align-items:center;border:1px solid #7a7a7a}.image-container .title{font-weight:400;word-break:break-all}.image-container .image{display:flex;height:200px;width:200px;align-items:center;justify-content:center}.image-container .image img{max-height:100%;max-width:100%;height:auto;width:auto}.image-container .details{position:absolute;left:11px;bottom:11px;right:11px;background-color:rgba(0,0,0,.56078);color:#eff0f1;padding:3px;font-size:.75rem}.image-container .details p{display:block;text-overflow:ellipsis;overflow:hidden}.image-container .details p.name{font-weight:700}
|
||||
/*# sourceMappingURL=thumbs.css.map */
|
||||
|
|
|
|||
|
|
@ -1 +1 @@
|
|||
{"version":3,"sources":["css/thumbs.css"],"names":[],"mappings":"AAAA,iBACE,SAAU,CACV,iBAAkB,CAClB,WAAY,CACZ,YAAa,CACb,aAAe,CACf,YAAa,CACb,eAAgB,CAChB,kBAAmB,CACnB,wBACF,CAEA,wBACE,eAAmB,CACnB,oBACF,CAEA,wBACE,YAAa,CACb,YAAa,CACb,WAAY,CACZ,kBAAmB,CACnB,sBACF,CAEA,4BACE,eAAgB,CAChB,cAAe,CACf,WAAY,CACZ,UACF,CAEA,0BACE,iBAAkB,CAClB,SAAU,CACV,WAAY,CACZ,UAAW,CACX,mCAA2B,CAC3B,aAAc,CACd,WAAY,CACZ,gBACF,CAEA,4BACE,aAAc,CACd,sBAAuB,CACvB,eACF,CAEA,iCACE,eACF","file":"thumbs.css","sourcesContent":[".image-container {\n flex: none;\n position: relative;\n width: 224px;\n height: 224px;\n margin: 0.75rem;\n padding: 11px;\n overflow: hidden;\n align-items: center;\n border: 1px solid #585858\n}\n\n.image-container .title {\n font-weight: normal;\n word-break: break-all\n}\n\n.image-container .image {\n display: flex;\n height: 200px;\n width: 200px;\n align-items: center;\n justify-content: center\n}\n\n.image-container .image img {\n max-height: 100%;\n max-width: 100%;\n height: auto;\n width: auto\n}\n\n.image-container .details {\n position: absolute;\n left: 11px;\n bottom: 11px;\n right: 11px;\n background-color: #0000008f;\n color: #eff0f1;\n padding: 3px;\n font-size: 0.75rem\n}\n\n.image-container .details p {\n display: block;\n text-overflow: ellipsis;\n overflow: hidden\n}\n\n.image-container .details p.name {\n font-weight: bold\n}\n"]}
|
||||
{"version":3,"sources":["css/thumbs.scss","../node_modules/bulma/sass/utilities/initial-variables.sass"],"names":[],"mappings":"AAMA,iBACE,SAAU,CACV,iBAAkB,CAClB,WAAY,CACZ,YAAa,CACb,aAAe,CACf,YAAa,CACb,eAAgB,CAChB,kBAAmB,CACnB,wBCP4B,CDF9B,wBAYI,eAAmB,CACnB,oBACF,CAdF,wBAiBI,YAAa,CACb,YAAa,CACb,WAAY,CACZ,kBAAmB,CACnB,sBAAuB,CArB3B,4BAwBM,eAAgB,CAChB,cAAe,CACf,WAAY,CACZ,UACF,CA5BJ,0BAgCI,iBAAkB,CAClB,SAAU,CACV,WAAY,CACZ,UAAW,CACX,mCAA2B,CAC3B,aAAc,CACd,WAAY,CACZ,gBAAkB,CAvCtB,4BA0CM,aAAc,CACd,sBAAuB,CACvB,eAAgB,CA5CtB,iCA+CQ,eACF","file":"thumbs.css","sourcesContent":["@charset \"utf-8\";\n\n@import \"_variables\";\n\n/** Main **/\n\n.image-container {\n flex: none;\n position: relative;\n width: 224px;\n height: 224px;\n margin: 0.75rem;\n padding: 11px;\n overflow: hidden;\n align-items: center;\n border: 1px solid $grey;\n\n .title {\n font-weight: normal;\n word-break: break-all\n }\n\n .image {\n display: flex;\n height: 200px;\n width: 200px;\n align-items: center;\n justify-content: center;\n\n img {\n max-height: 100%;\n max-width: 100%;\n height: auto;\n width: auto\n }\n }\n\n .details {\n position: absolute;\n left: 11px;\n bottom: 11px;\n right: 11px;\n background-color: #0000008f;\n color: #eff0f1;\n padding: 3px;\n font-size: 0.75rem;\n\n p {\n display: block;\n text-overflow: ellipsis;\n overflow: hidden;\n\n &.name {\n font-weight: bold\n }\n }\n }\n}\n","// Colors\n\n$black: hsl(0, 0%, 4%) !default;\n$black-bis: hsl(0, 0%, 7%) !default;\n$black-ter: hsl(0, 0%, 14%) !default;\n\n$grey-darker: hsl(0, 0%, 21%) !default;\n$grey-dark: hsl(0, 0%, 29%) !default;\n$grey: hsl(0, 0%, 48%) !default;\n$grey-light: hsl(0, 0%, 71%) !default;\n$grey-lighter: hsl(0, 0%, 86%) !default;\n$grey-lightest: hsl(0, 0%, 93%) !default;\n\n$white-ter: hsl(0, 0%, 96%) !default;\n$white-bis: hsl(0, 0%, 98%) !default;\n$white: hsl(0, 0%, 100%) !default;\n\n$orange: hsl(14, 100%, 53%) !default;\n$yellow: hsl(48, 100%, 67%) !default;\n$green: hsl(141, 53%, 53%) !default;\n$turquoise: hsl(171, 100%, 41%) !default;\n$cyan: hsl(204, 71%, 53%) !default;\n$blue: hsl(217, 71%, 53%) !default;\n$purple: hsl(271, 100%, 71%) !default;\n$red: hsl(348, 86%, 61%) !default;\n\n// Typography\n\n$family-sans-serif: BlinkMacSystemFont, -apple-system, \"Segoe UI\", \"Roboto\", \"Oxygen\", \"Ubuntu\", \"Cantarell\", \"Fira Sans\", \"Droid Sans\", \"Helvetica Neue\", \"Helvetica\", \"Arial\", sans-serif !default;\n$family-monospace: monospace !default;\n$render-mode: optimizeLegibility !default;\n\n$size-1: 3rem !default;\n$size-2: 2.5rem !default;\n$size-3: 2rem !default;\n$size-4: 1.5rem !default;\n$size-5: 1.25rem !default;\n$size-6: 1rem !default;\n$size-7: 0.75rem !default;\n\n$weight-light: 300 !default;\n$weight-normal: 400 !default;\n$weight-medium: 500 !default;\n$weight-semibold: 600 !default;\n$weight-bold: 700 !default;\n\n// Spacing\n\n$block-spacing: 1.5rem !default;\n\n// Responsiveness\n\n// The container horizontal gap, which acts as the offset for breakpoints\n$gap: 32px !default;\n// 960, 1152, and 1344 have been chosen because they are divisible by both 12 and 16\n$tablet: 769px !default;\n// 960px container + 4rem\n$desktop: 960px + (2 * $gap) !default;\n// 1152px container + 4rem\n$widescreen: 1152px + (2 * $gap) !default;\n$widescreen-enabled: true !default;\n// 1344px container + 4rem\n$fullhd: 1344px + (2 * $gap) !default;\n$fullhd-enabled: true !default;\n\n// Miscellaneous\n\n$easing: ease-out !default;\n$radius-small: 2px !default;\n$radius: 4px !default;\n$radius-large: 6px !default;\n$radius-rounded: 290486px !default;\n$speed: 86ms !default;\n\n// Flags\n\n$variable-columns: true !default;\n$rtl: false !default;\n"]}
|
||||
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
46
gulpfile.js
46
gulpfile.js
|
|
@ -9,6 +9,8 @@ const nodemon = require('gulp-nodemon')
|
|||
const postcss = require('gulp-postcss')
|
||||
const postcssPresetEnv = require('postcss-preset-env')
|
||||
const replace = require('gulp-replace')
|
||||
const sass = require('gulp-sass')
|
||||
const sassCompiler = require('node-sass')
|
||||
const sourcemaps = require('gulp-sourcemaps')
|
||||
const stylelint = require('gulp-stylelint')
|
||||
const terser = require('gulp-terser')
|
||||
|
|
@ -24,19 +26,20 @@ const postcssPlugins = [
|
|||
postcssPresetEnv()
|
||||
]
|
||||
|
||||
sass.compiler = sassCompiler
|
||||
|
||||
// Minify on production
|
||||
if (process.env.NODE_ENV !== 'development')
|
||||
postcssPlugins.push(cssnano())
|
||||
|
||||
/** TASKS: LINT */
|
||||
|
||||
gulp.task('lint:js', () => {
|
||||
return gulp.src('./src/**/*.js', {
|
||||
ignore: './src/libs/**/*'
|
||||
})
|
||||
.pipe(eslint())
|
||||
.pipe(eslint.format('stylish'))
|
||||
.pipe(eslint.failAfterError())
|
||||
gulp.task('lint:sass', () => {
|
||||
return gulp.src('./src/**/*.scss')
|
||||
.pipe(stylelint({
|
||||
failAfterError: true,
|
||||
reporters: [{ formatter: 'verbose', console: true }]
|
||||
}))
|
||||
})
|
||||
|
||||
gulp.task('lint:css', () => {
|
||||
|
|
@ -49,11 +52,20 @@ gulp.task('lint:css', () => {
|
|||
}))
|
||||
})
|
||||
|
||||
gulp.task('lint:js', () => {
|
||||
return gulp.src('./src/**/*.js', {
|
||||
ignore: './src/libs/**/*'
|
||||
})
|
||||
.pipe(eslint())
|
||||
.pipe(eslint.format('stylish'))
|
||||
.pipe(eslint.failAfterError())
|
||||
})
|
||||
|
||||
// Set _settle to true, so that if one of the parallel tasks fails,
|
||||
// the other one won't exit prematurely (this is a bit awkward).
|
||||
// https://github.com/gulpjs/gulp/issues/1487#issuecomment-466621047
|
||||
gulp._settle = true
|
||||
gulp.task('lint', gulp.parallel('lint:js', 'lint:css'))
|
||||
gulp.task('lint', gulp.parallel('lint:sass', 'lint:css', 'lint:js'))
|
||||
gulp._settle = false
|
||||
|
||||
/** TASKS: CLEAN */
|
||||
|
|
@ -82,6 +94,17 @@ gulp.task('clean', gulp.parallel('clean:css', 'clean:js', 'clean:rest'))
|
|||
|
||||
/** TASKS: BUILD */
|
||||
|
||||
gulp.task('build:sass', function () {
|
||||
return gulp.src('./src/**/*.scss', {
|
||||
ignore: '_*.scss'
|
||||
})
|
||||
.pipe(sourcemaps.init())
|
||||
.pipe(sass().on('error', sass.logError))
|
||||
.pipe(postcss(postcssPlugins))
|
||||
.pipe(sourcemaps.write('.'))
|
||||
.pipe(gulp.dest(dist))
|
||||
})
|
||||
|
||||
gulp.task('build:css', () => {
|
||||
return gulp.src('./src/**/*.css', {
|
||||
ignore: './src/libs/fontello/fontello.css'
|
||||
|
|
@ -112,7 +135,7 @@ gulp.task('build:js', () => {
|
|||
.pipe(gulp.dest(dist))
|
||||
})
|
||||
|
||||
gulp.task('build', gulp.parallel('build:css', 'build:fontello', 'build:js'))
|
||||
gulp.task('build', gulp.parallel('build:sass', 'build:css', 'build:fontello', 'build:js'))
|
||||
|
||||
/** TASKS: VERSION STRINGS */
|
||||
|
||||
|
|
@ -130,8 +153,9 @@ gulp.task('default', gulp.series('lint', 'clean', 'build', 'exec:bump-versions')
|
|||
|
||||
gulp.task('watch:css', () => {
|
||||
return gulp.watch([
|
||||
'src/**/*.css'
|
||||
], gulp.series('clean:css', 'build:css', 'build:fontello'))
|
||||
'src/**/*.css',
|
||||
'src/**/*.scss'
|
||||
], gulp.series('clean:css', 'build:sass', 'build:css', 'build:fontello'))
|
||||
})
|
||||
|
||||
gulp.task('watch:js', () => {
|
||||
|
|
|
|||
|
|
@ -44,7 +44,7 @@
|
|||
"knex": "~0.21.2",
|
||||
"multer": "~1.4.2",
|
||||
"node-fetch": "~2.6.0",
|
||||
"nunjucks": "~3.2.1",
|
||||
"nunjucks": "~3.2.2",
|
||||
"randomstring": "~1.1.5",
|
||||
"readline": "~1.3.0",
|
||||
"search-query-parser": "~1.5.5",
|
||||
|
|
@ -54,6 +54,7 @@
|
|||
},
|
||||
"devDependencies": {
|
||||
"browserslist": "~4.13.0",
|
||||
"bulma": "~0.9.0",
|
||||
"cssnano": "~4.1.10",
|
||||
"del": "~5.1.0",
|
||||
"eslint": "~6.8.0",
|
||||
|
|
@ -71,9 +72,11 @@
|
|||
"gulp-nodemon": "~2.5.0",
|
||||
"gulp-postcss": "~8.0.0",
|
||||
"gulp-replace": "~1.0.0",
|
||||
"gulp-sass": "~4.1.0",
|
||||
"gulp-sourcemaps": "~2.6.5",
|
||||
"gulp-stylelint": "~13.0.0",
|
||||
"gulp-terser": "~1.2.0",
|
||||
"gulp-terser": "~1.2.1",
|
||||
"node-sass": "~4.14.1",
|
||||
"postcss-preset-env": "~6.7.0",
|
||||
"stylelint": "~13.6.1",
|
||||
"stylelint-config-standard": "~20.0.0"
|
||||
|
|
|
|||
|
|
@ -1,21 +0,0 @@
|
|||
The MIT License (MIT)
|
||||
|
||||
Copyright (c) 2019 Jeremy Thomas
|
||||
|
||||
Permission is hereby granted, free of charge, to any person obtaining a copy
|
||||
of this software and associated documentation files (the "Software"), to deal
|
||||
in the Software without restriction, including without limitation the rights
|
||||
to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
|
||||
copies of the Software, and to permit persons to whom the Software is
|
||||
furnished to do so, subject to the following conditions:
|
||||
|
||||
The above copyright notice and this permission notice shall be included in
|
||||
all copies or substantial portions of the Software.
|
||||
|
||||
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
|
||||
IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
|
||||
FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
|
||||
AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
|
||||
LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
|
||||
OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
|
||||
THE SOFTWARE.
|
||||
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
|
|
@ -0,0 +1,59 @@
|
|||
@charset "utf-8";
|
||||
|
||||
/* stylelint-disable-next-line value-keyword-case */
|
||||
$family-sans-serif: blinkmacsystemfont, -apple-system, "Segoe UI", "Ubuntu", "Roboto", "Oxygen", "Cantarell", "Fira Sans", "Droid Sans", "Helvetica Neue", "Helvetica", "Arial", sans-serif;
|
||||
|
||||
$black: hsl(0, 0%, 0%);
|
||||
$green: hsl(141, 42%, 53%);
|
||||
$cyan: hsl(217, 89%, 61%);
|
||||
$blue: hsl(208, 79%, 51%);
|
||||
$red: hsl(348, 100%, 61%);
|
||||
|
||||
/** Bulma: Variables **/
|
||||
@import "../../node_modules/bulma/sass/utilities/initial-variables.sass";
|
||||
@import "../../node_modules/bulma/sass/utilities/functions.sass";
|
||||
@import "../../node_modules/bulma/sass/utilities/derived-variables.scss";
|
||||
|
||||
$scheme-main: $black;
|
||||
$text: $white-ter;
|
||||
|
||||
$strong-color: $grey-lighter;
|
||||
|
||||
$link-hover: $link-light;
|
||||
|
||||
$hr-background-color: $grey-light;
|
||||
|
||||
$border-hover: $link;
|
||||
$input-focus-border-color: $link-light;
|
||||
|
||||
$title-color: $white-ter;
|
||||
$subtitle-color: $grey-lightest;
|
||||
$subtitle-strong-color: $grey-lightest;
|
||||
|
||||
$input-background-color: $scheme-main;
|
||||
$input-border-color: $grey;
|
||||
$input-color: $text;
|
||||
$input-placeholder-color: $grey-lightest;
|
||||
|
||||
$input-disabled-background-color: $grey-dark;
|
||||
$input-disabled-border-color: $input-border-color;
|
||||
$input-disabled-color: $input-color;
|
||||
$input-disabled-placeholder-color: $grey-lightest;
|
||||
|
||||
$pagination-background-color: $scheme-main;
|
||||
$pagination-border-color: $text;
|
||||
$pagination-color: $text;
|
||||
|
||||
$pagination-hover-background-color: $pagination-color;
|
||||
$pagination-hover-border-color: $pagination-border-color;
|
||||
$pagination-hover-color: $scheme-main;
|
||||
|
||||
$pagination-disabled-background-color: $grey-dark;
|
||||
$pagination-disabled-border-color: $grey;
|
||||
$pagination-disabled-color: hsl(0, 0%, 64%);
|
||||
|
||||
$tabs-link-color: $text;
|
||||
$tabs-link-hover-color: $tabs-link-color;
|
||||
$tabs-boxed-link-active-border-color: $grey;
|
||||
$tabs-boxed-link-hover-background-color: $grey-darker;
|
||||
$tabs-boxed-link-hover-border-bottom-color: $tabs-boxed-link-active-border-color
|
||||
|
|
@ -1,6 +1,8 @@
|
|||
.section {
|
||||
background: none
|
||||
}
|
||||
@charset "utf-8";
|
||||
|
||||
@import "_variables";
|
||||
|
||||
/** Main **/
|
||||
|
||||
@media screen and (max-width: 768px) {
|
||||
.description {
|
||||
|
|
@ -1,177 +0,0 @@
|
|||
body {
|
||||
animation: none
|
||||
}
|
||||
|
||||
#dashboard {
|
||||
animation: fadeInOpacity 0.5s
|
||||
}
|
||||
|
||||
.section {
|
||||
background: none
|
||||
}
|
||||
|
||||
.menu-list a {
|
||||
color: #209cee;
|
||||
border: 1px solid transparent;
|
||||
margin-top: -1px
|
||||
}
|
||||
|
||||
.menu-list a.is-active {
|
||||
color: #fff;
|
||||
background: #209cee;
|
||||
border-color: #209cee
|
||||
}
|
||||
|
||||
.menu-list a:not(.is-active):hover {
|
||||
color: #209cee;
|
||||
background: none;
|
||||
border-color: #209cee
|
||||
}
|
||||
|
||||
.menu-list a[disabled] {
|
||||
color: #7a7a7a;
|
||||
pointer-events: none
|
||||
}
|
||||
|
||||
.menu-list a.is-loading::after {
|
||||
animation: spinAround 0.5s infinite linear;
|
||||
border: 2px solid #dbdbdb;
|
||||
border-radius: 290486px;
|
||||
border-right-color: transparent;
|
||||
border-top-color: transparent;
|
||||
content: "";
|
||||
display: block;
|
||||
height: 1em;
|
||||
width: 1em;
|
||||
right: calc(0% + (1em / 2));
|
||||
top: calc(50% - (1em / 2));
|
||||
position: absolute !important
|
||||
}
|
||||
|
||||
ul#albumsContainer {
|
||||
border-left: 0;
|
||||
padding-left: 0
|
||||
}
|
||||
|
||||
ul#albumsContainer li {
|
||||
border-left: 2px solid #585858;
|
||||
padding-left: 0.75em;
|
||||
animation: fadeInOpacity 0.5s
|
||||
}
|
||||
|
||||
#page.fade-in {
|
||||
animation: fadeInOpacity 0.5s
|
||||
}
|
||||
|
||||
.pagination {
|
||||
margin-bottom: 1.25rem
|
||||
}
|
||||
|
||||
.pagination a:not([disabled]) {
|
||||
color: #eff0f1;
|
||||
border-color: #eff0f1;
|
||||
background: none
|
||||
}
|
||||
|
||||
.pagination a.pagination-link:hover,
|
||||
.pagination a.pagination-next:not([disabled]):hover,
|
||||
.pagination a.pagination-previous:not([disabled]):hover {
|
||||
color: #000;
|
||||
background-color: #eff0f1;
|
||||
border-color: #eff0f1
|
||||
}
|
||||
|
||||
.pagination a.pagination-link.is-current {
|
||||
color: #000;
|
||||
background-color: #eff0f1
|
||||
}
|
||||
|
||||
.pagination a.is-loading:hover::after,
|
||||
.pagination a.pagination-link.is-current.is-loading::after {
|
||||
border-bottom-color: #000;
|
||||
border-left-color: #000
|
||||
}
|
||||
|
||||
li[data-action="page-ellipsis"] {
|
||||
cursor: pointer
|
||||
}
|
||||
|
||||
.label {
|
||||
color: #bdc3c7
|
||||
}
|
||||
|
||||
.menu-list li ul {
|
||||
border-left-color: #898b8d
|
||||
}
|
||||
|
||||
.image-container .checkbox {
|
||||
position: absolute;
|
||||
top: 11px;
|
||||
left: 11px
|
||||
}
|
||||
|
||||
.image-container .controls {
|
||||
display: flex;
|
||||
position: absolute;
|
||||
top: 11px;
|
||||
right: 11px
|
||||
}
|
||||
|
||||
.image-container .controls .button {
|
||||
border-radius: 0
|
||||
}
|
||||
|
||||
.image-container .controls .button:not(:active):not(:hover) {
|
||||
color: #fff;
|
||||
background-color: #0000008f
|
||||
}
|
||||
|
||||
.no-touch .image-container .checkbox {
|
||||
opacity: 0.5
|
||||
}
|
||||
|
||||
.no-touch .image-container .controls,
|
||||
.no-touch .image-container .details {
|
||||
opacity: 0
|
||||
}
|
||||
|
||||
.no-touch .image-container:hover .checkbox,
|
||||
.no-touch .image-container:hover .controls,
|
||||
.no-touch .image-container:hover .details {
|
||||
opacity: 1
|
||||
}
|
||||
|
||||
#page {
|
||||
/* fix overflow issue with flex */
|
||||
min-width: 0
|
||||
}
|
||||
|
||||
.is-linethrough {
|
||||
text-decoration: line-through
|
||||
}
|
||||
|
||||
#dashboard.is-loading *[data-action],
|
||||
#dashboard.is-loading #menu .menu-list a {
|
||||
cursor: progress
|
||||
}
|
||||
|
||||
#dashboard.is-loading *[data-action$="-help"],
|
||||
#dashboard.is-loading .table *[data-action],
|
||||
#dashboard.is-loading .column.bulk-operations *[data-action],
|
||||
#dashboard.is-loading .column.exclusive-operations *[data-action] {
|
||||
cursor: pointer
|
||||
}
|
||||
|
||||
#statistics tr *:nth-child(1) {
|
||||
width: 50%
|
||||
}
|
||||
|
||||
.expirydate {
|
||||
color: #bdc3c7
|
||||
}
|
||||
|
||||
.table .originalname {
|
||||
max-width: 200px;
|
||||
text-overflow: ellipsis;
|
||||
overflow: hidden
|
||||
}
|
||||
|
|
@ -0,0 +1,196 @@
|
|||
@charset "utf-8";
|
||||
|
||||
@import "_variables";
|
||||
|
||||
/** Main **/
|
||||
|
||||
body {
|
||||
animation: none
|
||||
}
|
||||
|
||||
#dashboard {
|
||||
animation: fadeInOpacity 0.5s
|
||||
}
|
||||
|
||||
.menu-label {
|
||||
color: $grey-light
|
||||
}
|
||||
|
||||
.menu-list {
|
||||
a {
|
||||
color: $link;
|
||||
border: 1px solid transparent;
|
||||
margin-top: -1px;
|
||||
|
||||
&.is-active {
|
||||
color: $white;
|
||||
background: $link;
|
||||
border-color: $link
|
||||
}
|
||||
|
||||
&:not(.is-active):hover {
|
||||
color: $link;
|
||||
background: none;
|
||||
border-color: $link
|
||||
}
|
||||
|
||||
&[disabled] {
|
||||
color: $grey;
|
||||
pointer-events: none
|
||||
}
|
||||
|
||||
&.is-loading::after {
|
||||
animation: spinAround 0.5s infinite linear;
|
||||
border: 2px solid $white-ter;
|
||||
border-radius: 290486px;
|
||||
border-right-color: transparent;
|
||||
border-top-color: transparent;
|
||||
content: "";
|
||||
display: block;
|
||||
height: 1em;
|
||||
width: 1em;
|
||||
right: calc(0% + (1em / 2));
|
||||
top: calc(50% - (1em / 2));
|
||||
position: absolute !important
|
||||
}
|
||||
}
|
||||
|
||||
li ul {
|
||||
border-left: 0;
|
||||
padding-left: 0;
|
||||
|
||||
li {
|
||||
border-left: 2px solid $grey-light;
|
||||
padding-left: 0.75em
|
||||
}
|
||||
}
|
||||
|
||||
#albumsContainer li {
|
||||
animation: fadeInOpacity 0.5s
|
||||
}
|
||||
}
|
||||
|
||||
#page.fade-in {
|
||||
animation: fadeInOpacity 0.5s
|
||||
}
|
||||
|
||||
.pagination {
|
||||
margin-bottom: 1.25rem
|
||||
}
|
||||
|
||||
.pagination-previous,
|
||||
.pagination-next,
|
||||
.pagination-link {
|
||||
&:not([disabled]) {
|
||||
background-color: $pagination-background-color;
|
||||
|
||||
&:hover {
|
||||
background-color: $pagination-hover-background-color
|
||||
}
|
||||
}
|
||||
|
||||
&[disabled] {
|
||||
opacity: 1
|
||||
}
|
||||
}
|
||||
|
||||
.pagination-link.is-current {
|
||||
color: $pagination-background-color;
|
||||
background-color: $pagination-color;
|
||||
border-color: $pagination-border-color;
|
||||
|
||||
&.is-loading::after {
|
||||
border-bottom-color: $grey-dark;
|
||||
border-left-color: $grey-dark
|
||||
}
|
||||
}
|
||||
|
||||
li[data-action="page-ellipsis"] {
|
||||
cursor: pointer
|
||||
}
|
||||
|
||||
.label {
|
||||
color: $grey-lightest
|
||||
}
|
||||
|
||||
#page {
|
||||
/* fix overflow issue with flex */
|
||||
min-width: 0
|
||||
}
|
||||
|
||||
.is-linethrough {
|
||||
text-decoration: line-through
|
||||
}
|
||||
|
||||
#dashboard.is-loading {
|
||||
*[data-action],
|
||||
#menu .menu-list a {
|
||||
cursor: progress
|
||||
}
|
||||
|
||||
*[data-action$="-help"],
|
||||
.table *[data-action],
|
||||
.column.bulk-operations *[data-action],
|
||||
.column.exclusive-operations *[data-action] {
|
||||
cursor: pointer
|
||||
}
|
||||
}
|
||||
|
||||
#statistics tr *:nth-child(1) {
|
||||
width: 50%
|
||||
}
|
||||
|
||||
.expirydate {
|
||||
color: $grey-lightest
|
||||
}
|
||||
|
||||
.table .originalname {
|
||||
max-width: 200px;
|
||||
text-overflow: ellipsis;
|
||||
overflow: hidden
|
||||
}
|
||||
|
||||
/** Thumbs extension **/
|
||||
|
||||
.image-container {
|
||||
.checkbox {
|
||||
position: absolute;
|
||||
top: 11px;
|
||||
left: 11px
|
||||
}
|
||||
|
||||
.controls {
|
||||
display: flex;
|
||||
position: absolute;
|
||||
top: 11px;
|
||||
right: 11px;
|
||||
|
||||
.button {
|
||||
border-radius: 0;
|
||||
|
||||
&:not(:active):not(:hover) {
|
||||
color: $white;
|
||||
background-color: rgba(0, 0, 0, 143)
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.no-touch .image-container {
|
||||
.checkbox {
|
||||
opacity: 0.5
|
||||
}
|
||||
|
||||
.controls,
|
||||
.details {
|
||||
opacity: 0
|
||||
}
|
||||
|
||||
&:hover {
|
||||
.checkbox,
|
||||
.controls,
|
||||
.details {
|
||||
opacity: 1
|
||||
}
|
||||
}
|
||||
}
|
||||
232
src/css/home.css
232
src/css/home.css
|
|
@ -1,232 +0,0 @@
|
|||
#b {
|
||||
width: 200px;
|
||||
height: 200px;
|
||||
border-radius: 100%;
|
||||
display: inline-block;
|
||||
margin-bottom: 40px;
|
||||
vertical-align: top;
|
||||
animation: fadeInOpacity 0.5s
|
||||
}
|
||||
|
||||
.logo {
|
||||
max-height: 200px
|
||||
}
|
||||
|
||||
.logo.is-2x {
|
||||
display: none
|
||||
}
|
||||
|
||||
#dropzone * {
|
||||
pointer-events: none
|
||||
}
|
||||
|
||||
#tokenContainer,
|
||||
#panel {
|
||||
display: none
|
||||
}
|
||||
|
||||
#maxSize {
|
||||
font-size: 1rem
|
||||
}
|
||||
|
||||
.dz-preview .dz-details {
|
||||
display: flex
|
||||
}
|
||||
|
||||
.dz-preview .dz-details .dz-size,
|
||||
.dz-preview .dz-details .dz-filename {
|
||||
flex: 1
|
||||
}
|
||||
|
||||
.dz-preview img,
|
||||
.dz-preview .dz-success-mark,
|
||||
.dz-preview .dz-error-mark {
|
||||
display: none
|
||||
}
|
||||
|
||||
.uploads {
|
||||
display: flex;
|
||||
flex-direction: column
|
||||
}
|
||||
|
||||
.uploads.is-reversed {
|
||||
flex-direction: column-reverse
|
||||
}
|
||||
|
||||
.uploads > div {
|
||||
animation: fadeInOpacity 0.5s;
|
||||
margin: 0.75rem !important
|
||||
}
|
||||
|
||||
.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: #209cee
|
||||
}
|
||||
|
||||
.uploads > div > .icon.icon-block {
|
||||
color: #da4453
|
||||
}
|
||||
|
||||
.uploads .descriptive-progress {
|
||||
color: #bdc3c7
|
||||
}
|
||||
|
||||
.uploads img {
|
||||
max-width: 200px
|
||||
}
|
||||
|
||||
.name {
|
||||
font-size: 1rem;
|
||||
color: #eff0f1;
|
||||
word-break: break-all
|
||||
}
|
||||
|
||||
.link > a {
|
||||
word-break: break-all
|
||||
}
|
||||
|
||||
.clipboard-mobile {
|
||||
margin-top: 5px
|
||||
}
|
||||
|
||||
#albumDiv {
|
||||
animation: fadeInOpacity 0.5s
|
||||
}
|
||||
|
||||
#albumDiv .control {
|
||||
text-align: inherit
|
||||
}
|
||||
|
||||
#linksColumn {
|
||||
margin-top: -0.25rem;
|
||||
margin-left: -0.25rem;
|
||||
margin-right: -0.25rem;
|
||||
animation: fadeInOpacity 0.5s
|
||||
}
|
||||
|
||||
#linksColumn .column {
|
||||
padding: 0.25rem
|
||||
}
|
||||
|
||||
#linksColumn > span {
|
||||
padding: 0 0.3rem;
|
||||
color: #7f8c8d
|
||||
}
|
||||
|
||||
.git-commit a {
|
||||
display: inline-block;
|
||||
word-break: break-all
|
||||
}
|
||||
|
||||
#tabs {
|
||||
margin-bottom: 1rem;
|
||||
animation: fadeInOpacity 0.5s
|
||||
}
|
||||
|
||||
#tabs ul {
|
||||
border-bottom: 1px solid #585858
|
||||
}
|
||||
|
||||
#tabs li a {
|
||||
color: #bdc3c7;
|
||||
border-bottom-color: #585858
|
||||
}
|
||||
|
||||
#tabs.is-boxed li.is-active a {
|
||||
color: #209cee;
|
||||
background: #000;
|
||||
border-color: #585858;
|
||||
border-bottom-color: #000
|
||||
}
|
||||
|
||||
#tabs.is-boxed li:not(.is-active) a:hover {
|
||||
background: #585858
|
||||
}
|
||||
|
||||
.tab-content {
|
||||
margin-bottom: -0.75rem;
|
||||
animation: fadeInOpacity 0.5s
|
||||
}
|
||||
|
||||
#tab-config.tab-content form {
|
||||
margin-bottom: 0.75rem
|
||||
}
|
||||
|
||||
#urlMaxSize {
|
||||
font-weight: bold
|
||||
}
|
||||
|
||||
input[type="file"].is-fullwidth {
|
||||
width: 100%
|
||||
}
|
||||
|
||||
/** Render **/
|
||||
|
||||
.render {
|
||||
position: fixed;
|
||||
right: 0;
|
||||
bottom: 0;
|
||||
font-size: 1rem;
|
||||
color: #bdc3c7;
|
||||
cursor: pointer;
|
||||
animation: floatUp 1.5s cubic-bezier(0, 0.71, 0.29, 1) 0.5s 1 normal both
|
||||
}
|
||||
|
||||
.render.button {
|
||||
border-bottom-left-radius: 0;
|
||||
border-bottom-right-radius: 0;
|
||||
right: 1%;
|
||||
opacity: 0.25;
|
||||
transition: opacity 0.25s
|
||||
}
|
||||
|
||||
.render.button:hover {
|
||||
opacity: 1
|
||||
}
|
||||
|
||||
/** Newsfeed **/
|
||||
|
||||
#newsfeed {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
right: 0;
|
||||
left: 0;
|
||||
padding: 1.5rem 1.5rem 0 1.5rem
|
||||
}
|
||||
|
||||
#newsfeed .column:last-child {
|
||||
animation: floatUp 1.5s cubic-bezier(0, 0.71, 0.29, 1) 0.5s 1 normal both
|
||||
}
|
||||
|
||||
#newsfeed .notification {
|
||||
display: block;
|
||||
padding: 0.75rem 2.25rem 0.75rem 1.125rem;
|
||||
margin-bottom: 1.125rem
|
||||
}
|
||||
|
||||
#newsfeed .notification > .delete {
|
||||
top: 0.75rem
|
||||
}
|
||||
|
||||
#newsfeed .notification .content {
|
||||
font-size: 0.75rem
|
||||
}
|
||||
|
||||
#newsfeed .news-title {
|
||||
font-weight: bold
|
||||
}
|
||||
|
||||
#newsfeed .news-date.is-recent-week {
|
||||
font-weight: bold
|
||||
}
|
||||
|
|
@ -0,0 +1,224 @@
|
|||
@charset "utf-8";
|
||||
|
||||
@import "_variables";
|
||||
|
||||
/** Main **/
|
||||
|
||||
#b {
|
||||
width: 200px;
|
||||
height: 200px;
|
||||
border-radius: 100%;
|
||||
display: inline-block;
|
||||
margin-bottom: 40px;
|
||||
vertical-align: top;
|
||||
animation: fadeInOpacity 0.5s
|
||||
}
|
||||
|
||||
.logo {
|
||||
max-height: 200px;
|
||||
|
||||
&.is-2x {
|
||||
display: none
|
||||
}
|
||||
}
|
||||
|
||||
#dropzone * {
|
||||
pointer-events: none
|
||||
}
|
||||
|
||||
#tokenContainer,
|
||||
#panel {
|
||||
display: none
|
||||
}
|
||||
|
||||
#maxSize {
|
||||
font-size: 1rem
|
||||
}
|
||||
|
||||
.dz-preview {
|
||||
.dz-details {
|
||||
display: flex;
|
||||
|
||||
.dz-size,
|
||||
.dz-filename {
|
||||
flex: 1
|
||||
}
|
||||
}
|
||||
|
||||
img,
|
||||
.dz-success-mark,
|
||||
.dz-error-mark {
|
||||
display: none
|
||||
}
|
||||
}
|
||||
|
||||
.uploads {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
|
||||
&.is-reversed {
|
||||
flex-direction: column-reverse
|
||||
}
|
||||
|
||||
> div {
|
||||
animation: fadeInOpacity 0.5s;
|
||||
margin: 0.75rem !important;
|
||||
|
||||
&:first-child {
|
||||
margin-top: 1.5rem
|
||||
}
|
||||
|
||||
> .icon:not(.icon-block) {
|
||||
color: $blue
|
||||
}
|
||||
|
||||
> .icon.icon-block {
|
||||
color: $danger
|
||||
}
|
||||
}
|
||||
|
||||
&.is-reversed > div {
|
||||
flex: 0 0 auto
|
||||
}
|
||||
|
||||
&.nojs {
|
||||
margin-bottom: 0
|
||||
}
|
||||
|
||||
.descriptive-progress {
|
||||
color: $grey-lightest
|
||||
}
|
||||
|
||||
img {
|
||||
max-width: 200px
|
||||
}
|
||||
}
|
||||
|
||||
.name {
|
||||
font-size: 1rem;
|
||||
color: $white-ter;
|
||||
word-break: break-all
|
||||
}
|
||||
|
||||
.link > a {
|
||||
word-break: break-all
|
||||
}
|
||||
|
||||
.clipboard-mobile {
|
||||
margin-top: 5px
|
||||
}
|
||||
|
||||
#albumDiv {
|
||||
animation: fadeInOpacity 0.5s;
|
||||
|
||||
.control {
|
||||
text-align: inherit
|
||||
}
|
||||
}
|
||||
|
||||
#linksColumn {
|
||||
margin-top: -0.25rem;
|
||||
margin-left: -0.25rem;
|
||||
margin-right: -0.25rem;
|
||||
animation: fadeInOpacity 0.5s;
|
||||
|
||||
.column {
|
||||
padding: 0.25rem
|
||||
}
|
||||
|
||||
> span {
|
||||
padding: 0 0.3rem;
|
||||
color: $grey-light
|
||||
}
|
||||
}
|
||||
|
||||
.git-commit a {
|
||||
display: inline-block;
|
||||
word-break: break-all
|
||||
}
|
||||
|
||||
.hero .tabs ul {
|
||||
border-bottom: 1px solid $tabs-boxed-link-active-border-color
|
||||
}
|
||||
|
||||
#tabs {
|
||||
margin-bottom: 1rem;
|
||||
animation: fadeInOpacity 0.5s;
|
||||
|
||||
.tab-content {
|
||||
margin-bottom: -0.75rem;
|
||||
animation: fadeInOpacity 0.5s
|
||||
}
|
||||
}
|
||||
|
||||
#tab-config.tab-content form {
|
||||
margin-bottom: 0.75rem
|
||||
}
|
||||
|
||||
#urlMaxSize {
|
||||
font-weight: bold
|
||||
}
|
||||
|
||||
input[type="file"].is-fullwidth {
|
||||
width: 100%
|
||||
}
|
||||
|
||||
/** Render **/
|
||||
|
||||
.render {
|
||||
position: fixed;
|
||||
right: 0;
|
||||
bottom: 0;
|
||||
font-size: 1rem;
|
||||
color: $grey-lightest;
|
||||
cursor: pointer;
|
||||
animation: floatUp 1.5s cubic-bezier(0, 0.71, 0.29, 1) 0.5s 1 normal both;
|
||||
|
||||
&.button {
|
||||
border-bottom-left-radius: 0;
|
||||
border-bottom-right-radius: 0;
|
||||
right: 1%;
|
||||
opacity: 0.25;
|
||||
transition: opacity 0.25s;
|
||||
|
||||
&:hover {
|
||||
opacity: 1
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
/** Newsfeed **/
|
||||
|
||||
#newsfeed {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
right: 0;
|
||||
left: 0;
|
||||
padding: 1.5rem 1.5rem 0 1.5rem;
|
||||
|
||||
.column:last-child {
|
||||
animation: floatUp 1.5s cubic-bezier(0, 0.71, 0.29, 1) 0.5s 1 normal both
|
||||
}
|
||||
|
||||
.notification {
|
||||
display: block;
|
||||
padding: 0.75rem 2.25rem 0.75rem 1.125rem;
|
||||
margin-bottom: 1.125rem;
|
||||
|
||||
> .delete {
|
||||
top: 0.75rem
|
||||
}
|
||||
|
||||
.content {
|
||||
font-size: 0.75rem
|
||||
}
|
||||
}
|
||||
|
||||
.news-title {
|
||||
font-weight: bold
|
||||
}
|
||||
|
||||
.news-date.is-recent-week {
|
||||
font-weight: bold
|
||||
}
|
||||
}
|
||||
|
|
@ -1,348 +0,0 @@
|
|||
/** Animations **/
|
||||
|
||||
@-webkit-keyframes fadeInOpacity {
|
||||
0% {
|
||||
opacity: 0
|
||||
}
|
||||
|
||||
100% {
|
||||
opacity: 1
|
||||
}
|
||||
}
|
||||
|
||||
@keyframes fadeInOpacity {
|
||||
0% {
|
||||
opacity: 0
|
||||
}
|
||||
|
||||
100% {
|
||||
opacity: 1
|
||||
}
|
||||
}
|
||||
|
||||
@-webkit-keyframes floatUp {
|
||||
0% {
|
||||
opacity: 0;
|
||||
transform: scale(0.86)
|
||||
}
|
||||
|
||||
25% {
|
||||
opacity: 100
|
||||
}
|
||||
|
||||
67% {
|
||||
transform: scale(1)
|
||||
}
|
||||
|
||||
100% {
|
||||
transform: scale(1)
|
||||
}
|
||||
}
|
||||
|
||||
@keyframes floatUp {
|
||||
0% {
|
||||
opacity: 0;
|
||||
transform: scale(0.86)
|
||||
}
|
||||
|
||||
25% {
|
||||
opacity: 100
|
||||
}
|
||||
|
||||
67% {
|
||||
transform: scale(1)
|
||||
}
|
||||
|
||||
100% {
|
||||
transform: scale(1)
|
||||
}
|
||||
}
|
||||
|
||||
/** General **/
|
||||
|
||||
html {
|
||||
background-color: #000;
|
||||
overflow-y: auto
|
||||
}
|
||||
|
||||
body {
|
||||
color: #eff0f1;
|
||||
animation: fadeInOpacity 0.5s
|
||||
}
|
||||
|
||||
a {
|
||||
color: #209cee
|
||||
}
|
||||
|
||||
a:hover {
|
||||
color: #67c3ff
|
||||
}
|
||||
|
||||
hr {
|
||||
background-color: #585858
|
||||
}
|
||||
|
||||
code,
|
||||
.message-body code {
|
||||
background-color: #000;
|
||||
border-radius: 5px;
|
||||
font-size: 1rem
|
||||
}
|
||||
|
||||
.subtitle {
|
||||
color: #bdc3c7
|
||||
}
|
||||
|
||||
.subtitle strong {
|
||||
color: #bdc3c7
|
||||
}
|
||||
|
||||
.title,
|
||||
.subtitle.is-brighter,
|
||||
.subtitle.is-brighter strong {
|
||||
color: #eff0f1
|
||||
}
|
||||
|
||||
.input,
|
||||
.select select,
|
||||
.textarea {
|
||||
color: #eff0f1;
|
||||
border-color: #585858;
|
||||
background-color: #000
|
||||
}
|
||||
|
||||
.input::-moz-placeholder,
|
||||
.textarea::-moz-placeholder {
|
||||
color: #bdc3c7
|
||||
}
|
||||
|
||||
.input::-webkit-input-placeholder,
|
||||
.textarea::-webkit-input-placeholder {
|
||||
color: #bdc3c7
|
||||
}
|
||||
|
||||
.input:-moz-placeholder,
|
||||
.textarea:-moz-placeholder {
|
||||
color: #bdc3c7
|
||||
}
|
||||
|
||||
.input:-ms-input-placeholder,
|
||||
.textarea:-ms-input-placeholder {
|
||||
color: #bdc3c7
|
||||
}
|
||||
|
||||
.input:not([disabled]):hover,
|
||||
.select fieldset:not([disabled]) select:hover,
|
||||
.select select:not([disabled]):hover,
|
||||
.textarea:not([disabled]):hover,
|
||||
fieldset:not([disabled]) .input:hover,
|
||||
fieldset:not([disabled]) .select select:hover,
|
||||
fieldset:not([disabled]) .textarea:hover {
|
||||
border-color: #209cee
|
||||
}
|
||||
|
||||
.input.is-active,
|
||||
.input.is-focused,
|
||||
.input:active,
|
||||
.input:focus,
|
||||
.textarea.is-active,
|
||||
.textarea.is-focused,
|
||||
.textarea:active,
|
||||
.textarea:focus {
|
||||
border-color: #209cee
|
||||
}
|
||||
|
||||
.input[disabled],
|
||||
.select fieldset[disabled] select,
|
||||
.select select[disabled],
|
||||
.textarea[disabled],
|
||||
fieldset[disabled] .input,
|
||||
fieldset[disabled] .select select,
|
||||
fieldset[disabled] .textarea {
|
||||
border-color: #585858;
|
||||
background-color: #2f2f2f
|
||||
}
|
||||
|
||||
.label {
|
||||
color: #eff0f1;
|
||||
font-weight: normal
|
||||
}
|
||||
|
||||
.help {
|
||||
color: #bdc3c7
|
||||
}
|
||||
|
||||
.progress {
|
||||
background-color: #585858
|
||||
}
|
||||
|
||||
.button.is-info.is-hovered [class^="icon-"]::before,
|
||||
.button.is-info.is-hovered [class*=" icon-"]::before,
|
||||
.button.is-info:hover [class^="icon-"]::before,
|
||||
.button.is-info:hover [class*=" icon-"]::before {
|
||||
fill: #fff
|
||||
}
|
||||
|
||||
.button.is-dangerish {
|
||||
background-color: #ff7043;
|
||||
border-color: transparent;
|
||||
color: rgba(0, 0, 0, 0.7)
|
||||
}
|
||||
|
||||
.button.is-dangerish.is-hovered,
|
||||
.button.is-dangerish:not([disabled]):hover {
|
||||
background-color: #ff8a65;
|
||||
border-color: transparent;
|
||||
color: rgba(0, 0, 0, 0.7)
|
||||
}
|
||||
|
||||
.button.is-dangerish.is-active,
|
||||
.button.is-dangerish:not([disabled]):active {
|
||||
background-color: #ff5722;
|
||||
border-color: transparent;
|
||||
color: rgba(0, 0, 0, 0.7)
|
||||
}
|
||||
|
||||
.button.is-dangerish.is-outlined {
|
||||
background-color: transparent;
|
||||
border-color: #ff7043;
|
||||
color: #ff7043
|
||||
}
|
||||
|
||||