@difizen/libro-lab 0.2.20 → 0.2.22

package/es/lab-color-registry.js

@@ -0,0 +1,124 @@
+function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); }
+var _dec, _class;
+function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
+function _defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, _toPropertyKey(descriptor.key), descriptor); } }
+function _createClass(Constructor, protoProps, staticProps) { if (protoProps) _defineProperties(Constructor.prototype, protoProps); if (staticProps) _defineProperties(Constructor, staticProps); Object.defineProperty(Constructor, "prototype", { writable: false }); return Constructor; }
+function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == _typeof(i) ? i : String(i); }
+function _toPrimitive(t, r) { if ("object" != _typeof(t) || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != _typeof(i)) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
+import { Color, ColorContribution } from '@difizen/mana-app';
+import { singleton } from '@difizen/mana-app';
+export var LabColorContribution = (_dec = singleton({
+  contrib: ColorContribution
+}), _dec(_class = /*#__PURE__*/function () {
+  function LabColorContribution() {
+    _classCallCheck(this, LabColorContribution);
+  }
+  _createClass(LabColorContribution, [{
+    key: "registerColors",
+    value: function registerColors(colors) {
+      // common
+      colors.register(
+      // #region antd variable
+      {
+        id: 'libro.lab.welcome.background.color',
+        defaults: {
+          dark: '#1f2022',
+          light: '#FFFFFF'
+        },
+        description: ''
+      }, {
+        id: 'libro.lab.welcome.h1.color',
+        defaults: {
+          dark: '#edeeef',
+          light: '#000A1A'
+        },
+        description: 'welcome'
+      }, {
+        id: 'libro.lab.server.info.title.text',
+        defaults: {
+          dark: '#BDC0C4',
+          light: Color.rgba(0, 10, 26, 0.89)
+        },
+        description: ''
+      }, {
+        id: 'libro.lab.server.info.text',
+        defaults: {
+          dark: '#e3e4e6',
+          light: Color.rgba(0, 10, 26, 0.78)
+        },
+        description: 'welcome'
+      }, {
+        id: 'libro.lab.welcome.h3.text',
+        defaults: {
+          dark: '#EDEEEF',
+          light: Color.rgba(0, 10, 26, 0.89)
+        },
+        description: 'welcome'
+      }, {
+        id: 'libro.lab.welcome.entry.point.text',
+        defaults: {
+          dark: '#D6D8DA',
+          light: Color.rgba(0, 10, 26, 0.68)
+        },
+        description: 'welcome'
+      }, {
+        id: 'libro.lab.welcome.entry.point.text',
+        defaults: {
+          dark: '#D6D8DA',
+          light: Color.rgba(0, 10, 26, 0.68)
+        },
+        description: 'welcome'
+      }, {
+        id: 'libro.lab.welcome.entry.point.background',
+        defaults: {
+          dark: Color.rgba(255, 255, 255, 0.08),
+          light: '#000a1a05'
+        },
+        description: 'welcome'
+      }, {
+        id: 'libro.lab.welcome.service.info.background',
+        defaults: {
+          dark: Color.rgba(255, 255, 255, 0.08),
+          light: Color.rgba(0, 10, 26, 0.02)
+        },
+        description: 'welcome'
+      }, {
+        id: 'libro.lab.welcome.entry.point.hover.background',
+        defaults: {
+          dark: Color.rgba(255, 255, 255, 0.16),
+          light: Color.rgba(0, 10, 26, 0.04)
+        },
+        description: 'welcome'
+      }, {
+        id: 'libro.lab.footer.text',
+        defaults: {
+          dark: '#E3E4E6',
+          light: '#000a1aad'
+        },
+        description: ''
+      }, {
+        id: 'libro.lab.footer.background',
+        defaults: {
+          dark: '#161b21',
+          light: '#fcfcfc'
+        },
+        description: ''
+      }, {
+        id: 'libro.lab.content.tab.nav',
+        defaults: {
+          dark: '#252526',
+          light: '#f8f8fb'
+        },
+        description: ''
+      }, {
+        id: 'libro.lab.content.tab.active.background',
+        defaults: {
+          dark: '#161b21',
+          light: '#ffffff'
+        },
+        description: ''
+      });
+    }
+  }]);
+  return LabColorContribution;
+}()) || _class);

package/es/layout/footer/index.less

@@ -17,7 +17,7 @@
   align-items: center;
   font-weight: 400;
   font-size: 12px;
-  color: rgba(0, 10, 26, 68%);
+  color: var(--mana-libro-lab-footer-text);
 }
 
 .libro-lab-status-footer {

package/es/layout/index.less

@@ -20,7 +20,7 @@
   &-footer {
     height: 28px;
     min-height: 28px;
-    background-image: linear-gradient(270deg, #fafafa 0%, #fff 100%);
+    background: var(--mana-libro-lab-footer-background);
     box-shadow: 0 -1px 1px 0 rgba(0, 0, 0, 12%);
   }
 
@@ -33,13 +33,19 @@
       flex: unset !important;
     }
 
+    .mana-header-middle {
+      display: flex;
+      align-items: center;
+    }
+
     .mana-menubar {
-      height: 100%;
+      // height: 100%;
+      position: relative;
       padding: unset;
     }
 
     .mana-menubar-item-text {
-      color: rgba(0, 10, 26, 89%);
+      // color: rgba(0, 10, 26, 89%);
       font-weight: 400;
     }
   }

