vesta/web/css/file_manager.css
2015-11-06 23:41:32 +02:00

731 lines
30 KiB
CSS
Raw Permalink Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

body { margin: 0; padding: 0; }
.hidden { display: none; }
.l-logo {
background-color: #7B7B7B;
background-image: url("/images/sprite.png?1446554103");
background-position: -117px -57px;
background-repeat: no-repeat;
border: 9px solid #7B7B7B;
display: inline-block;
float: left;
height: 22px;
margin-left: 0;
margin-top: 0;
width: 59px;
}
#main{ display: inline-block; font-family: Arial; font-size: 15px; color: #777; width: 100%; }
.window { display: inline-block; float: left; /*border: 1px solid #eee;*/ width: 50%; height: 100%; background-color: #ececec; /*background: url(/images/background-dots.png) #ececec;*/ }
.window.active { background: #fff; }
.window.active .l-logo { background-color: #333; border-color: #333; }
.pwd { background-color: #7b7b7b; height: 28px; padding: 12px 0 0 17px; color: #eee; font-size: 14px; overflow: hidden; }
.window.active .pwd { background-color: #333; box-shadow: -2px 0 5px -3px rgba(0, 0, 0, 0.7); }
.window.active .pwd a { color: #FFF; }
.pwd a { color: #CFCFCF; cursor: pointer; text-decoration: none; }
.window.active .pwd a:hover, .pwd a:hover { color: #FFCC00; }
.active .menu { box-shadow: 0 1px 11px -5px rgba(0, 0, 0, 0.5); }
.menu { /*background-color: #EEE;*/ display: inline-block; color: #999999; width: 100%; padding: 8px 0 7px 0; border-bottom: 1px solid #CFCFCD; border-left: 1px solid #CFCFCD; margin-left: -1px; }
.menu div { display: inline-block; float: left; padding: 6px 5px 5px; font-size: 11px; margin: 0 3px; line-height: 14px; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; }
.window.active .menu div.button { color: #777; }
.menu div.button.small { display: none; width: 19px; height: 12px; }
.menu div.button.small.mkfile { background: url("/images/flat_icons.png") no-repeat scroll -176px -97px; margin-left: 10px; }
.menu div.button.small.mkdir { background: url("/images/flat_icons.png") no-repeat scroll -176px -123px; }
.menu div.button.small.del { background: url("/images/flat_icons.png") no-repeat scroll -176px -149px; }
.menu div.button.small.rename { background: url("/images/flat_icons.png") no-repeat scroll -180px -180px; width: 12px; }
.menu div.button.small.copy { background: url("/images/flat_icons.png") no-repeat scroll -177px -210px; }
.menu div.button.small.download { background: url("/images/flat_icons.png") no-repeat scroll -176px -243px; }
.menu div.button.small.extract { background: url("/images/flat_icons.png") no-repeat scroll -232px -35px; }
.menu div.button.small.archive { background: url("/images/flat_icons.png") no-repeat scroll -175px -58px; }
.menu div.button.small.mkfile:hover { background-position: -203px -97px; }
.menu div.button.small.mkdir:hover { background-position: -203px -123px; }
.menu div.button.small.del:hover { background-position: -203px -149px; }
.menu div.button.small.rename:hover { background-position: -207px -180px; }
.menu div.button.small.copy:hover { background-position: -204px -210px; }
.menu div.button.small.download:hover { background-position: -204px -243px; }
.menu div.button.small.extract:hover { background: url("/images/flat_icons.png") no-repeat scroll -255px -35px; }
.menu div.button.small.archive:hover { background: url("/images/flat_icons.png") no-repeat scroll -201px -35px; }
.menu div.button.disabled:hover,
.menu div.button { cursor: pointer; transition: box-shadow 0.28s cubic-bezier(0.4, 0, 0.2, 1) 0s; -webkit-transition: box-shadow 0.28s cubic-bezier(0.4, 0, 0.2, 1) 0s; box-shadow: none; color: #999; }
.window.active .menu div.button:hover,
.menu div.button:hover { text-decoration: none; color: #1FB9CA; }
.window.active .menu div.button.del:hover,
.menu div.button.del:hover { color: #FF5A5A; }
.menu div.button.disabled:hover,
.menu div.button.disabled { opacity: 0.5; cursor: default; text-decoration: none; }
.menu .upload.button { color: #777; border: 1px solid #B7B7B7; background-color: #EAEAE8; text-transform: uppercase; font-size: 12px; text-decoration: none; margin-left: 8px; padding: 5px 12px; margin-right: 10px; border-radius: 3px; float: left; transition: box-shadow 0.28s cubic-bezier(0.4, 0, 0.2, 1) 0s; -webkit-transition: box-shadow 0.28s cubic-bezier(0.4, 0, 0.2, 1) 0s; font-size: 11px; line-height: 14px; }
.window.active .menu .upload { border: 1px solid #AACC0D; background-color: #AACC0D; color: #FFF; }
.menu .upload.button.progress { background: url(/images/progress.gif) no-repeat /*-98px*/ -60px 0px #EBEBEB; border-color: #8A9079; color: transparent; padding: 3px 12px; height: 0; margin-top: 9px; transition: background 0.28s cubic-bezier(0.4, 0, 0.2, 1) 0s;
-webkit-transition: background 0.28s cubic-bezier(0.4, 0, 0.2, 1) 0s;
}
.menu .upload.button.progress.done { background-color: #d1ff66; border-color: #8a9079; box-shadow: 0 0 9px 0 #d1ff38; color: transparent; height: 0; margin-top: 9px; padding: 3px 12px; transition: background 0.28s cubic-bezier(0.4, 0, 0.2, 1) 0s; -webkit-transition: background 0.28s cubic-bezier(0.4, 0, 0.2, 1) 0s; transition: height 0.28s cubic-bezier(0.4, 0, 0.2, 1) 0s; -webkit-transition: height 0.28s cubic-bezier(0.4, 0, 0.2, 1) 0s; }
.menu .upload.button:hover, .window.active .menu .upload:hover { border: 1px solid #C0E60F; background-color: #C0E60F; color: #fff; }
.menu .upload.button:active, .window.active .menu .upload:active { border: 1px solid #FFCC00; background-color: #FFCC00; color: #FFF; }
.menu .not-writable { color: #BD846A; font-size: 12px; text-decoration: none; margin-left: 10px; padding: 5px 12px; margin-right: 20px; }
.menu .sort-by { border-radius: 0; cursor: pointer; float: right; height: 17px; line-height: 10px; margin-right: 8px; padding: 8px 10px 0; text-decoration: none; }
.menu .sort-by .direction { background: url("/images/flat_icons.png") repeat scroll -390px -76px; display: inline-block; float:right; width: 12px; height: 20px; margin-top: -10px; }
.menu .sort-by.desc .direction { background-position: -415px -76px; }
.menu .sort-by span { font-size: 12px; color: #555; text-decoration: none; border: none; }
.menu .sort-by span.entity { color: #555; text-decoration: none; border: none; float: right; display: inline-block; }
.menu .sort-by:hover span { color: #43B2BE; }
.menu .total-size { padding: 7px 0 0 0; }
.menu .not-writable:hover { border: 1px solid #E2E2E0; }
ul.listing { list-style-type: none; padding: 18px 0 0; margin: -4px 0 0 -1px; border-left: 1px solid #DDDDDD; overflow: auto; }
.listing li { color: #999999; display: block; height: 34px; margin: 1px 0 0; line-height: 30px; padding: 0; }
.listing li span { display: inline-block; float: right; height: 32px; overflow: hidden; }
.listing li .marker { width: 4px; float: left; height: 100%; margin-right: 31px; }
.listing li.back { }
.listing li.file { }
/* .listing li .icon { background: url("/images/document.png") no-repeat scroll -2px 6px; float: left; margin-left: -17px; width: 13px; height: 24px; }*/
.listing li .icon { background: url("/images/flat_icons.png") no-repeat scroll -97px -100px; float: left; margin-left: -17px; width: 31px; height: 31px; margin-top: 1px; }
.listing li .icon.filetype-dir { background: url("/images/flat_icons.png") no-repeat scroll -24px -98px; }
.listing li .icon.filetype-link { background: url("/images/flat_icons.png") no-repeat scroll -97px -121px; }
.listing li .icon.filetype-tif,
.listing li .icon.filetype-gif,
.listing li .icon.filetype-jpg,
.listing li .icon.filetype-jpeg,
.listing li .icon.filetype-bmp,
.listing li .icon.filetype-psd,
.listing li .icon.filetype-thm,
.listing li .icon.filetype-yuv,
.listing li .icon.filetype-ai,
.listing li .icon.filetype-svg,
.listing li .icon.filetype-png { background: url("/images/flat_icons.png") no-repeat scroll -138px -68px; }
.listing li .icon.filetype-txt,
.listing li .icon.filetype-csv,
.listing li .icon.filetype-dat,
.listing li .icon.filetype-efx,
.listing li .icon.filetype-gbr,
.listing li .icon.filetype-key,
.listing li .icon.filetype-pps,
.listing li .icon.filetype-ppt,
.listing li .icon.filetype-sdf,
.listing li .icon.filetype-vcf,
.listing li .icon.filetype-db { background: url("/images/flat_icons.png") no-repeat scroll -97px -149px; }
.listing li .icon.filetype-xlr,
.listing li .icon.filetype-xls,
.listing li .icon.filetype-xlsx { background: url("/images/flat_icons.png") no-repeat scroll -138px -146px; }
.listing li .icon.filetype-jar,
.listing li .icon.filetype-tar,
.listing li .icon.filetype-7z,
.listing li .icon.filetype-deb,
.listing li .icon.filetype-gz,
.listing li .icon.filetype-pkg,
.listing li .icon.filetype-rar,
.listing li .icon.filetype-rpm,
.listing li .icon.filetype-sit,
.listing li .icon.filetype-sitx,
.listing li .icon.filetype-zip,
.listing li .icon.filetype-zipx,
.listing li .icon.filetype-jar { background: url("/images/flat_icons.png") no-repeat scroll -176px -33px; }
.listing li .icon.filetype-fnt,
.listing li .icon.filetype-otf,
.listing li .icon.filetype-ttf,
.listing li .icon.filetype-fon { background: url("/images/flat_icons.png") no-repeat scroll -97px -99px; }
.listing li .icon.filetype-3g2,
.listing li .icon.filetype-3gp,
.listing li .icon.filetype-asf,
.listing li .icon.filetype-asx,
.listing li .icon.filetype-avi,
.listing li .icon.filetype-flv,
.listing li .icon.filetype-mov,
.listing li .icon.filetype-mp4,
.listing li .icon.filetype-mpg,
.listing li .icon.filetype-mpeg,
.listing li .icon.filetype-rm,
.listing li .icon.filetype-swf,
.listing li .icon.filetype-vob,
.listing li .icon.filetype-wmv { background: url("/images/flat_icons.png") no-repeat scroll -97px -99px; }
.listing li .icon.filetype-aif,
.listing li .icon.filetype-iff,
.listing li .icon.filetype-m3u,
.listing li .icon.filetype-m4a,
.listing li .icon.filetype-mid,
.listing li .icon.filetype-mp3,
.listing li .icon.filetype-mpa,
.listing li .icon.filetype-ra,
.listing li .icon.filetype-wav,
.listing li .icon.filetype-wma { background: url("/images/flat_icons.png") no-repeat scroll -97px -99px; }
.listing li .icon.filetype-rtf,
.listing li .icon.filetype-doc,
.listing li .icon.filetype-docx { background: url("/images/flat_icons.png") no-repeat scroll -138px -122px; }
.listing li .icon.filetype-pdf { background: url("/images/flat_icons.png") no-repeat scroll -138px -95px; }
.listing li .icon.filetype-js { background: url("/images/flat_icons.png") no-repeat scroll -138px -203px; }
.listing li .icon.filetype-css { background: url("/images/flat_icons.png") no-repeat scroll -138px -253px; }
.listing li .icon.filetype-php { background: url("/images/flat_icons.png") no-repeat scroll -138px -178px; }
.listing li .icon.filetype-html,
.listing li .icon.filetype-htm,
.listing li .icon.filetype-xhtml { background: url("/images/flat_icons.png") no-repeat scroll -138px -227px; }
.listing li .filename-holder { max-width: 40%; overflow: hidden; float: left; height: 35px; }
.listing li .filename { color: #555; cursor: pointer; height: 32px; float: left; padding: 2px 7px 0 7px; border-radius: 3px; transition: all 0.18s cubic-bezier(0.4, 0, 0.2, 1) 0s; -webkit-transition: all 0.18s cubic-bezier(0.4, 0, 0.2, 1) 0s; }
/* .listing li .filename { background: url("/images/folder_.png") no-repeat scroll -2px 6px; color: #555; cursor: pointer; float: left; margin-left: -27px; padding-left: 19px; }*/
.listing li .filename:hover { color: #333; background-color: #D1D0CF; }
/*
.listing li .filename:hover { color: #FFF; background-color: #6CB6B9; }
.listing li.selected .filename:hover { color: #FFF; }
.listing li.active .filename:hover { color: #FFF; background-color: #CAA335; }
.listing li.active.selected .filename:hover { color: #FFF; background-color: #60A885; }
*/
.listing li .filename a { color: #7D7D7D; text-decoration: none; }
.listing li .mode { width: 51px; font-size: 11px; padding-top: 2px; }
.listing li .owner { width: 11%; font-style: italic; color: #81A64F; font-size: 12px; padding-top: 2px; }
.listing li .size-value { width: 70px; color: #44a8b3; font-size: 12px; padding-right: 7px; text-align: right; padding-top: 2px; }
.listing li .size-unit { width: 30px; font-size: 11px; font-weight: bold; color: #A7A7A7; text-align: left; padding-top: 2px; }
.listing li .date { width: 50px; font-size: 11px; padding-top: 2px; }
.listing li .time { width: 50px; font-size: 11px; padding-top: 2px; }
.window.active .listing li.selected .mode { color: #7F7550; }
.window.active .listing li.selected .owner { /* color: #7F7550; */ }
.window.active .listing li.selected .size-value { color: #7F7550; }
.window.active .listing li.selected .size-unit { color: #7F7550; }
.window.active .listing li.selected .date { color: #7F7550; }
.window.active .listing li.selected .time { color: #7F7550; }
/*
.listing li.selected-inactive.selected { background-color: #e9e9e9; border-top: 1px solid #ccc; border-bottom: 1px solid #ccc; }
.listing li.selected-inactive .mode,
.listing li.selected-inactive .time,
.listing li.selected-inactive .date { color: #999 !important; }
*/
.listing li.selected { background-color: #DEDEDE; }
.listing.active li.selected { background-color: #ffd437 /*#7FD5D9*/; }
.listing li.selected .filename:hover { color: #333; background-color: #F0B607; }
/* ///.listing li.selected-inactive.selected.active { background-color: #dfc891; border-top: 1px solid #cdb885; border-bottom: 1px solid #cdb885; }*/
/*
.listing li.selected .filename { color: #333; }
.listing li.selected .date,
.listing li.selected .mode,
.listing li.selected .time { color: #777; }
.listing li.selected .owner { color: #31775A; }
.listing li.selected .size { color: #31775A; }
*/
.window.active .listing li.active { background-color: #FFDC5A; }
.window.active .listing li.active .marker { background-color: #C2A84B; }
.listing li.active { background-color: #DEDEDE; }
.listing li.active .marker { background-color: #C2C2C2; }
/* ///.listing li.selected.active .filename { color: #fff29c; } */
.listing li.selected.active .marker { background-color: #3a8a96; }
.listing li.selected-inactive { background-color: #DEDEDE; }
/*///.listing li.selected-inactive .marker { background-color: #7FD5D9; }
.listing li.selected-inactive .filename { color: #54A9A9; } */
.listing li .filename a:hover { color: #3399FF; }
.listing li:hover { background-color: #E5E5E5; cursor: pointer; }
.window.active .listing li.active:hover { background-color: #FFE570; }
.listing li.selected:hover { background-color: /*#89E6EA*/#FFE570; }
.listing li.selected.active:hover { background-color: #FFE570; }
.context-menu { background-color: #333333; width: 200px; list-style-type: none; font-family: arial; padding-left: 0; }
.context-menu li { border-bottom: 1px solid #555; padding: 12px 12px 12px 12px; color: #D6CEC1; font-size: 14px; cursor: pointer; }
.context-menu li:hover { background-color: #4B4B4B; color: #FFF; }
.context-menu li:active { background-color: #FFCC00; color: #FFF; }
.context-menu li.download { text-transform: uppercase; font-size: 12px; color: #CCCD33; }
.context-menu li.download:hover { background-color: #CCCD33; color: #FFF; }
.context-menu li.delete { color: #DC5847; }
.context-menu li.delete:hover { background-color: #DC5847; color: #FFF; }
.context-menu li.disabled { font-size: 12px; color: #777; cursor: default; }
.context-menu li.disabled:active, .context-menu li.disabled:hover { background-color: #333; color: #777; }
.context-menu.sort-order { width: 148px; border-radius: 3px; box-shadow: 0px 2px 11px 0px rgba(0, 0, 0, 0.5); left: 300px; position: absolute; top: 54px; overflow: hidden; margin: 0; }
.context-menu.sort-order li { padding: 0; }
.context-menu.sort-order li.last { border: none; }
.context-menu.sort-order li:hover { background-color: #333; }
.context-menu.sort-order span { padding: 12px 12px 12px 12px; background: ulr(/images/flat_icons.png) }
.context-menu.sort-order span.up { background: url(/images/flat_icons.png) -399px -141px; padding: 12px 14px; display: inline-block; width: 16px; }
.context-menu.sort-order span.name,
.context-menu.sort-order span.date,
.context-menu.sort-order span.size,
.context-menu.sort-order span.type
{ background: url("/images/flat_icons.png") repeat scroll -308px -105px; display: inline-block; padding: 12px 28px 12px 12px; width: 64px; }
.context-menu.sort-order span.active { background-color: #FFCC00; color: #FFF; }
.context-menu.sort-order span:hover { background-color: #4B4B4B; color: #FFF; }
.context-menu.sort-order span:active { background-color: #FFCC00; color: #FFF; }
.confirm-box { background-color: #333; width: 480px; font-family: arial; margin-left: 50px; border-radius: 3px; box-shadow: 0 2px 11px 0 rgba(0, 0, 0, 0.5); }
/*.confirm-box.replace { height: 230px; }*/
.confirm-box .message { color: #EBE697; font-size: 16px; padding: 25px; margin-bottom: 60px; display: inline-block; }
.confirm-box .warning { color: #FF9500; font-size: 16px; padding: 25px; }
.confirm-box .warning .title,
.confirm-box .message .title { color: #48B1B7; }
.confirm-box .action-name { color: #B9CAD4; display: inline-block; float: left; margin-bottom: 28px; margin-left: 25px; }
.confirm-box .action-name span { display: inline-block; float: left; }
.confirm-box .action-nam .checkbox { border: 1px solid #777; height: 10px; margin-right: 10px; margin-top: 3px; padding-top: 0; width: 10px; }
.confirm-box .controls { border-top: 1px solid #555; display: inline-block; width: 100%; margin-bottom :9px; }
.confirm-box .controls .cancel { /*background-color: #e8e8e6;*/ border: 1px solid transparent; border-radius: 3px; color: #CCC; display: inline-block; float: left; font-size: 12px; margin: 12px 0 0 12px; padding: 7px 18px; text-transform: uppercase; cursor: pointer; }
.confirm-box .controls .keep-original { color: #ccc; cursor: pointer; display: inline-block; float: left; margin: 11px 0 0 15px; padding: 7px; text-decoration: underline; }
.confirm-box .controls .ok { margin: 12px 12px 0 0; border-radius: 3px; cursor: pointer; border: 1px solid #CACE33; background-color: #CACE33; color: #FFF; float: right; display: inline-block; font-size: 12px; padding: 7px 18px; text-transform: uppercase; width: 100px; text-align: center; height: 14px; }
.confirm-box .controls .cancel:hover,
.confirm-box .controls .ok:hover { border: 1px solid #54BDAA; background-color: #54BDAA; /*border: 1px solid #6DB8D3; background-color: #6DB8D3;*/ color: #FFF; box-shadow: 0 2px 11px 0 rgba(0, 0, 0, 0.5); }
.confirm-box .controls .cancel:active,
.confirm-box .controls .ok:active { border: 1px solid #ccc; background-color: #ccc; }
.confirm-box.delete .controls .ok { background-color: #ff9f89; border-color: #ff9f89; }
.confirm-box.delete .controls .ok:hover { background-color: #FF6C6E; border-color: #FF6C6E; }
.confirm-box .controls .keep-original:hover { color: #FFCC00; }
.confirm-box .controls .keep-original:active { color: #6DB8D3; }
/*.confirm-box.delete { height: 183px; }*/
.confirm-box .new-title { background-color: #292929; border: 1px solid #111; color: #eee; font-family: Arial; font-size: 16px; margin-bottom: 73px; margin-left: 27px; padding: 10px 14px; width: 396px; }
.confirm-box .new-title:focus { border: 1px solid #FFCC00; box-shadow: 0 0 5px 0 rgba(255, 204, 0 , 0.3); }
/*.confirm-box.rename { height: 209px; } */
.confirm-box.rename .message { margin-bottom: 36px; }
.confirm-box.rename .controls.replace { display: none; }
.confirm-box.rename.warning .controls { display: none; }
.confirm-box.rename .warning { display: none; }
.confirm-box.rename.warning .warning { display: inline-block; }
.confirm-box.rename.warning .controls.replace { display: inline-block; }
.confirm-box.rename.warning .message { padding-bottom: 0; }
/*.confirm-box.archive { height: 468px; }*/
.confirm-box.archive .message { margin-bottom: 38px; }
.confirm-box.archive.warning .controls,
.confirm-box.archive .controls.replace,
.confirm-box.archive .warning { display: none; }
.confirm-box.archive.warning .controls.replace,
.confirm-box.archive.warning .warning { display: inline-block; }
.confirm-box.archive.warning .message { margin-bottom: -31px; }
.confirm-box.copy .message { margin-bottom: 0; }
.confirm-box.unpack .message { margin-bottom: 0; }
.confirm-box.pack .message { margin-bottom: 0; }
.confirm-box .actions select { background-color: #333333; border: 1px solid #ccc; color: #fff; font-family: Arial; font-size: 16px; margin-bottom: 27px; margin-left: 27px; padding: 10px 14px; }
.confirm-box .actions .title { color: #ccc; font-family: Arial; line-height: 33px; padding-left: 27px; text-transform: capitalize; }
.confirm-box .actions label { cursor: pointer; padding-left: 27px; color: #ebe697; }
.confirm-box.unpack .actions { padding-bottom: 30px; }
.confirm-box.unpack .actions input { margin-right: 5px; }
/*.confirm-box.owner-mode { height: 484px; }*/
.confirm-box.owner-mode .warning { display: none; }
.confirm-box.owner-mode.warning .warning { display: inline-block; }
.confirm-box.owner-mode.warning .message { margin-bottom: -39px; }
.confirm-box.owner-mode .message { margin-bottom: 30px; }
.confirm-box.owner-mode .mode,
.confirm-box.owner-mode .owner-group { display: inline-block; }
.confirm-box.owner-mode .mode .col,
.confirm-box.owner-mode .owner-group .col { display: inline-block; float: left; width: 150px; }
.confirm-box.owner-mode .recursive { margin-top: 30px; margin-bottom: 25px; }
.warning-box { width: 60%; background-color: #ff9f89; border-bottom: 5px solid #ff6c6e; color: #FFF; font-family: arial; margin-left: auto; margin-right: auto; padding-bottom: 30px; margin-bottom: 50px; left: 20%; position: absolute; top: 0; box-shadow: 0 2px 11px 0 rgba(0, 0, 0, 0.5); }
.warning-box.inform { background-color: #72c5b2; border-color: #019174; }
.warning-box.reload { width: 100px; background-color: #333; border-color: #222; z-index: 5000; left: 45%; opacity: 0.9; padding: 17px 27px; border-radius: 0 0 6px 6px; border: none; opacity: 0.9; }
.warning-box .message { width: 100%; padding: 30px 0 5px; text-align: center; font-size: 14px; text-transform: uppercase; font-weight: bold; }
.warning-box.reload .message-small { color: #ccc; }
.warning-box.reload .message-small span { color: #72C5B2; font-weight: bold; }
.warning-box .message-small { width: 100%; text-align: center; font-size: 13px; color: #9D3407; }
.warning-box.inform .message-small { color: #555; }
.warning-box .close { width: 30px; height: 30px; top: 5px; right: -5px; background-color: #FFF; float: right; cursor: pointer; background: url("/images/flat_icons.png") repeat scroll -382px -174px; }
.warning-box .close:hover { background-color: #DC5D5F; }
.warning-box.inform .close:hover { background-color: #019174; }
.fotorama--fullscreen .fotorama__fullscreen-icon { background-position: -64px 0 !important; }
/*
transition: box-shadow 0.28s cubic-bezier(0.4, 0, 0.2, 1) 0s;
-webkit-transition: box-shadow 0.28s cubic-bezier(0.4, 0, 0.2, 1) 0s;
box-shadow: 0 6px 15px rgba( 0, 0, 0, 0.23), 0 10px 18px rgba( 0, 0, 0, 0.16);
box-shadow: 0 3px 10px rgba(0, 0, 0, 0.23), 0 3px 10px rgba(0, 0, 0, 0.16);
box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.64);
*/
/*
Прочёл. Похоже проблема уже решена, не понял, что нужно сделать, проверить правильность решения?
Вроде всё в порядке, инпут уже максимльно близко вкладывается в спан.
-- Для Дмитрия (удалить после прочтения):
-- Аплоад прячет инпут, делая его прозрачным, и помещая поверх кнопку html (сделано для кроссбраузерности)
-- При стилизации кнопки для аплоада, важно задать такие же размеры для инпута с типом файла,
-- иначе он может быть больше или меньше стилизованной кнопки, что приведёт к вызову аплоад диалогового окна
-- при клике на неправильную область
-- вот файл инпут ----> .fileinput-button input
*/
.fileinput-button input {
font-size: 14px !important;
width: 90px;
}
.progress-container {
width: 100%;
position: fixed;
bottom: 1px;
}
.progress-container .progress-elm {
background-color: rgba(0, 0, 0, 0.5);
border-radius: 3px;
display: block;
height: 12px;
margin-left: auto;
margin-right: auto;
padding: 7px;
width: 212px;
}
.progress-container .progress-elm .title {
color: #fff;
display: inline-block;
float: left;
font-family: arial;
font-size: 11px;
margin-left: 4px;
padding-right: 14px;
padding-top: 0;
text-transform: uppercase;
}
.progress-container .progress-elm .progress {
background: #ebebeb url("/images/progress.gif") no-repeat scroll 0px 0;
border-color: #8a9079;
border-radius: 3px;
color: transparent;
display: inline-block;
height: 0;
margin-top: 3px;
padding: 3px 12px;
transition: background 0.28s cubic-bezier(0.4, 0, 0.2, 1) 0s;
width: 60px;
float: left;
}
.progress-container .progress-elm .close {
background: rgba(0, 0, 0, 0) url("/images/sprite.png?1446554103") repeat scroll -428px -487px;
cursor: pointer;
display: inline-block;
float: right;
height: 7px;
margin-right: 3px;
margin-top: 3px;
width: 7px;
}
.progress-container .progress-elm .close:hover {
border: 7px solid #333;
margin-top: -4px;
margin-right: -4px;
background-color: #333;
}
.progress-container .progress-elm .close:active {
border: 7px solid #FFCC00;
margin-top: -4px;
margin-right: -4px;
background-color: #FFCC00;
}
.checkbox-toolbar {
float: left !important;
}
/*W
.check-label::before {
background-image: url("/images/sprite.png?1446554103");
background-position: -232px -9px;
background-repeat: no-repeat;
background-size: 450px auto;
content: "";
display: inline-block;
height: 16px;
width: 16px;
margin-top: -25px;
border: 1px solid red;
}
input[type="checkbox"] {
display: none;
}
.clicked-on.check-label::before, .checkbox-selected .check-label {
background-position: -225px -42px;
content: "";
display: inline-block;
height: 27px;
left: -6px;
top: -6px;
width: 27px;
}
*/
@media (max-width: 1400px) {
.listing li .filename-holder { width: 35%; }
}
@media (max-width: 1320px) {
.menu div.button.mkfile,
.menu div.button.mkdir { display: none; }
.menu div.button.mkfile.small,
.menu div.button.mkdir.small { display: inline-block; }
.listing li .filename-holder { max-width: 30%; }
}
@media (max-width: 1210px) {
.menu div.button.del { display: none; }
.menu div.button.del.small { display: inline-block; }
.listing li .filename-holder { max-width: 25%; }
}
@media (max-width: 1180px) {
.menu div.button { display: none; }
.menu div.button.medium,
.menu div.button.small { display: inline-block; }
}
@media (max-width: 1080px) {
.listing li .filename-holder { max-width: 36%; }
.listing li .owner { display: none; }
.listing li .mode { display: none; }
}
@media (max-width: 890px) {
.window { width: 100%; }
.window:nth-of-type(2){ display: none; }
.listing li .owner { display: inline-block; }
.menu div.button { display: inline-block; }
.menu div.button.small { display: none; }
.menu div.copy.button { display: none; }
.listing li .filename-holder { max-width: 40%; }
}
@media (max-width: 720px) {
.listing li .filename-holder { max-width: 30%; }
}
@media (max-width: 600px) {
.menu div.button { display: none; }
.menu div.button.medium,
.menu div.button.small { display: inline-block; }
.menu div.copy.button.small { display: none; }
.listing li .filename-holder { max-width: 20%; }
}
@media (max-width: 520px) {
.listing li .owner { display: none; }
.listing li .filename-holder { max-width: 15%; }
}
@media (max-width: 400px) {
.listing li .mode { display: none; }
.listing li .time { display: none; }
.listing li .filename-holder { max-width: 30%; }
}
@media (max-width: 360px) {
.listing li .date { display: none; }
}
@media (max-width: 310px) {
.listing li .size { display: none; }
}
.subcontext-control.hidden {
display: none !important;
}
.subcontext-control {
color: red;
}
.subcontext-menu-hidden {
display: none;
}
.subcontext-menu {
position: absolute;
background-color: yellow;
padding: 10px;
border: 1px solid red;
}
.subcontext-menu li {
/*float: left;*/
}
.shortcuts {
background: rgba(50, 50, 50, 0.9);
display: inline-block;
position: fixed;
right: 20%;
bottom: 0;
color: #eee;
width: 810px;
border: 1px solid #333;
font-family: arial;
font-size: 13px;
}
.shortcuts .header {
border-bottom: 1px solid #333;
height: 43px;
}
.shortcuts .title {
text-transform: uppercase;
color: #ffcc00;
padding: 7px 0 7px 14px;
display: inline-block;
float: left;
font-size: 11px;
letter-spacing: 3px;
font-weight: bold;
line-height: 30px;
}
.shortcuts .close {
background: url("/images/sprite.png?1446554103") repeat scroll -408px -469px;
cursor: pointer;
display: inline-block;
float: right;
height: 32px;
padding-top: 11px;
width: 46px;
}
.shortcuts .close:hover {
background-color: #000;
..
}
.shortcuts .close:active {
background-color: #55c9c0;
}
.shortcuts ul {
list-style-type: none;
padding: 30px 20px;
display: inline-block;
float: left;
width: 360px;
}
.shortcuts ul li {
padding: 5px 20px;
}
.shortcuts ul li.step-top {
padding-top: 30px;
}
.shortcuts ul li span {
color: #48F4EF;
display: inline-block;
font-weight: bold;
padding: 0 20px 0 0;
text-align: right;
}
.shortcuts ul li span.bigger {
font-size: 18px;
}
.shortcuts ul.note {
font-style: italic;
color: #9CA484;
width: 700px;
padding-left: 50px;
}
.shortcuts ul.note a {
color: #9CA484;
}
.to-shortcuts {
display: inline-block;
position: fixed;
top: 95%;
right: 1%;
}
.l-icon-shortcuts {
display: inline-block;
vertical-align: middle;
background-image: url("/images/sprite.png?1446554103");
width: 35px;
height: 35px;
background-position: -122px -283px;
border-radius: 18px;
}
.l-icon-shortcuts:hover {
background-position: -160px -283px;
}
.l-icon-shortcuts:active {
background-position: -198px -283px;
}