ul.explr-tree { height: 100% !important; li { span { color: #AAA; font-size: 17px; padding-left: 1px; cursor: pointer; &.explr-plus, &.explr-minus { z-index: 1; &:hover { background: rgba($white, .1); border-radius: 2px; } } } a { color: white; padding-right: 80px; &:hover { color: white; } &.active { background: rgba(255, 255, 255, .1); border-radius: $baseRadius; font-weight: bold; text-decoration: underline; margin-left: 35px; padding-left: 5px; margin-right: 10px; } } } } .explr-selection-actions { display: none; margin-right: 10px; border-right: 1px solid #222; padding-right: 20px; } .explr-selection .explr-selection-actions { display: flex; } ul.explr-dirview { display: flex; flex-direction: row; flex-wrap: wrap; li { display: flex; flex-direction: column; justify-content: flex-start; align-items: center; flex-shrink: 0; margin: 18px; min-width: 90px; min-height: 104px; padding-top: 5px; border: 1px solid transparent; border-radius: $baseRadius; &.renaming { a { span { display: none; } form { display: block; } } } &.highlight-drop { border: 1px dotted rgba($seaBlue, .4); background: rgba($seaBlue, .3); } &.highlight-clicked { border: 1px dotted rgba($white, .2); background: rgba($white, .1); } a { color: #BBB; text-decoration: none; flex: 1; text-align: center; font-size: 12px; display: flex; flex-direction: column; justify-content: flex-start; align-items: center; max-width: 84px; i { font-size: 64px; margin-bottom: 12px; border-radius: 8px; } input { width: 100%; padding: 0 3px; &:focus { outline: none; } } &:hover { opacity: 0.8; } form { display: none; } } &.new-folder { a { color: $seaBlue; form { display: block; } } } } .ui-draggable-dragging { z-index: 20; a { opacity: 1 !important; } } }