package/es/module.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"module.d.ts","sourceRoot":"","sources":["../src/module.tsx"],"names":[],"mappings":"AAIA,OAAO,EACL,UAAU,EAKX,MAAM,mBAAmB,CAAC;AAiB3B,OAAO,cAAc,CAAC;AAMtB,eAAO,MAAM,cAAc,YA6ExB,CAAC"}
+{"version":3,"file":"module.d.ts","sourceRoot":"","sources":["../src/module.tsx"],"names":[],"mappings":"AAIA,OAAO,EACL,UAAU,EAKX,MAAM,mBAAmB,CAAC;AAkB3B,OAAO,cAAc,CAAC;AAMtB,eAAO,MAAM,cAAc,YA8ExB,CAAC"}

package/es/module.js

@@ -11,6 +11,7 @@ import { ImageViewerModule } from "./image-viewer/index.js";
 // import { KernelManagerView } from './kernel-manager/index.js';
 import { LibroKernelAndTerminalPanelModule } from "./kernel-and-terminal-panel/module.js";
 import { LibroLabApp } from "./lab-app.js";
+import { LabColorContribution } from "./lab-color-registry.js";
 import { ContentBottomTabView } from "./layout/content-bottom-tab-view.js";
 import { LibroLabLayoutModule, LibroLabLayoutSlots, LibroLabLayoutView } from "./layout/index.js";
 import { SaveableTabView } from "./layout/saveable-tab-view.js";
@@ -19,7 +20,7 @@ import { LibroLabSideTabView } from "./layout/side-tab-view.js";
 import { LibroLabTocModule } from "./toc/module.js";
 import { EntryPointView } from "./welcome/entry-point-view.js";
 import { WelcomeView } from "./welcome/index.js";
