@midscene/visualizer 0.2.2 → 0.2.3-beta-20240815085544.0

package/dist/report/index.css

@@ -0,0 +1,445 @@
+/* src/index.less */
+html,
+body {
+  padding: 0;
+  margin: 0;
+  line-height: 1;
+}
+.rspress-nav {
+  transition: 0.2s;
+}
+:root {
+  --modern-sidebar-width: 0 !important;
+  --modern-aside-width: 0 !important;
+  --modern-preview-padding: 0 !important;
+}
+.modern-doc-layout,
+.modern-doc {
+  width: 100% !important;
+  margin: 0 !important;
+  padding: 0 !important;
+  height: 100vh;
+}
+.modern-sidebar,
+header.w-full {
+  display: none !important;
+}
+.modern-doc-container {
+  padding: 0 !important;
+}
+footer.mt-8 {
+  display: none;
+}
+.page-container {
+  display: flex;
+  flex-direction: column;
+  height: 100%;
+  color: #3b3b3b;
+  font-family:
+    -apple-system,
+    BlinkMacSystemFont,
+    "Segoe UI",
+    "Noto Sans",
+    Helvetica,
+    Arial,
+    sans-serif,
+    "Apple Color Emoji",
+    "Segoe UI Emoji";
+  font-size: 14px;
+  border-top: 1px solid #E5E5E5;
+  border-bottom: 1px solid #E5E5E5;
+  font-synthesis: style;
+  text-rendering: optimizelegibility;
+  -webkit-font-smoothing: antialiased;
+  line-height: 1.5;
+}
+.page-container blockquote,
+.page-container dl,
+.page-container dd,
+.page-container h1,
+.page-container h2,
+.page-container h3,
+.page-container h4,
+.page-container h5,
+.page-container h6,
+.page-container hr,
+.page-container figure,
+.page-container p,
+.page-container pre {
+  margin: 0;
+}
+.page-nav {
+  height: 30px;
+  padding: 10px;
+  border-bottom: 1px solid #E5E5E5;
+  display: flex;
+  flex-direction: row;
+}
+.page-nav .logo img {
+  height: 20px;
+  line-height: 30px;
+  vertical-align: baseline;
+  vertical-align: -webkit-baseline-middle;
+}
+.page-nav .playwright-case-selector {
+  margin-left: 20px;
+  line-height: 30px;
+  width: 320px;
+}
+.cost-str {
+  color: #777;
+}
+.ant-layout {
+  flex-grow: 1;
+  height: 100%;
+}
+.main-right {
+  display: flex;
+  flex-direction: column;
+  width: 100%;
+  height: 100%;
+  box-sizing: border-box;
+}
+.main-right .main-content {
+  display: flex;
+  flex-direction: row;
+  flex-grow: 1;
+  overflow: hidden;
+  background: #FFF;
+}
+.main-right.uploader-wrapper {
+  box-sizing: border-box;
+  margin: auto;
+  max-width: 800px;
+  flex-direction: column;
+  justify-content: center;
+}
+.main-right.uploader-wrapper .uploader {
+  width: 100%;
+}
+.main-right.uploader-wrapper .demo-loader {
+  width: 100%;
+  text-align: center;
+  margin-top: 10px;
+}
+.main-right .main-canvas-container {
+  flex-grow: 1;
+  height: 100%;
+  background: #ffffff;
+  overflow-x: hidden;
+  overflow-y: scroll;
+  border-left: 1px solid #E5E5E5;
+}
+.main-right .main-side {
+  box-sizing: border-box;
+  overflow-y: scroll;
+  height: 100%;
+}
+.main-right .json-content {
+  word-wrap: break-word;
+  white-space: pre-wrap;
+}
+
+/* src/component/detail-side.less */
+.detail-side h2 {
+  padding-top: 0;
+  margin-top: 0;
+  margin-bottom: 4px;
+}
+.detail-side .ant-tag {
+  margin-top: 2px;
+}
+.detail-side .meta-kv {
+  padding: 10px 10px calc(10px + 4px);
+}
+.detail-side .meta-kv .meta {
+  box-sizing: border-box;
+  padding: 2px 0;
+  width: 100%;
+  display: flex;
+  flex-direction: row;
+  line-height: 1.5;
+}
+.detail-side .meta-kv .meta .meta-key {
+  width: 100px;
+  text-align: right;
+  padding-right: 16px;
+}
+.detail-side .meta-kv .meta .meta-value {
+  flex: 1 1;
+}
+.detail-side .item-list {
+  padding: 10px 10px;
+  cursor: default;
+  margin-bottom: 10px;
+}
+.detail-side .item-list .item {
+  padding: 16px 10px 10px;
+  transition: 0.1s;
+  border: 1px solid #DDD;
+  border-radius: 5px;
+  margin-bottom: 10px;
+  position: relative;
+}
+.detail-side .item-list .item.item-lite {
+  border: none;
+  padding: 0;
+}
+.detail-side .item-list .item-highlight {
+  color: #FFF;
+}
+.detail-side .item-list .item-highlight .subtitle {
+  color: #CCC;
+}
+.detail-side .item-list .item-extra {
+  position: absolute;
+  right: 10px;
+  top: 10px;
+  color: #777;
+}
+.detail-side .item-list .title-right-padding {
+  padding-right: 15px;
+}
+.detail-side .item-list .title {
+  font-size: 18px;
+  font-weight: bold;
+  margin-bottom: 5px;
+}
+.detail-side .item-list .title .title-tag {
+  display: inline-block;
+  margin-left: 6px;
+  color: #777;
+  font-size: 14px;
+  line-height: 18px;
+}
+.detail-side .item-list .subtitle {
+  font-weight: normal;
+  font-size: 14px;
+  color: #777;
+}
+.detail-side .item-list .description {
+  margin-top: 5px;
+}
+.detail-side .item-list .description-content {
+  font-size: 14px;
+  margin-top: 10px;
+  white-space: break-spaces;
+  word-wrap: break-word;
+  margin: 0;
+}
+.detail-side .item-list .element-button:hover {
+  color: #fff;
+  background: #F9483E;
+}
+.detail-side .item-list .section-button:hover {
+  color: #fff;
+  background: #01204E;
+}
+.detail-side pre {
+  text-wrap: balance;
+}
+.detail-side .item-list-space-up {
+  margin-top: 10px;
+}
+
+/* src/component/panel-title.less */
+.panel-title {
+  background: #F8F8F8;
+  border-top: 1px solid #E5E5E5;
+  border-bottom: 1px solid #E5E5E5;
+  margin-top: -1px;
+  padding: 2px 10px;
+}
+.panel-title .task-list-name {
+  font-weight: bold;
+}
+
+/* src/component/sidebar.less */
+.side-bar {
+  display: flex;
+  flex-direction: column;
+  justify-content: space-between;
+  width: 100%;
+  height: 100%;
+  border-right: 1px solid #E5E5E5;
+  overflow: auto;
+  background: #F8F8F8;
+  box-sizing: border-box;
+}
+.side-bar .task-meta-section {
+  margin-top: 6px;
+}
+.side-bar .task-meta {
+  color: #777;
+  font-weight: normal;
+  padding-left: 10px;
+}
+.side-bar .side-seperator {
+  border-top: 1px solid none;
+}
+.side-bar .side-seperator.side-seperator-line {
+  border-top: 1px solid #E5E5E5;
+}
+.side-bar .side-seperator.side-seperator-space-up {
+  margin-top: 10px;
+}
+.side-bar .side-seperator.side-seperator-space-down {
+  margin-bottom: 10px;
+}
+.side-bar .side-sub-title {
+  padding: 0 10px;
+  margin-bottom: 6px;
+}
+.side-bar .name-status {
+  font-size: 12px;
+  display: inline-block;
+  margin-right: 6px;
+}
+.side-bar .side-item {
+  cursor: pointer;
+  transition: 0.1s;
+  padding: 2px 0;
+}
+.side-bar .side-item:hover {
+  background: #dcdcdc80;
+}
+.side-bar .side-item.selected {
+  background: #bfc4da80;
+}
+.side-bar .side-item .side-item-content {
+  padding: 0 10px 0 calc(10px + 18px);
+}
+.side-bar .side-item-name {
+  padding: 0 10px 0 calc(10px + 18px);
+  position: relative;
+  display: flex;
+  justify-content: space-between;
+}
+.side-bar .side-item-name .status-icon {
+  position: absolute;
+  left: 10px;
+  display: inline-block;
+  color: #AAA;
+  font-size: 12px;
+  line-height: 10px;
+  top: 50%;
+  margin-top: -5px;
+}
+.side-bar .side-item-name .status-text {
+  color: #777;
+}
+.side-bar .bottom-controls {
+  padding: 10px 10px;
+  text-align: left;
+  text-align: center;
+}
+
+/* src/component/detail-panel.less */
+.detail-panel {
+  display: flex;
+  flex-direction: column;
+  height: 100%;
+  padding: 10px;
+  background: #FFF;
+}
+.detail-panel .ant-segmented {
+  padding: 0;
+}
+.detail-panel .view-switcher {
+  margin-bottom: 10px;
+  flex-shrink: 0;
+}
+.detail-panel .detail-content {
+  box-sizing: border-box;
+  justify-content: center;
+  flex-direction: column;
+  display: flex;
+  flex-grow: 1;
+}
+.detail-panel .blackboard {
+  margin: 0 auto;
+}
+.detail-panel .screenshot-item-wrapper {
+  display: flex;
+  flex-wrap: wrap;
+  justify-content: space-around;
+  align-items: center;
+}
+.detail-panel .screenshot-item {
+  margin-bottom: 10px;
+}
+.detail-panel .screenshot-item .screenshot-item-title {
+  margin-bottom: 5px;
+}
+.detail-panel .screenshot-item img {
+  border: 1px solid #888;
+  max-width: 100%;
+}
+
+/* src/component/blackboard.less */
+.blackboard .footer {
+  color: #aaa;
+}
+.blackboard ul {
+  padding-left: 0px;
+}
+.blackboard li {
+  list-style: none;
+}
+.blackboard .bottom-tip {
+  height: 30px;
+}
+.blackboard .bottom-tip-item {
+  max-width: 500px;
+  color: #AAA;
+  text-overflow: ellipsis;
+  word-wrap: break-word;
+}
+.blackboard-filter {
+  margin: 10px 0;
+}
+.blackboard-main-content canvas {
+  width: 100%;
+  border: 1px solid #888;
+}
+
+/* src/component/global-hover-preview.less */
+.global-hover-preview {
+  position: fixed;
+  display: block;
+  max-width: 400px;
+  max-height: 400px;
+  overflow: hidden;
+  z-index: 10;
+  text-align: center;
+  border: 1px solid #E5E5E5;
+  box-sizing: border-box;
+  background: #F8F8F8;
+  box-shadow: 1px 1px 5px 0 rgba(0, 0, 0, 0.2);
+}
+.global-hover-preview img {
+  max-width: 400px;
+  max-height: 400px;
+  width: auto;
+  height: auto;
+}
+
+/* src/component/timeline.less */
+.timeline-wrapper {
+  flex-basis: 110px;
+  flex-grow: 0;
+  flex-shrink: 0;
+  width: 100%;
+  height: 100%;
+  border-bottom: 1px solid #E5E5E5;
+  position: relative;
+  box-sizing: border-box;
+}
+.timeline-wrapper .timeline-canvas-wrapper {
+  width: 100%;
+  height: 100%;
+}
+.timeline-wrapper canvas {
+  width: 100%;
+  height: 100%;
+}