magic-page-designer/src/assets/skin/theme/dark.less

magic-page-designer 是一个基于 vue 的在线页面快速开发平台，主要把所有的 vue 代码都改为在线配置，最终获得一个 json 格式的页面，你可以把它存放到服务器的任何地方：数据库、静态文件、redis 等。最方便的是可以在线修改页面，再也不用担心生产出问题了，还得打开 IDE，修改测试打包，直接在线编码，所见即所得。还可以配合 [magic-api](https://gitee.com/ssssssss-team/magic-api) 使用，完全抛弃 IDE，随时随地 code w

.mpd-container.theme-dark {
  // 全局默认变量
  --mpd-global-font-color: #cccccc;
  --mpd-global-font-size: 12px;
  --mpd-global-bg-color: #1e1e1e;
  --mpd-global-block-bg-hover-color: #505050;
  // 头部标题
  --mpd-title-bar-bg-color: #3e3e3e;
  --mpd-title-bar-menu-button-hover-bg-color: var(--mpd-global-block-bg-hover-color);
  // 工作空间
  // 侧边栏
  --mpd-content-side-bar-bg-color: #333333;
  // --mpd-content-side-panel-bg-color: #252525;
  --mpd-content-side-panel-bg-color: #ffffff;
  --mpd-content-side-actions-item-font-hover-color: #ffffff;
  --mpd-content-side-actions-item-border-selected-color: var(--mpd-content-side-actions-item-border-color);
  --mpd-content-side-workspace-bg-color: #e2e5ec;
  // 底部状态栏
  --mpd-status-bar-bg-color: #3e3e3e;
  // menu组件
  --mpd-contextmenu-bg-color: #3c3c3c;
  --mpd-contextmenu-font-color: var(--mpd-global-font-color);
  --mpd-contextmenu-font-hover-color: var(--mpd-contextmenu-font-color);
  --mpd-contextmenu-border-color: var(--mpd-global-border-color);
  --mpd-contextmenu-hover-bg-color: #094771;
  --mpd-contextmenu-expand-bg-color: var(--mpd-contextmenu-hover-bg-color);
  --mpd-contextmenu-expand-font-color: var(--mpd-contextmenu-font-hover-color);
}