/** * EGroupware: CSS with less preprocessor * * FILEMANAGER * * Please do NOT change app.css directly, instead change app.less and compile it! * * @link http://www.egroupware.org * @license http://opensource.org/licenses/gpl-license.php GPL - GNU General Public License * @author Stefan Reinhardt * @package filemanager * @version $Id$ */ /** * EGroupware - CSS Styles used by filemanager app * * @license http://opensource.org/licenses/gpl-license.php GPL - GNU General Public License * @package etemplate * @link http://www.egroupware.org * @author Ralf Becker * @version $Id$ */ /** * CSS for new eTemplate filemanager UI */ .mimeHuge img { width: 64px; height: 64px; } .fileName input { font-weight: bold; width: 100%; } .previewImage img { max-width: 430px; max-height: 275px; border: 1px solid black; } .pathSelection { font-weight: bold; } .pathSelection a { font-weight: bold; font-size: 120%; } .pathSelectionContainer { width: 640px; overflow: auto; } /** * Get path input to take all remaining width */ #filemanager-index_filemanager-index-header_left { float: left; width: 100%; margin-bottom: 1px; } div.filemanager_navigation { position: relative; width: 100%; white-space: normal; } div.filemanager_navigation > * { vertical-align: middle; } div.filemanager_navigation > img { margin-top: 3px; } #filemanager-index_buttons { float: right; } img#filemanager-index_tarp { height: 22px; } div.filemanager_navigation > label { position: absolute; left: 56px; right: 475px; font-size: 140%; white-space: nowrap; } div.filemanager_navigation > label > input { width: 100%; } #filemanager-index_buttons div.et2_file { margin: 2px 0 0 0; vertical-align: top; padding-right: 7px; } #filemanager-index_buttons div.et2_file span, #filemanager-index_buttons div.et2_file input { width: 130px; height: 16px; top: 0; background-position: 3px 3px; margin: 0; text-indent: 22px; color: #666666; } #filemanager-index_buttons div.et2_file .progress { width: auto; margin: 0; overflow: hidden; text-overflow: ellipsis; max-height: none; } /** * Tile view table.egwGridView_grid .tile .file_tile { height: 150px; } */ .egwGridView_grid .tile span.iconOverlayContainer { display: block; max-width: 140px; } .tile .file_tile img.vfsMimeIcon { height: auto; width: auto; max-height: 48px; display: block; margin: 0 auto; } .tile .file_tile .et2_label { word-wrap: break-word; } .tile .file_tile { position: relative; } .tile .file_tile[data-mime^="image"] .et2_label { display: none; } .tile .file_tile[data-mime^="image"]:hover .et2_label { display: block; position: absolute; top: 10px; color: white; text-shadow: 2px 2px 8px black; width: 100%; } .tile .file_tile[data-mime^="image"]:hover .et2_label[id*=comment] { top: 30px; } #filemanager-index_nm .file_tile[data-mime^="image"] img.vfsMimeIcon { height: auto; max-height: 100px; } /** * Select file dialog */ .selectPath { font-weight: bold; width: 98%; } .selectPathContainer { width: 470px; overflow: auto; } .selectName input { width: 100%; } .selectMime select { width: 100%; } .displayNone input, input.displayNone { display: none; } .selectFiles div { overflow-y: auto; } #filemanager-select_dir { height: 400px; overflow-y: scroll; display: inline-block; } /** * VFS mounts and versioning */ .filemanager_smallButton { font-size: 90%; margin: 0; } .filemanager_header { font-size: 120%; font-weight: bold; } .filemanager_config > * { margin-top: 20px; } .error { color: red; font-style: italic; } .createDir img { padding-right: 30px; } #filemanager-select_apps { width: 61px; height: 400px; margin-top: 44px; display: inline-block; overflow-y: scroll; } /*/***************************************************************** // sidebar */ /*//****************************************************************** // iframe*/ table.egwGridView_grid img { /*filter grey*/ filter: none; -webkit-filter: initial; -moz-filter: initial; -ms-filter: initial; -o-filter: initial; /*filter: url(grayscale.svg); Firefox 4+ */ filter: initial; /* IE 6-9 */ } /*// #####################################################*/ /*Dialog filemanager*/ #filemanager-select .dialogHeader .et2_button_icon { margin: 4px 4px 0 4px; border-top: solid 1px #ffffff; border-left: solid 1px #ffffff; border-right: solid 1px #ffffff; border-bottom: solid 1px #ffffff; -webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px; background-color: #ffffff; height: auto; width: 24px; } #filemanager-select .dialogHeader .selectPathContainer { overflow: auto; width: 470px; margin-top: 0px; height: 32px; } #filemanager-select .dialogHeader .selectPathContainer input { height: 20px; } #filemanager-select #filemanager-select_apps { background-color: #d9d9d9; } #filemanager-select #filemanager-select_apps .et2_button_icon { height: auto; width: 24px; padding: 10px; } #filemanager-select table#filemanager-select_dir { border: 1px solid rgba(0, 0, 0, 0.15); } #filemanager-select table#filemanager-select_dir tr:nth-child(even) { background: #ffffff; } #filemanager-select table#filemanager-select_dir tr:nth-child(odd) { background: #f2f2f2; } /*// #####################################################*/ /*Dialog filemanager edit POPUP WINDOW*/ div#filemanager-file_tabs { /*eacl*/ /*Abonements*/ } div#filemanager-file_tabs span.ui-icon-search { /*.background_color_10_gray;*/ -webkit-box-shadow: 0px 1px 0px rgba(0, 0, 0, 0.5); -moz-box-shadow: 0px 1px 0px rgba(0, 0, 0, 0.5); box-shadow: 0px 1px 0px rgba(0, 0, 0, 0.5); border: 1px solid rgba(0, 0, 0, 0.15); -webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px; position: relative; top: 3px; margin-left: 3px; } div#filemanager-file_tabs span.ui-icon-search:hover { /*.background_color_20_gray;*/ -webkit-box-shadow: 1px 1px 1px rgba(0, 0, 0, 0.6); -moz-box-shadow: 1px 1px 1px rgba(0, 0, 0, 0.6); box-shadow: 1px 1px 1px rgba(0, 0, 0, 0.6); border: 1px solid rgba(0, 0, 0, 0.5); -webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px; } div#filemanager-file_tabs span.ui-icon-search:active { /*.background_color_30_gray;*/ border: 1px solid rgba(0, 0, 0, 0.9); -webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px; -webkit-box-shadow: inset 1px 2px 1px rgba(0, 0, 0, 0.5); -moz-box-shadow: inset 1px 2px 1px rgba(0, 0, 0, 0.5); box-shadow: inset 1px 2px 1px rgba(0, 0, 0, 0.5); background-color: #1aa200; } div#filemanager-file_tabs #filemanager-file_filemanager-file-eacl { /*Owner*/ } div#filemanager-file_tabs #filemanager-file_filemanager-file-eacl td.filemanager-file_filemanager-file-eaclowner span { display: flex; margin-right: 1px; } div#filemanager-file_tabs #filemanager-file_filemanager-file-eacl td.filemanager-file_filemanager-file-eaclowner span.ui-icon-search { position: relative; top: 15px; margin-left: -3px; margin-right: 3px; } div#filemanager-file_tabs td.eaclAccount { width: 200px; } /*// #####################################################*/ /*Dialog filemanager upload POPUP WINDOW*/ div#stylite-filemanager-upload { margin: 0.5em; } div#stylite-filemanager-upload .et2_file { height: 24px; } div#stylite-filemanager-upload .et2_file input { color: #ffffff; width: 250px; background-color: #0c5da5; } div#stylite-filemanager-upload .et2_file input:hover { background-color: #189800 !important; color: #ffc200; -webkit-box-shadow: 1px 1px 1px rgba(0, 0, 0, 0.6); -moz-box-shadow: 1px 1px 1px rgba(0, 0, 0, 0.6); box-shadow: 1px 1px 1px rgba(0, 0, 0, 0.6); -webkit-border-radius: 3px; -webkit-border-top-left-radius: 10px; -moz-border-radius: 3px; -moz-border-radius-topleft: 10px; border-radius: 3px; border-top-left-radius: 10px; } div#stylite-filemanager-upload .et2_file input:active { background-color: #1aa200 !important; } div#stylite-filemanager-upload .et2_file div.progress { width: 0px; } div#stylite-filemanager-upload .th { background: none; } div#stylite-filemanager-upload .dialogFooterToolbar button { /*.border_normal;*/ /*.box_shadow_standard_light;*/ /*.rounded (3px);*/ color: #000000; -webkit-appearance: none; -webkit-transition-property: background-color; -moz-transition-property: background-color; -o-transition-property: background-color; transition-property: background-color; -webkit-transition-duration: 0.5s; -moz-transition-duration: 0.5s; -o-transition-duration: 0.5s; transition-duration: 0.5s; -webkit-transition-timing-function: linear; -moz-transition-timing-function: linear; -o-transition-timing-function: linear; transition-timing-function: linear; background-color: #b4b4b4; padding-left: 30px; background-position: 6px center; background-repeat: no-repeat; background-size: 20px auto; /*.Button_size_h32_auto;*/ height: 24px; } div#stylite-filemanager-upload .dialogFooterToolbar button:hover { background-color: #f5b301 !important; color: #000000; -webkit-box-shadow: 1px 1px 1px rgba(0, 0, 0, 0.6); -moz-box-shadow: 1px 1px 1px rgba(0, 0, 0, 0.6); box-shadow: 1px 1px 1px rgba(0, 0, 0, 0.6); } div#stylite-filemanager-upload .dialogFooterToolbar button:active { background-color: #fecc44 !important; color: #000000; -webkit-box-shadow: inset 1px 2px 1px rgba(0, 0, 0, 0.5); -moz-box-shadow: inset 1px 2px 1px rgba(0, 0, 0, 0.5); box-shadow: inset 1px 2px 1px rgba(0, 0, 0, 0.5); } /* tablets and smartphones */ @media only screen and (max-device-width: 1024px) { #filemanager-index_nm table.egwGridView_outer tbody span[id^='filemanager-index'][id$='size]'] { font-size: 9pt; text-align: right; } #filemanager-index_nm table.egwGridView_outer tbody label[id^='filemanager-index'][id$='name]'] { overflow: hidden; text-overflow: ellipsis; max-width: 100%; } #filemanager-index_nm table.egwGridView_outer tbody label[id^='filemanager-index'][id$='name]'] span { white-space: nowrap; } #filemanager-index_nm #filemanager-index_buttons { position: relative; display: inline-block; } #filemanager-index_nm #filemanager-index_tarp { display: none !important; } #filemanager-index_nm #filemanager-index_filemanager-index-header_left { height: auto; } .et2_file.plus_button { position: absolute !important; right: 15px; bottom: 15px; border-radius: 50%; width: 60px; height: 60px; background-position: center; z-index: 100; background-color: #0c5da5; border: none; box-shadow: 0px 1px 5px 3px silver; background-image: none !important; margin: 0; padding: 0; } .et2_file.plus_button .et2_file_span { display: none; } .et2_file.plus_button .et2_file_upload { width: 60px; height: 60px; top: 0; } .et2_file.plus_button:after { content: '+'; font-weight: bold; font-size: 34pt; color: #fafafa; margin-left: 10px; } .previewImage img { max-width: 100%; } div#filemanager-file_tabs td.eaclAccount, td.eaclRights { display: block; } }