android-midscene-automation 0.1.43 → 0.2.2

package/src/ui-refresh.css

@@ -1,677 +0,0 @@
-:root {
-  --ui-primary: #fed73b;
-  --ui-primary-hover: #ffe166;
-  --ui-primary-active: #e5b900;
-  --ui-success: #52c41a;
-  --ui-warning: #faad14;
-  --ui-danger: #ff4d4f;
-  --ui-text: #1f2937;
-  --ui-text-secondary: #6b7280;
-  --ui-text-muted: #9ca3af;
-  --ui-border: #ededed;
-  --ui-border-strong: #dedede;
-  --ui-bg: #f5f5f5;
-  --ui-bg-soft: #fafafa;
-  --ui-surface: #fff;
-  --ui-radius: 8px;
-  --ui-radius-control: 6px;
-  --ui-shadow-popover: 0 8px 24px rgba(15, 23, 42, 0.1);
-
-  --el-color-primary: var(--ui-primary);
-  --el-color-primary-light-3: #ffe575;
-  --el-color-primary-light-5: #ffeb9d;
-  --el-color-primary-light-7: #fff2c4;
-  --el-color-primary-light-8: #fff6d8;
-  --el-color-primary-light-9: #fffaeb;
-  --el-color-primary-dark-2: var(--ui-primary-active);
-  --el-color-success: var(--ui-success);
-  --el-color-warning: var(--ui-warning);
-  --el-color-danger: var(--ui-danger);
-  --el-text-color-primary: var(--ui-text);
-  --el-text-color-regular: #4b5563;
-  --el-text-color-secondary: var(--ui-text-secondary);
-  --el-text-color-placeholder: var(--ui-text-muted);
-  --el-border-color: var(--ui-border-strong);
-  --el-border-color-light: var(--ui-border);
-  --el-border-color-lighter: #edf0f3;
-  --el-fill-color-light: #f6f8fb;
-  --el-fill-color-lighter: #fafbfc;
-  --el-bg-color-page: var(--ui-bg);
-  --el-border-radius-base: var(--ui-radius-control);
-  --el-border-radius-small: 4px;
-  --el-box-shadow-light: var(--ui-shadow-popover);
-  color: var(--ui-text);
-}
-
-body {
-  background: var(--ui-bg);
-  color: var(--ui-text);
-  letter-spacing: 0;
-}
-
-::selection {
-  background: #fff0a8;
-  color: #342a00;
-}
-
-.layout {
-  grid-template-columns: 216px minmax(0, 1fr);
-  background: var(--ui-bg);
-}
-
-.layout-sidebar {
-  border-right: 1px solid var(--ui-border);
-  background: #fff;
-}
-
-.layout-sidebar__top {
-  height: 64px;
-  border-bottom-color: var(--ui-border);
-}
-
-.layout-sidebar__logo {
-  width: 38px;
-  height: 38px;
-  border-radius: var(--ui-radius);
-  background: var(--ui-primary);
-  box-shadow: none;
-  color: #1f1f1f;
-  font-size: 14px;
-}
-
-.layout-menu.el-menu {
-  --el-menu-bg-color: #fff;
-  --el-menu-text-color: #4b5563;
-  --el-menu-hover-bg-color: #fafafa;
-  --el-menu-active-color: #1f2937;
-  padding: 10px 8px;
-}
-
-.layout-menu .el-menu-item,
-.layout-menu .el-sub-menu__title {
-  height: 44px;
-  margin: 2px 0;
-  border-radius: 6px;
-  line-height: 44px;
-}
-
-.layout-menu .el-menu-item.is-active {
-  background: #fff9df;
-  box-shadow: 3px 0 0 var(--ui-primary) inset;
-  font-weight: 600;
-}
-
-.layout-menu .el-sub-menu .el-menu-item {
-  min-width: 0;
-  padding-left: 48px !important;
-}
-
-.layout-main {
-  grid-template-rows: 64px minmax(0, 1fr);
-}
-
-.layout-header {
-  height: 64px;
-  padding: 0 24px;
-  border-bottom-color: var(--ui-border);
-  background: rgba(255, 255, 255, 0.96);
-}
-
-.layout-header__title {
-  color: var(--ui-text);
-  font-size: 18px;
-  font-weight: 650;
-}
-
-.layout-header__actions {
-  align-items: center;
-  gap: 8px;
-}
-
-.page-body {
-  padding: 20px 24px 24px;
-  scrollbar-gutter: stable;
-}
-
-.page-body:not(.page-body--appium) > .generator-page,
-.page-body:not(.page-body--appium) > .config-page,
-.page-body:not(.page-body--appium) > .automation-layout {
-  width: 100%;
-  margin: 0;
-}
-
-.page-alert,
-.page-section {
-  margin-bottom: 16px;
-}
-
-.el-card {
-  border-color: var(--ui-border);
-  border-radius: var(--ui-radius);
-  background: var(--ui-surface);
-}
-
-.el-card__header {
-  min-height: 54px;
-  padding: 15px 18px;
-  border-bottom-color: var(--ui-border);
-  color: var(--ui-text);
-  font-size: 15px;
-  font-weight: 650;
-}
-
-.el-card__body {
-  padding: 18px;
-}
-
-.el-button {
-  font-weight: 500;
-  letter-spacing: 0;
-}
-
-.el-button:not(.is-circle) {
-  min-height: 32px;
-  padding-right: 14px;
-  padding-left: 14px;
-}
-
-.el-button--primary:not(.is-disabled) {
-  --el-button-text-color: #1f1f1f;
-  --el-button-hover-text-color: #1f1f1f;
-  --el-button-active-text-color: #1f1f1f;
-  box-shadow: none;
-}
-
-.layout-header .el-button--primary.is-disabled,
-.generator-page .el-button--primary.is-disabled,
-.appium-header-actions .el-button--primary.is-disabled {
-  --el-button-disabled-text-color: #9ca3af;
-  --el-button-disabled-bg-color: #f3f4f6;
-  --el-button-disabled-border-color: #e5e7eb;
-}
-
-.el-button--danger:not(.is-disabled) {
-  box-shadow: 0 2px 5px rgba(255, 77, 79, 0.12);
-}
-
-.el-input__wrapper,
-.el-select__wrapper,
-.el-textarea__inner,
-.el-input-number .el-input__wrapper {
-  border-radius: var(--ui-radius-control);
-  box-shadow: 0 0 0 1px var(--ui-border-strong) inset;
-}
-
-.el-input__wrapper:hover,
-.el-select__wrapper:hover,
-.el-textarea__inner:hover {
-  box-shadow: 0 0 0 1px #e8c32f inset;
-}
-
-.el-form-item__label {
-  color: #374151;
-  font-size: 13px;
-  font-weight: 500;
-}
-
-.el-dialog {
-  overflow: hidden;
-  border: 1px solid var(--ui-border);
-  border-radius: var(--ui-radius);
-  box-shadow: 0 18px 48px rgba(15, 23, 42, 0.18);
-}
-
-.el-dialog__header {
-  padding: 18px 20px 14px;
-  border-bottom: 1px solid var(--ui-border);
-}
-
-.el-dialog__title {
-  color: var(--ui-text);
-  font-size: 16px;
-  font-weight: 650;
-}
-
-.el-dialog__body {
-  padding: 20px;
-}
-
-.el-dialog__footer {
-  padding: 12px 20px 18px;
-}
-
-.el-message-box {
-  border: 1px solid var(--ui-border);
-  border-radius: var(--ui-radius);
-  box-shadow: 0 18px 48px rgba(15, 23, 42, 0.18);
-}
-
-.el-tabs__item {
-  color: var(--ui-text-secondary);
-  font-weight: 500;
-}
-
-.el-tabs__item.is-active {
-  color: var(--ui-text);
-  font-weight: 600;
-}
-
-.el-alert {
-  border: 1px solid color-mix(in srgb, currentColor 14%, transparent);
-  border-radius: var(--ui-radius-control);
-}
-
-.el-tag {
-  border-radius: 4px;
-  font-weight: 500;
-}
-
-.el-empty__description p {
-  color: var(--ui-text-muted);
-  font-size: 13px;
-}
-
-.el-select-dropdown,
-.el-dropdown__popper,
-.el-picker__popper,
-.el-popover.el-popper,
-.el-tooltip__popper {
-  border-radius: var(--ui-radius-control);
-  box-shadow: var(--ui-shadow-popover);
-}
-
-.subnav {
-  display: inline-flex;
-  width: fit-content;
-  padding: 4px;
-  border: 1px solid var(--ui-border);
-  border-radius: var(--ui-radius);
-  background: #eef1f5;
-}
-
-.subnav__item {
-  min-height: 32px;
-  padding: 6px 14px;
-  border: 0;
-  border-radius: 5px;
-  background: transparent;
-  color: var(--ui-text-secondary);
-  font-size: 13px;
-  font-weight: 500;
-}
-
-.subnav__item:hover {
-  color: var(--ui-text);
-}
-
-.subnav__item--active {
-  border: 0;
-  background: var(--ui-surface);
-  color: #1f2937;
-  box-shadow:
-    0 1px 4px rgba(15, 23, 42, 0.08),
-    0 2px 0 var(--ui-primary);
-}
-
-.page-grid,
-.config-grid,
-.generator-page--ai {
-  gap: 16px;
-}
-
-.panel-header {
-  min-width: 0;
-}
-
-.panel-header > span,
-.panel-header__title {
-  color: var(--ui-text);
-  font-weight: 650;
-}
-
-.panel-header__actions {
-  align-items: center;
-}
-
-.config-model-grid {
-  gap: 32px;
-}
-
-.config-model-grid > section {
-  min-width: 0;
-  padding: 0;
-  border: 0;
-  border-radius: 0;
-}
-
-.config-model-grid > section + section {
-  padding-left: 32px;
-  border-left: 1px solid var(--ui-border);
-}
-
-@media (max-width: 640px) {
-  .config-model-grid > section + section {
-    padding: 24px 0 0;
-    border-left: 0;
-    border-top: 1px solid var(--ui-border);
-  }
-}
-
-.config-model-grid > section,
-.config-page .config-grid > .config-module-card > .el-card__body,
-.config-appium-card > .el-card__body {
-  background: var(--ui-bg-soft);
-}
-
-.model-usage-chart {
-  border-top-color: var(--ui-border);
-}
-
-.model-usage-chart__svg {
-  border-color: var(--ui-border);
-  background: #fbfcfe;
-}
-
-.model-usage-chart__record {
-  border: 1px solid transparent;
-  background: var(--ui-bg-soft);
-}
-
-.model-usage-chart__record:not(.model-usage-chart__record--head):hover {
-  border-color: #f2d768;
-  background: #fffdf2;
-}
-
-.model-usage-chart__record--head {
-  background: #eef1f5;
-  color: #374151;
-}
-
-.app-preset-row,
-.script-row,
-.step-item {
-  border-color: var(--ui-border);
-  border-radius: var(--ui-radius-control);
-}
-
-.app-preset-row:hover,
-.script-row:hover {
-  border-color: #efd467;
-  background: #fffdf4;
-}
-
-.method-guide {
-  border-color: #f0dc8a;
-  background: #fffbed;
-}
-
-.method-guide__summary {
-  color: #594b12;
-}
-
-.step-item {
-  background: var(--ui-bg-soft);
-}
-
-.code-block,
-.terminal-block,
-.generator-code-editor .el-textarea__inner,
-.code-dialog__editor .el-textarea__inner {
-  background: #111827;
-}
-
-.automation-layout,
-.automation-stage {
-  gap: 16px;
-}
-
-.script-row--active {
-  border-color: #e7c63f;
-  background: #fff9df;
-}
-
-.execution-output {
-  border-color: var(--ui-border);
-  border-radius: var(--ui-radius-control);
-  background: var(--ui-surface);
-}
-
-.execution-log__output {
-  border-radius: var(--ui-radius-control);
-  background: #111827;
-}
-
-.device-preview {
-  border-radius: var(--ui-radius-control);
-  background: #0f172a;
-}
-
-.device-preview--empty {
-  border: 1px dashed var(--ui-border-strong);
-  background: #fafafa;
-}
-
-.device-action-button {
-  border-radius: var(--ui-radius-control);
-}
-
-.device-action-button:hover {
-  background: #fff8d6;
-}
-
-.appium-header-actions {
-  top: 0;
-  right: 24px;
-  height: 64px;
-  gap: 8px;
-}
-
-.appium-recorder-page {
-  gap: 16px;
-}
-
-.appium-recorder-layout {
-  gap: 16px;
-}
-
-.appium-workbench-tabs > .el-tabs__header {
-  padding: 0 18px;
-  background: #fbfcfe;
-}
-
-.appium-workbench {
-  gap: 18px;
-  padding: 18px;
-}
-
-.appium-workbench__section h3 {
-  color: var(--ui-text);
-  font-size: 15px;
-  font-weight: 650;
-}
-
-.appium-tree .el-tree-node__content {
-  min-height: 30px;
-  border-radius: 4px;
-}
-
-.appium-tree .el-tree-node__content:hover {
-  background: #fffbed;
-}
-
-.appium-tree .el-tree-node.is-current > .el-tree-node__content {
-  background: #fff6cf;
-  color: #6b5700;
-}
-
-.appium-current-activity {
-  border-top-color: var(--ui-border);
-  background: #fbfcfe;
-}
-
-.appium-current-activity > span {
-  color: var(--ui-text-secondary);
-  font-weight: 500;
-}
-
-.appium-side-form {
-  gap: 10px;
-}
-
-.appium-script-list__item {
-  border-color: var(--ui-border);
-  border-radius: var(--ui-radius-control);
-  background: var(--ui-surface);
-}
-
-.appium-script-list__item:hover {
-  border-color: #efd467;
-  background: #fffdf4;
-}
-
-.appium-script-list__item--active {
-  border-color: #e7c63f;
-  background: #fff9df;
-}
-
-.appium-replay-fab .el-button {
-  box-shadow: 0 8px 24px rgba(181, 145, 0, 0.24);
-}
-
-.appium-replay-output--dialog {
-  border-radius: var(--ui-radius-control);
-  background: #111827;
-}
-
-.el-button.recorder-panel-tool {
-  --el-button-text-color: #606266;
-  --el-button-border-color: #dcdfe6;
-  --el-button-disabled-text-color: #a8abb2;
-  --el-button-disabled-border-color: #e4e7ed;
-  --el-color-primary: #409eff;
-  --el-color-primary-light-3: #79bbff;
-  --el-color-primary-light-5: #a0cfff;
-  --el-color-primary-light-7: #c6e2ff;
-  --el-color-primary-light-9: #ecf5ff;
-  --el-color-primary-dark-2: #337ecc;
-  width: 30px;
-  min-width: 30px;
-  height: 32px;
-  min-height: 32px;
-  padding: 0;
-  margin: 0;
-  border-radius: 3px;
-  font-size: 12px;
-  font-weight: 400;
-}
-
-/* Keep the Appium flow editor on its original Element Plus theme. */
-.appium-recorded-steps-panel,
-.appium-flow-dialog,
-.appium-action-dropdown {
-  --el-color-primary: #409eff;
-  --el-color-primary-light-3: #79bbff;
-  --el-color-primary-light-5: #a0cfff;
-  --el-color-primary-light-7: #c6e2ff;
-  --el-color-primary-light-8: #d9ecff;
-  --el-color-primary-light-9: #ecf5ff;
-  --el-color-primary-dark-2: #337ecc;
-  --el-color-success: #67c23a;
-  --el-color-warning: #e6a23c;
-  --el-color-danger: #f56c6c;
-  --el-text-color-primary: #303133;
-  --el-text-color-regular: #606266;
-  --el-text-color-secondary: #909399;
-  --el-text-color-placeholder: #a8abb2;
-  --el-border-color: #dcdfe6;
-  --el-border-color-light: #e4e7ed;
-  --el-border-color-lighter: #ebeef5;
-  --el-fill-color-light: #f5f7fa;
-  --el-fill-color-lighter: #fafafa;
-  --el-border-radius-base: 4px;
-  --el-border-radius-small: 2px;
-  color: #303133;
-}
-
-.appium-flow-dialog.el-dialog {
-  display: flex;
-  flex-direction: column;
-  height: 86dvh;
-  max-height: calc(100dvh - 32px);
-  overflow: visible;
-  padding: 16px;
-  border: 0;
-  border-radius: 4px;
-  box-shadow: var(--el-box-shadow);
-}
-
-.appium-flow-dialog .el-dialog__header {
-  flex: none;
-  padding: 0 0 16px;
-  border-bottom: 0;
-}
-
-.appium-flow-dialog .el-dialog__title {
-  font-size: var(--el-dialog-title-font-size);
-  font-weight: 400;
-}
-
-.appium-flow-dialog .el-dialog__body {
-  display: flex;
-  flex-direction: column;
-  flex: 1;
-  min-height: 0;
-  padding: 8px 0 0;
-}
-
-.appium-flow-dialog__toolbar { flex: none; }
-
-/* Keep the canvas within the centered dialog even on short viewports. */
-.appium-flow-dialog .appium-flow-canvas--dialog.appium-flow-canvas--vue {
-  flex: 1;
-  height: auto;
-  min-height: 0;
-}
-
-.appium-flow-dialog .el-dialog__footer {
-  padding: 16px 0 0;
-}
-
-.appium-recorded-steps-panel .el-button,
-.appium-flow-dialog .el-button {
-  --el-button-disabled-text-color: #a8abb2;
-  font-weight: 400;
-}
-
-.appium-recorded-steps-panel .el-form-item__label,
-.appium-flow-dialog .el-form-item__label {
-  color: #606266;
-  font-size: 14px;
-  font-weight: 400;
-}
-
-.appium-recorded-steps-panel .el-button:not(.is-circle),
-.appium-flow-dialog .el-button:not(.is-circle) {
-  min-height: var(--el-component-size, 32px);
-  padding-right: 15px;
-  padding-left: 15px;
-}
-
-.appium-recorded-steps-panel .el-button--primary:not(.is-disabled),
-.appium-flow-dialog .el-button--primary:not(.is-disabled) {
-  --el-button-text-color: #fff;
-  --el-button-hover-text-color: #fff;
-  --el-button-active-text-color: #fff;
-  box-shadow: none;
-}
-
-@media (max-width: 1440px) {
-  .layout {
-    grid-template-columns: 200px minmax(0, 1fr);
-  }
-
-  .page-body {
-    padding-right: 18px;
-    padding-left: 18px;
-  }
-}