mirror of
https://github.com/web-infra-dev/midscene.git
synced 2026-01-06 04:01:20 +00:00
fix: style of chrome (#586)
This commit is contained in:
Leyang
GitHub
parent
2cc12dad12
commit
bcfcb3c4d0
@ -106,11 +106,12 @@ body {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
height: 100%;
|
||||
gap: 24px;
|
||||
}
|
||||
|
||||
.command-input-wrapper {
|
||||
margin-top: 8px;
|
||||
margin-bottom: 25px;
|
||||
margin-bottom: 24px;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
@ -16,230 +16,6 @@
|
||||
height: 22px;
|
||||
}
|
||||
|
||||
/* src/component/blackboard.less */
|
||||
.blackboard .footer {
|
||||
color: #aaa;
|
||||
}
|
||||
|
||||
.blackboard ul {
|
||||
padding-left: 0px;
|
||||
}
|
||||
|
||||
.blackboard li {
|
||||
list-style: none;
|
||||
}
|
||||
|
||||
.blackboard .bottom-tip {
|
||||
height: 30px;
|
||||
}
|
||||
|
||||
.blackboard .bottom-tip-item {
|
||||
max-width: 500px;
|
||||
color: #aaa;
|
||||
text-overflow: ellipsis;
|
||||
word-wrap: break-word;
|
||||
}
|
||||
|
||||
.blackboard-filter {
|
||||
margin: 10px 0;
|
||||
}
|
||||
|
||||
.blackboard-main-content canvas {
|
||||
width: 100%;
|
||||
border: 1px solid #888;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
/* src/component/player.less */
|
||||
.player-container {
|
||||
width: fit-content;
|
||||
max-width: 100%;
|
||||
max-height: 100%;
|
||||
padding: 12px 0;
|
||||
padding-bottom: 0;
|
||||
background: #434443dd;
|
||||
box-sizing: border-box;
|
||||
border: 1px solid #979797;
|
||||
border-radius: 6px;
|
||||
line-height: 100%;
|
||||
margin: 0 auto;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.player-container .canvas-container {
|
||||
flex-grow: 1;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
overflow: hidden;
|
||||
padding: 0 12px;
|
||||
}
|
||||
|
||||
.player-container .canvas-container canvas {
|
||||
max-width: 100%;
|
||||
max-height: 100%;
|
||||
box-sizing: border-box;
|
||||
display: block;
|
||||
margin: 0 auto;
|
||||
}
|
||||
|
||||
.player-container .player-timeline {
|
||||
width: 100%;
|
||||
height: 4px;
|
||||
background: #666;
|
||||
position: relative;
|
||||
margin-top: -2px;
|
||||
}
|
||||
|
||||
.player-container .player-timeline .player-timeline-progress {
|
||||
transition-timing-function: linear;
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
height: 4px;
|
||||
background: #2B83FF;
|
||||
}
|
||||
|
||||
.player-container .player-tools {
|
||||
margin-top: 15px;
|
||||
margin-bottom: 15px;
|
||||
max-width: 100%;
|
||||
overflow: hidden;
|
||||
color: #fff;
|
||||
font-size: 16px;
|
||||
box-sizing: border-box;
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
padding: 0 12px;
|
||||
justify-content: space-between;
|
||||
height: 40px;
|
||||
flex-shrink: 0;
|
||||
}
|
||||
|
||||
.player-container .player-tools .player-control {
|
||||
flex-grow: 1;
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
}
|
||||
|
||||
.player-container .player-tools .status-icon {
|
||||
transition: 0.2s;
|
||||
width: 40px;
|
||||
height: 40px;
|
||||
margin-right: 12px;
|
||||
border-radius: 6px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
flex-shrink: 0;
|
||||
}
|
||||
|
||||
.player-container .player-tools .status-text {
|
||||
flex-grow: 1;
|
||||
overflow: hidden;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.player-container .player-tools .title {
|
||||
font-weight: bold;
|
||||
height: 20px;
|
||||
line-height: 20px;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
white-space: nowrap;
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.player-container .player-tools .subtitle {
|
||||
height: 20px;
|
||||
line-height: 20px;
|
||||
width: 100%;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
white-space: nowrap;
|
||||
position: absolute;
|
||||
top: 18px;
|
||||
left: 0;
|
||||
}
|
||||
|
||||
.player-container .player-tools .player-tools-item {
|
||||
height: 100%;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
.player-container .player-tools .player-tools-item .ant-btn-variant-link {
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
/* src/component/playground-component.less */
|
||||
body {
|
||||
margin: 0;
|
||||
font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Noto Sans',
|
||||
Helvetica, Arial, sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji';
|
||||
font-size: 14px;
|
||||
}
|
||||
|
||||
.playground-container {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
min-height: 0;
|
||||
}
|
||||
|
||||
.playground-container.vertical-mode {
|
||||
height: 100%;
|
||||
min-height: 0;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
}
|
||||
|
||||
.playground-container.vertical-mode .form-part {
|
||||
margin-bottom: 15px;
|
||||
}
|
||||
|
||||
.playground-container.vertical-mode .form-part h3 {
|
||||
font-size: 14px;
|
||||
line-height: 1.6;
|
||||
}
|
||||
|
||||
.playground-container .playground-header {
|
||||
padding: 10px 10px 30px;
|
||||
}
|
||||
|
||||
.playground-container .playground-left-panel {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
background-color: #fff;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: space-between;
|
||||
overflow-y: auto !important;
|
||||
}
|
||||
|
||||
.playground-container .playground-left-panel .ant-form {
|
||||
height: 100%;
|
||||
flex-grow: 1;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
.playground-container .playground-form-container {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
height: 100%;
|
||||
flex: 1;
|
||||
}
|
||||
|
||||
/* 命令表单样式 */
|
||||
.command-form {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
@ -253,157 +29,20 @@ body {
|
||||
height: 100%;
|
||||
min-height: 0;
|
||||
position: relative;
|
||||
gap: 24px;
|
||||
}
|
||||
|
||||
.playground-container .form-part {
|
||||
margin-bottom: 10px;
|
||||
padding: 0 20px;
|
||||
min-height: 0;
|
||||
}
|
||||
|
||||
.playground-container .form-part:not(.result-container) {
|
||||
flex: 0 1 auto;
|
||||
overflow: auto;
|
||||
}
|
||||
|
||||
.playground-container .form-part h3 {
|
||||
margin-top: 0;
|
||||
margin-bottom: 8px;
|
||||
font-size: 18px;
|
||||
}
|
||||
|
||||
.playground-container .form-part:first-child {
|
||||
overflow: auto;
|
||||
flex: 0 1 auto;
|
||||
}
|
||||
|
||||
.playground-container .form-part .switch-btn-wrapper {
|
||||
margin-left: 2px;
|
||||
}
|
||||
|
||||
.playground-container .input-wrapper {
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
.playground-container .input-wrapper .main-side-console-input {
|
||||
position: relative;
|
||||
margin-top: 4px;
|
||||
}
|
||||
|
||||
.playground-container .input-wrapper .ant-input {
|
||||
padding-bottom: 40px;
|
||||
}
|
||||
|
||||
.playground-container .input-wrapper .form-controller-wrapper {
|
||||
position: absolute;
|
||||
bottom: 8px;
|
||||
padding: 0 12px;
|
||||
left: 0px;
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
justify-content: space-between;
|
||||
width: 100%;
|
||||
box-sizing: border-box;
|
||||
align-items: flex-end;
|
||||
gap: 8px;
|
||||
}
|
||||
|
||||
.playground-container .input-wrapper .settings-wrapper {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
gap: 2px;
|
||||
color: #777;
|
||||
flex-wrap: wrap;
|
||||
}
|
||||
|
||||
.playground-container .input-wrapper .settings-wrapper.settings-wrapper-hover {
|
||||
color: #3b3b3b;
|
||||
}
|
||||
|
||||
.playground-container .input-wrapper .history-selector {
|
||||
margin-right: 8px;
|
||||
}
|
||||
|
||||
.playground-container .loading-container {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
box-sizing: border-box;
|
||||
padding: 20px 20px;
|
||||
}
|
||||
|
||||
.playground-container .loading-container .loading-progress-text {
|
||||
text-align: center;
|
||||
width: 100%;
|
||||
color: #777;
|
||||
margin-top: 16px;
|
||||
}
|
||||
|
||||
.playground-container .loading-container .loading-progress-text-tab-info {
|
||||
overflow: hidden;
|
||||
white-space: nowrap;
|
||||
text-overflow: ellipsis;
|
||||
}
|
||||
|
||||
.playground-container .loading-container .loading-progress-text-progress {
|
||||
height: 60px;
|
||||
}
|
||||
|
||||
.playground-container .result-wrapper {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: center;
|
||||
box-sizing: border-box;
|
||||
border-radius: 4px;
|
||||
flex: 1;
|
||||
}
|
||||
|
||||
.playground-container .result-wrapper.result-wrapper-compact {
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
.playground-container .result-wrapper.vertical-mode-result {
|
||||
height: inherit;
|
||||
min-height: 300px;
|
||||
}
|
||||
|
||||
.playground-container .result-wrapper .result-empty-tip {
|
||||
text-align: center;
|
||||
width: 100%;
|
||||
color: #ccc;
|
||||
}
|
||||
|
||||
.playground-container .result-wrapper pre {
|
||||
display: block;
|
||||
word-wrap: break-word;
|
||||
white-space: pre-wrap;
|
||||
}
|
||||
|
||||
/* 添加结果容器样式 */
|
||||
.result-container {
|
||||
grid-row: 2;
|
||||
margin-top: 12px;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
min-height: 0;
|
||||
position: relative;
|
||||
overflow: auto;
|
||||
padding-top: 12px;
|
||||
}
|
||||
|
||||
.result-container>div {
|
||||
flex: 1;
|
||||
height: auto;
|
||||
min-height: 0;
|
||||
}
|
||||
|
||||
.playground-container.vertical-mode .result-container {
|
||||
grid-row: 2;
|
||||
}
|
||||
|
||||
/* src/component/open-in-playground.less */
|
||||
.playground-drawer .ant-drawer-body {
|
||||
padding: 0;
|
||||
}
|
||||
@ -28,7 +28,7 @@ html {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
box-sizing: border-box;
|
||||
padding: @layout-extension-space-vertical 0;
|
||||
padding: @layout-extension-space-vertical 25px 0 25px;
|
||||
background: #FFF;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
@ -41,7 +41,7 @@ html {
|
||||
}
|
||||
|
||||
.ant-tabs-nav {
|
||||
padding: 0 @layout-extension-space-horizontal;
|
||||
margin: 0 0 24px 0;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
@ -112,10 +112,6 @@ html {
|
||||
transition: opacity 0.15s cubic-bezier(0.4, 0, 0.2, 1), transform 0.15s cubic-bezier(0.4, 0, 0.2, 1), visibility 0s linear 0.15s;
|
||||
}
|
||||
|
||||
.popup-header {
|
||||
padding: 0 @layout-extension-space-horizontal;
|
||||
}
|
||||
|
||||
.hr {
|
||||
border-top: 1px solid @border-color;
|
||||
margin-bottom: 15px;
|
||||
|
||||
@ -20,6 +20,7 @@ export class AndroidDevice implements AndroidDevicePage {
|
||||
private adb: ADB | null = null;
|
||||
private connectingAdb: Promise<ADB> | null = null;
|
||||
pageType = 'android';
|
||||
uri: string | undefined;
|
||||
|
||||
constructor(deviceId: string) {
|
||||
assert(deviceId, 'deviceId is required for AndroidDevice');
|
||||
@ -120,6 +121,7 @@ ${Object.keys(size)
|
||||
|
||||
public async launch(uri: string): Promise<AndroidDevice> {
|
||||
const adb = await this.getAdb();
|
||||
this.uri = uri;
|
||||
|
||||
try {
|
||||
if (
|
||||
@ -368,11 +370,7 @@ ${Object.keys(size)
|
||||
}
|
||||
|
||||
async url(): Promise<string> {
|
||||
const adb = await this.getAdb();
|
||||
|
||||
const { appPackage, appActivity } =
|
||||
await adb.getFocusedPackageAndActivity();
|
||||
return `${appPackage}/${appActivity}`;
|
||||
return '';
|
||||
}
|
||||
|
||||
async scrollUntilTop(startPoint?: Point): Promise<void> {
|
||||
|
||||
@ -123,6 +123,7 @@ body {
|
||||
border-radius: 8px;
|
||||
color: rgba(0, 0, 0, 0.45);
|
||||
font-size: 14px;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user