rc-dock/style/index-dark.less

dock layout for react component

@import "./index";

@background-color: #000;
@text-color: fade(#fff, 85%);
@dragging-layer-shadow: 0 0 8px rgba(255, 255, 255, 0.1), inset 0 0 8px rgba(255, 255, 255, 0.1);

@component-background: #141414;
@primary-color: #108ee9;
@primary-highlight: mix(#fff, @primary-color, 20%);
@drop-indicator-bg: mix(@component-background, @primary-color, 40%);
@drop-indicator-border-color: #fff;


@disabled-color: #ccc;
@panel-border-color: #434343;
@nav-color-split: #282828;
@nav-more-shadow: inset -10px 0 8px -8px fade(#000, 8%);
@tab-background: #141414;
@panel-corner-color: rgba(255, 255, 255, 0.15);
@panel-box-shadow: 0 0 4px #444;

@button-text-color: #444;
@button-text-focus-color: #fff;
@button-text-middle-color: mix(@button-text-color, @button-text-focus-color, 50%);

// main window style
@nav-color-split-main: #282828;

@dropdown-menu-bg: @component-background;
@item-hover-bg: mix(#fff, @dropdown-menu-bg, 10%);
@box-shadow-base: 0 3px 6px -4px rgba(0, 0, 0, 0.12), 0 6px 16px 0 rgba(0, 0, 0, 0.08), 0 9px 28px 8px rgba(0, 0, 0, 0.05);