@midscene/android-playground 0.25.4-beta-20250811115904.0 → 0.26.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/package.json +4 -4
- package/static/index.html +1 -1
- package/static/static/css/{index.1b4c3383.css → index.76d92e80.css} +2 -2
- package/static/static/css/{index.1b4c3383.css.map → index.76d92e80.css.map} +1 -1
- package/static/static/js/{index.3061f7c5.js → index.7cf27480.js} +127 -98
- package/static/static/js/{index.3061f7c5.js.map → index.7cf27480.js.map} +1 -1
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@midscene/android-playground",
|
|
3
|
-
"version": "0.
|
|
3
|
+
"version": "0.26.1",
|
|
4
4
|
"description": "Android playground for Midscene",
|
|
5
5
|
"main": "./dist/lib/index.js",
|
|
6
6
|
"types": "./dist/types/index.d.ts",
|
|
@@ -24,9 +24,9 @@
|
|
|
24
24
|
"express": "^4.21.2",
|
|
25
25
|
"open": "10.1.0",
|
|
26
26
|
"socket.io": "^4.8.1",
|
|
27
|
-
"@midscene/shared": "0.
|
|
28
|
-
"@midscene/
|
|
29
|
-
"@midscene/
|
|
27
|
+
"@midscene/shared": "0.26.1",
|
|
28
|
+
"@midscene/web": "0.26.1",
|
|
29
|
+
"@midscene/android": "0.26.1"
|
|
30
30
|
},
|
|
31
31
|
"devDependencies": {
|
|
32
32
|
"@modern-js/module-tools": "2.60.6",
|
package/static/index.html
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
<!doctype html><html><head><title>Midscene Android Playground</title><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><script defer src="/static/js/lib-react.8db3c72f.js"></script><script defer src="/static/js/770.cc6deea1.js"></script><script defer src="/static/js/index.
|
|
1
|
+
<!doctype html><html><head><title>Midscene Android Playground</title><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><script defer src="/static/js/lib-react.8db3c72f.js"></script><script defer src="/static/js/770.cc6deea1.js"></script><script defer src="/static/js/index.7cf27480.js"></script><link href="/static/css/index.76d92e80.css" rel="stylesheet"></head><body><div id="root"></div></body></html>
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
body{margin:0;padding:0;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Noto Sans,Helvetica,Arial,sans-serif,Apple Color Emoji,Segoe UI Emoji;font-size:14px}.app-container{background-color:#f5f5f5;flex-direction:column;width:100%;height:100vh;display:flex}.app-content{height:100vh;overflow:hidden}.app-grid-layout{height:100%;display:flex}.app-grid-layout .ant-row{flex-wrap:nowrap;flex:1;width:100%;height:100%;display:flex}.app-panel{background-color:#fff;border-radius:0;height:100%;transition:box-shadow .3s;overflow:hidden;box-shadow:0 1px 2px #0000000d}.app-panel:hover{box-shadow:0 2px 8px #00000017}.app-panel.left-panel{flex-direction:column;flex:none;width:480px;height:100%;display:flex;overflow:hidden}.app-panel.right-panel{border-radius:0;flex:1;overflow:hidden;box-shadow:-4px 0 20px #0000000a}.panel-content{border-left:1px solid #00000014;flex-direction:column;height:100%;padding:12px 24px 24px;display:flex;overflow:auto}.panel-content.left-panel-content{flex-direction:column;height:100%;display:flex;overflow:hidden}.panel-content.right-panel-content{border-radius:0}.panel-content h2{color:#000;margin-top:16px;margin-bottom:12px;font-size:18px}.panel-content canvas{border:1px solid #f0f0f0;border-radius:4px;max-width:100%;margin-top:16px}.command-form{flex-direction:column;height:100%;display:flex;overflow:hidden}.command-form .form-content{flex-direction:column;gap:24px;height:100%;display:flex}.command-form .command-input-wrapper{margin-top:8px}.result-container{flex-direction:column;flex:1;height:100%;min-height:0;display:flex;position:relative;overflow:hidden}@media (max-width:768px){.app-container{height:auto;min-height:100vh}.app-grid-layout .ant-row{flex-wrap:wrap!important}.app-panel{height:auto;min-height:200px;margin-bottom:16px;flex:0 0 100%!important;width:100%!important}.app-panel:first-child,.app-panel:first-child .panel-content{border-radius:20px}.panel-content{padding:12px}.panel-content h2{margin-bottom:12px;padding-bottom:6px;font-size:16px}.panel-content textarea{min-height:100px}}@media (min-width:769px) and (max-width:992px){.app-panel{min-height:300px;margin-bottom:16px}}.resize-handle{background-color:#f0f0f0;width:2px;transition:background-color .2s}.resize-handle:hover{background-color:#1677ff}.device-header{align-items:center;margin-bottom:16px;display:flex}.device-header .device-title-container{align-items:center;display:flex}.device-header .device-title{color:#000;align-items:center;height:32px;margin:0 12px 0 0;font-size:18px;display:flex}.device-dropdown-button{box-shadow:none;background:#f0f0f0;border:none;border-radius:20px;align-items:center;height:32px;padding:4px 12px 4px 8px;display:flex}.device-dropdown-button .device-icon-container{background:#3b82f6;border-radius:50%;justify-content:center;align-items:center;width:24px;height:24px;display:flex;position:relative}.device-dropdown-button .device-icon-container .device-icon{color:#fff;font-size:14px}.device-dropdown-button .device-icon-container .status-indicator{align-items:center;display:flex;position:absolute;bottom:-5px;right:-5px}.device-dropdown-button .device-name{color:#333;text-overflow:ellipsis;white-space:nowrap;max-width:120px;margin-left:8px;margin-right:4px;font-size:16px;font-weight:700;overflow:hidden}.device-dropdown-button .device-name.no-device{color:#999;font-style:italic;font-weight:400}.device-dropdown-button .dropdown-arrow{color:#666;font-size:12px;font-weight:700;transform:scaleY(.6)}.device-dropdown{background:#fff;border:1px solid #eaedf1;border-radius:8px;width:430px;overflow:hidden;box-shadow:0 10px 20px #00000005}.device-dropdown .dropdown-header{justify-content:space-between;align-items:center;padding:16px 16px 12px;display:flex}.device-dropdown .dropdown-header .dropdown-title{color:#333;font-size:16px;font-weight:700}.device-dropdown .device-list-item{cursor:pointer;padding:5px 17px 9px 6px}.device-dropdown .device-list-item.selected{background:#2b83ff14}.device-dropdown .device-list-item.offline{cursor:not-allowed;opacity:.5}.device-dropdown .device-list-item .device-item-content{align-items:center;display:flex}.device-dropdown .device-list-item .device-item-content .device-item-icon-container{justify-content:center;align-items:center;width:34px;height:34px;margin-right:12px;display:flex}.device-dropdown .device-list-item .device-item-content .device-item-icon-container .device-item-icon{color:#666;font-size:22px}.device-dropdown .device-list-item .device-item-content .device-item-info{flex:1}.device-dropdown .device-list-item .device-item-content .device-item-info .device-item-name{color:#333;font-size:15px;font-weight:700}.device-dropdown .device-list-item .device-item-content .device-item-info .device-item-status{align-items:center;margin-top:4px;display:flex}.device-dropdown .device-list-item .device-item-content .device-item-info .device-item-status .status-badge{align-items:center;margin-right:12px;display:flex}.device-dropdown .device-list-item .device-item-content .device-item-info .device-item-status .status-badge .status-text{color:#666;font-size:12px}.device-dropdown .device-list-item .device-item-content .device-item-info .device-item-status .device-id-container{color:#999;font-size:12px}.device-dropdown .device-list-item .device-item-content .current-device-indicator{color:#1890ff;margin-left:auto;font-size:13px;font-weight:700}.device-dropdown .device-list-empty{text-align:center;color:#999;padding:20px}.status-dot{margin-right:4px;font-size:12px}.status-divider{margin:0 4px}.scrcpy-container{flex-direction:column;width:100%;height:100%;display:flex}.scrcpy-container .ant-card{background:0 0;border:none;flex-direction:column;flex:1;display:flex}.scrcpy-container .ant-card .ant-card-head{display:none}.scrcpy-container .ant-card .ant-card-body{flex-direction:column;flex:1;padding:0;display:flex}.scrcpy-container .ant-card .ant-card-body .ant-row{flex:1;margin:0!important}.scrcpy-container .ant-card .ant-card-body .ant-row .ant-col{padding:0!important}.scrcpy-container .ant-card .ant-card-body .ant-row .ant-col:first-child{flex-direction:column;flex:1;display:flex}.scrcpy-container .header-bar{-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);background:#ffffffe6;border:1px solid #f5f5f5;border-top-left-radius:12px;border-top-right-radius:12px;grid-template-columns:1fr auto 1fr;align-items:center;padding:8px 16px;display:grid}.scrcpy-container .header-bar .header-left{align-items:center;gap:8px;display:flex}.scrcpy-container .header-bar .header-left .ant-typography{color:#333;margin:0;font-size:14px}.scrcpy-container .header-bar .header-left .anticon{color:#999;cursor:pointer;font-size:14px}.scrcpy-container .header-bar .header-left .anticon:hover{color:#666}.scrcpy-container .header-bar .screen-info{text-align:center}.scrcpy-container .header-bar .screen-info .ant-typography{color:#666;margin:0;font-size:14px}.scrcpy-container .header-bar .header-right{justify-self:end;align-items:center;gap:8px;display:flex}.scrcpy-container .header-bar .header-right .ant-btn{border:none;justify-content:center;align-items:center;width:16px;height:16px;display:flex}.scrcpy-container .header-bar .header-right .ant-btn .link-icon{font-size:16px;line-height:1}.scrcpy-container .video-section{flex-direction:column;flex:1;display:flex;position:relative}.scrcpy-container .video-section .video-container{background-color:#f5f5f5;border-bottom-right-radius:12px;border-bottom-left-radius:12px;flex:1;justify-content:center;align-items:center;width:100%;display:flex;position:relative;overflow:hidden}.scrcpy-container .video-section .video-container .canvas-wrapper{justify-content:center;align-items:center;width:100%;height:100%;display:flex;position:absolute;top:0;left:0}.scrcpy-container .video-section .video-container canvas{box-shadow:none!important;border:none!important}.scrcpy-container .video-section .video-container .empty-state{z-index:1;text-align:center;flex-direction:column;align-items:center;gap:16px;padding:24px;display:flex;position:relative}.scrcpy-container .video-section .video-container .empty-state .empty-state-icon{font-size:48px;line-height:1}.scrcpy-container .video-section .video-container .empty-state .empty-state-text{color:#666;margin-bottom:8px;font-size:16px}.scrcpy-container .video-section .video-container .empty-state .loading-spinner{margin-top:16px}.scrcpy-container .video-section .video-container .empty-state .loading-spinner .ant-spin{color:#1677ff}.scrcpy-container .video-section .video-container .empty-state .ant-btn{border-radius:20px;min-width:120px;height:40px;font-size:16px}.scrcpy-container .video-section .screen-info{background:#00000080;border-radius:4px;padding:4px 8px;position:absolute;bottom:8px;left:8px}.scrcpy-container .video-section .screen-info .ant-typography{color:#fff;margin:0}@media (max-width:576px){.scrcpy-container .header-bar{grid-template-rows:auto auto auto;grid-template-columns:1fr;gap:8px;padding:8px}.scrcpy-container .header-bar .header-left,.scrcpy-container .header-bar .screen-info{text-align:center}.scrcpy-container .header-bar .header-right{justify-content:flex-end;justify-self:center;width:100%}}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}.prompt-input-wrapper{width:100%}.prompt-input-wrapper .mode-radio-group-wrapper{justify-content:space-between;align-items:center;display:flex}.prompt-input-wrapper .mode-radio-group-wrapper .mode-radio-group{align-items:center;height:100%;display:flex}.prompt-input-wrapper .mode-radio-group-wrapper .mode-radio-group .ant-radio-button-wrapper{height:24px;box-shadow:none;background-color:#f7f7f7;border:none;border-radius:11px;margin-right:8px;padding:0 8px;font-size:12px;line-height:24px}.prompt-input-wrapper .mode-radio-group-wrapper .mode-radio-group .ant-radio-button-wrapper:before{display:none}.prompt-input-wrapper .mode-radio-group-wrapper .mode-radio-group .ant-radio-button-wrapper:focus-within{outline:none}.prompt-input-wrapper .mode-radio-group-wrapper .mode-radio-group .ant-radio-button-wrapper.ant-radio-button-wrapper-checked{color:#fff;background-color:#2b83ff;border-color:#2b83ff}.prompt-input-wrapper .mode-radio-group-wrapper .mode-radio-group .ant-radio-button-wrapper.ant-radio-button-wrapper-checked:hover{color:#fff}.prompt-input-wrapper .mode-radio-group-wrapper .mode-radio-group .ant-radio-button-wrapper:hover{color:#2b83ff}.prompt-input-wrapper .mode-radio-group-wrapper .action-icons{align-items:center;display:flex}.prompt-input-wrapper .main-side-console-input{margin-top:10px;position:relative}.prompt-input-wrapper .main-side-console-input .main-side-console-input-textarea{white-space:pre-wrap;scrollbar-width:thin;background:#fff;border:1px solid #f2f4f7;border-radius:12px;padding:12px 16px;line-height:21px;transition:background-color .2s;overflow-y:auto}@keyframes hue-shift{0%{filter:hue-rotate()}to{filter:hue-rotate(360deg)}}.prompt-input-wrapper .main-side-console-input .main-side-console-input-textarea:focus-within{background:linear-gradient(#fff,#fff) padding-box padding-box,linear-gradient(135deg,#4285f4 0%,#06f 25%,#7b02c5 50%,#ea4335 75%,#ff7043 100%) border-box;border:1px solid #0000}.prompt-input-wrapper .main-side-console-input .main-side-console-input-textarea::-webkit-scrollbar{width:6px}.prompt-input-wrapper .main-side-console-input .main-side-console-input-textarea::-webkit-scrollbar-thumb{background-color:#0003;border-radius:3px}.prompt-input-wrapper .main-side-console-input.loading .main-side-console-input-textarea{background:linear-gradient(#fff,#fff) padding-box padding-box,linear-gradient(135deg,#4285f4 0%,#06f 25%,#7b02c5 50%,#ea4335 75%,#ff7043 100%) border-box;border:1px solid #0000;animation:5s linear infinite hue-shift}.prompt-input-wrapper .main-side-console-input .ant-form-item-control-input-content{z-index:999;border:3px solid #0000;border-radius:14px}.prompt-input-wrapper .main-side-console-input:focus-within .ant-form-item-control-input-content{border-color:#2b83ff29}.prompt-input-wrapper .main-side-console-input.disabled .form-controller-wrapper{background-color:#0000}.prompt-input-wrapper .ant-input{padding-bottom:40px}.prompt-input-wrapper .form-controller-wrapper{box-sizing:border-box;background-color:#fff;flex-direction:row;justify-content:flex-end;align-items:flex-end;gap:8px;width:calc(100% - 32px);padding:12px 0;line-height:32px;transition:background-color .2s;display:flex;position:absolute;bottom:.5px;left:16px}.prompt-input-wrapper .settings-wrapper{color:#777;flex-flow:wrap;gap:2px;display:flex}.prompt-input-wrapper .settings-wrapper.settings-wrapper-hover{color:#3b3b3b}.selector-trigger{cursor:pointer;width:24px;height:24px;transition:all .2s}.selector-trigger .action-icon{color:#000000d9;font-size:14px;transition:all .2s}.selector-trigger .action-icon:hover{color:#2b83ff}.history-modal-container{border-radius:12px 12px 0 0;flex-direction:column;height:70vh;display:flex;overflow:hidden}.history-modal-container .history-modal-header{justify-content:space-between;align-items:center;height:48px;padding:0 25px;line-height:48px;display:flex}.history-modal-container .history-modal-header .close-button{justify-content:center;align-items:center;margin-right:-4px;padding:4px;display:flex}.history-modal-container .history-modal-header .close-button .anticon{color:#999;font-size:18px}.history-modal-container .history-modal-header .close-button:hover .anticon{color:#666}.history-modal-container .history-search-section{background:#fff;padding:16px 20px}.history-modal-container .history-search-section .search-input-wrapper{color:#00000040;align-items:center;gap:12px;display:flex}.history-modal-container .history-search-section .search-input-wrapper .search-input{background:#f1f2f3;border:none;border-radius:16px;flex:1;height:36px}.history-modal-container .history-search-section .search-input-wrapper .search-input .ant-input{box-shadow:none;background:0 0;border:none}.history-modal-container .history-search-section .search-input-wrapper .search-input:hover,.history-modal-container .history-search-section .search-input-wrapper .search-input:focus-within{background:#fff;border-color:#d9d9d9}.history-modal-container .history-search-section .search-input-wrapper .clear-button{color:#1890ff;height:auto;padding:0}.history-modal-container .history-search-section .search-input-wrapper .clear-button:hover{color:#40a9ff}.history-modal-container .history-content{flex:1;padding:0 25px 25px;overflow-y:auto}.history-modal-container .history-content .history-group{margin-bottom:10px}.history-modal-container .history-content .history-group .history-group-title{color:#00000073;height:40px;font-size:12px;font-weight:400;line-height:40px}.history-modal-container .history-content .history-group .history-item{cursor:pointer;color:#000000d9;white-space:nowrap;text-overflow:ellipsis;height:40px;font-size:14px;line-height:40px;overflow:hidden}.history-modal-container .history-content .history-group .history-item:hover{background:#f2f4f7;margin:0 -8px;padding:0 8px}.history-modal-container .history-content .no-results{text-align:center;color:#999;padding:40px 20px}.ant-modal-wrap .ant-modal-content{animation:.3s cubic-bezier(.4,0,.2,1) forwards slideUpFromBottom!important}@keyframes slideUpFromBottom{0%{opacity:0;transform:translateY(100%)}to{opacity:1;transform:translateY(0)}}.result-wrapper{justify-content:center;height:100%;margin:4px 0;display:flex}.result-wrapper .loading-container{text-align:center}.result-wrapper pre{white-space:pre-wrap;text-wrap:unset;word-wrap:break-word;overflow-wrap:break-word;background:#f2f4f7;border-radius:8px;margin:0;padding:14px;overflow:scroll}.player-container{box-sizing:border-box;background:#f2f4f7;border:1px solid #f2f4f7;border-radius:8px;flex-direction:column;width:100%;max-width:100%;height:100%;min-height:300px;max-height:100%;margin:0 auto;padding:12px;line-height:100%;display:flex;position:relative;overflow:visible}.player-container[data-fit-mode=height]{background:#fff}.player-container[data-fit-mode=height] .canvas-container{background-color:#f2f4f7}.player-container .canvas-container{width:100%;min-height:200px;aspect-ratio:var(--canvas-aspect-ratio,16/9);background-color:#fff;border-top-left-radius:16px;border-top-right-radius:16px;flex:none;justify-content:center;align-items:center;display:flex;position:relative;overflow:hidden}.player-container .canvas-container canvas{box-sizing:border-box;object-fit:contain;border:none;width:100%;max-width:100%;height:auto;max-height:100%;margin:0 auto;display:block}.player-container .canvas-container[data-fit-mode=height]{aspect-ratio:unset;flex:auto;height:auto;min-height:0}.player-container .canvas-container[data-fit-mode=height] canvas{width:auto;max-width:100%;height:100%;max-height:100%}.player-container .canvas-container[data-fit-mode=width]{aspect-ratio:var(--canvas-aspect-ratio,16/9)}.player-container .canvas-container[data-fit-mode=width] canvas{width:100%;height:auto}.player-container .player-timeline-wrapper{flex:none;width:100%;height:4px;margin-bottom:2px;position:relative}.player-container .player-timeline{background:#666;flex-shrink:0;width:100%;height:4px;position:relative}.player-container .player-timeline .player-timeline-progress{background:#2b83ff;height:4px;transition-timing-function:linear;position:absolute;top:0;left:0}.player-container .player-tools-wrapper{box-sizing:border-box;flex:none;width:100%;height:72px;padding:15px 16px;position:relative}.player-container .player-tools{color:#000;box-sizing:border-box;flex-direction:row;flex-shrink:0;justify-content:space-between;width:100%;max-width:100%;height:42px;font-size:14px;display:flex;overflow:hidden}.player-container .player-tools .ant-spin{color:#333}.player-container .player-tools .player-control{flex-direction:row;flex-grow:1;align-items:center;display:flex;overflow:hidden}.player-container .player-tools .status-icon{border-radius:8px;flex-shrink:0;justify-content:center;align-items:center;width:32px;height:32px;margin-left:10px;transition:all .2s;display:flex}.player-container .player-tools .status-icon:hover{cursor:pointer;background:#f0f0f0}.player-container .player-tools .status-text{flex-direction:column;flex-grow:1;flex-shrink:1;justify-content:space-between;width:0;min-width:0;height:100%;display:flex;position:relative;overflow:hidden}.player-container .player-tools .title{font-weight:600}.player-container .player-tools .title,.player-container .player-tools .subtitle{text-overflow:ellipsis;white-space:nowrap;width:100%;overflow:hidden}.player-container .player-tools .player-tools-item{flex-direction:column;justify-content:center;height:100%;display:flex}.logo img{vertical-align:baseline;height:30px;vertical-align:-webkit-baseline-middle;line-height:30px}.logo-with-star-wrapper{flex-direction:row;justify-content:space-between;display:flex}.blackboard .footer{color:#aaa}.blackboard ul{padding-left:0}.blackboard li{list-style:none}.blackboard .bottom-tip{height:30px}.blackboard .bottom-tip-item{color:#aaa;text-overflow:ellipsis;word-wrap:break-word;max-width:500px}.blackboard-filter{margin:10px 0}.blackboard-main-content canvas{box-sizing:border-box;border:1px solid #888;width:100%}.shiny-text{color:#0000;letter-spacing:.5px;text-shadow:0 1px 2px #0000000d;background-image:linear-gradient(45deg,#2b83ff,#6a11cb,#2575fc,#4481eb);background-size:300%;-webkit-background-clip:text;background-clip:text;font-weight:600;animation:8s infinite textGradient;display:inline-block;position:relative;overflow:hidden}.shiny-text:after{content:"";width:120%;height:120%;animation:shine var(--animation-duration,5s)cubic-bezier(.25,.1,.25,1)infinite;z-index:1;pointer-events:none;background:linear-gradient(90deg,#fff0 0%,#ffffff1a 10%,#fff9 50%,#ffffff1a 90%,#fff0 100%);position:absolute;top:-10%;left:-150%;transform:skew(-20deg)translateY(0)}.shiny-text.disabled{background:#2b83ff;-webkit-background-clip:text;background-clip:text;animation:none}.shiny-text.disabled:after{animation:none;display:none}@keyframes shine{0%{opacity:.7;left:-150%}20%{opacity:1}80%{opacity:1}to{opacity:.7;left:250%}}@keyframes textGradient{0%{background-position:0%}50%{background-position:100%}to{background-position:0%}}.github-star{height:22px}.image-describer{position:relative}.image-describer .describe-text{box-sizing:border-box;color:#fff;background:#000;width:100%;height:30px;padding:10px;font-size:12px;position:absolute;bottom:0;left:0}.image-describer .describe-text.success{background:#047704}.image-describer .describe-text.error{background:#870707}
|
|
2
|
-
/*# sourceMappingURL=index.
|
|
1
|
+
body{margin:0;padding:0;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Noto Sans,Helvetica,Arial,sans-serif,Apple Color Emoji,Segoe UI Emoji;font-size:14px}.app-container{background-color:#f5f5f5;flex-direction:column;width:100%;height:100vh;display:flex}.app-content{height:100vh;overflow:hidden}.app-grid-layout{height:100%;display:flex}.app-grid-layout .ant-row{flex-wrap:nowrap;flex:1;width:100%;height:100%;display:flex}.app-panel{background-color:#fff;border-radius:0;height:100%;transition:box-shadow .3s;overflow:hidden;box-shadow:0 1px 2px #0000000d}.app-panel:hover{box-shadow:0 2px 8px #00000017}.app-panel.left-panel{flex-direction:column;flex:none;width:480px;height:100%;display:flex;overflow:hidden}.app-panel.right-panel{border-radius:0;flex:1;overflow:hidden;box-shadow:-4px 0 20px #0000000a}.panel-content{border-left:1px solid #00000014;flex-direction:column;height:100%;padding:12px 24px 24px;display:flex;overflow:auto}.panel-content.left-panel-content{flex-direction:column;height:100%;display:flex;overflow:hidden}.panel-content.right-panel-content{border-radius:0}.panel-content h2{color:#000;margin-top:16px;margin-bottom:12px;font-size:18px}.panel-content canvas{border:1px solid #f0f0f0;border-radius:4px;max-width:100%;margin-top:16px}.command-form{flex-direction:column;height:100%;display:flex;overflow:hidden}.command-form .form-content{flex-direction:column;gap:24px;height:100%;display:flex}.command-form .command-input-wrapper{margin-top:8px}.result-container{flex-direction:column;flex:1;height:100%;min-height:0;display:flex;position:relative;overflow:hidden}@media (max-width:768px){.app-container{height:auto;min-height:100vh}.app-grid-layout .ant-row{flex-wrap:wrap!important}.app-panel{height:auto;min-height:200px;margin-bottom:16px;flex:0 0 100%!important;width:100%!important}.app-panel:first-child,.app-panel:first-child .panel-content{border-radius:20px}.panel-content{padding:12px}.panel-content h2{margin-bottom:12px;padding-bottom:6px;font-size:16px}.panel-content textarea{min-height:100px}}@media (min-width:769px) and (max-width:992px){.app-panel{min-height:300px;margin-bottom:16px}}.resize-handle{background-color:#f0f0f0;width:2px;transition:background-color .2s}.resize-handle:hover{background-color:#1677ff}.device-header{align-items:center;margin-bottom:16px;display:flex}.device-header .device-title-container{align-items:center;display:flex}.device-header .device-title{color:#000;align-items:center;height:32px;margin:0 12px 0 0;font-size:18px;display:flex}.device-dropdown-button{box-shadow:none;background:#f0f0f0;border:none;border-radius:20px;align-items:center;height:32px;padding:4px 12px 4px 8px;display:flex}.device-dropdown-button .device-icon-container{background:#3b82f6;border-radius:50%;justify-content:center;align-items:center;width:24px;height:24px;display:flex;position:relative}.device-dropdown-button .device-icon-container .device-icon{color:#fff;font-size:14px}.device-dropdown-button .device-icon-container .status-indicator{align-items:center;display:flex;position:absolute;bottom:-5px;right:-5px}.device-dropdown-button .device-name{color:#333;text-overflow:ellipsis;white-space:nowrap;max-width:120px;margin-left:8px;margin-right:4px;font-size:16px;font-weight:700;overflow:hidden}.device-dropdown-button .device-name.no-device{color:#999;font-style:italic;font-weight:400}.device-dropdown-button .dropdown-arrow{color:#666;font-size:12px;font-weight:700;transform:scaleY(.6)}.device-dropdown{background:#fff;border:1px solid #eaedf1;border-radius:8px;width:430px;overflow:hidden;box-shadow:0 10px 20px #00000005}.device-dropdown .dropdown-header{justify-content:space-between;align-items:center;padding:16px 16px 12px;display:flex}.device-dropdown .dropdown-header .dropdown-title{color:#333;font-size:16px;font-weight:700}.device-dropdown .device-list-item{cursor:pointer;padding:5px 17px 9px 6px}.device-dropdown .device-list-item.selected{background:#2b83ff14}.device-dropdown .device-list-item.offline{cursor:not-allowed;opacity:.5}.device-dropdown .device-list-item .device-item-content{align-items:center;display:flex}.device-dropdown .device-list-item .device-item-content .device-item-icon-container{justify-content:center;align-items:center;width:34px;height:34px;margin-right:12px;display:flex}.device-dropdown .device-list-item .device-item-content .device-item-icon-container .device-item-icon{color:#666;font-size:22px}.device-dropdown .device-list-item .device-item-content .device-item-info{flex:1}.device-dropdown .device-list-item .device-item-content .device-item-info .device-item-name{color:#333;font-size:15px;font-weight:700}.device-dropdown .device-list-item .device-item-content .device-item-info .device-item-status{align-items:center;margin-top:4px;display:flex}.device-dropdown .device-list-item .device-item-content .device-item-info .device-item-status .status-badge{align-items:center;margin-right:12px;display:flex}.device-dropdown .device-list-item .device-item-content .device-item-info .device-item-status .status-badge .status-text{color:#666;font-size:12px}.device-dropdown .device-list-item .device-item-content .device-item-info .device-item-status .device-id-container{color:#999;font-size:12px}.device-dropdown .device-list-item .device-item-content .current-device-indicator{color:#1890ff;margin-left:auto;font-size:13px;font-weight:700}.device-dropdown .device-list-empty{text-align:center;color:#999;padding:20px}.status-dot{margin-right:4px;font-size:12px}.status-divider{margin:0 4px}.scrcpy-container{flex-direction:column;width:100%;height:100%;display:flex}.scrcpy-container .ant-card{background:0 0;border:none;flex-direction:column;flex:1;display:flex}.scrcpy-container .ant-card .ant-card-head{display:none}.scrcpy-container .ant-card .ant-card-body{flex-direction:column;flex:1;padding:0;display:flex}.scrcpy-container .ant-card .ant-card-body .ant-row{flex:1;margin:0!important}.scrcpy-container .ant-card .ant-card-body .ant-row .ant-col{padding:0!important}.scrcpy-container .ant-card .ant-card-body .ant-row .ant-col:first-child{flex-direction:column;flex:1;display:flex}.scrcpy-container .header-bar{-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);background:#ffffffe6;border:1px solid #f5f5f5;border-top-left-radius:12px;border-top-right-radius:12px;grid-template-columns:1fr auto 1fr;align-items:center;padding:8px 16px;display:grid}.scrcpy-container .header-bar .header-left{align-items:center;gap:8px;display:flex}.scrcpy-container .header-bar .header-left .ant-typography{color:#333;margin:0;font-size:14px}.scrcpy-container .header-bar .header-left .anticon{color:#999;cursor:pointer;font-size:14px}.scrcpy-container .header-bar .header-left .anticon:hover{color:#666}.scrcpy-container .header-bar .screen-info{text-align:center}.scrcpy-container .header-bar .screen-info .ant-typography{color:#666;margin:0;font-size:14px}.scrcpy-container .header-bar .header-right{justify-self:end;align-items:center;gap:8px;display:flex}.scrcpy-container .header-bar .header-right .ant-btn{border:none;justify-content:center;align-items:center;width:16px;height:16px;display:flex}.scrcpy-container .header-bar .header-right .ant-btn .link-icon{font-size:16px;line-height:1}.scrcpy-container .video-section{flex-direction:column;flex:1;display:flex;position:relative}.scrcpy-container .video-section .video-container{background-color:#f5f5f5;border-bottom-right-radius:12px;border-bottom-left-radius:12px;flex:1;justify-content:center;align-items:center;width:100%;display:flex;position:relative;overflow:hidden}.scrcpy-container .video-section .video-container .canvas-wrapper{justify-content:center;align-items:center;width:100%;height:100%;display:flex;position:absolute;top:0;left:0}.scrcpy-container .video-section .video-container canvas{box-shadow:none!important;border:none!important}.scrcpy-container .video-section .video-container .empty-state{z-index:1;text-align:center;flex-direction:column;align-items:center;gap:16px;padding:24px;display:flex;position:relative}.scrcpy-container .video-section .video-container .empty-state .empty-state-icon{font-size:48px;line-height:1}.scrcpy-container .video-section .video-container .empty-state .empty-state-text{color:#666;margin-bottom:8px;font-size:16px}.scrcpy-container .video-section .video-container .empty-state .loading-spinner{margin-top:16px}.scrcpy-container .video-section .video-container .empty-state .loading-spinner .ant-spin{color:#1677ff}.scrcpy-container .video-section .video-container .empty-state .ant-btn{border-radius:20px;min-width:120px;height:40px;font-size:16px}.scrcpy-container .video-section .screen-info{background:#00000080;border-radius:4px;padding:4px 8px;position:absolute;bottom:8px;left:8px}.scrcpy-container .video-section .screen-info .ant-typography{color:#fff;margin:0}@media (max-width:576px){.scrcpy-container .header-bar{grid-template-rows:auto auto auto;grid-template-columns:1fr;gap:8px;padding:8px}.scrcpy-container .header-bar .header-left,.scrcpy-container .header-bar .screen-info{text-align:center}.scrcpy-container .header-bar .header-right{justify-content:flex-end;justify-self:center;width:100%}}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}.prompt-input-wrapper{width:100%}.prompt-input-wrapper .mode-radio-group-wrapper{justify-content:space-between;align-items:center;display:flex}.prompt-input-wrapper .mode-radio-group-wrapper .mode-radio-group{align-items:center;height:100%;display:flex}.prompt-input-wrapper .mode-radio-group-wrapper .mode-radio-group .ant-radio-button-wrapper{height:24px;box-shadow:none;background-color:#f7f7f7;border:none;border-radius:11px;margin-right:8px;padding:0 8px;font-size:12px;line-height:24px}.prompt-input-wrapper .mode-radio-group-wrapper .mode-radio-group .ant-radio-button-wrapper:before{display:none}.prompt-input-wrapper .mode-radio-group-wrapper .mode-radio-group .ant-radio-button-wrapper:focus-within{outline:none}.prompt-input-wrapper .mode-radio-group-wrapper .mode-radio-group .ant-radio-button-wrapper.ant-radio-button-wrapper-checked{color:#fff;background-color:#2b83ff;border-color:#2b83ff}.prompt-input-wrapper .mode-radio-group-wrapper .mode-radio-group .ant-radio-button-wrapper.ant-radio-button-wrapper-checked:hover{color:#fff}.prompt-input-wrapper .mode-radio-group-wrapper .mode-radio-group .ant-radio-button-wrapper:hover{color:#2b83ff}.prompt-input-wrapper .mode-radio-group-wrapper .action-icons{align-items:center;display:flex}.prompt-input-wrapper .main-side-console-input{margin-top:10px;position:relative}.prompt-input-wrapper .main-side-console-input .main-side-console-input-textarea{white-space:pre-wrap;scrollbar-width:thin;background:#fff;border:1px solid #f2f4f7;border-radius:12px;padding:12px 16px;line-height:21px;transition:background-color .2s;overflow-y:auto}@keyframes hue-shift{0%{filter:hue-rotate()}to{filter:hue-rotate(360deg)}}.prompt-input-wrapper .main-side-console-input .main-side-console-input-textarea:focus-within{background:linear-gradient(#fff,#fff) padding-box padding-box,linear-gradient(135deg,#4285f4 0%,#06f 25%,#7b02c5 50%,#ea4335 75%,#ff7043 100%) border-box;border:1px solid #0000}.prompt-input-wrapper .main-side-console-input .main-side-console-input-textarea::-webkit-scrollbar{width:6px}.prompt-input-wrapper .main-side-console-input .main-side-console-input-textarea::-webkit-scrollbar-thumb{background-color:#0003;border-radius:3px}.prompt-input-wrapper .main-side-console-input.loading .main-side-console-input-textarea{background:linear-gradient(#fff,#fff) padding-box padding-box,linear-gradient(135deg,#4285f4 0%,#06f 25%,#7b02c5 50%,#ea4335 75%,#ff7043 100%) border-box;border:1px solid #0000;animation:5s linear infinite hue-shift}.prompt-input-wrapper .main-side-console-input .ant-form-item-control-input-content{z-index:999;border:3px solid #0000;border-radius:14px}.prompt-input-wrapper .main-side-console-input:focus-within .ant-form-item-control-input-content{border-color:#2b83ff29}.prompt-input-wrapper .main-side-console-input.disabled .form-controller-wrapper{background-color:#0000}.prompt-input-wrapper .ant-input{padding-bottom:40px}.prompt-input-wrapper .form-controller-wrapper{box-sizing:border-box;background-color:#fff;flex-direction:row;justify-content:flex-end;align-items:flex-end;gap:8px;width:calc(100% - 32px);padding:12px 0;line-height:32px;transition:background-color .2s;display:flex;position:absolute;bottom:.5px;left:16px}.prompt-input-wrapper .settings-wrapper{color:#777;flex-flow:wrap;gap:2px;display:flex}.prompt-input-wrapper .settings-wrapper.settings-wrapper-hover{color:#3b3b3b}.selector-trigger{cursor:pointer;width:24px;height:24px;transition:all .2s}.selector-trigger .action-icon{color:#000000d9;font-size:14px;transition:all .2s}.selector-trigger .action-icon:hover{color:#2b83ff}.history-modal-container{border-radius:12px 12px 0 0;flex-direction:column;height:70vh;display:flex;overflow:hidden}.history-modal-container .history-modal-header{justify-content:space-between;align-items:center;height:48px;padding:0 25px;line-height:48px;display:flex}.history-modal-container .history-modal-header .close-button{justify-content:center;align-items:center;margin-right:-4px;padding:4px;display:flex}.history-modal-container .history-modal-header .close-button .anticon{color:#999;font-size:18px}.history-modal-container .history-modal-header .close-button:hover .anticon{color:#666}.history-modal-container .history-search-section{background:#fff;padding:16px 20px}.history-modal-container .history-search-section .search-input-wrapper{color:#00000040;align-items:center;gap:12px;display:flex}.history-modal-container .history-search-section .search-input-wrapper .search-input{background:#f1f2f3;border:none;border-radius:16px;flex:1;height:36px}.history-modal-container .history-search-section .search-input-wrapper .search-input .ant-input{box-shadow:none;background:0 0;border:none}.history-modal-container .history-search-section .search-input-wrapper .search-input:hover,.history-modal-container .history-search-section .search-input-wrapper .search-input:focus-within{background:#fff;border-color:#d9d9d9}.history-modal-container .history-search-section .search-input-wrapper .clear-button{color:#1890ff;height:auto;padding:0}.history-modal-container .history-search-section .search-input-wrapper .clear-button:hover{color:#40a9ff}.history-modal-container .history-content{flex:1;padding:0 25px 25px;overflow-y:auto}.history-modal-container .history-content .history-group{margin-bottom:10px}.history-modal-container .history-content .history-group .history-group-title{color:#00000073;height:40px;font-size:12px;font-weight:400;line-height:40px}.history-modal-container .history-content .history-group .history-item{cursor:pointer;color:#000000d9;white-space:nowrap;text-overflow:ellipsis;height:40px;font-size:14px;line-height:40px;overflow:hidden}.history-modal-container .history-content .history-group .history-item:hover{background:#f2f4f7;margin:0 -8px;padding:0 8px}.history-modal-container .history-content .no-results{text-align:center;color:#999;padding:40px 20px}.ant-modal-wrap .ant-modal-content{animation:.3s cubic-bezier(.4,0,.2,1) forwards slideUpFromBottom!important}@keyframes slideUpFromBottom{0%{opacity:0;transform:translateY(100%)}to{opacity:1;transform:translateY(0)}}.result-wrapper{justify-content:center;height:100%;margin:4px 0;display:flex}.result-wrapper .loading-container{text-align:center}.result-wrapper .loading-container .loading-progress-text{color:#888;margin-top:8px;font-size:12px}.result-wrapper pre{white-space:pre-wrap;text-wrap:unset;word-wrap:break-word;overflow-wrap:break-word;background:#f2f4f7;border-radius:8px;margin:0;padding:14px;overflow:scroll}.player-container{box-sizing:border-box;background:#f2f4f7;border:1px solid #f2f4f7;border-radius:8px;flex-direction:column;width:100%;max-width:100%;height:100%;min-height:300px;max-height:100%;margin:0 auto;padding:12px;line-height:100%;display:flex;position:relative;overflow:visible}.player-container[data-fit-mode=height]{background:#fff}.player-container[data-fit-mode=height] .canvas-container{background-color:#f2f4f7}.player-container .canvas-container{width:100%;min-height:200px;aspect-ratio:var(--canvas-aspect-ratio,16/9);background-color:#fff;border-top-left-radius:16px;border-top-right-radius:16px;flex:none;justify-content:center;align-items:center;display:flex;position:relative;overflow:hidden}.player-container .canvas-container canvas{box-sizing:border-box;object-fit:contain;border:none;width:100%;max-width:100%;height:auto;max-height:100%;margin:0 auto;display:block}.player-container .canvas-container[data-fit-mode=height]{aspect-ratio:unset;flex:auto;height:auto;min-height:0}.player-container .canvas-container[data-fit-mode=height] canvas{width:auto;max-width:100%;height:100%;max-height:100%}.player-container .canvas-container[data-fit-mode=width]{aspect-ratio:var(--canvas-aspect-ratio,16/9)}.player-container .canvas-container[data-fit-mode=width] canvas{width:100%;height:auto}.player-container .player-timeline-wrapper{flex:none;width:100%;height:4px;margin-bottom:2px;position:relative}.player-container .player-timeline{background:#666;flex-shrink:0;width:100%;height:4px;position:relative}.player-container .player-timeline .player-timeline-progress{background:#2b83ff;height:4px;transition-timing-function:linear;position:absolute;top:0;left:0}.player-container .player-tools-wrapper{box-sizing:border-box;flex:none;width:100%;height:72px;padding:15px 16px;position:relative}.player-container .player-tools{color:#000;box-sizing:border-box;flex-direction:row;flex-shrink:0;justify-content:space-between;width:100%;max-width:100%;height:42px;font-size:14px;display:flex;overflow:hidden}.player-container .player-tools .ant-spin{color:#333}.player-container .player-tools .player-control{flex-direction:row;flex-grow:1;align-items:center;display:flex;overflow:hidden}.player-container .player-tools .status-icon{border-radius:8px;flex-shrink:0;justify-content:center;align-items:center;width:32px;height:32px;margin-left:10px;transition:all .2s;display:flex}.player-container .player-tools .status-icon:hover{cursor:pointer;background:#f0f0f0}.player-container .player-tools .status-text{flex-direction:column;flex-grow:1;flex-shrink:1;justify-content:space-between;width:0;min-width:0;height:100%;display:flex;position:relative;overflow:hidden}.player-container .player-tools .title{font-weight:600}.player-container .player-tools .title,.player-container .player-tools .subtitle{text-overflow:ellipsis;white-space:nowrap;width:100%;overflow:hidden}.player-container .player-tools .player-tools-item{flex-direction:column;justify-content:center;height:100%;display:flex}.logo img{vertical-align:baseline;height:30px;vertical-align:-webkit-baseline-middle;line-height:30px}.logo-with-star-wrapper{flex-direction:row;justify-content:space-between;display:flex}.blackboard .footer{color:#aaa}.blackboard ul{padding-left:0}.blackboard li{list-style:none}.blackboard .bottom-tip{height:30px}.blackboard .bottom-tip-item{color:#aaa;text-overflow:ellipsis;word-wrap:break-word;max-width:500px}.blackboard-filter{margin:10px 0}.blackboard-main-content canvas{box-sizing:border-box;border:1px solid #888;width:100%}.shiny-text{color:#0000;letter-spacing:.5px;text-shadow:0 1px 2px #0000000d;background-image:linear-gradient(45deg,#2b83ff,#6a11cb,#2575fc,#4481eb);background-size:300%;-webkit-background-clip:text;background-clip:text;font-weight:600;animation:8s infinite textGradient;display:inline-block;position:relative;overflow:hidden}.shiny-text:after{content:"";width:120%;height:120%;animation:shine var(--animation-duration,5s)cubic-bezier(.25,.1,.25,1)infinite;z-index:1;pointer-events:none;background:linear-gradient(90deg,#fff0 0%,#ffffff1a 10%,#fff9 50%,#ffffff1a 90%,#fff0 100%);position:absolute;top:-10%;left:-150%;transform:skew(-20deg)translateY(0)}.shiny-text.disabled{background:#2b83ff;-webkit-background-clip:text;background-clip:text;animation:none}.shiny-text.disabled:after{animation:none;display:none}@keyframes shine{0%{opacity:.7;left:-150%}20%{opacity:1}80%{opacity:1}to{opacity:.7;left:250%}}@keyframes textGradient{0%{background-position:0%}50%{background-position:100%}to{background-position:0%}}.github-star{height:22px}.image-describer{position:relative}.image-describer .describe-text{box-sizing:border-box;color:#fff;background:#000;width:100%;height:30px;padding:10px;font-size:12px;position:absolute;bottom:0;left:0}.image-describer .describe-text.success{background:#047704}.image-describer .describe-text.error{background:#870707}
|
|
2
|
+
/*# sourceMappingURL=index.76d92e80.css.map*/
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"static/css/index.1b4c3383.css","sources":["webpack://android-playground/./home/runner/work/midscene/midscene/apps/android-playground/src/App.less","webpack://android-playground/./src/App.less","webpack://android-playground/./home/runner/work/midscene/midscene/apps/android-playground/src/adb-device/index.less","webpack://android-playground/./src/adb-device/index.less","webpack://android-playground/./home/runner/work/midscene/midscene/apps/android-playground/src/scrcpy-player/index.less","webpack://android-playground/./src/scrcpy-player/index.less","webpack://android-playground/../../packages/visualizer/dist/index.css"],"sourcesContent":["body {\n margin: 0;\n padding: 0;\n font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Noto Sans', Helvetica, Arial, sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji';\n font-size: 14px;\n}\n.app-container {\n width: 100%;\n height: 100vh;\n display: flex;\n flex-direction: column;\n background-color: #f5f5f5;\n}\n.app-content {\n height: 100vh;\n overflow: hidden;\n}\n.app-grid-layout {\n height: 100%;\n display: flex;\n}\n.app-grid-layout .ant-row {\n flex: 1;\n height: 100%;\n display: flex;\n flex-wrap: nowrap;\n width: 100%;\n}\n.app-panel {\n height: 100%;\n background-color: #fff;\n border-radius: 0;\n box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05);\n transition: box-shadow 0.3s;\n overflow: hidden;\n}\n.app-panel:hover {\n box-shadow: 0 2px 8px rgba(0, 0, 0, 0.09);\n}\n.app-panel.left-panel {\n width: 480px;\n flex: none;\n overflow: hidden;\n height: 100%;\n display: flex;\n flex-direction: column;\n}\n.app-panel.right-panel {\n border-radius: 0;\n flex: 1;\n overflow: hidden;\n box-shadow: -4px 0px 20px 0px #0000000A;\n}\n.panel-content {\n padding: 12px 24px 24px 24px;\n height: 100%;\n overflow: auto;\n display: flex;\n flex-direction: column;\n border-left: 1px solid rgba(0, 0, 0, 0.08);\n}\n.panel-content.left-panel-content {\n display: flex;\n flex-direction: column;\n height: 100%;\n overflow: hidden;\n}\n.panel-content.right-panel-content {\n border-radius: 0;\n}\n.panel-content h2 {\n color: #000;\n font-size: 18px;\n margin-top: 16px;\n margin-bottom: 12px;\n}\n.panel-content canvas {\n max-width: 100%;\n margin-top: 16px;\n border: 1px solid #f0f0f0;\n border-radius: 4px;\n}\n.command-form {\n display: flex;\n flex-direction: column;\n height: 100%;\n overflow: hidden;\n}\n.command-form .form-content {\n display: flex;\n flex-direction: column;\n height: 100%;\n gap: 24px;\n}\n.command-form .command-input-wrapper {\n margin-top: 8px;\n}\n.result-container {\n flex: 1;\n overflow: hidden;\n display: flex;\n flex-direction: column;\n min-height: 0;\n position: relative;\n height: 100%;\n}\n@media (max-width: 768px) {\n .app-container {\n height: auto;\n min-height: 100vh;\n }\n .app-grid-layout .ant-row {\n flex-wrap: wrap !important;\n }\n .app-panel {\n margin-bottom: 16px;\n height: auto;\n min-height: 200px;\n width: 100% !important;\n flex: 0 0 100% !important;\n }\n .app-panel:first-child {\n border-radius: 20px;\n }\n .app-panel:first-child .panel-content {\n border-radius: 20px;\n }\n .panel-content {\n padding: 12px;\n }\n .panel-content h2 {\n font-size: 16px;\n margin-bottom: 12px;\n padding-bottom: 6px;\n }\n .panel-content textarea {\n min-height: 100px;\n }\n}\n@media (min-width: 769px) and (max-width: 992px) {\n .app-panel {\n margin-bottom: 16px;\n min-height: 300px;\n }\n}\n.resize-handle {\n width: 2px;\n background-color: #f0f0f0;\n transition: background-color 0.2s;\n}\n.resize-handle:hover {\n background-color: #1677ff;\n}\n","body {\n margin: 0;\n padding: 0;\n font-family: -apple-system, BlinkMacSystemFont, Segoe UI, Noto Sans, Helvetica, Arial, sans-serif, Apple Color Emoji, Segoe UI Emoji;\n font-size: 14px;\n}\n\n.app-container {\n background-color: #f5f5f5;\n flex-direction: column;\n width: 100%;\n height: 100vh;\n display: flex;\n}\n\n.app-content {\n height: 100vh;\n overflow: hidden;\n}\n\n.app-grid-layout {\n height: 100%;\n display: flex;\n}\n\n.app-grid-layout .ant-row {\n flex-wrap: nowrap;\n flex: 1;\n width: 100%;\n height: 100%;\n display: flex;\n}\n\n.app-panel {\n background-color: #fff;\n border-radius: 0;\n height: 100%;\n transition: box-shadow .3s;\n overflow: hidden;\n box-shadow: 0 1px 2px #0000000d;\n}\n\n.app-panel:hover {\n box-shadow: 0 2px 8px #00000017;\n}\n\n.app-panel.left-panel {\n flex-direction: column;\n flex: none;\n width: 480px;\n height: 100%;\n display: flex;\n overflow: hidden;\n}\n\n.app-panel.right-panel {\n border-radius: 0;\n flex: 1;\n overflow: hidden;\n box-shadow: -4px 0 20px #0000000a;\n}\n\n.panel-content {\n border-left: 1px solid #00000014;\n flex-direction: column;\n height: 100%;\n padding: 12px 24px 24px;\n display: flex;\n overflow: auto;\n}\n\n.panel-content.left-panel-content {\n flex-direction: column;\n height: 100%;\n display: flex;\n overflow: hidden;\n}\n\n.panel-content.right-panel-content {\n border-radius: 0;\n}\n\n.panel-content h2 {\n color: #000;\n margin-top: 16px;\n margin-bottom: 12px;\n font-size: 18px;\n}\n\n.panel-content canvas {\n border: 1px solid #f0f0f0;\n border-radius: 4px;\n max-width: 100%;\n margin-top: 16px;\n}\n\n.command-form {\n flex-direction: column;\n height: 100%;\n display: flex;\n overflow: hidden;\n}\n\n.command-form .form-content {\n flex-direction: column;\n gap: 24px;\n height: 100%;\n display: flex;\n}\n\n.command-form .command-input-wrapper {\n margin-top: 8px;\n}\n\n.result-container {\n flex-direction: column;\n flex: 1;\n height: 100%;\n min-height: 0;\n display: flex;\n position: relative;\n overflow: hidden;\n}\n\n@media (max-width: 768px) {\n .app-container {\n height: auto;\n min-height: 100vh;\n }\n\n .app-grid-layout .ant-row {\n flex-wrap: wrap !important;\n }\n\n .app-panel {\n height: auto;\n min-height: 200px;\n margin-bottom: 16px;\n flex: 0 0 100% !important;\n width: 100% !important;\n }\n\n .app-panel:first-child, .app-panel:first-child .panel-content {\n border-radius: 20px;\n }\n\n .panel-content {\n padding: 12px;\n }\n\n .panel-content h2 {\n margin-bottom: 12px;\n padding-bottom: 6px;\n font-size: 16px;\n }\n\n .panel-content textarea {\n min-height: 100px;\n }\n}\n\n@media (min-width: 769px) and (max-width: 992px) {\n .app-panel {\n min-height: 300px;\n margin-bottom: 16px;\n }\n}\n\n.resize-handle {\n background-color: #f0f0f0;\n width: 2px;\n transition: background-color .2s;\n}\n\n.resize-handle:hover {\n background-color: #1677ff;\n}\n",".device-header {\n display: flex;\n align-items: center;\n margin-bottom: 16px;\n}\n.device-header .device-title-container {\n display: flex;\n align-items: center;\n}\n.device-header .device-title {\n margin: 0;\n font-size: 18px;\n color: #000;\n margin-right: 12px;\n display: flex;\n align-items: center;\n height: 32px;\n}\n.device-dropdown-button {\n border: none;\n padding: 4px 12px 4px 8px;\n display: flex;\n align-items: center;\n background: #f0f0f0;\n border-radius: 20px;\n box-shadow: none;\n height: 32px;\n}\n.device-dropdown-button .device-icon-container {\n width: 24px;\n height: 24px;\n border-radius: 50%;\n background: #3b82f6;\n display: flex;\n align-items: center;\n justify-content: center;\n position: relative;\n}\n.device-dropdown-button .device-icon-container .device-icon {\n font-size: 14px;\n color: white;\n}\n.device-dropdown-button .device-icon-container .status-indicator {\n position: absolute;\n right: -5px;\n bottom: -5px;\n display: flex;\n align-items: center;\n}\n.device-dropdown-button .device-name {\n font-weight: bold;\n font-size: 16px;\n color: #333;\n max-width: 120px;\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n margin-left: 8px;\n margin-right: 4px;\n}\n.device-dropdown-button .device-name.no-device {\n color: #999;\n font-weight: normal;\n font-style: italic;\n}\n.device-dropdown-button .dropdown-arrow {\n color: #666;\n font-size: 12px;\n transform: scaleY(0.6);\n font-weight: bold;\n}\n.device-dropdown {\n width: 430px;\n background: #fff;\n border-radius: 8px;\n overflow: hidden;\n box-shadow: 0px 10px 20px 0px #00000005;\n border: 1px solid #EAEDF1;\n}\n.device-dropdown .dropdown-header {\n display: flex;\n justify-content: space-between;\n align-items: center;\n padding: 16px 16px 12px;\n}\n.device-dropdown .dropdown-header .dropdown-title {\n font-weight: bold;\n font-size: 16px;\n color: #333;\n}\n.device-dropdown .device-list-item {\n padding: 5px 17px 9px 6px;\n cursor: pointer;\n}\n.device-dropdown .device-list-item.selected {\n background: #2B83FF14;\n}\n.device-dropdown .device-list-item.offline {\n cursor: not-allowed;\n opacity: 0.5;\n}\n.device-dropdown .device-list-item .device-item-content {\n display: flex;\n align-items: center;\n}\n.device-dropdown .device-list-item .device-item-content .device-item-icon-container {\n width: 34px;\n height: 34px;\n display: flex;\n align-items: center;\n justify-content: center;\n margin-right: 12px;\n}\n.device-dropdown .device-list-item .device-item-content .device-item-icon-container .device-item-icon {\n font-size: 22px;\n color: #666;\n}\n.device-dropdown .device-list-item .device-item-content .device-item-info {\n flex: 1;\n}\n.device-dropdown .device-list-item .device-item-content .device-item-info .device-item-name {\n font-weight: bold;\n font-size: 15px;\n color: #333;\n}\n.device-dropdown .device-list-item .device-item-content .device-item-info .device-item-status {\n display: flex;\n align-items: center;\n margin-top: 4px;\n}\n.device-dropdown .device-list-item .device-item-content .device-item-info .device-item-status .status-badge {\n display: flex;\n align-items: center;\n margin-right: 12px;\n}\n.device-dropdown .device-list-item .device-item-content .device-item-info .device-item-status .status-badge .status-text {\n color: #666;\n font-size: 12px;\n}\n.device-dropdown .device-list-item .device-item-content .device-item-info .device-item-status .device-id-container {\n color: #999;\n font-size: 12px;\n}\n.device-dropdown .device-list-item .device-item-content .current-device-indicator {\n margin-left: auto;\n color: #1890ff;\n font-weight: bold;\n font-size: 13px;\n}\n.device-dropdown .device-list-empty {\n padding: 20px;\n text-align: center;\n color: #999;\n}\n.status-dot {\n margin-right: 4px;\n font-size: 12px;\n}\n.status-divider {\n margin: 0 4px;\n}\n",".device-header {\n align-items: center;\n margin-bottom: 16px;\n display: flex;\n}\n\n.device-header .device-title-container {\n align-items: center;\n display: flex;\n}\n\n.device-header .device-title {\n color: #000;\n align-items: center;\n height: 32px;\n margin: 0 12px 0 0;\n font-size: 18px;\n display: flex;\n}\n\n.device-dropdown-button {\n box-shadow: none;\n background: #f0f0f0;\n border: none;\n border-radius: 20px;\n align-items: center;\n height: 32px;\n padding: 4px 12px 4px 8px;\n display: flex;\n}\n\n.device-dropdown-button .device-icon-container {\n background: #3b82f6;\n border-radius: 50%;\n justify-content: center;\n align-items: center;\n width: 24px;\n height: 24px;\n display: flex;\n position: relative;\n}\n\n.device-dropdown-button .device-icon-container .device-icon {\n color: #fff;\n font-size: 14px;\n}\n\n.device-dropdown-button .device-icon-container .status-indicator {\n align-items: center;\n display: flex;\n position: absolute;\n bottom: -5px;\n right: -5px;\n}\n\n.device-dropdown-button .device-name {\n color: #333;\n text-overflow: ellipsis;\n white-space: nowrap;\n max-width: 120px;\n margin-left: 8px;\n margin-right: 4px;\n font-size: 16px;\n font-weight: bold;\n overflow: hidden;\n}\n\n.device-dropdown-button .device-name.no-device {\n color: #999;\n font-style: italic;\n font-weight: normal;\n}\n\n.device-dropdown-button .dropdown-arrow {\n color: #666;\n font-size: 12px;\n font-weight: bold;\n transform: scaleY(.6);\n}\n\n.device-dropdown {\n background: #fff;\n border: 1px solid #eaedf1;\n border-radius: 8px;\n width: 430px;\n overflow: hidden;\n box-shadow: 0 10px 20px #00000005;\n}\n\n.device-dropdown .dropdown-header {\n justify-content: space-between;\n align-items: center;\n padding: 16px 16px 12px;\n display: flex;\n}\n\n.device-dropdown .dropdown-header .dropdown-title {\n color: #333;\n font-size: 16px;\n font-weight: bold;\n}\n\n.device-dropdown .device-list-item {\n cursor: pointer;\n padding: 5px 17px 9px 6px;\n}\n\n.device-dropdown .device-list-item.selected {\n background: #2b83ff14;\n}\n\n.device-dropdown .device-list-item.offline {\n cursor: not-allowed;\n opacity: .5;\n}\n\n.device-dropdown .device-list-item .device-item-content {\n align-items: center;\n display: flex;\n}\n\n.device-dropdown .device-list-item .device-item-content .device-item-icon-container {\n justify-content: center;\n align-items: center;\n width: 34px;\n height: 34px;\n margin-right: 12px;\n display: flex;\n}\n\n.device-dropdown .device-list-item .device-item-content .device-item-icon-container .device-item-icon {\n color: #666;\n font-size: 22px;\n}\n\n.device-dropdown .device-list-item .device-item-content .device-item-info {\n flex: 1;\n}\n\n.device-dropdown .device-list-item .device-item-content .device-item-info .device-item-name {\n color: #333;\n font-size: 15px;\n font-weight: bold;\n}\n\n.device-dropdown .device-list-item .device-item-content .device-item-info .device-item-status {\n align-items: center;\n margin-top: 4px;\n display: flex;\n}\n\n.device-dropdown .device-list-item .device-item-content .device-item-info .device-item-status .status-badge {\n align-items: center;\n margin-right: 12px;\n display: flex;\n}\n\n.device-dropdown .device-list-item .device-item-content .device-item-info .device-item-status .status-badge .status-text {\n color: #666;\n font-size: 12px;\n}\n\n.device-dropdown .device-list-item .device-item-content .device-item-info .device-item-status .device-id-container {\n color: #999;\n font-size: 12px;\n}\n\n.device-dropdown .device-list-item .device-item-content .current-device-indicator {\n color: #1890ff;\n margin-left: auto;\n font-size: 13px;\n font-weight: bold;\n}\n\n.device-dropdown .device-list-empty {\n text-align: center;\n color: #999;\n padding: 20px;\n}\n\n.status-dot {\n margin-right: 4px;\n font-size: 12px;\n}\n\n.status-divider {\n margin: 0 4px;\n}\n",".scrcpy-container {\n width: 100%;\n height: 100%;\n display: flex;\n flex-direction: column;\n}\n.scrcpy-container .ant-card {\n background: transparent;\n border: none;\n flex: 1;\n display: flex;\n flex-direction: column;\n}\n.scrcpy-container .ant-card .ant-card-head {\n display: none;\n}\n.scrcpy-container .ant-card .ant-card-body {\n padding: 0;\n flex: 1;\n display: flex;\n flex-direction: column;\n}\n.scrcpy-container .ant-card .ant-card-body .ant-row {\n flex: 1;\n margin: 0 !important;\n}\n.scrcpy-container .ant-card .ant-card-body .ant-row .ant-col {\n padding: 0 !important;\n}\n.scrcpy-container .ant-card .ant-card-body .ant-row .ant-col:first-child {\n flex: 1;\n display: flex;\n flex-direction: column;\n}\n.scrcpy-container .header-bar {\n display: grid;\n grid-template-columns: 1fr auto 1fr;\n align-items: center;\n padding: 8px 16px;\n background: rgba(255, 255, 255, 0.9);\n backdrop-filter: blur(10px);\n border-top-left-radius: 12px;\n border-top-right-radius: 12px;\n border: 1px solid #F5F5F5;\n}\n.scrcpy-container .header-bar .header-left {\n display: flex;\n align-items: center;\n gap: 8px;\n}\n.scrcpy-container .header-bar .header-left .ant-typography {\n color: #333;\n font-size: 14px;\n margin: 0;\n}\n.scrcpy-container .header-bar .header-left .anticon {\n color: #999;\n font-size: 14px;\n cursor: pointer;\n}\n.scrcpy-container .header-bar .header-left .anticon:hover {\n color: #666;\n}\n.scrcpy-container .header-bar .screen-info {\n text-align: center;\n}\n.scrcpy-container .header-bar .screen-info .ant-typography {\n color: #666;\n font-size: 14px;\n margin: 0;\n}\n.scrcpy-container .header-bar .header-right {\n justify-self: end;\n display: flex;\n gap: 8px;\n align-items: center;\n}\n.scrcpy-container .header-bar .header-right .ant-btn {\n width: 16px;\n height: 16px;\n border: none;\n display: flex;\n align-items: center;\n justify-content: center;\n}\n.scrcpy-container .header-bar .header-right .ant-btn .link-icon {\n font-size: 16px;\n line-height: 1;\n}\n.scrcpy-container .video-section {\n position: relative;\n flex: 1;\n display: flex;\n flex-direction: column;\n}\n.scrcpy-container .video-section .video-container {\n width: 100%;\n flex: 1;\n background-color: #F5F5F5;\n display: flex;\n justify-content: center;\n align-items: center;\n border-bottom-left-radius: 12px;\n border-bottom-right-radius: 12px;\n overflow: hidden;\n position: relative;\n}\n.scrcpy-container .video-section .video-container .canvas-wrapper {\n position: absolute;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n display: flex;\n justify-content: center;\n align-items: center;\n}\n.scrcpy-container .video-section .video-container canvas {\n border: none !important;\n box-shadow: none !important;\n}\n.scrcpy-container .video-section .video-container .empty-state {\n position: relative;\n z-index: 1;\n display: flex;\n flex-direction: column;\n align-items: center;\n gap: 16px;\n padding: 24px;\n text-align: center;\n}\n.scrcpy-container .video-section .video-container .empty-state .empty-state-icon {\n font-size: 48px;\n line-height: 1;\n}\n.scrcpy-container .video-section .video-container .empty-state .empty-state-text {\n color: #666;\n font-size: 16px;\n margin-bottom: 8px;\n}\n.scrcpy-container .video-section .video-container .empty-state .loading-spinner {\n margin-top: 16px;\n}\n.scrcpy-container .video-section .video-container .empty-state .loading-spinner .ant-spin {\n color: #1677ff;\n}\n.scrcpy-container .video-section .video-container .empty-state .ant-btn {\n min-width: 120px;\n height: 40px;\n font-size: 16px;\n border-radius: 20px;\n}\n.scrcpy-container .video-section .screen-info {\n position: absolute;\n bottom: 8px;\n left: 8px;\n background: rgba(0, 0, 0, 0.5);\n padding: 4px 8px;\n border-radius: 4px;\n}\n.scrcpy-container .video-section .screen-info .ant-typography {\n color: white;\n margin: 0;\n}\n@media (max-width: 576px) {\n .scrcpy-container .header-bar {\n grid-template-columns: 1fr;\n grid-template-rows: auto auto auto;\n padding: 8px;\n gap: 8px;\n }\n .scrcpy-container .header-bar .header-left {\n text-align: center;\n }\n .scrcpy-container .header-bar .screen-info {\n text-align: center;\n }\n .scrcpy-container .header-bar .header-right {\n justify-self: center;\n width: 100%;\n justify-content: flex-end;\n }\n}\n",".scrcpy-container {\n flex-direction: column;\n width: 100%;\n height: 100%;\n display: flex;\n}\n\n.scrcpy-container .ant-card {\n background: none;\n border: none;\n flex-direction: column;\n flex: 1;\n display: flex;\n}\n\n.scrcpy-container .ant-card .ant-card-head {\n display: none;\n}\n\n.scrcpy-container .ant-card .ant-card-body {\n flex-direction: column;\n flex: 1;\n padding: 0;\n display: flex;\n}\n\n.scrcpy-container .ant-card .ant-card-body .ant-row {\n flex: 1;\n margin: 0 !important;\n}\n\n.scrcpy-container .ant-card .ant-card-body .ant-row .ant-col {\n padding: 0 !important;\n}\n\n.scrcpy-container .ant-card .ant-card-body .ant-row .ant-col:first-child {\n flex-direction: column;\n flex: 1;\n display: flex;\n}\n\n.scrcpy-container .header-bar {\n -webkit-backdrop-filter: blur(10px);\n backdrop-filter: blur(10px);\n background: #ffffffe6;\n border: 1px solid #f5f5f5;\n border-top-left-radius: 12px;\n border-top-right-radius: 12px;\n grid-template-columns: 1fr auto 1fr;\n align-items: center;\n padding: 8px 16px;\n display: grid;\n}\n\n.scrcpy-container .header-bar .header-left {\n align-items: center;\n gap: 8px;\n display: flex;\n}\n\n.scrcpy-container .header-bar .header-left .ant-typography {\n color: #333;\n margin: 0;\n font-size: 14px;\n}\n\n.scrcpy-container .header-bar .header-left .anticon {\n color: #999;\n cursor: pointer;\n font-size: 14px;\n}\n\n.scrcpy-container .header-bar .header-left .anticon:hover {\n color: #666;\n}\n\n.scrcpy-container .header-bar .screen-info {\n text-align: center;\n}\n\n.scrcpy-container .header-bar .screen-info .ant-typography {\n color: #666;\n margin: 0;\n font-size: 14px;\n}\n\n.scrcpy-container .header-bar .header-right {\n justify-self: end;\n align-items: center;\n gap: 8px;\n display: flex;\n}\n\n.scrcpy-container .header-bar .header-right .ant-btn {\n border: none;\n justify-content: center;\n align-items: center;\n width: 16px;\n height: 16px;\n display: flex;\n}\n\n.scrcpy-container .header-bar .header-right .ant-btn .link-icon {\n font-size: 16px;\n line-height: 1;\n}\n\n.scrcpy-container .video-section {\n flex-direction: column;\n flex: 1;\n display: flex;\n position: relative;\n}\n\n.scrcpy-container .video-section .video-container {\n background-color: #f5f5f5;\n border-bottom-right-radius: 12px;\n border-bottom-left-radius: 12px;\n flex: 1;\n justify-content: center;\n align-items: center;\n width: 100%;\n display: flex;\n position: relative;\n overflow: hidden;\n}\n\n.scrcpy-container .video-section .video-container .canvas-wrapper {\n justify-content: center;\n align-items: center;\n width: 100%;\n height: 100%;\n display: flex;\n position: absolute;\n top: 0;\n left: 0;\n}\n\n.scrcpy-container .video-section .video-container canvas {\n box-shadow: none !important;\n border: none !important;\n}\n\n.scrcpy-container .video-section .video-container .empty-state {\n z-index: 1;\n text-align: center;\n flex-direction: column;\n align-items: center;\n gap: 16px;\n padding: 24px;\n display: flex;\n position: relative;\n}\n\n.scrcpy-container .video-section .video-container .empty-state .empty-state-icon {\n font-size: 48px;\n line-height: 1;\n}\n\n.scrcpy-container .video-section .video-container .empty-state .empty-state-text {\n color: #666;\n margin-bottom: 8px;\n font-size: 16px;\n}\n\n.scrcpy-container .video-section .video-container .empty-state .loading-spinner {\n margin-top: 16px;\n}\n\n.scrcpy-container .video-section .video-container .empty-state .loading-spinner .ant-spin {\n color: #1677ff;\n}\n\n.scrcpy-container .video-section .video-container .empty-state .ant-btn {\n border-radius: 20px;\n min-width: 120px;\n height: 40px;\n font-size: 16px;\n}\n\n.scrcpy-container .video-section .screen-info {\n background: #00000080;\n border-radius: 4px;\n padding: 4px 8px;\n position: absolute;\n bottom: 8px;\n left: 8px;\n}\n\n.scrcpy-container .video-section .screen-info .ant-typography {\n color: #fff;\n margin: 0;\n}\n\n@media (max-width: 576px) {\n .scrcpy-container .header-bar {\n grid-template-rows: auto auto auto;\n grid-template-columns: 1fr;\n gap: 8px;\n padding: 8px;\n }\n\n .scrcpy-container .header-bar .header-left, .scrcpy-container .header-bar .screen-info {\n text-align: center;\n }\n\n .scrcpy-container .header-bar .header-right {\n justify-content: flex-end;\n justify-self: center;\n width: 100%;\n }\n}\n","/* src/component/playground/index.less */\nbody {\n margin: 0;\n font-family:\n -apple-system,\n BlinkMacSystemFont,\n \"Segoe UI\",\n \"Noto Sans\",\n Helvetica,\n Arial,\n sans-serif,\n \"Apple Color Emoji\",\n \"Segoe UI Emoji\";\n font-size: 14px;\n}\n.prompt-input-wrapper {\n width: 100%;\n}\n.prompt-input-wrapper .mode-radio-group-wrapper {\n display: flex;\n align-items: center;\n justify-content: space-between;\n}\n.prompt-input-wrapper .mode-radio-group-wrapper .mode-radio-group {\n display: flex;\n align-items: center;\n height: 100%;\n}\n.prompt-input-wrapper .mode-radio-group-wrapper .mode-radio-group .ant-radio-button-wrapper {\n height: 24px;\n padding: 0 8px;\n line-height: 24px;\n border-radius: 11px;\n margin-right: 8px;\n box-shadow: none;\n border: none;\n background-color: #F7F7F7;\n font-size: 12px;\n}\n.prompt-input-wrapper .mode-radio-group-wrapper .mode-radio-group .ant-radio-button-wrapper:before {\n display: none;\n}\n.prompt-input-wrapper .mode-radio-group-wrapper .mode-radio-group .ant-radio-button-wrapper:focus-within {\n outline: none;\n}\n.prompt-input-wrapper .mode-radio-group-wrapper .mode-radio-group .ant-radio-button-wrapper.ant-radio-button-wrapper-checked {\n background-color: #2B83FF;\n border-color: #2B83FF;\n color: white;\n}\n.prompt-input-wrapper .mode-radio-group-wrapper .mode-radio-group .ant-radio-button-wrapper.ant-radio-button-wrapper-checked:hover {\n color: #fff;\n}\n.prompt-input-wrapper .mode-radio-group-wrapper .mode-radio-group .ant-radio-button-wrapper:hover {\n color: #2B83FF;\n}\n.prompt-input-wrapper .mode-radio-group-wrapper .action-icons {\n display: flex;\n align-items: center;\n}\n.prompt-input-wrapper .main-side-console-input {\n position: relative;\n margin-top: 10px;\n}\n.prompt-input-wrapper .main-side-console-input .main-side-console-input-textarea {\n border-radius: 12px;\n border: 1px solid #F2F4F7;\n background: white;\n padding: 12px 16px;\n transition: background-color 0.2s ease;\n overflow-y: auto;\n white-space: pre-wrap;\n line-height: 21px;\n scrollbar-width: thin;\n}\n@keyframes hue-shift {\n 0% {\n filter: hue-rotate(0deg);\n }\n 100% {\n filter: hue-rotate(360deg);\n }\n}\n.prompt-input-wrapper .main-side-console-input .main-side-console-input-textarea:focus-within {\n border: 1px solid transparent;\n background: linear-gradient(white, white) padding-box, linear-gradient(135deg, #4285f4 0%, #0066FF 25%, #7B02C5 50%, #ea4335 75%, #ff7043 100%) border-box;\n}\n.prompt-input-wrapper .main-side-console-input .main-side-console-input-textarea::-webkit-scrollbar {\n width: 6px;\n}\n.prompt-input-wrapper .main-side-console-input .main-side-console-input-textarea::-webkit-scrollbar-thumb {\n background-color: rgba(0, 0, 0, 0.2);\n border-radius: 3px;\n}\n.prompt-input-wrapper .main-side-console-input.loading .main-side-console-input-textarea {\n border: 1px solid transparent;\n background: linear-gradient(white, white) padding-box, linear-gradient(135deg, #4285f4 0%, #0066FF 25%, #7B02C5 50%, #ea4335 75%, #ff7043 100%) border-box;\n animation: hue-shift 5s linear infinite;\n}\n.prompt-input-wrapper .main-side-console-input .ant-form-item-control-input-content {\n border: 3px solid transparent;\n border-radius: 14px;\n z-index: 999;\n}\n.prompt-input-wrapper .main-side-console-input:focus-within .ant-form-item-control-input-content {\n border-color: rgba(43, 131, 255, 0.16);\n}\n.prompt-input-wrapper .main-side-console-input.disabled .form-controller-wrapper {\n background-color: transparent;\n}\n.prompt-input-wrapper .ant-input {\n padding-bottom: 40px;\n}\n.prompt-input-wrapper .form-controller-wrapper {\n position: absolute;\n display: flex;\n flex-direction: row;\n justify-content: flex-end;\n width: calc(100% - 32px);\n box-sizing: border-box;\n align-items: flex-end;\n gap: 8px;\n background-color: #FFF;\n left: 16px;\n bottom: 0.5px;\n padding: 12px 0;\n line-height: 32px;\n transition: background-color 0.2s ease;\n}\n.prompt-input-wrapper .settings-wrapper {\n display: flex;\n flex-direction: row;\n gap: 2px;\n color: #777;\n flex-wrap: wrap;\n}\n.prompt-input-wrapper .settings-wrapper.settings-wrapper-hover {\n color: #3b3b3b;\n}\n.selector-trigger {\n width: 24px;\n height: 24px;\n cursor: pointer;\n transition: all 0.2s ease;\n}\n.selector-trigger .action-icon {\n font-size: 14px;\n color: rgba(0, 0, 0, 0.85);\n transition: all 0.2s;\n}\n.selector-trigger .action-icon:hover {\n color: #2B83FF;\n}\n.history-modal-container {\n height: 70vh;\n display: flex;\n flex-direction: column;\n border-radius: 12px 12px 0 0;\n overflow: hidden;\n}\n.history-modal-container .history-modal-header {\n display: flex;\n justify-content: space-between;\n align-items: center;\n height: 48px;\n line-height: 48px;\n padding: 0 25px;\n}\n.history-modal-container .history-modal-header .close-button {\n margin-right: -4px;\n padding: 4px;\n display: flex;\n align-items: center;\n justify-content: center;\n}\n.history-modal-container .history-modal-header .close-button .anticon {\n font-size: 18px;\n color: #999999;\n}\n.history-modal-container .history-modal-header .close-button:hover .anticon {\n color: #666666;\n}\n.history-modal-container .history-search-section {\n padding: 16px 20px;\n background: #ffffff;\n}\n.history-modal-container .history-search-section .search-input-wrapper {\n display: flex;\n align-items: center;\n gap: 12px;\n color: rgba(0, 0, 0, 0.25);\n}\n.history-modal-container .history-search-section .search-input-wrapper .search-input {\n flex: 1 1;\n height: 36px;\n border-radius: 16px;\n background: #f1f2f3;\n border: none;\n}\n.history-modal-container .history-search-section .search-input-wrapper .search-input .ant-input {\n background: transparent;\n border: none;\n box-shadow: none;\n}\n.history-modal-container .history-search-section .search-input-wrapper .search-input:hover,\n.history-modal-container .history-search-section .search-input-wrapper .search-input:focus-within {\n border-color: #d9d9d9;\n background: #ffffff;\n}\n.history-modal-container .history-search-section .search-input-wrapper .clear-button {\n color: #1890ff;\n padding: 0;\n height: auto;\n}\n.history-modal-container .history-search-section .search-input-wrapper .clear-button:hover {\n color: #40a9ff;\n}\n.history-modal-container .history-content {\n flex: 1 1;\n overflow-y: auto;\n padding: 0 25px 25px 25px;\n}\n.history-modal-container .history-content .history-group {\n margin-bottom: 10px;\n}\n.history-modal-container .history-content .history-group .history-group-title {\n font-size: 12px;\n color: rgba(0, 0, 0, 0.45);\n height: 40px;\n line-height: 40px;\n font-weight: 400;\n}\n.history-modal-container .history-content .history-group .history-item {\n cursor: pointer;\n height: 40px;\n line-height: 40px;\n font-size: 14px;\n color: rgba(0, 0, 0, 0.85);\n overflow: hidden;\n white-space: nowrap;\n text-overflow: ellipsis;\n}\n.history-modal-container .history-content .history-group .history-item:hover {\n background: #f2f4f7;\n padding: 0 8px;\n margin: 0 -8px;\n}\n.history-modal-container .history-content .no-results {\n text-align: center;\n padding: 40px 20px;\n color: #999999;\n}\n.ant-modal-wrap .ant-modal-content {\n animation: slideUpFromBottom 0.3s cubic-bezier(0.4, 0, 0.2, 1) forwards !important;\n}\n@keyframes slideUpFromBottom {\n 0% {\n transform: translateY(100%);\n opacity: 0;\n }\n 100% {\n transform: translateY(0);\n opacity: 1;\n }\n}\n.result-wrapper {\n display: flex;\n height: 100%;\n justify-content: center;\n margin: 4px 0;\n}\n.result-wrapper .loading-container {\n text-align: center;\n}\n.result-wrapper pre {\n margin: 4px 0;\n margin: 0;\n white-space: pre-wrap;\n text-wrap: unset;\n word-wrap: break-word;\n overflow-wrap: break-word;\n background: #F2F4F7;\n border-radius: 8px;\n padding: 14px;\n overflow: scroll;\n}\n\n/* src/component/player.less */\n.player-container {\n width: 100%;\n height: 100%;\n max-width: 100%;\n max-height: 100%;\n padding: 12px;\n background: #F2F4F7;\n box-sizing: border-box;\n border: 1px solid #F2F4F7;\n border-radius: 8px;\n line-height: 100%;\n margin: 0 auto;\n display: flex;\n flex-direction: column;\n overflow: visible;\n min-height: 300px;\n position: relative;\n}\n.player-container[data-fit-mode=height] {\n background: #fff;\n}\n.player-container[data-fit-mode=height] .canvas-container {\n background-color: #F2F4F7;\n}\n.player-container .canvas-container {\n flex: 0 0 auto;\n min-height: 200px;\n width: 100%;\n display: flex;\n justify-content: center;\n align-items: center;\n overflow: hidden;\n position: relative;\n background-color: #fff;\n border-top-right-radius: 16px;\n border-top-left-radius: 16px;\n aspect-ratio: var(--canvas-aspect-ratio, 16/9);\n}\n.player-container .canvas-container canvas {\n width: 100%;\n height: auto;\n max-width: 100%;\n max-height: 100%;\n box-sizing: border-box;\n display: block;\n margin: 0 auto;\n object-fit: contain;\n border: none;\n}\n.player-container .canvas-container[data-fit-mode=height] {\n flex: 1 1 auto;\n aspect-ratio: unset;\n min-height: 0;\n height: auto;\n}\n.player-container .canvas-container[data-fit-mode=height] canvas {\n height: 100%;\n width: auto;\n max-width: 100%;\n max-height: 100%;\n}\n.player-container .canvas-container[data-fit-mode=width] {\n aspect-ratio: var(--canvas-aspect-ratio, 16/9);\n}\n.player-container .canvas-container[data-fit-mode=width] canvas {\n width: 100%;\n height: auto;\n}\n.player-container .player-timeline-wrapper {\n width: 100%;\n height: 4px;\n flex: none;\n margin-bottom: 2px;\n position: relative;\n}\n.player-container .player-timeline {\n width: 100%;\n height: 4px;\n background: #666;\n position: relative;\n flex-shrink: 0;\n}\n.player-container .player-timeline .player-timeline-progress {\n transition-timing-function: linear;\n position: absolute;\n top: 0;\n left: 0;\n height: 4px;\n background: #2B83FF;\n}\n.player-container .player-tools-wrapper {\n width: 100%;\n height: 72px;\n flex: none;\n position: relative;\n padding-top: 15px;\n padding-bottom: 15px;\n padding-left: 16px;\n padding-right: 16px;\n box-sizing: border-box;\n}\n.player-container .player-tools {\n width: 100%;\n height: 42px;\n max-width: 100%;\n overflow: hidden;\n color: #000;\n font-size: 14px;\n box-sizing: border-box;\n display: flex;\n flex-direction: row;\n justify-content: space-between;\n flex-shrink: 0;\n}\n.player-container .player-tools .ant-spin {\n color: #333;\n}\n.player-container .player-tools .player-control {\n flex-grow: 1;\n display: flex;\n flex-direction: row;\n align-items: center;\n overflow: hidden;\n}\n.player-container .player-tools .status-icon {\n transition: 0.2s;\n width: 32px;\n height: 32px;\n border-radius: 8px;\n display: flex;\n align-items: center;\n justify-content: center;\n flex-shrink: 0;\n margin-left: 10px;\n}\n.player-container .player-tools .status-icon:hover {\n cursor: pointer;\n background: #F0f0f0;\n}\n.player-container .player-tools .status-text {\n flex-grow: 1;\n flex-shrink: 1;\n min-width: 0;\n overflow: hidden;\n position: relative;\n height: 100%;\n display: flex;\n flex-direction: column;\n justify-content: space-between;\n width: 0;\n}\n.player-container .player-tools .title {\n font-weight: 600;\n}\n.player-container .player-tools .title,\n.player-container .player-tools .subtitle {\n text-overflow: ellipsis;\n overflow: hidden;\n white-space: nowrap;\n width: 100%;\n}\n.player-container .player-tools .player-tools-item {\n height: 100%;\n display: flex;\n flex-direction: column;\n justify-content: center;\n}\n\n/* src/component/logo.less */\n.logo img {\n height: 30px;\n line-height: 30px;\n vertical-align: baseline;\n vertical-align: -webkit-baseline-middle;\n}\n.logo-with-star-wrapper {\n display: flex;\n flex-direction: row;\n justify-content: space-between;\n}\n\n/* src/component/blackboard.less */\n.blackboard .footer {\n color: #aaa;\n}\n.blackboard ul {\n padding-left: 0px;\n}\n.blackboard li {\n list-style: none;\n}\n.blackboard .bottom-tip {\n height: 30px;\n}\n.blackboard .bottom-tip-item {\n max-width: 500px;\n color: #AAA;\n text-overflow: ellipsis;\n word-wrap: break-word;\n}\n.blackboard-filter {\n margin: 10px 0;\n}\n.blackboard-main-content canvas {\n width: 100%;\n border: 1px solid #888;\n box-sizing: border-box;\n}\n\n/* src/component/shiny-text.less */\n.shiny-text {\n position: relative;\n display: inline-block;\n background-size: 300% auto;\n -webkit-background-clip: text;\n background-clip: text;\n color: transparent;\n font-weight: 600;\n letter-spacing: 0.5px;\n text-shadow: 0 1px 2px rgba(0, 0, 0, 0.05);\n overflow: hidden;\n animation: textGradient 8s ease infinite;\n background-image: linear-gradient(45deg, #2b83ff, #6a11cb, #2575fc, #4481eb);\n}\n.shiny-text::after {\n content: \"\";\n position: absolute;\n top: -10%;\n left: -150%;\n width: 120%;\n height: 120%;\n background: linear-gradient(90deg, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0.1) 10%, rgba(255, 255, 255, 0.6) 50%, rgba(255, 255, 255, 0.1) 90%, rgba(255, 255, 255, 0) 100%);\n transform: skewX(-20deg) translateY(0);\n animation: shine var(--animation-duration, 5s) cubic-bezier(0.25, 0.1, 0.25, 1) infinite;\n z-index: 1;\n pointer-events: none;\n}\n.shiny-text.disabled {\n animation: none;\n background: #2b83ff;\n -webkit-background-clip: text;\n background-clip: text;\n}\n.shiny-text.disabled::after {\n animation: none;\n display: none;\n}\n@keyframes shine {\n 0% {\n left: -150%;\n opacity: 0.7;\n }\n 20% {\n opacity: 1;\n }\n 80% {\n opacity: 1;\n }\n 100% {\n left: 250%;\n opacity: 0.7;\n }\n}\n@keyframes textGradient {\n 0% {\n background-position: 0% 50%;\n }\n 50% {\n background-position: 100% 50%;\n }\n 100% {\n background-position: 0% 50%;\n }\n}\n\n/* src/component/github-star.less */\n.github-star {\n height: 22px;\n}\n\n/* src/component/describer.less */\n.image-describer {\n position: relative;\n}\n.image-describer .describe-text {\n box-sizing: border-box;\n position: absolute;\n background: #000;\n width: 100%;\n height: 30px;\n left: 0;\n bottom: 0;\n color: #FFF;\n font-size: 12px;\n padding: 10px;\n}\n.image-describer .describe-text.success {\n background: #047704;\n}\n.image-describer .describe-text.error {\n background: #870707;\n}\n"],"names":[],"mappings":"AADA,mKCQA,mGAQA,0CAKA,0CAKA,sFAQA,sIASA,gDAIA,2GASA,+FAOA,mIASA,iGAOA,mDAIA,+EAOA,gGAOA,6EAOA,oFAOA,oDAIA,uHAUA,yBACE,4CAKA,mDAIA,wGAQA,gFAIA,4BAIA,uEAMA,0CAKF,+CACE,gDAMF,kFAMA,8CC/KA,kECOA,uEAKA,qHASA,+JAWA,oLAWA,sFAKA,0IAQA,0LAYA,4FAMA,uGAOA,yIASA,uHAOA,4FAMA,2EAKA,iEAIA,yEAKA,wFAKA,oLASA,gIAKA,iFAIA,sIAMA,6IAMA,8JAMA,mJAKA,6IAKA,gJAOA,8EAMA,4CAKA,6BC1LA,4ECQA,iGAQA,wDAIA,+FAOA,8EAKA,iFAIA,mHAMA,uRAaA,mFAMA,8FAMA,6FAMA,qEAIA,6DAIA,8FAMA,qGAOA,+IASA,6FAKA,6FAOA,qPAaA,+KAWA,yGAKA,yLAWA,8GAKA,6HAMA,gGAIA,wGAIA,sIAOA,2IASA,kFAKA,yBACE,8GAOA,wGAIA,qGC9MF,yJAMA,iCAIA,8GAMA,8GAMA,+OAYA,gHAIA,sHAIA,sLAMA,8IAIA,gHAIA,8FAKA,iFAKA,0QAYA,0EAUA,+QAKA,8GAIA,mJAKA,iTAMA,0IAMA,wHAIA,wGAIA,qDAIA,iTAiBA,uFAOA,6EAIA,2EAOA,iFAMA,mDAIA,oHAQA,yJASA,kJAQA,gGAKA,uFAIA,mFAKA,gIAOA,0JAQA,2IAMA,kOAKA,yHAMA,yGAIA,qFAMA,4EAIA,0JAQA,4MAWA,4HAMA,qGAMA,8GAIA,2GAYA,6EAOA,qDAIA,kLAYA,+RAmBA,wDAIA,mFAIA,+RAeA,kLAYA,gHAOA,uHAOA,sGAIA,uFAKA,+GAQA,yGAQA,4JASA,mIASA,kNAcA,qDAIA,+HAQA,+LAYA,qFAKA,0MAaA,uDAIA,sJAOA,yHAOA,sGAOA,sFAMA,+BAIA,8BAIA,+BAIA,oCAIA,oGAOA,iCAIA,uFAMA,qUAeA,uUAcA,yGAOA,uDAKA,+FAoBA,0GAcA,yBAIA,mCAIA,sKAaA,2DAIA"}
|
|
1
|
+
{"version":3,"file":"static/css/index.76d92e80.css","sources":["webpack://android-playground/./home/runner/work/midscene/midscene/apps/android-playground/src/App.less","webpack://android-playground/./src/App.less","webpack://android-playground/./home/runner/work/midscene/midscene/apps/android-playground/src/adb-device/index.less","webpack://android-playground/./src/adb-device/index.less","webpack://android-playground/./home/runner/work/midscene/midscene/apps/android-playground/src/scrcpy-player/index.less","webpack://android-playground/./src/scrcpy-player/index.less","webpack://android-playground/../../packages/visualizer/dist/index.css"],"sourcesContent":["body {\n margin: 0;\n padding: 0;\n font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Noto Sans', Helvetica, Arial, sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji';\n font-size: 14px;\n}\n.app-container {\n width: 100%;\n height: 100vh;\n display: flex;\n flex-direction: column;\n background-color: #f5f5f5;\n}\n.app-content {\n height: 100vh;\n overflow: hidden;\n}\n.app-grid-layout {\n height: 100%;\n display: flex;\n}\n.app-grid-layout .ant-row {\n flex: 1;\n height: 100%;\n display: flex;\n flex-wrap: nowrap;\n width: 100%;\n}\n.app-panel {\n height: 100%;\n background-color: #fff;\n border-radius: 0;\n box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05);\n transition: box-shadow 0.3s;\n overflow: hidden;\n}\n.app-panel:hover {\n box-shadow: 0 2px 8px rgba(0, 0, 0, 0.09);\n}\n.app-panel.left-panel {\n width: 480px;\n flex: none;\n overflow: hidden;\n height: 100%;\n display: flex;\n flex-direction: column;\n}\n.app-panel.right-panel {\n border-radius: 0;\n flex: 1;\n overflow: hidden;\n box-shadow: -4px 0px 20px 0px #0000000A;\n}\n.panel-content {\n padding: 12px 24px 24px 24px;\n height: 100%;\n overflow: auto;\n display: flex;\n flex-direction: column;\n border-left: 1px solid rgba(0, 0, 0, 0.08);\n}\n.panel-content.left-panel-content {\n display: flex;\n flex-direction: column;\n height: 100%;\n overflow: hidden;\n}\n.panel-content.right-panel-content {\n border-radius: 0;\n}\n.panel-content h2 {\n color: #000;\n font-size: 18px;\n margin-top: 16px;\n margin-bottom: 12px;\n}\n.panel-content canvas {\n max-width: 100%;\n margin-top: 16px;\n border: 1px solid #f0f0f0;\n border-radius: 4px;\n}\n.command-form {\n display: flex;\n flex-direction: column;\n height: 100%;\n overflow: hidden;\n}\n.command-form .form-content {\n display: flex;\n flex-direction: column;\n height: 100%;\n gap: 24px;\n}\n.command-form .command-input-wrapper {\n margin-top: 8px;\n}\n.result-container {\n flex: 1;\n overflow: hidden;\n display: flex;\n flex-direction: column;\n min-height: 0;\n position: relative;\n height: 100%;\n}\n@media (max-width: 768px) {\n .app-container {\n height: auto;\n min-height: 100vh;\n }\n .app-grid-layout .ant-row {\n flex-wrap: wrap !important;\n }\n .app-panel {\n margin-bottom: 16px;\n height: auto;\n min-height: 200px;\n width: 100% !important;\n flex: 0 0 100% !important;\n }\n .app-panel:first-child {\n border-radius: 20px;\n }\n .app-panel:first-child .panel-content {\n border-radius: 20px;\n }\n .panel-content {\n padding: 12px;\n }\n .panel-content h2 {\n font-size: 16px;\n margin-bottom: 12px;\n padding-bottom: 6px;\n }\n .panel-content textarea {\n min-height: 100px;\n }\n}\n@media (min-width: 769px) and (max-width: 992px) {\n .app-panel {\n margin-bottom: 16px;\n min-height: 300px;\n }\n}\n.resize-handle {\n width: 2px;\n background-color: #f0f0f0;\n transition: background-color 0.2s;\n}\n.resize-handle:hover {\n background-color: #1677ff;\n}\n","body {\n margin: 0;\n padding: 0;\n font-family: -apple-system, BlinkMacSystemFont, Segoe UI, Noto Sans, Helvetica, Arial, sans-serif, Apple Color Emoji, Segoe UI Emoji;\n font-size: 14px;\n}\n\n.app-container {\n background-color: #f5f5f5;\n flex-direction: column;\n width: 100%;\n height: 100vh;\n display: flex;\n}\n\n.app-content {\n height: 100vh;\n overflow: hidden;\n}\n\n.app-grid-layout {\n height: 100%;\n display: flex;\n}\n\n.app-grid-layout .ant-row {\n flex-wrap: nowrap;\n flex: 1;\n width: 100%;\n height: 100%;\n display: flex;\n}\n\n.app-panel {\n background-color: #fff;\n border-radius: 0;\n height: 100%;\n transition: box-shadow .3s;\n overflow: hidden;\n box-shadow: 0 1px 2px #0000000d;\n}\n\n.app-panel:hover {\n box-shadow: 0 2px 8px #00000017;\n}\n\n.app-panel.left-panel {\n flex-direction: column;\n flex: none;\n width: 480px;\n height: 100%;\n display: flex;\n overflow: hidden;\n}\n\n.app-panel.right-panel {\n border-radius: 0;\n flex: 1;\n overflow: hidden;\n box-shadow: -4px 0 20px #0000000a;\n}\n\n.panel-content {\n border-left: 1px solid #00000014;\n flex-direction: column;\n height: 100%;\n padding: 12px 24px 24px;\n display: flex;\n overflow: auto;\n}\n\n.panel-content.left-panel-content {\n flex-direction: column;\n height: 100%;\n display: flex;\n overflow: hidden;\n}\n\n.panel-content.right-panel-content {\n border-radius: 0;\n}\n\n.panel-content h2 {\n color: #000;\n margin-top: 16px;\n margin-bottom: 12px;\n font-size: 18px;\n}\n\n.panel-content canvas {\n border: 1px solid #f0f0f0;\n border-radius: 4px;\n max-width: 100%;\n margin-top: 16px;\n}\n\n.command-form {\n flex-direction: column;\n height: 100%;\n display: flex;\n overflow: hidden;\n}\n\n.command-form .form-content {\n flex-direction: column;\n gap: 24px;\n height: 100%;\n display: flex;\n}\n\n.command-form .command-input-wrapper {\n margin-top: 8px;\n}\n\n.result-container {\n flex-direction: column;\n flex: 1;\n height: 100%;\n min-height: 0;\n display: flex;\n position: relative;\n overflow: hidden;\n}\n\n@media (max-width: 768px) {\n .app-container {\n height: auto;\n min-height: 100vh;\n }\n\n .app-grid-layout .ant-row {\n flex-wrap: wrap !important;\n }\n\n .app-panel {\n height: auto;\n min-height: 200px;\n margin-bottom: 16px;\n flex: 0 0 100% !important;\n width: 100% !important;\n }\n\n .app-panel:first-child, .app-panel:first-child .panel-content {\n border-radius: 20px;\n }\n\n .panel-content {\n padding: 12px;\n }\n\n .panel-content h2 {\n margin-bottom: 12px;\n padding-bottom: 6px;\n font-size: 16px;\n }\n\n .panel-content textarea {\n min-height: 100px;\n }\n}\n\n@media (min-width: 769px) and (max-width: 992px) {\n .app-panel {\n min-height: 300px;\n margin-bottom: 16px;\n }\n}\n\n.resize-handle {\n background-color: #f0f0f0;\n width: 2px;\n transition: background-color .2s;\n}\n\n.resize-handle:hover {\n background-color: #1677ff;\n}\n",".device-header {\n display: flex;\n align-items: center;\n margin-bottom: 16px;\n}\n.device-header .device-title-container {\n display: flex;\n align-items: center;\n}\n.device-header .device-title {\n margin: 0;\n font-size: 18px;\n color: #000;\n margin-right: 12px;\n display: flex;\n align-items: center;\n height: 32px;\n}\n.device-dropdown-button {\n border: none;\n padding: 4px 12px 4px 8px;\n display: flex;\n align-items: center;\n background: #f0f0f0;\n border-radius: 20px;\n box-shadow: none;\n height: 32px;\n}\n.device-dropdown-button .device-icon-container {\n width: 24px;\n height: 24px;\n border-radius: 50%;\n background: #3b82f6;\n display: flex;\n align-items: center;\n justify-content: center;\n position: relative;\n}\n.device-dropdown-button .device-icon-container .device-icon {\n font-size: 14px;\n color: white;\n}\n.device-dropdown-button .device-icon-container .status-indicator {\n position: absolute;\n right: -5px;\n bottom: -5px;\n display: flex;\n align-items: center;\n}\n.device-dropdown-button .device-name {\n font-weight: bold;\n font-size: 16px;\n color: #333;\n max-width: 120px;\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n margin-left: 8px;\n margin-right: 4px;\n}\n.device-dropdown-button .device-name.no-device {\n color: #999;\n font-weight: normal;\n font-style: italic;\n}\n.device-dropdown-button .dropdown-arrow {\n color: #666;\n font-size: 12px;\n transform: scaleY(0.6);\n font-weight: bold;\n}\n.device-dropdown {\n width: 430px;\n background: #fff;\n border-radius: 8px;\n overflow: hidden;\n box-shadow: 0px 10px 20px 0px #00000005;\n border: 1px solid #EAEDF1;\n}\n.device-dropdown .dropdown-header {\n display: flex;\n justify-content: space-between;\n align-items: center;\n padding: 16px 16px 12px;\n}\n.device-dropdown .dropdown-header .dropdown-title {\n font-weight: bold;\n font-size: 16px;\n color: #333;\n}\n.device-dropdown .device-list-item {\n padding: 5px 17px 9px 6px;\n cursor: pointer;\n}\n.device-dropdown .device-list-item.selected {\n background: #2B83FF14;\n}\n.device-dropdown .device-list-item.offline {\n cursor: not-allowed;\n opacity: 0.5;\n}\n.device-dropdown .device-list-item .device-item-content {\n display: flex;\n align-items: center;\n}\n.device-dropdown .device-list-item .device-item-content .device-item-icon-container {\n width: 34px;\n height: 34px;\n display: flex;\n align-items: center;\n justify-content: center;\n margin-right: 12px;\n}\n.device-dropdown .device-list-item .device-item-content .device-item-icon-container .device-item-icon {\n font-size: 22px;\n color: #666;\n}\n.device-dropdown .device-list-item .device-item-content .device-item-info {\n flex: 1;\n}\n.device-dropdown .device-list-item .device-item-content .device-item-info .device-item-name {\n font-weight: bold;\n font-size: 15px;\n color: #333;\n}\n.device-dropdown .device-list-item .device-item-content .device-item-info .device-item-status {\n display: flex;\n align-items: center;\n margin-top: 4px;\n}\n.device-dropdown .device-list-item .device-item-content .device-item-info .device-item-status .status-badge {\n display: flex;\n align-items: center;\n margin-right: 12px;\n}\n.device-dropdown .device-list-item .device-item-content .device-item-info .device-item-status .status-badge .status-text {\n color: #666;\n font-size: 12px;\n}\n.device-dropdown .device-list-item .device-item-content .device-item-info .device-item-status .device-id-container {\n color: #999;\n font-size: 12px;\n}\n.device-dropdown .device-list-item .device-item-content .current-device-indicator {\n margin-left: auto;\n color: #1890ff;\n font-weight: bold;\n font-size: 13px;\n}\n.device-dropdown .device-list-empty {\n padding: 20px;\n text-align: center;\n color: #999;\n}\n.status-dot {\n margin-right: 4px;\n font-size: 12px;\n}\n.status-divider {\n margin: 0 4px;\n}\n",".device-header {\n align-items: center;\n margin-bottom: 16px;\n display: flex;\n}\n\n.device-header .device-title-container {\n align-items: center;\n display: flex;\n}\n\n.device-header .device-title {\n color: #000;\n align-items: center;\n height: 32px;\n margin: 0 12px 0 0;\n font-size: 18px;\n display: flex;\n}\n\n.device-dropdown-button {\n box-shadow: none;\n background: #f0f0f0;\n border: none;\n border-radius: 20px;\n align-items: center;\n height: 32px;\n padding: 4px 12px 4px 8px;\n display: flex;\n}\n\n.device-dropdown-button .device-icon-container {\n background: #3b82f6;\n border-radius: 50%;\n justify-content: center;\n align-items: center;\n width: 24px;\n height: 24px;\n display: flex;\n position: relative;\n}\n\n.device-dropdown-button .device-icon-container .device-icon {\n color: #fff;\n font-size: 14px;\n}\n\n.device-dropdown-button .device-icon-container .status-indicator {\n align-items: center;\n display: flex;\n position: absolute;\n bottom: -5px;\n right: -5px;\n}\n\n.device-dropdown-button .device-name {\n color: #333;\n text-overflow: ellipsis;\n white-space: nowrap;\n max-width: 120px;\n margin-left: 8px;\n margin-right: 4px;\n font-size: 16px;\n font-weight: bold;\n overflow: hidden;\n}\n\n.device-dropdown-button .device-name.no-device {\n color: #999;\n font-style: italic;\n font-weight: normal;\n}\n\n.device-dropdown-button .dropdown-arrow {\n color: #666;\n font-size: 12px;\n font-weight: bold;\n transform: scaleY(.6);\n}\n\n.device-dropdown {\n background: #fff;\n border: 1px solid #eaedf1;\n border-radius: 8px;\n width: 430px;\n overflow: hidden;\n box-shadow: 0 10px 20px #00000005;\n}\n\n.device-dropdown .dropdown-header {\n justify-content: space-between;\n align-items: center;\n padding: 16px 16px 12px;\n display: flex;\n}\n\n.device-dropdown .dropdown-header .dropdown-title {\n color: #333;\n font-size: 16px;\n font-weight: bold;\n}\n\n.device-dropdown .device-list-item {\n cursor: pointer;\n padding: 5px 17px 9px 6px;\n}\n\n.device-dropdown .device-list-item.selected {\n background: #2b83ff14;\n}\n\n.device-dropdown .device-list-item.offline {\n cursor: not-allowed;\n opacity: .5;\n}\n\n.device-dropdown .device-list-item .device-item-content {\n align-items: center;\n display: flex;\n}\n\n.device-dropdown .device-list-item .device-item-content .device-item-icon-container {\n justify-content: center;\n align-items: center;\n width: 34px;\n height: 34px;\n margin-right: 12px;\n display: flex;\n}\n\n.device-dropdown .device-list-item .device-item-content .device-item-icon-container .device-item-icon {\n color: #666;\n font-size: 22px;\n}\n\n.device-dropdown .device-list-item .device-item-content .device-item-info {\n flex: 1;\n}\n\n.device-dropdown .device-list-item .device-item-content .device-item-info .device-item-name {\n color: #333;\n font-size: 15px;\n font-weight: bold;\n}\n\n.device-dropdown .device-list-item .device-item-content .device-item-info .device-item-status {\n align-items: center;\n margin-top: 4px;\n display: flex;\n}\n\n.device-dropdown .device-list-item .device-item-content .device-item-info .device-item-status .status-badge {\n align-items: center;\n margin-right: 12px;\n display: flex;\n}\n\n.device-dropdown .device-list-item .device-item-content .device-item-info .device-item-status .status-badge .status-text {\n color: #666;\n font-size: 12px;\n}\n\n.device-dropdown .device-list-item .device-item-content .device-item-info .device-item-status .device-id-container {\n color: #999;\n font-size: 12px;\n}\n\n.device-dropdown .device-list-item .device-item-content .current-device-indicator {\n color: #1890ff;\n margin-left: auto;\n font-size: 13px;\n font-weight: bold;\n}\n\n.device-dropdown .device-list-empty {\n text-align: center;\n color: #999;\n padding: 20px;\n}\n\n.status-dot {\n margin-right: 4px;\n font-size: 12px;\n}\n\n.status-divider {\n margin: 0 4px;\n}\n",".scrcpy-container {\n width: 100%;\n height: 100%;\n display: flex;\n flex-direction: column;\n}\n.scrcpy-container .ant-card {\n background: transparent;\n border: none;\n flex: 1;\n display: flex;\n flex-direction: column;\n}\n.scrcpy-container .ant-card .ant-card-head {\n display: none;\n}\n.scrcpy-container .ant-card .ant-card-body {\n padding: 0;\n flex: 1;\n display: flex;\n flex-direction: column;\n}\n.scrcpy-container .ant-card .ant-card-body .ant-row {\n flex: 1;\n margin: 0 !important;\n}\n.scrcpy-container .ant-card .ant-card-body .ant-row .ant-col {\n padding: 0 !important;\n}\n.scrcpy-container .ant-card .ant-card-body .ant-row .ant-col:first-child {\n flex: 1;\n display: flex;\n flex-direction: column;\n}\n.scrcpy-container .header-bar {\n display: grid;\n grid-template-columns: 1fr auto 1fr;\n align-items: center;\n padding: 8px 16px;\n background: rgba(255, 255, 255, 0.9);\n backdrop-filter: blur(10px);\n border-top-left-radius: 12px;\n border-top-right-radius: 12px;\n border: 1px solid #F5F5F5;\n}\n.scrcpy-container .header-bar .header-left {\n display: flex;\n align-items: center;\n gap: 8px;\n}\n.scrcpy-container .header-bar .header-left .ant-typography {\n color: #333;\n font-size: 14px;\n margin: 0;\n}\n.scrcpy-container .header-bar .header-left .anticon {\n color: #999;\n font-size: 14px;\n cursor: pointer;\n}\n.scrcpy-container .header-bar .header-left .anticon:hover {\n color: #666;\n}\n.scrcpy-container .header-bar .screen-info {\n text-align: center;\n}\n.scrcpy-container .header-bar .screen-info .ant-typography {\n color: #666;\n font-size: 14px;\n margin: 0;\n}\n.scrcpy-container .header-bar .header-right {\n justify-self: end;\n display: flex;\n gap: 8px;\n align-items: center;\n}\n.scrcpy-container .header-bar .header-right .ant-btn {\n width: 16px;\n height: 16px;\n border: none;\n display: flex;\n align-items: center;\n justify-content: center;\n}\n.scrcpy-container .header-bar .header-right .ant-btn .link-icon {\n font-size: 16px;\n line-height: 1;\n}\n.scrcpy-container .video-section {\n position: relative;\n flex: 1;\n display: flex;\n flex-direction: column;\n}\n.scrcpy-container .video-section .video-container {\n width: 100%;\n flex: 1;\n background-color: #F5F5F5;\n display: flex;\n justify-content: center;\n align-items: center;\n border-bottom-left-radius: 12px;\n border-bottom-right-radius: 12px;\n overflow: hidden;\n position: relative;\n}\n.scrcpy-container .video-section .video-container .canvas-wrapper {\n position: absolute;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n display: flex;\n justify-content: center;\n align-items: center;\n}\n.scrcpy-container .video-section .video-container canvas {\n border: none !important;\n box-shadow: none !important;\n}\n.scrcpy-container .video-section .video-container .empty-state {\n position: relative;\n z-index: 1;\n display: flex;\n flex-direction: column;\n align-items: center;\n gap: 16px;\n padding: 24px;\n text-align: center;\n}\n.scrcpy-container .video-section .video-container .empty-state .empty-state-icon {\n font-size: 48px;\n line-height: 1;\n}\n.scrcpy-container .video-section .video-container .empty-state .empty-state-text {\n color: #666;\n font-size: 16px;\n margin-bottom: 8px;\n}\n.scrcpy-container .video-section .video-container .empty-state .loading-spinner {\n margin-top: 16px;\n}\n.scrcpy-container .video-section .video-container .empty-state .loading-spinner .ant-spin {\n color: #1677ff;\n}\n.scrcpy-container .video-section .video-container .empty-state .ant-btn {\n min-width: 120px;\n height: 40px;\n font-size: 16px;\n border-radius: 20px;\n}\n.scrcpy-container .video-section .screen-info {\n position: absolute;\n bottom: 8px;\n left: 8px;\n background: rgba(0, 0, 0, 0.5);\n padding: 4px 8px;\n border-radius: 4px;\n}\n.scrcpy-container .video-section .screen-info .ant-typography {\n color: white;\n margin: 0;\n}\n@media (max-width: 576px) {\n .scrcpy-container .header-bar {\n grid-template-columns: 1fr;\n grid-template-rows: auto auto auto;\n padding: 8px;\n gap: 8px;\n }\n .scrcpy-container .header-bar .header-left {\n text-align: center;\n }\n .scrcpy-container .header-bar .screen-info {\n text-align: center;\n }\n .scrcpy-container .header-bar .header-right {\n justify-self: center;\n width: 100%;\n justify-content: flex-end;\n }\n}\n",".scrcpy-container {\n flex-direction: column;\n width: 100%;\n height: 100%;\n display: flex;\n}\n\n.scrcpy-container .ant-card {\n background: none;\n border: none;\n flex-direction: column;\n flex: 1;\n display: flex;\n}\n\n.scrcpy-container .ant-card .ant-card-head {\n display: none;\n}\n\n.scrcpy-container .ant-card .ant-card-body {\n flex-direction: column;\n flex: 1;\n padding: 0;\n display: flex;\n}\n\n.scrcpy-container .ant-card .ant-card-body .ant-row {\n flex: 1;\n margin: 0 !important;\n}\n\n.scrcpy-container .ant-card .ant-card-body .ant-row .ant-col {\n padding: 0 !important;\n}\n\n.scrcpy-container .ant-card .ant-card-body .ant-row .ant-col:first-child {\n flex-direction: column;\n flex: 1;\n display: flex;\n}\n\n.scrcpy-container .header-bar {\n -webkit-backdrop-filter: blur(10px);\n backdrop-filter: blur(10px);\n background: #ffffffe6;\n border: 1px solid #f5f5f5;\n border-top-left-radius: 12px;\n border-top-right-radius: 12px;\n grid-template-columns: 1fr auto 1fr;\n align-items: center;\n padding: 8px 16px;\n display: grid;\n}\n\n.scrcpy-container .header-bar .header-left {\n align-items: center;\n gap: 8px;\n display: flex;\n}\n\n.scrcpy-container .header-bar .header-left .ant-typography {\n color: #333;\n margin: 0;\n font-size: 14px;\n}\n\n.scrcpy-container .header-bar .header-left .anticon {\n color: #999;\n cursor: pointer;\n font-size: 14px;\n}\n\n.scrcpy-container .header-bar .header-left .anticon:hover {\n color: #666;\n}\n\n.scrcpy-container .header-bar .screen-info {\n text-align: center;\n}\n\n.scrcpy-container .header-bar .screen-info .ant-typography {\n color: #666;\n margin: 0;\n font-size: 14px;\n}\n\n.scrcpy-container .header-bar .header-right {\n justify-self: end;\n align-items: center;\n gap: 8px;\n display: flex;\n}\n\n.scrcpy-container .header-bar .header-right .ant-btn {\n border: none;\n justify-content: center;\n align-items: center;\n width: 16px;\n height: 16px;\n display: flex;\n}\n\n.scrcpy-container .header-bar .header-right .ant-btn .link-icon {\n font-size: 16px;\n line-height: 1;\n}\n\n.scrcpy-container .video-section {\n flex-direction: column;\n flex: 1;\n display: flex;\n position: relative;\n}\n\n.scrcpy-container .video-section .video-container {\n background-color: #f5f5f5;\n border-bottom-right-radius: 12px;\n border-bottom-left-radius: 12px;\n flex: 1;\n justify-content: center;\n align-items: center;\n width: 100%;\n display: flex;\n position: relative;\n overflow: hidden;\n}\n\n.scrcpy-container .video-section .video-container .canvas-wrapper {\n justify-content: center;\n align-items: center;\n width: 100%;\n height: 100%;\n display: flex;\n position: absolute;\n top: 0;\n left: 0;\n}\n\n.scrcpy-container .video-section .video-container canvas {\n box-shadow: none !important;\n border: none !important;\n}\n\n.scrcpy-container .video-section .video-container .empty-state {\n z-index: 1;\n text-align: center;\n flex-direction: column;\n align-items: center;\n gap: 16px;\n padding: 24px;\n display: flex;\n position: relative;\n}\n\n.scrcpy-container .video-section .video-container .empty-state .empty-state-icon {\n font-size: 48px;\n line-height: 1;\n}\n\n.scrcpy-container .video-section .video-container .empty-state .empty-state-text {\n color: #666;\n margin-bottom: 8px;\n font-size: 16px;\n}\n\n.scrcpy-container .video-section .video-container .empty-state .loading-spinner {\n margin-top: 16px;\n}\n\n.scrcpy-container .video-section .video-container .empty-state .loading-spinner .ant-spin {\n color: #1677ff;\n}\n\n.scrcpy-container .video-section .video-container .empty-state .ant-btn {\n border-radius: 20px;\n min-width: 120px;\n height: 40px;\n font-size: 16px;\n}\n\n.scrcpy-container .video-section .screen-info {\n background: #00000080;\n border-radius: 4px;\n padding: 4px 8px;\n position: absolute;\n bottom: 8px;\n left: 8px;\n}\n\n.scrcpy-container .video-section .screen-info .ant-typography {\n color: #fff;\n margin: 0;\n}\n\n@media (max-width: 576px) {\n .scrcpy-container .header-bar {\n grid-template-rows: auto auto auto;\n grid-template-columns: 1fr;\n gap: 8px;\n padding: 8px;\n }\n\n .scrcpy-container .header-bar .header-left, .scrcpy-container .header-bar .screen-info {\n text-align: center;\n }\n\n .scrcpy-container .header-bar .header-right {\n justify-content: flex-end;\n justify-self: center;\n width: 100%;\n }\n}\n","/* src/component/playground/index.less */\nbody {\n margin: 0;\n font-family:\n -apple-system,\n BlinkMacSystemFont,\n \"Segoe UI\",\n \"Noto Sans\",\n Helvetica,\n Arial,\n sans-serif,\n \"Apple Color Emoji\",\n \"Segoe UI Emoji\";\n font-size: 14px;\n}\n.prompt-input-wrapper {\n width: 100%;\n}\n.prompt-input-wrapper .mode-radio-group-wrapper {\n display: flex;\n align-items: center;\n justify-content: space-between;\n}\n.prompt-input-wrapper .mode-radio-group-wrapper .mode-radio-group {\n display: flex;\n align-items: center;\n height: 100%;\n}\n.prompt-input-wrapper .mode-radio-group-wrapper .mode-radio-group .ant-radio-button-wrapper {\n height: 24px;\n padding: 0 8px;\n line-height: 24px;\n border-radius: 11px;\n margin-right: 8px;\n box-shadow: none;\n border: none;\n background-color: #F7F7F7;\n font-size: 12px;\n}\n.prompt-input-wrapper .mode-radio-group-wrapper .mode-radio-group .ant-radio-button-wrapper:before {\n display: none;\n}\n.prompt-input-wrapper .mode-radio-group-wrapper .mode-radio-group .ant-radio-button-wrapper:focus-within {\n outline: none;\n}\n.prompt-input-wrapper .mode-radio-group-wrapper .mode-radio-group .ant-radio-button-wrapper.ant-radio-button-wrapper-checked {\n background-color: #2B83FF;\n border-color: #2B83FF;\n color: white;\n}\n.prompt-input-wrapper .mode-radio-group-wrapper .mode-radio-group .ant-radio-button-wrapper.ant-radio-button-wrapper-checked:hover {\n color: #fff;\n}\n.prompt-input-wrapper .mode-radio-group-wrapper .mode-radio-group .ant-radio-button-wrapper:hover {\n color: #2B83FF;\n}\n.prompt-input-wrapper .mode-radio-group-wrapper .action-icons {\n display: flex;\n align-items: center;\n}\n.prompt-input-wrapper .main-side-console-input {\n position: relative;\n margin-top: 10px;\n}\n.prompt-input-wrapper .main-side-console-input .main-side-console-input-textarea {\n border-radius: 12px;\n border: 1px solid #F2F4F7;\n background: white;\n padding: 12px 16px;\n transition: background-color 0.2s ease;\n overflow-y: auto;\n white-space: pre-wrap;\n line-height: 21px;\n scrollbar-width: thin;\n}\n@keyframes hue-shift {\n 0% {\n filter: hue-rotate(0deg);\n }\n 100% {\n filter: hue-rotate(360deg);\n }\n}\n.prompt-input-wrapper .main-side-console-input .main-side-console-input-textarea:focus-within {\n border: 1px solid transparent;\n background: linear-gradient(white, white) padding-box, linear-gradient(135deg, #4285f4 0%, #0066FF 25%, #7B02C5 50%, #ea4335 75%, #ff7043 100%) border-box;\n}\n.prompt-input-wrapper .main-side-console-input .main-side-console-input-textarea::-webkit-scrollbar {\n width: 6px;\n}\n.prompt-input-wrapper .main-side-console-input .main-side-console-input-textarea::-webkit-scrollbar-thumb {\n background-color: rgba(0, 0, 0, 0.2);\n border-radius: 3px;\n}\n.prompt-input-wrapper .main-side-console-input.loading .main-side-console-input-textarea {\n border: 1px solid transparent;\n background: linear-gradient(white, white) padding-box, linear-gradient(135deg, #4285f4 0%, #0066FF 25%, #7B02C5 50%, #ea4335 75%, #ff7043 100%) border-box;\n animation: hue-shift 5s linear infinite;\n}\n.prompt-input-wrapper .main-side-console-input .ant-form-item-control-input-content {\n border: 3px solid transparent;\n border-radius: 14px;\n z-index: 999;\n}\n.prompt-input-wrapper .main-side-console-input:focus-within .ant-form-item-control-input-content {\n border-color: rgba(43, 131, 255, 0.16);\n}\n.prompt-input-wrapper .main-side-console-input.disabled .form-controller-wrapper {\n background-color: transparent;\n}\n.prompt-input-wrapper .ant-input {\n padding-bottom: 40px;\n}\n.prompt-input-wrapper .form-controller-wrapper {\n position: absolute;\n display: flex;\n flex-direction: row;\n justify-content: flex-end;\n width: calc(100% - 32px);\n box-sizing: border-box;\n align-items: flex-end;\n gap: 8px;\n background-color: #FFF;\n left: 16px;\n bottom: 0.5px;\n padding: 12px 0;\n line-height: 32px;\n transition: background-color 0.2s ease;\n}\n.prompt-input-wrapper .settings-wrapper {\n display: flex;\n flex-direction: row;\n gap: 2px;\n color: #777;\n flex-wrap: wrap;\n}\n.prompt-input-wrapper .settings-wrapper.settings-wrapper-hover {\n color: #3b3b3b;\n}\n.selector-trigger {\n width: 24px;\n height: 24px;\n cursor: pointer;\n transition: all 0.2s ease;\n}\n.selector-trigger .action-icon {\n font-size: 14px;\n color: rgba(0, 0, 0, 0.85);\n transition: all 0.2s;\n}\n.selector-trigger .action-icon:hover {\n color: #2B83FF;\n}\n.history-modal-container {\n height: 70vh;\n display: flex;\n flex-direction: column;\n border-radius: 12px 12px 0 0;\n overflow: hidden;\n}\n.history-modal-container .history-modal-header {\n display: flex;\n justify-content: space-between;\n align-items: center;\n height: 48px;\n line-height: 48px;\n padding: 0 25px;\n}\n.history-modal-container .history-modal-header .close-button {\n margin-right: -4px;\n padding: 4px;\n display: flex;\n align-items: center;\n justify-content: center;\n}\n.history-modal-container .history-modal-header .close-button .anticon {\n font-size: 18px;\n color: #999999;\n}\n.history-modal-container .history-modal-header .close-button:hover .anticon {\n color: #666666;\n}\n.history-modal-container .history-search-section {\n padding: 16px 20px;\n background: #ffffff;\n}\n.history-modal-container .history-search-section .search-input-wrapper {\n display: flex;\n align-items: center;\n gap: 12px;\n color: rgba(0, 0, 0, 0.25);\n}\n.history-modal-container .history-search-section .search-input-wrapper .search-input {\n flex: 1 1;\n height: 36px;\n border-radius: 16px;\n background: #f1f2f3;\n border: none;\n}\n.history-modal-container .history-search-section .search-input-wrapper .search-input .ant-input {\n background: transparent;\n border: none;\n box-shadow: none;\n}\n.history-modal-container .history-search-section .search-input-wrapper .search-input:hover,\n.history-modal-container .history-search-section .search-input-wrapper .search-input:focus-within {\n border-color: #d9d9d9;\n background: #ffffff;\n}\n.history-modal-container .history-search-section .search-input-wrapper .clear-button {\n color: #1890ff;\n padding: 0;\n height: auto;\n}\n.history-modal-container .history-search-section .search-input-wrapper .clear-button:hover {\n color: #40a9ff;\n}\n.history-modal-container .history-content {\n flex: 1 1;\n overflow-y: auto;\n padding: 0 25px 25px 25px;\n}\n.history-modal-container .history-content .history-group {\n margin-bottom: 10px;\n}\n.history-modal-container .history-content .history-group .history-group-title {\n font-size: 12px;\n color: rgba(0, 0, 0, 0.45);\n height: 40px;\n line-height: 40px;\n font-weight: 400;\n}\n.history-modal-container .history-content .history-group .history-item {\n cursor: pointer;\n height: 40px;\n line-height: 40px;\n font-size: 14px;\n color: rgba(0, 0, 0, 0.85);\n overflow: hidden;\n white-space: nowrap;\n text-overflow: ellipsis;\n}\n.history-modal-container .history-content .history-group .history-item:hover {\n background: #f2f4f7;\n padding: 0 8px;\n margin: 0 -8px;\n}\n.history-modal-container .history-content .no-results {\n text-align: center;\n padding: 40px 20px;\n color: #999999;\n}\n.ant-modal-wrap .ant-modal-content {\n animation: slideUpFromBottom 0.3s cubic-bezier(0.4, 0, 0.2, 1) forwards !important;\n}\n@keyframes slideUpFromBottom {\n 0% {\n transform: translateY(100%);\n opacity: 0;\n }\n 100% {\n transform: translateY(0);\n opacity: 1;\n }\n}\n.result-wrapper {\n display: flex;\n height: 100%;\n justify-content: center;\n margin: 4px 0;\n}\n.result-wrapper .loading-container {\n text-align: center;\n}\n.result-wrapper .loading-container .loading-progress-text {\n margin-top: 8px;\n color: #888;\n font-size: 12px;\n}\n.result-wrapper pre {\n margin: 4px 0;\n margin: 0;\n white-space: pre-wrap;\n text-wrap: unset;\n word-wrap: break-word;\n overflow-wrap: break-word;\n background: #F2F4F7;\n border-radius: 8px;\n padding: 14px;\n overflow: scroll;\n}\n\n/* src/component/player.less */\n.player-container {\n width: 100%;\n height: 100%;\n max-width: 100%;\n max-height: 100%;\n padding: 12px;\n background: #F2F4F7;\n box-sizing: border-box;\n border: 1px solid #F2F4F7;\n border-radius: 8px;\n line-height: 100%;\n margin: 0 auto;\n display: flex;\n flex-direction: column;\n overflow: visible;\n min-height: 300px;\n position: relative;\n}\n.player-container[data-fit-mode=height] {\n background: #fff;\n}\n.player-container[data-fit-mode=height] .canvas-container {\n background-color: #F2F4F7;\n}\n.player-container .canvas-container {\n flex: 0 0 auto;\n min-height: 200px;\n width: 100%;\n display: flex;\n justify-content: center;\n align-items: center;\n overflow: hidden;\n position: relative;\n background-color: #fff;\n border-top-right-radius: 16px;\n border-top-left-radius: 16px;\n aspect-ratio: var(--canvas-aspect-ratio, 16/9);\n}\n.player-container .canvas-container canvas {\n width: 100%;\n height: auto;\n max-width: 100%;\n max-height: 100%;\n box-sizing: border-box;\n display: block;\n margin: 0 auto;\n object-fit: contain;\n border: none;\n}\n.player-container .canvas-container[data-fit-mode=height] {\n flex: 1 1 auto;\n aspect-ratio: unset;\n min-height: 0;\n height: auto;\n}\n.player-container .canvas-container[data-fit-mode=height] canvas {\n height: 100%;\n width: auto;\n max-width: 100%;\n max-height: 100%;\n}\n.player-container .canvas-container[data-fit-mode=width] {\n aspect-ratio: var(--canvas-aspect-ratio, 16/9);\n}\n.player-container .canvas-container[data-fit-mode=width] canvas {\n width: 100%;\n height: auto;\n}\n.player-container .player-timeline-wrapper {\n width: 100%;\n height: 4px;\n flex: none;\n margin-bottom: 2px;\n position: relative;\n}\n.player-container .player-timeline {\n width: 100%;\n height: 4px;\n background: #666;\n position: relative;\n flex-shrink: 0;\n}\n.player-container .player-timeline .player-timeline-progress {\n transition-timing-function: linear;\n position: absolute;\n top: 0;\n left: 0;\n height: 4px;\n background: #2B83FF;\n}\n.player-container .player-tools-wrapper {\n width: 100%;\n height: 72px;\n flex: none;\n position: relative;\n padding-top: 15px;\n padding-bottom: 15px;\n padding-left: 16px;\n padding-right: 16px;\n box-sizing: border-box;\n}\n.player-container .player-tools {\n width: 100%;\n height: 42px;\n max-width: 100%;\n overflow: hidden;\n color: #000;\n font-size: 14px;\n box-sizing: border-box;\n display: flex;\n flex-direction: row;\n justify-content: space-between;\n flex-shrink: 0;\n}\n.player-container .player-tools .ant-spin {\n color: #333;\n}\n.player-container .player-tools .player-control {\n flex-grow: 1;\n display: flex;\n flex-direction: row;\n align-items: center;\n overflow: hidden;\n}\n.player-container .player-tools .status-icon {\n transition: 0.2s;\n width: 32px;\n height: 32px;\n border-radius: 8px;\n display: flex;\n align-items: center;\n justify-content: center;\n flex-shrink: 0;\n margin-left: 10px;\n}\n.player-container .player-tools .status-icon:hover {\n cursor: pointer;\n background: #F0f0f0;\n}\n.player-container .player-tools .status-text {\n flex-grow: 1;\n flex-shrink: 1;\n min-width: 0;\n overflow: hidden;\n position: relative;\n height: 100%;\n display: flex;\n flex-direction: column;\n justify-content: space-between;\n width: 0;\n}\n.player-container .player-tools .title {\n font-weight: 600;\n}\n.player-container .player-tools .title,\n.player-container .player-tools .subtitle {\n text-overflow: ellipsis;\n overflow: hidden;\n white-space: nowrap;\n width: 100%;\n}\n.player-container .player-tools .player-tools-item {\n height: 100%;\n display: flex;\n flex-direction: column;\n justify-content: center;\n}\n\n/* src/component/logo.less */\n.logo img {\n height: 30px;\n line-height: 30px;\n vertical-align: baseline;\n vertical-align: -webkit-baseline-middle;\n}\n.logo-with-star-wrapper {\n display: flex;\n flex-direction: row;\n justify-content: space-between;\n}\n\n/* src/component/blackboard.less */\n.blackboard .footer {\n color: #aaa;\n}\n.blackboard ul {\n padding-left: 0px;\n}\n.blackboard li {\n list-style: none;\n}\n.blackboard .bottom-tip {\n height: 30px;\n}\n.blackboard .bottom-tip-item {\n max-width: 500px;\n color: #AAA;\n text-overflow: ellipsis;\n word-wrap: break-word;\n}\n.blackboard-filter {\n margin: 10px 0;\n}\n.blackboard-main-content canvas {\n width: 100%;\n border: 1px solid #888;\n box-sizing: border-box;\n}\n\n/* src/component/shiny-text.less */\n.shiny-text {\n position: relative;\n display: inline-block;\n background-size: 300% auto;\n -webkit-background-clip: text;\n background-clip: text;\n color: transparent;\n font-weight: 600;\n letter-spacing: 0.5px;\n text-shadow: 0 1px 2px rgba(0, 0, 0, 0.05);\n overflow: hidden;\n animation: textGradient 8s ease infinite;\n background-image: linear-gradient(45deg, #2b83ff, #6a11cb, #2575fc, #4481eb);\n}\n.shiny-text::after {\n content: \"\";\n position: absolute;\n top: -10%;\n left: -150%;\n width: 120%;\n height: 120%;\n background: linear-gradient(90deg, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0.1) 10%, rgba(255, 255, 255, 0.6) 50%, rgba(255, 255, 255, 0.1) 90%, rgba(255, 255, 255, 0) 100%);\n transform: skewX(-20deg) translateY(0);\n animation: shine var(--animation-duration, 5s) cubic-bezier(0.25, 0.1, 0.25, 1) infinite;\n z-index: 1;\n pointer-events: none;\n}\n.shiny-text.disabled {\n animation: none;\n background: #2b83ff;\n -webkit-background-clip: text;\n background-clip: text;\n}\n.shiny-text.disabled::after {\n animation: none;\n display: none;\n}\n@keyframes shine {\n 0% {\n left: -150%;\n opacity: 0.7;\n }\n 20% {\n opacity: 1;\n }\n 80% {\n opacity: 1;\n }\n 100% {\n left: 250%;\n opacity: 0.7;\n }\n}\n@keyframes textGradient {\n 0% {\n background-position: 0% 50%;\n }\n 50% {\n background-position: 100% 50%;\n }\n 100% {\n background-position: 0% 50%;\n }\n}\n\n/* src/component/github-star.less */\n.github-star {\n height: 22px;\n}\n\n/* src/component/describer.less */\n.image-describer {\n position: relative;\n}\n.image-describer .describe-text {\n box-sizing: border-box;\n position: absolute;\n background: #000;\n width: 100%;\n height: 30px;\n left: 0;\n bottom: 0;\n color: #FFF;\n font-size: 12px;\n padding: 10px;\n}\n.image-describer .describe-text.success {\n background: #047704;\n}\n.image-describer .describe-text.error {\n background: #870707;\n}\n"],"names":[],"mappings":"AADA,mKCQA,mGAQA,0CAKA,0CAKA,sFAQA,sIASA,gDAIA,2GASA,+FAOA,mIASA,iGAOA,mDAIA,+EAOA,gGAOA,6EAOA,oFAOA,oDAIA,uHAUA,yBACE,4CAKA,mDAIA,wGAQA,gFAIA,4BAIA,uEAMA,0CAKF,+CACE,gDAMF,kFAMA,8CC/KA,kECOA,uEAKA,qHASA,+JAWA,oLAWA,sFAKA,0IAQA,0LAYA,4FAMA,uGAOA,yIASA,uHAOA,4FAMA,2EAKA,iEAIA,yEAKA,wFAKA,oLASA,gIAKA,iFAIA,sIAMA,6IAMA,8JAMA,mJAKA,6IAKA,gJAOA,8EAMA,4CAKA,6BC1LA,4ECQA,iGAQA,wDAIA,+FAOA,8EAKA,iFAIA,mHAMA,uRAaA,mFAMA,8FAMA,6FAMA,qEAIA,6DAIA,8FAMA,qGAOA,+IASA,6FAKA,6FAOA,qPAaA,+KAWA,yGAKA,yLAWA,8GAKA,6HAMA,gGAIA,wGAIA,sIAOA,2IASA,kFAKA,yBACE,8GAOA,wGAIA,qGC9MF,yJAMA,iCAIA,8GAMA,8GAMA,+OAYA,gHAIA,sHAIA,sLAMA,8IAIA,gHAIA,8FAKA,iFAKA,0QAYA,0EAUA,+QAKA,8GAIA,mJAKA,iTAMA,0IAMA,wHAIA,wGAIA,qDAIA,iTAiBA,uFAOA,6EAIA,2EAOA,iFAMA,mDAIA,oHAQA,yJASA,kJAQA,gGAKA,uFAIA,mFAKA,gIAOA,0JAQA,2IAMA,kOAKA,yHAMA,yGAIA,qFAMA,4EAIA,0JAQA,4MAWA,4HAMA,qGAMA,8GAIA,2GAYA,6EAOA,qDAIA,mGAMA,kLAYA,+RAmBA,wDAIA,mFAIA,+RAeA,kLAYA,gHAOA,uHAOA,sGAIA,uFAKA,+GAQA,yGAQA,4JASA,mIASA,kNAcA,qDAIA,+HAQA,+LAYA,qFAKA,0MAaA,uDAIA,sJAOA,yHAOA,sGAOA,sFAMA,+BAIA,8BAIA,+BAIA,oCAIA,oGAOA,iCAIA,uFAMA,qUAeA,uUAcA,yGAOA,uDAKA,+FAoBA,0GAcA,yBAIA,mCAIA,sKAaA,2DAIA"}
|