-export var LibroLabModule = ManaModule.create().register(LibroLabApp, LibroLabLayoutView, GithubLinkView, LabConfigAppContribution, LibroLabSideTabView, createViewPreference({
+export var LibroLabModule = ManaModule.create().register(LibroLabApp, LibroLabLayoutView, GithubLinkView, LabConfigAppContribution, LibroLabSideTabView, LabColorContribution, createViewPreference({
   view: GithubLinkView,
   slot: HeaderArea.right,
   openOptions: {

package/es/toc/libro-toc-panel-view.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"libro-toc-panel-view.d.ts","sourceRoot":"","sources":["../../src/toc/libro-toc-panel-view.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,oBAAoB,EAAE,MAAM,wBAAwB,CAAC;AAC9D,OAAO,EAAE,OAAO,EAAE,MAAM,oBAAoB,CAAC;AAC7C,OAAO,EACL,QAAQ,EAOR,WAAW,EAEZ,MAAM,mBAAmB,CAAC;AAI3B,OAAO,EAAE,aAAa,EAAE,MAAM,6BAA6B,CAAC;AAG5D,OAAO,cAAc,CAAC;AAmBtB,eAAO,MAAM,gBAAgB,uBAAuB,CAAC;AACrD,qBAEa,YAAa,SAAQ,QAAQ;IAC/B,IAAI,yBAAiB;IACT,SAAS,CAAC,WAAW,EAAE,WAAW,CAAC;IACjC,SAAS,CAAC,aAAa,EAAE,aAAa,CAAC;IACtD,YAAY,EAAE,OAAO,GAAG,SAAS,CAAC;;IAQjC,WAAW,IAAI,IAAI;IAQ5B,IAAI,oBAAoB,qCAMvB;IAED,mBAAmB,aAiBjB;CACH"}
+{"version":3,"file":"libro-toc-panel-view.d.ts","sourceRoot":"","sources":["../../src/toc/libro-toc-panel-view.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,oBAAoB,EAAE,MAAM,wBAAwB,CAAC;AAC9D,OAAO,EAAE,OAAO,EAAE,MAAM,oBAAoB,CAAC;AAC7C,OAAO,EACL,QAAQ,EAQR,WAAW,EAEZ,MAAM,mBAAmB,CAAC;AAI3B,OAAO,EAAE,aAAa,EAAE,MAAM,6BAA6B,CAAC;AAG5D,OAAO,cAAc,CAAC;AA6BtB,eAAO,MAAM,gBAAgB,uBAAuB,CAAC;AACrD,qBAEa,YAAa,SAAQ,QAAQ;IAC/B,IAAI,yBAAiB;IACT,SAAS,CAAC,WAAW,EAAE,WAAW,CAAC;IACjC,SAAS,CAAC,aAAa,EAAE,aAAa,CAAC;IACtD,YAAY,EAAE,OAAO,GAAG,SAAS,CAAC;;IAQjC,WAAW,IAAI,IAAI;IAQ5B,IAAI,oBAAoB,qCAMvB;IAED,mBAAmB,aAiBjB;CACH"}

package/es/toc/libro-toc-panel-view.js

@@ -17,8 +17,8 @@ function _applyDecoratedDescriptor(target, property, decorators, descriptor, con
 function _initializerWarningHelper(descriptor, context) { throw new Error('Decorating class property failed. Please ensure that ' + 'transform-class-properties is enabled and runs after the decorators transform.'); }
 import { LibroNavigatableView } from '@difizen/libro-jupyter';
 import { TOCView } from '@difizen/libro-toc';
-import { BaseView, inject, prop, singleton, useInject, view, ViewInstance, ViewManager, ViewRender } from '@difizen/mana-app';
-import { Empty } from 'antd';
+import { BaseView, inject, prop, singleton, ThemeService, useInject, view, ViewInstance, ViewManager, ViewRender } from '@difizen/mana-app';
+import { ConfigProvider, Empty, theme } from 'antd';
 import { TocIcon } from "../common/index.js";
 import { LayoutService } from "../layout/layout-service.js";
 import { LibroLabLayoutSlots } from "../layout/protocol.js";
@@ -26,14 +26,20 @@ import "./index.less";
 import { jsx as _jsx } from "react/jsx-runtime";
 var TocViewRender = function TocViewRender() {
   var tocPanelView = useInject(ViewInstance);
-  return /*#__PURE__*/_jsx("div", {
-    className: "libro-lab-toc-panel",
-    children: tocPanelView.libroTocView ? /*#__PURE__*/_jsx(ViewRender, {
-      view: tocPanelView.libroTocView
-    }) : /*#__PURE__*/_jsx(Empty, {
-      image: Empty.PRESENTED_IMAGE_SIMPLE,
-      description: "\u8BE5\u6587\u4EF6\u683C\u5F0F\u6682\u4E0D\u652F\u6301\u5927\u7EB2",
-      className: "libro-lab-toc-empty"
+  var themeService = useInject(ThemeService);
+  return /*#__PURE__*/_jsx(ConfigProvider, {
+    theme: {
+      algorithm: themeService.getCurrentTheme().type === 'dark' ? theme.darkAlgorithm : theme.defaultAlgorithm
+    },
+    children: /*#__PURE__*/_jsx("div", {
+      className: "libro-lab-toc-panel",
+      children: tocPanelView.libroTocView ? /*#__PURE__*/_jsx(ViewRender, {
+        view: tocPanelView.libroTocView
+      }) : /*#__PURE__*/_jsx(Empty, {
+        image: Empty.PRESENTED_IMAGE_SIMPLE,
+        description: "\u8BE5\u6587\u4EF6\u683C\u5F0F\u6682\u4E0D\u652F\u6301\u5927\u7EB2",
+        className: "libro-lab-toc-empty"
+      })
     })
   });
 };

package/es/welcome/index.less

@@ -1,7 +1,7 @@
 .libro-lab-welcome-page {
   padding: 32px 54px;
   height: 100%;
-  background: white;
+  background: var(--mana-libro-lab-welcome-background-color);
   overflow: auto;
 
   .libro-lab-welcome-page-title {
@@ -9,7 +9,7 @@
     font-family: PingFangSC;
     font-weight: 600;
     font-size: 40px;
-    color: #000a1a;
+    color: var(--mana-libro-lab-welcome-h1-color);
     letter-spacing: 0;
     line-height: 56px;
   }
@@ -29,12 +29,12 @@
   margin-bottom: 24px;
   height: 100px;
   width: 100px;
-  background-color: rgba(0, 10, 26, 2%);
+  background-color: var(--mana-libro-lab-welcome-entry-point-background);
   border-radius: 8px;
   cursor: pointer;
 
   &:hover {
-    background-color: rgba(0, 10, 26, 4%);
+    background-color: var(--mana-libro-lab-welcome-entry-point-hover-background);
   }
 }
 
@@ -42,20 +42,20 @@
   margin-top: 6px;
   line-height: 20px;
   font-size: 14px;
-  color: rgba(0, 10, 26, 68%);
+  color: var(--mana-libro-lab-welcome-entry-point-text);
 }
 
 .libro-lab-entry-point-title {
   font-weight: 500;
   font-size: 18px;
   margin-bottom: 12px;
-  color: rgba(0, 10, 26, 89%);
+  color: var(--mana-libro-lab-welcome-h3-color);
 }
 
 .libro-lab-entry-point-item-title {
   font-weight: 500;
   font-size: 16px;
-  color: rgba(0, 10, 26, 89%);
+  color: var(--mana-libro-lab-welcome-h3-color);
   margin-bottom: 16px;
 }
 
@@ -103,7 +103,7 @@
 
 .libro-lab-welcome-page-server-info {
   width: 400px;
-  background-color: rgba(0, 10, 26, 2%);
+  background: var(--mana-libro-lab-welcome-service-info-background);
   border-radius: 8px;
   margin-bottom: 24px;
   padding: 16px 24px;
@@ -112,9 +112,9 @@
 .libro-lab-welcome-page-server-info-title {
   font-weight: 500;
   font-size: 16px;
-  color: rgba(0, 10, 26, 89%);
+  color: var(--mana-libro-lab-server-info-title-text);
 }
 
 .libro-lab-welcome-page-server-info-item {
-  color: rgba(0, 10, 26, 78%);
+  color: var(--mana-libro-lab-server-info-text);
 }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@difizen/libro-lab",
-  "version": "0.2.20",
+  "version": "0.2.22",
   "description": "",
   "keywords": [
     "libro",
@@ -34,15 +34,15 @@
   ],
   "dependencies": {
     "@ant-design/icons": "^5.1.0",
-    "@difizen/libro-core": "^0.2.20",
-    "@difizen/libro-jupyter": "^0.2.20",
-    "@difizen/libro-kernel": "^0.2.20",
-    "@difizen/libro-prompt-cell": "^0.2.20",
-    "@difizen/libro-terminal": "^0.2.20",
-    "@difizen/libro-toc": "^0.2.20",
-    "@difizen/libro-cofine-editor-core": "^0.2.20",
-    "@difizen/libro-language-client": "^0.2.20",
-    "@difizen/libro-widget": "^0.2.20",
+    "@difizen/libro-core": "^0.2.22",
+    "@difizen/libro-jupyter": "^0.2.22",
+    "@difizen/libro-kernel": "^0.2.22",
+    "@difizen/libro-prompt-cell": "^0.2.22",
+    "@difizen/libro-terminal": "^0.2.22",
+    "@difizen/libro-toc": "^0.2.22",
+    "@difizen/libro-cofine-editor-core": "^0.2.22",
+    "@difizen/libro-language-client": "^0.2.22",
+    "@difizen/libro-widget": "^0.2.22",
     "@difizen/mana-app": "latest",
     "@difizen/mana-common": "latest",
     "@difizen/mana-react": "latest",

package/src/common/icon.tsx

@@ -1,4 +1,5 @@
 /* eslint-disable @typescript-eslint/no-unused-vars */
+import { CodeFilled } from '@ant-design/icons';
 import './index.less';
 
 export interface IProps {
@@ -52,7 +53,13 @@ export function TocIcon(props: IProps) {
       xmlnsXlink="http://www.w3.org/1999/xlink"
     >
       <title>source</title>
-      <g id="代码片段" stroke="none" strokeWidth="1" fill="none" fillRule="evenodd">
+      <g
+        id="代码片段"
+        stroke="none"
+        strokeWidth="1"
+        fill="currentColor"
+        fillRule="evenodd"
+      >
         <g
           id="1.4编辑状态备份"
           transform="translate(-14.000000, -215.000000)"
@@ -88,7 +95,7 @@ export function Loadding(props: IProps) {
         <g
           id="1.1容器加载中-关闭提示"
           transform="translate(-1362.000000, -879.000000)"
-          fill="#1890FF"
+          fill="currentColor"
         >
           <g id="编组-20" transform="translate(0.000000, 872.000000)">
             <g id="编组-3" transform="translate(1302.000000, 5.000000)">
@@ -196,11 +203,17 @@ export function PreferenceIcon(props: IProps) {
       xmlnsXlink="http://www.w3.org/1999/xlink"
     >
       <title>政策</title>
-      <g id="整体框架部分" stroke="none" strokeWidth="1" fill="none" fillRule="evenodd">
+      <g
+        id="整体框架部分"
+        stroke="none"
+        strokeWidth="1"
+        fill="currentColor"
+        fillRule="evenodd"
+      >
         <g
           id="1.2容器加载完成"
           transform="translate(-330.000000, -970.000000)"
-          fill="#333333"
+          fill="currentColor"
           fillRule="nonzero"
         >
           <g id="编组-19" transform="translate(318.000000, 485.000000)">
@@ -234,11 +247,17 @@ export function KeybindIcon(props: IProps) {
       xmlnsXlink="http://www.w3.org/1999/xlink"
     >
       <title>键盘</title>
-      <g id="整体框架部分" stroke="none" strokeWidth="1" fill="none" fillRule="evenodd">
+      <g
+        id="整体框架部分"
+        stroke="none"
+        strokeWidth="1"
+        fill="currentColor"
+        fillRule="evenodd"
+      >
         <g
           id="1.2容器加载完成"
           transform="translate(-446.000000, -970.000000)"
-          fill="#333333"
+          fill="currentColor"
           fillRule="nonzero"
         >
           <g id="编组-19" transform="translate(318.000000, 485.000000)">
@@ -277,11 +296,17 @@ export function SuccIcon(props: IProps) {
       className="libro-lab-success"
     >
       <title>编组 12</title>
-      <g id="整体框架部分" stroke="none" strokeWidth="1" fill="none" fillRule="evenodd">
+      <g
+        id="整体框架部分"
+        stroke="none"
+        strokeWidth="1"
+        fill="currentColor"
+        fillRule="evenodd"
+      >
         <g
           id="1.2容器加载完成"
           transform="translate(-1392.000000, -1073.000000)"
-          fill="#52C41A"
+          fill="currentColor"
         >
           <g id="编组-26" transform="translate(24.000000, 1070.000000)">
             <g id="编组-3" transform="translate(1252.000000, 0.000000)">
@@ -315,14 +340,13 @@ export function KernelAndTerminal() {
         id="代码片段"
         stroke="none"
         strokeWidth="1"
-        fill="none"
+        fill="currentColor"
         fillRule="evenodd"
-        fillOpacity="0.35"
       >
         <g
           id="1.1搜索"
           transform="translate(-12.000000, -142.000000)"
-          fill="#000000"
+          fill="currentColor"
           fillRule="nonzero"
         >
           <g id="编组-2" transform="translate(0.000000, 56.000000)">
@@ -510,47 +534,7 @@ export function runningKernel() {
 }
 
 export function runningTerminal() {
-  return (
-    <svg
-      width="12px"
-      height="12px"
-      viewBox="0 0 12 12"
-      version="1.1"
-      xmlns="http://www.w3.org/2000/svg"
-      xmlnsXlink="http://www.w3.org/1999/xlink"
-    >
-      <title>bxs-terminal</title>
-      <g
-        id="kernel管理面板"
-        stroke="none"
-        strokeWidth="1"
-        fill="none"
-        fillRule="evenodd"
-        opacity="0.45"
-      >
-        <g
-          id="2.0展开"
-          transform="translate(-52.000000, -332.000000)"
-          fill="#000000"
-          fillRule="nonzero"
-        >
-          <g id="编组-2" transform="translate(0.000000, 56.000000)">
-            <g id="编组-11" transform="translate(40.000000, 0.000000)">
-              <g id="编组-16备份-4" transform="translate(12.000000, 272.000000)">
-                <g id="bxs-terminal" transform="translate(0.000000, 4.000000)">
-                  <rect id="矩形" opacity="0" x="0" y="0" width="12" height="12"></rect>
-                  <path
-                    d="M9.99999609,2.00000391 L1.99999609,2.00000391 C1.73478642,2.00000391 1.48043049,2.10535585 1.29289231,2.29289184 C1.10535413,2.48042782 0.999996094,2.73478252 0.999996094,3.00000391 L0.999996094,9.00000391 C0.999996094,9.26521748 1.10535413,9.51957218 1.29289231,9.70710816 C1.48043049,9.89464415 1.73478642,10.0000039 1.99999609,10.0000039 L9.99999609,10.0000039 C10.2652136,10.0000039 10.5195695,9.89464415 10.7071077,9.70710816 C10.8946459,9.51957218 10.9999961,9.26521748 10.9999961,9.00000391 L10.9999961,3.00000391 C10.9999961,2.73478252 10.8946459,2.48042782 10.7071077,2.29289184 C10.5195695,2.10535585 10.2652136,2.00000391 9.99999609,2.00000391 Z M3.207,7.85349609 L2.49998438,7.14650391 L3.64648828,6 L2.49998438,4.85349609 L3.20698828,4.14650391 L5.06049609,6 L3.207,7.85349609 Z M9.5,7.99999609 L6,7.99999609 L6,6.99999609 L9.5,6.99999609 L9.5,7.99999609 L9.5,7.99999609 Z"
-                    id="形状"
-                  ></path>
-                </g>
-              </g>
-            </g>
-          </g>
-        </g>
-      </g>
-    </svg>
-  );
+  return <CodeFilled />;
 }
 
 export function existedLSP() {

package/src/index.less

@@ -1,12 +1,22 @@
+/* stylelint-disable selector-no-vendor-prefix */
+a:-webkit-any-link {
+  color: unset;
+}
+
+.libro-lab-layout {
+  .ant-empty {
+    .ant-empty-description {
+      color: var(--mana-ant-color-text-description);
+    }
+  }
+}
+
 #libro-lab-content-layout-left {
   .mana-side-tab-view {
     .mana-tabs-left {
       .mana-tabs-nav {
-        background-color: #f0f2f51f;
+        background-color: var(--mana-ant-color-bg-elevated);
         min-width: 40px;
-        box-shadow:
-          1px 0 0 0 #000a1a02,
-          2px 0 0 0 #ffffff0c;
 
         .mana-tabs-ink-bar {
           display: none;
@@ -37,28 +47,29 @@
         }
 
         .mana-tabs-tab-btn:hover {
-          background-color: #000a1a1f;
-
           .mana-tab-icon {
-            color: #00000059;
+            color: var(--mana-ant-color-icon);
           }
         }
 
         .mana-tabs-tab-active {
           .mana-tabs-tab-btn {
-            background-color: #000a1a1f;
-
             .mana-tab-icon {
-              color: #000a1a7f;
+              color: var(--mana-ant-color-icon-hover);
             }
           }
         }
       }
 
       .mana-tabs-content-holder {
-        background-image: linear-gradient(269deg, #c8c8cd1f 0%, #ffffff1f 100%);
+        background-image: linear-gradient(
+          269deg,
+          var(--mana-libro-lab-content-tab-nav) 0%,
+          var(--mana-libro-background)
+        );
         border-left: none;
-        background-color: unset;
+        box-shadow: var(--mana-ant-box-shadow-tabs-overflow-left);
+        padding-left: 2px;
 
         .mana-tab-side-pane-content {
           height: calc(100% - 32px);
@@ -69,22 +80,17 @@
 }
 
 #libro-lab-content-layout-main {
-  background-color: #f8f8fb;
+  background-color: var(--mana-libro-lab-content-tab-nav);
 
   .mana-tabs-nav {
-    background-color: #f8f8fb;
+    background-color: var(--mana-libro-lab-content-tab-nav);
+  }
+
+  .mana-tabs-tab-active {
+    background-color: var(--mana-libro-lab-content-tab-active-background);
   }
 }
 
 #libro-lab-content-layout-main-container {
   overflow: auto;
 }
-
-.default-folder-icon,
-.default-file-icon {
-  color: #00000072;
-}
-
-.mana-tree-node-segment-grow {
-  color: #000000a5;
-}

package/src/kernel-and-terminal-panel/collapse/index.less

@@ -5,7 +5,7 @@
 
 .libro-panel-collapse-header {
   user-select: none; // 双击不选中文本
-  color: rgba(0, 10, 26, 68%);
+  color: var(--mana-libro-lab-kernel-panel-collapse-header-label);
   font-size: 12px;
 
   .libro-panel-collapse-header-left {
@@ -25,7 +25,7 @@
   .libro-panel-collapse-header-closeAll {
     // display: inline-block;
     cursor: pointer;
-    color: rgba(0, 10, 26, 47%);
+    color: var(--mana-ant-color-text-secondary);
     float: right;
   }
 }
@@ -40,7 +40,7 @@
   .libro-panel-collapse-kernel-item {
     cursor: pointer;
     user-select: none; // 双击不选中文本
-    color: rgba(0, 10, 26, 65%);
+    color: var(--mana-libro-lab-kernel-panel-collapse-item-text);
     font-size: 12px;
     margin: 8px 0;
     padding: 0 10px;