.statusbar { padding: 0 2px 0; z-index: 500; .margin-left-sheet(@value) { margin-left: @value; margin-right: 0; .rtl-sheet& { margin-left: 0; margin-right: @value; } } .margin-right-sheet(@value) { margin-right: @value; margin-left: 0; .rtl-sheet& { margin-right: 0; margin-left: @value; } } .padding-x-sheet(@left, @right) { padding-left: @left; padding-right: @right; .rtl-sheet& { padding-left: @right; padding-right: @left; } } .padding-right-sheet(@value) { padding-right: @value; padding-left: 0; .rtl-sheet& { padding-right: 0; padding-left: @value; } } #status-tabs-scroll { width: 66px; padding: 0 12px 0 10px; height: @statusbar-height-ie; height: @statusbar-height; float: left; .rtl-sheet& { padding: 0 10px 0 12px; float: right; } } #status-zoom-box { position: absolute; height: @statusbar-height-ie; height: @statusbar-height; .separator { margin-top: calc(-1*(@statusbar-height-ie - @x-small-btn-size-ie)); margin-top: calc(-1*(@statusbar-height - @x-small-btn-size)); } #status-label-zoom { cursor: pointer; text-align: center; &.disabled { cursor: default; } } } &.no-compact { #status-zoom-box { right: 0; .rtl & { right: auto; left: 0; } } #status-btn-zoomup { .margin-right-10(); } #status-btn-zoomdown, #status-btn-zoom-towidth { .margin-left-10(); } } &:not(.no-compact) { #status-zoom-box { right: 0; .rtl-sheet& { right: auto; left: 0; } } #status-btn-zoomup { .margin-right-sheet(10px); } #status-btn-zoomdown, #status-btn-zoom-towidth { .margin-left-sheet(10px); } #status-zoom-box, #status-action { .separator { border-right: none; border-left: @scaled-one-px-value-ie solid @border-divider-ie; border-left: @scaled-one-px-value solid @border-divider; .rtl-sheet& { border-left: none; border-right: @scaled-one-px-value-ie solid @border-divider-ie; border-right: @scaled-one-px-value solid @border-divider; } } } } #status-addtabs-box { padding: 0 8px; border-left: @scaled-one-px-value-ie solid @border-toolbar-ie; border-left: @scaled-one-px-value solid @border-toolbar; border-right: @scaled-one-px-value-ie solid @border-toolbar-ie; border-right: @scaled-one-px-value solid @border-toolbar; height: @statusbar-height-ie; height: @statusbar-height; float: left; .rtl-sheet& { float: right; } } #status-sheets-bar-box { position: absolute; overflow: hidden; height: @statusbar-height-ie; height: @statusbar-height; left: 66px; right: 160px; top: 0; .rtl-sheet& { left: 160px; right: 66px; } } #status-sheets-bar { width: 100%; height: 100%; .dropdown-menu { margin-top: -1px; } .nav-tabs { height: 100%; display: flex; > li { background-color: @background-pane-ie; background-color: @background-pane; &:first-of-type { span { border-left: none; .rtl-sheet& { border-left: @scaled-one-px-value-ie solid @border-toolbar-ie; border-left: @scaled-one-px-value solid @border-toolbar; border-right: none; } } } &:last-of-type { > span { margin-right: 0; margin-left: 0; } } &:not(.active) { > span { color: @text-secondary-ie; color: @text-secondary; } } > span { display: inline-block; .border-radius(0); padding: 0 10px 0; line-height: @statusbar-height-ie; line-height: @statusbar-height; background-color: @background-pane-additional-ie; background-color: @background-pane-additional; outline: none; border-left: @scaled-one-px-value-ie solid @border-toolbar-ie; border-left: @scaled-one-px-value solid @border-toolbar; border-right: @scaled-one-px-value-ie solid @border-toolbar-ie; border-right: @scaled-one-px-value solid @border-toolbar; border-top: @scaled-one-px-value-ie solid @border-toolbar-ie; border-top: @scaled-one-px-value solid @border-toolbar; .margin-right-sheet(-1px); &:hover { border-top-color: @border-toolbar-ie; border-top-color: @border-toolbar; border-bottom-color: @border-toolbar-ie; border-bottom-color: @border-toolbar; color: @text-normal-ie; color: @text-normal; } } &.active { > span { border-bottom-color: @background-pane-ie; border-bottom-color: @background-pane; background-color: @background-pane-ie; background-color: @background-pane; outline: none; box-shadow: 0px 4px 0 #444796 inset; border-top-width: 0; padding-top: 1px; .font-weight-bold(); } } &.selected { > span { border-bottom-color: @highlight-header-button-hover-ie; border-bottom-color: @highlight-header-button-hover; background-color: @background-normal-ie; background-color: @background-normal; box-shadow: 0px 4px 0 #444796 inset; color: @text-normal-ie; color: @text-normal; } } &.disabled { opacity: @component-disabled-opacity-ie; opacity: @component-disabled-opacity; > span { cursor: default; color: @text-secondary-ie; color: @text-secondary; } } &.separator-item { margin-top: 1px; .margin-left-sheet(20px); width: @scaled-one-px-value-ie; width: @scaled-one-px-value; > span { display: none; padding: 0; margin: 0; width: @scaled-one-px-value-ie; width: @scaled-one-px-value; &::after { content: none; } } } } } } #status-number-of-sheet , #status-action { position: absolute; height: @statusbar-height-ie; height: @statusbar-height; bottom: 0; display: flex; justify-content: flex-start; .status-label { .font-weight-bold(); color: @text-normal; width: 100%; text-align: center; } } #status-number-of-sheet { width: 135px; left: 0; .rtl & { left: auto; right: 0; } } &.no-compact { #status-tabs-scroll, #status-sheets-bar-box, #status-addtabs-box { height: @statusbar-height-ie; height: @statusbar-height; border-bottom: @scaled-one-px-value-ie solid @border-toolbar-ie; border-bottom: @scaled-one-px-value solid @border-toolbar; } } .status-group { white-space: nowrap; &.dropup { position: static; } } .cnt-tabslist { display: inline-block; position: relative; .dropdown-menu { min-width: 112px; li { .text-align-left(); a { position: relative; .padding-x(26px, 20px); .color { height: 21px; width: 4px; position: absolute; top: 2px; left: 0; .rtl & { left: auto; right: 0; } } .name { .float-left(); } } .hidden-mark { .margin-left-12(); font-style: italic; color: @text-secondary; } } } } .cnt-zoom { display: inline-block; position: relative; .dropdown-menu { min-width: 80px; li { > a { text-align: center; padding-left: 15px; padding-right: 15px; } } } } .dropdown-menu { margin-bottom: 6px; li { .text-align-left(); } } .separator { &.short { height: @statusbar-height-ie; height: @statusbar-height; } } #btn-zoom-topage, #btn-zoom-towidth { .margin-right-8(); } } .rtl-sheet .nav { padding-right: 0; } #statusbar { background-color: @background-statusbar-ie; background-color: @background-statusbar; }