.finder-block-button() { display: block; float: left; border: 2px dotted rgba(0,0,0,.1); position: relative; outline: none; .find-button-icon { position: absolute; width: 22px; height: 22px; top: 50%; left: 50%; margin-top: -11px; margin-left: -11px; &:before { text-align: center; display: block; font-size: 22px; height: 22px; width: 22px; line-height: 22px; color: rgba(0,0,0,.1); } } &:hover { border: 2px dotted rgba(0,0,0,.2); .find-button-icon:before { color: @brand-success; color: rgba(0,0,0,.2); } } &:focus { border: 2px solid rgba(0,0,0,.3); background: transparent; .find-button-icon:before { color: @brand-success; color: rgba(0,0,0,.2); } } } .finder-vertical-align() { position: absolute; top: 50%; margin-top: -44px; height: 88px; } // // Shared // .field-mediafinder { overflow: hidden; .find-object { .border-radius(3px); position: relative; outline: none; overflow: hidden; display: inline-block; vertical-align: top; .icon-container { display: table; i { color: #95a5a6; display: inline-block; } } h4 { font-weight: 600; font-size: 13px; color: #2b3e50; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; line-height: 150%; margin: 15px 0 5px 0; padding-right: 0; .transition(padding 0.1s); position: relative; a { position: absolute; right: 0; top: 0; display: none; font-weight: 400; } } .info h4 a, .meta a.find-remove-button { color: #2b3e50; display: none; font-size: 15px; text-decoration: none; } } &.is-populated { .find-object:hover { h4 a, .meta .find-remove-button { display: block; } } } // // Preview mode // &.is-preview { .find-button, .find-remove-button { display: none !important; } } } // // Media // @media (max-width: 1024px) { .field-fileupload { &.is-populated .find-object { h4 a, .meta .find-remove-button { display: block !important; } } } }