/** * @copyright 2014 by Tobias Reich */ #upload { display: none; } .upload_overlay { position: fixed; width: 100%; height: 100%; top: 0; left: 0; background-color: rgba(0, 0, 0, .85); z-index: 1000; } .upload_message { position: absolute; display: inline-block; width: 450px; margin-left: -225px; margin-top: -170px; background-image: linear-gradient(to bottom, rgb(75, 75, 75), rgb(45, 45, 45)); border-radius: 5px; box-shadow: 0 0 5px #000, inset 0 1px 0 rgba(255, 255, 255, .08); animation-name: moveUp; animation-duration: .3s; animation-timing-function: cubic-bezier(0.51,.92,.24,1.15); /* Header ------------------------------------------------*/ h1 { float: left; width: 100%; padding: 12px 0; color: #fff; font-size: 16px; font-weight: bold; text-shadow: 0px -1px 0px rgba(0, 0, 0, .3); text-align: center; } .close { display: none; position: absolute; top: 0; right: 0; padding: 11px 14px 6px 7px; color: #aaa; font-size: 20px; text-shadow: 0px -1px 0px rgba(0, 0, 0, .3); cursor: pointer; &:hover { color: #fff; } } /* Rows ------------------------------------------------*/ .rows { float: left; margin: 3px 8px 8px 8px; width: calc(100% - 16px); height: 300px; background-color: rgba(0, 0, 0, .5); overflow: hidden; overflow-y: scroll; border-radius: 3px; box-shadow: inset 0 0 3px rgba(0, 0, 0, .8); } /* Row ------------------------------------------------*/ .rows .row { float: left; display: inline-block; padding: 8px 0; width: 100%; background-color: rgba(255, 255, 255, .02); &:nth-child(2n) { background-color: rgba(255, 255, 255, 0); } a.name { float: left; padding: 5px 10px; width: calc(70% - 20px); color: #fff; font-size: 14px; white-space: nowrap; overflow: hidden; } a.status { float: left; padding: 5px 10px; width: calc(30% - 20px); color: rgba(255, 255, 255, .5); font-size: 14px; text-align: right; animation-name: pulse; animation-duration: 2s; animation-timing-function: ease-in-out; animation-iteration-count: infinite; &.error, &.success { animation: none; } &.error { color: rgb(213, 24, 24); } &.success { color: rgb(42, 213, 0); } } p.notice { display: none; float: left; padding: 2px 10px 5px; width: calc(100% - 20px); color: rgba(255, 255, 255, .5); font-size: 12px; overflow: hidden; line-height: 16px; } } }