#rl-app.UserBackground { background-size: cover; background-repeat: no-repeat; background-position: center; } #rl-left { flex-grow: 0; flex-shrink: 0; position: relative; /* transition: width 0.3s ease-out;*/ width: @rlLeftWidth; z-index: 0; } #rl-right:not([hidden]) { display: flex; flex-grow: 1; width: 20%; } .rl-bottom-preview-pane #rl-right { flex-direction: column; } /* .resizable::after { background-color: #aaa; bottom: 0; content: ''; height: 22px; pointer-events: none; position: absolute; right: 0; text-align: center; width: 20px; } .resizable::-webkit-resizer { background: #aaa; background: rgba(255,255,255,0.5); } */ .resizer { background: #aaa; background: rgba(255,255,255,0.5); display: none; opacity: 0; position: absolute; z-index: 102; } .resizer:hover { opacity: 1; } html:not(.rl-left-panel-disabled) #rl-left { resize: horizontal; overflow: auto; min-width: 155px; max-width: 350px; } #rl-left > .resizer, .rl-side-preview-pane #V-MailMessageList .resizer { cursor: ew-resize; cursor: col-resize; right: 0; top: 0; bottom: 0; width: 5px; } .rl-bottom-preview-pane #V-MailMessageList .resizer { cursor: ns-resize; cursor: row-resize; bottom: 0; left: 0; right: 0; height: 5px; } html:not(.rl-left-panel-disabled) #rl-left > .resizer, #V-MailMessageList .resizer { display: block; } #top-system-dropdown-id::after, #button-add-prop-dropdown-id::after { content: '▼'; font-size: 80%; } .dropdown-menu * + .dividerbar { margin-top: 9px; padding-top: 9px; border-top: 1px solid var(--border-color, #e5e5e5); } .dropdown.show { box-shadow: 0 0 1px var(--main-color, #333); } .btn.btn-transparent { background: none !important; border-color: transparent !important; box-shadow: none !important; color: inherit; text-shadow: none !important; opacity: .6; &:hover { opacity: 1; } } .btn-group.open .btn.btn-transparent.dropdown-toggle { color: #BD362F; } .btn-group > .btn.single { border-radius: var(--input-border-radius, 3px) !important; } .search-input-wrp { position: relative; text-align: right; } .search-input-wrp a { position: absolute; right: 0; top: 5px; margin: 0 7px; z-index: 100; opacity: .4; cursor: pointer; &:hover { opacity: .6; } } #rl-left .search-input-wrp { margin-right: 8px; } /* desktop */ @media screen and (min-width: 1000px) { } /* desktop-large */ @media screen and (min-width: 1401px) { #rl-left { width: @rlLeftWidth + 20; } } /* mobile and tablet */ @media screen and (max-width: 999px) { #rl-left { width: 155px; } #rl-app { #V-SettingsPane { margin-right: 0; } #rl-settings-subscreen { padding: 10px; } } .dropdown-menu a { line-height: 2.5; } } html:not(.rl-ctrl-key-pressed) .visible-on-ctrl-btn, html.rl-ctrl-key-pressed .hidden-on-ctrl-btn, .show-on-panel-disabled { display: none; } html.rl-left-panel-disabled { #rl-left { width: 60px !important; .show-on-panel-disabled { display: block; } .b-content { opacity: 0.3; } .hide-on-panel-disabled { display: none; } } } html.rl-mobile #rl-left > .resizer, html.rl-no-preview-pane #rl-right .resizer { display: none !important; } html.rl-mobile { #rl-left { background: var(--main-bg-color, #aaa); border-right: 1px solid var(--border-color, #ddd); position: fixed; left: 0; top: 0; bottom: 0; width: 50vw; z-index: 3; } &.rl-left-panel-disabled #rl-left { display: none; } } html.rl-mobile .hide-mobile, html:not(.rl-mobile) .show-mobile { display: none !important; } .e-paginator { a { opacity: 0.5; text-decoration: none; font-size: 22px; padding: 3px; cursor: pointer; &:hover { opacity: 0.8; } &.current { opacity: 1; font-size: 25px; cursor: default; } } }