// ========================================================================== // File Upload Style // ========================================================================== .#{$selector} { .ipt_uif_uploader { .fileupload-buttonbar { margin-bottom: 5px; } .fileinput-button { .ui-button-text { button { border: 0 none; text-transform: uppercase; background-color: transparent; color: inherit; } } } .fileupload-buttons { .ui-button { margin-bottom: 4px; } } @media screen and ( max-width: $screen-xs-max ) { .fileupload-buttons { .cancel, .delete { display: none; } } .delete_toggle input, .delete_toggle input + label, .fileinput-dragdrop { display: none; } .ipt_fsqm_fileuploader_list { .cancel, .delete { .ui-icon { left: 50%; margin-left: -6px !important; top: 50%; margin-top: -6px; } } } } .fileinput-dragdrop { height: 150px; border: 1px solid $divider-color; color: $disabled-color-text; line-height: 150px; text-align: center; font-size: 2em; border-radius: 4px; font-variant: small-caps; text-transform: capitalize; margin: 0 0 12px 0; will-change: background-color, color, border-color; @include material__smooth-tran( 500ms ); &.hover { background-color: $primary-color; border-color: $primary-color-dark; color: $primary-color-text; } span { overflow: hidden; text-overflow: ellipsis; display: block; height: 150px; white-space: nowrap; } } .fileupload-meta { color: $secondary-text-color; } .ipt_fsqm_fileuploader_list_wrap { .ipt_fsqm_fileuploader_list { margin: 0; thead td { padding: 0; } .delete_toggle { padding: 0; } } .fileupload-progress { margin: 12px 20px 12px 0; } } .fileinput-button { input { bottom: 0; } } .fade { opacity: 1; } .progress-extended { color: $secondary-text-color; margin: 12px 0; } } }