调整主屏容器图标换位逻辑和样式

src/components/base/auto-px-style.ts

@@ -10,6 +10,7 @@ export const autoPxStyle: CSSResult = css`
     --auto-15px: calc(15px / var(--hostDevicePixelRatio));
     --auto-16px: calc(16px / var(--hostDevicePixelRatio));
     --auto-18px: calc(18px / var(--hostDevicePixelRatio));
+    --auto-20px: calc(20px / var(--hostDevicePixelRatio));
     --auto-24px: calc(24px / var(--hostDevicePixelRatio));
     --auto-26px: calc(26px / var(--hostDevicePixelRatio));
     --auto-25_6px: calc(25.6px / var(--hostDevicePixelRatio));

src/components/base/global-style.ts

@@ -227,6 +227,9 @@ const baseStyle = css`
     /*******************************基础色**************************************/
     /* 底色/base白 */
     --base-white: #fafafa;
+    /* 底色/侧栏黑 */
+    --base-slider-black: #2e2e2e;
+    --base-normal-bgc: var(--base-white);
     /* 底色/base黑 */
     --base-black: #110101; //////提交时更新
     /****************************主题色汇总*************************************/
@@ -284,6 +287,7 @@ const baseStyle = css`
     --font-main-white: #f0f0f0;
     /* 文字/正文黑 */
     --font-main-black: #262626;
+    --font-normal-color: var(--font-main-black);
     /* 文字/底色黑 */
     --font-base-black: var(--pure-black);
     /* 文字/底色白 */
@@ -374,6 +378,16 @@ const baseStyle = css`
   }
 `
 
+const baseDarkStyle = css`
+  @media (prefers-color-scheme: light) {
+    :root {
+      /****************************文字颜色*************************************/
+      --font-normal-color: var(--font-secondary-white);
+      /*****************************基础色**************************************/
+      --base-normal-bgc: var(--base-slider-black);
+    }
+  }
+`
 /**
  * 基础组件所需变量
  */
@@ -795,6 +809,7 @@ const darkStyle = css`
 
 export const globalStyles: CSSResultArray = [
   baseStyle,
+  baseDarkStyle,
   baseComponentStyle,
   homeWidgetStyle,
   themeStyle,

src/components/grid-container/container.ts

@@ -522,7 +522,7 @@ export class GaiaContainer extends StarBaseElement {
   set sortMode(value) {
     if (value) {
       this.status |= STATUS.SORT
-      this.gestureDetector.setOption('holdThreshold', 100)
+      this.gestureDetector.setOption('holdThreshold', 120)
       this.setAttribute('sort-mode', '')
       this.updateComplete.then(this.addTailPage)
       this.setAttribute('sort-mode', '')
@@ -905,6 +905,7 @@ export class GaiaContainer extends StarBaseElement {
    * @param {Object} options 所添加元素的尺寸信息和添加回调
    */
   appendContainerChild(element: HTMLElement, options?: ChildElementInfo) {
+    let child
     if (element.tagName.split('-').length > 1 || options?.isWidget) {
       let obj: ChildElementInfo = options
         ? {...options}
@@ -913,10 +914,21 @@ export class GaiaContainer extends StarBaseElement {
         obj.row = (element as any).size[0]
         obj.column = (element as any).size[1]
       }
-      this.insertContainerBefore(element, null, obj)
+      child = this.insertContainerBefore(element, null, obj)
     } else {
-      this.insertContainerBefore(element, null, options)
+      child = this.insertContainerBefore(element, null, options)
     }
+
+    if (child.breakout) {
+      this.dispatchEvent(
+        new CustomEvent('cross-field', {
+          detail: child,
+          composed: true,
+        })
+      )
+    }
+
+    return child
   }
 
   removeContainerChild(element: HTMLElement, callback?: Function) {
@@ -1197,6 +1209,7 @@ export class GaiaContainer extends StarBaseElement {
     } else {
       this.updateComplete.then(setGridId)
     }
+    return childToInsert
   }
 
   /**
@@ -1253,7 +1266,7 @@ export class GaiaContainer extends StarBaseElement {
     child.container.addEventListener('animationstart', animStart)
     child.container.classList.add(state)
 
-    child[state] = window.window.setTimeout(() => {
+    child[state] = window.setTimeout(() => {
       delete child[state]
       child.container.removeEventListener('animationstart', animStart)
       child.container.classList.remove(state)
@@ -2405,7 +2418,7 @@ export class GaiaContainer extends StarBaseElement {
       } else if (
         child.element === target ||
         child.master === target ||
-        child.container === target ||
+        // child.container === target ||
         child.element.compareDocumentPosition(target) & 16
       ) {
         this._dnd.child = child

src/components/grid-container/gaia-container-child.ts

@@ -76,7 +76,7 @@ export default class GaiaContainerChild {
     manager: GaiaContainer,
     isWidget: boolean = false
   ) {
-    this._element = element
+    this.element = element
     this.isWidget = isWidget
     this.row = row
     this.column = column
@@ -179,6 +179,8 @@ export default class GaiaContainerChild {
     if (this._element) {
       this.container.replaceChild(node, this._element)
     }
+
+    node.classList.add('child-element')
     this._element = node
   }