@vtx/player 0.0.15 → 0.0.16

package/lib/live-player/demo/src/components/lib/vtx-page-layout/style/index.less

@@ -0,0 +1,138 @@
+@import (reference) '~antd/lib/style/themes/index.less';
+
+@prefix-cls: vtx-page;
+@spacing-base: 10px;
+@padding-default-base: @spacing-base;
+
+.size(@width; @height) {
+    width: @width;
+    height: @height;
+}
+
+.relative(@height: 100%, @width: 100%) {
+    position: relative;
+    .size(@width, @height);
+}
+
+.absolute(@top: 0, @right: 0, @left: 0, @bottom: 0) {
+    position: absolute;
+    top: @top;
+    right: @right;
+    bottom: @bottom;
+    left: @left;
+}
+
+.overflow-y {
+    overflow: hidden;
+    overflow-y: auto;
+}
+
+.vtx-page {
+    position: relative;
+    width: 100%;
+    height: 100%;
+    overflow-x: hidden;
+    font-size: 14px;
+    .ant-table-footer {
+        padding: 0 !important;
+    }
+    .vtx-ui-date-normal {
+        width: 100%;
+    }
+    .vtx-ui-grid-normal {
+        z-index: 999;
+    }
+    .ant-tabs {
+        height: 100%;
+    }
+    .ant-tabs-content {
+        height: e('calc(100% - 56px)');
+    }
+    .ant-tabs-tabpane {
+        height: 100%;
+    }
+    .td {
+        position: relative;
+    }
+}
+
+.vtx-button-wrap {
+    button + button {
+        margin-left: 8px;
+    }
+}
+
+.vtx-content {
+    &-absolute {
+        .absolute();
+    }
+    &-relative {
+        .relative();
+    }
+    &-scroll-y {
+        .overflow-y();
+    }
+}
+
+.vtx-table-wrapper {
+    &-absolute {
+        .absolute();
+        padding: 0 @padding-default-base / 2;
+    }
+    &-relative {
+        .relative();
+        max-height: 500px;
+        padding: 0 @padding-default-base / 2;
+    }
+}
+
+@table-page-padding-left: 20px;
+@table-page-padding-right: 20px;
+@table-page-padding-bottom: 16px;
+@table-page-padding-top: 16px;
+
+.vtx-page--table {
+    position: relative;
+    width: 100%;
+    height: 100%;
+    padding: @table-page-padding-top @table-page-padding-right @table-page-padding-bottom
+        @table-page-padding-left;
+    overflow-x: hidden;
+    font-size: 14px;
+    background-color: @layout-body-background;
+}
+
+.vtx-table {
+    &-search {
+        margin-bottom: 16px;
+        background: @component-background;
+        border-radius: @border-radius-base;
+    }
+    &-content {
+        .absolute();
+        right: @table-page-padding-right;
+        bottom: @table-page-padding-bottom;
+        left: @table-page-padding-left;
+        transition-duration: 0.3s;
+        transition-property: top;
+    }
+    &-wrap {
+        .absolute();
+        padding: 0 24px;
+        background-color: @component-background;
+    }
+    &-card {
+        background: @component-background;
+        border-radius: @border-radius-base;
+    }
+    &-left,
+    &-right {
+        height: 100%;
+        overflow: hidden;
+    }
+    &-left {
+        .vtx-ztree-search {
+            right: 0;
+        }
+    }
+}

package/lib/live-player/demo/src/components/lib/vtx-rps-frame/style/index.css

@@ -0,0 +1,8 @@
+.vtx-rps-frame {
+  width: 100%;
+  height: 100%;
+  overflow: hidden;
+}
+.vtx-rps-frame iframe {
+  border-width: 0;
+}

package/lib/live-player/demo/src/components/lib/vtx-rps-frame/style/index.less

@@ -0,0 +1,8 @@
+.vtx-rps-frame {
+    width: 100%;
+    height: 100%;
+    overflow: hidden;
+    iframe {
+        border-width: 0;
+    }
+}

package/lib/live-player/demo/src/components/lib/vtx-scrollable-row/style/index.css

@@ -0,0 +1,111 @@
+.vtx-scrollable-row-container {
+  position: relative;
+  -webkit-box-sizing: border-box;
+          box-sizing: border-box;
+  margin-bottom: -1px;
+  overflow: hidden;
+  font-size: 14px;
+  line-height: 1.5715;
+  white-space: nowrap;
+  -webkit-transition: padding 0.3s cubic-bezier(0.645, 0.045, 0.355, 1);
+  transition: padding 0.3s cubic-bezier(0.645, 0.045, 0.355, 1);
+  zoom: 1;
+}
+.vtx-scrollable-row-container::after {
+  clear: both;
+}
+.vtx-scrollable-row-container::before,
+.vtx-scrollable-row-container::after {
+  display: table;
+  content: ' ';
+}
+.vtx-scrollable-row-container:hover .vtx-scrollable-row-arrow-show {
+  display: inline-block;
+}
+.vtx-scrollable-row-prev,
+.vtx-scrollable-row-next {
+  position: absolute;
+  z-index: 1;
+  display: none;
+  line-height: 36px;
+  text-align: center;
+  background: #fff;
+  border: none;
+  cursor: pointer;
+  -webkit-transition: width 0.3s cubic-bezier(0.645, 0.045, 0.355, 1), opacity 0.3s cubic-bezier(0.645, 0.045, 0.355, 1), color 0.3s cubic-bezier(0.645, 0.045, 0.355, 1);
+  transition: width 0.3s cubic-bezier(0.645, 0.045, 0.355, 1), opacity 0.3s cubic-bezier(0.645, 0.045, 0.355, 1), color 0.3s cubic-bezier(0.645, 0.045, 0.355, 1);
+  -webkit-user-select: none;
+     -moz-user-select: none;
+      -ms-user-select: none;
+          user-select: none;
+}
+.vtx-scrollable-row-prev-icon,
+.vtx-scrollable-row-next-icon {
+  position: absolute;
+  top: 50%;
+  left: 50%;
+  font-weight: 700;
+  font-style: normal;
+  font-variant: normal;
+  line-height: inherit;
+  text-align: center;
+  text-transform: none;
+  vertical-align: baseline;
+  -webkit-transform: translate(-50%, -50%);
+  -ms-transform: translate(-50%, -50%);
+  transform: translate(-50%, -50%);
+}
+.vtx-scrollable-row-prev::before,
+.vtx-scrollable-row-next::before {
+  display: block;
+}
+.vtx-scrollable-row-prev {
+  left: 0;
+  border-radius: 2px 0 0 2px;
+  -webkit-box-shadow: 5px 0 5px -5px rgba(0, 0, 0, 0.16);
+          box-shadow: 5px 0 5px -5px rgba(0, 0, 0, 0.16);
+}
+.vtx-scrollable-row-next {
+  right: 0;
+  border-radius: 0 2px 2px 0;
+  -webkit-box-shadow: -5px 0 5px -5px rgba(0, 0, 0, 0.16);
+          box-shadow: -5px 0 5px -5px rgba(0, 0, 0, 0.16);
+}
+.vtx-scrollable-row-btn-disabled {
+  color: #ccc;
+  cursor: not-allowed;
+}
+.vtx-scrollable-row-arrow-show {
+  display: none;
+  width: 32px;
+  height: 100%;
+  opacity: 1;
+  pointer-events: auto;
+}
+.vtx-scrollable-row-nav-wrap {
+  margin-bottom: -1px;
+  overflow: hidden;
+}
+.vtx-scrollable-row-nav-scroll {
+  overflow: hidden;
+  line-height: 1;
+  white-space: nowrap;
+}
+.vtx-scrollable-row-nav {
+  position: relative;
+  display: inline-block;
+  -webkit-box-sizing: border-box;
+          box-sizing: border-box;
+  margin: 0;
+  padding-left: 0;
+  list-style: none;
+  transition: transform 0.3s cubic-bezier(0.645, 0.045, 0.355, 1), -webkit-transform 0.3s cubic-bezier(0.645, 0.045, 0.355, 1);
+}
+.vtx-scrollable-row-nav::after {
+  clear: both;
+}
+.vtx-scrollable-row-nav::before,
+.vtx-scrollable-row-nav::after {
+  display: table;
+  content: ' ';
+}

package/lib/live-player/demo/src/components/lib/vtx-scrollable-row/style/index.less

@@ -0,0 +1,113 @@
+@import (reference) '~antd/lib/style/themes/index.less';
+
+@prefix-cls: vtx-scrollable-row;
+@easing-in-out: cubic-bezier(0.645, 0.045, 0.355, 1);
+@effect-duration: 0.3s;
+
+.@{prefix-cls} {
+    &-container {
+        position: relative;
+        box-sizing: border-box;
+        margin-bottom: -1px;
+        overflow: hidden;
+        font-size: @font-size-base;
+        line-height: @line-height-base;
+        white-space: nowrap;
+        transition: padding @effect-duration @easing-in-out;
+        zoom: 1;
+        &::after {
+            clear: both;
+        }
+        &::before,
+        &::after {
+            display: table;
+            content: ' ';
+        }
+        &:hover {
+            .@{prefix-cls}-arrow-show {
+                display: inline-block;
+            }
+        }
+    }
+    &-prev,
+    &-next {
+        position: absolute;
+        z-index: 1;
+        display: none;
+        line-height: 36px;
+        text-align: center;
+        background: @component-background;
+        border: none;
+        cursor: pointer;
+        transition: width @effect-duration @easing-in-out, opacity @effect-duration @easing-in-out,
+            color @effect-duration @easing-in-out;
+        user-select: none;
+        &-icon {
+            position: absolute;
+            top: 50%;
+            left: 50%;
+            font-weight: 700;
+            font-style: normal;
+            font-variant: normal;
+            line-height: inherit;
+            text-align: center;
+            text-transform: none;
+            vertical-align: baseline;
+            -webkit-transform: translate(-50%, -50%);
+            -ms-transform: translate(-50%, -50%);
+            transform: translate(-50%, -50%);
+        }
+        &::before {
+            display: block;
+        }
+    }
+
+    &-prev {
+        left: 0;
+        border-radius: @border-radius-base 0 0 @border-radius-base;
+        box-shadow: 5px 0 5px -5px rgba(0, 0, 0, 0.16);
+    }
+    &-next {
+        right: 0;
+        border-radius: 0 @border-radius-base @border-radius-base 0;
+        box-shadow: -5px 0 5px -5px rgba(0, 0, 0, 0.16);
+    }
+    &-btn-disabled {
+        color: #ccc;
+        cursor: not-allowed;
+    }
+    &-arrow-show {
+        display: none;
+        width: 32px;
+        height: 100%;
+        opacity: 1;
+        pointer-events: auto;
+    }
+    &-nav-wrap {
+        margin-bottom: -1px;
+        overflow: hidden;
+    }
+    &-nav-scroll {
+        overflow: hidden;
+        line-height: 1;
+        white-space: nowrap;
+    }
+    &-nav {
+        position: relative;
+        display: inline-block;
+        box-sizing: border-box;
+        margin: 0;
+        padding-left: 0;
+        list-style: none;
+        transition: transform @effect-duration @easing-in-out,
+            -webkit-transform @effect-duration @easing-in-out;
+        &::after {
+            clear: both;
+        }
+        &::before,
+        &::after {
+            display: table;
+            content: ' ';
+        }
+    }
+}

package/lib/live-player/demo/src/components/lib/vtx-search/style/index.css

@@ -0,0 +1,84 @@
+.vtx-search {
+  position: relative;
+  z-index: 9;
+  padding-top: 8px;
+  padding-right: 24px;
+  padding-bottom: 8px;
+  padding-left: 24px;
+  overflow: hidden;
+  background: #fff;
+  -webkit-transition-duration: 0.3s;
+          transition-duration: 0.3s;
+  -webkit-transition-property: height;
+  transition-property: height;
+}
+.vtx-search-label_h {
+  display: inline-block;
+  overflow: hidden;
+  line-height: 48px;
+  white-space: nowrap;
+  text-overflow: ellipsis;
+  vertical-align: top;
+}
+.vtx-search-lists_h {
+  position: relative;
+  display: inline-block;
+  -webkit-box-sizing: border-box;
+          box-sizing: border-box;
+  height: 48px;
+  padding-top: 8px;
+  padding-bottom: 8px;
+  padding-left: 12px;
+  line-height: 1.5715;
+  vertical-align: top;
+}
+.vtx-search .vtx-search-item__v {
+  -webkit-box-orient: vertical;
+  -webkit-box-direction: normal;
+      -ms-flex-direction: column;
+          flex-direction: column;
+  padding: 8px 0;
+}
+.vtx-search-label_v {
+  overflow: hidden;
+  line-height: 21px;
+  white-space: nowrap;
+  text-overflow: ellipsis;
+  vertical-align: top;
+}
+.vtx-search-lists_v {
+  position: relative;
+  -webkit-box-sizing: border-box;
+          box-sizing: border-box;
+  height: 42px;
+  padding-top: 8px;
+  padding-bottom: 8px;
+  line-height: 32px;
+  vertical-align: top;
+}
+.vtx-search-list {
+  width: 100%;
+}
+.vtx-search-element {
+  display: inline-block;
+  /* stylelint-disable */
+  width: calc(100% - 200px - 24px);
+  margin-right: 24px;
+}
+.vtx-search-buttons {
+  display: inline-block;
+  -webkit-box-sizing: border-box;
+          box-sizing: border-box;
+  width: 200px;
+  height: 100%;
+  vertical-align: top;
+}
+.vtx-search .vtx-search-more {
+  height: 32px;
+  color: #1890ff;
+  line-height: 32px;
+  cursor: pointer;
+}
+.vtx-row {
+  overflow: hidden;
+}

package/lib/live-player/demo/src/components/lib/vtx-search/style/index.less

@@ -0,0 +1,83 @@
+@import (reference) '~antd/lib/style/themes/index.less';
+
+@prefix-cls: vtx-search;
+@toggleSpeed: 0.3s; // 展开速度
+@buttons-width: 200px;
+
+.@{prefix-cls} {
+    position: relative;
+    z-index: 9;
+    padding-top: 8px;
+    padding-right: 24px;
+    padding-bottom: 8px;
+    padding-left: 24px;
+    overflow: hidden;
+    background: @component-background;
+    transition-duration: @toggleSpeed;
+    transition-property: height;
+    &-label_h {
+        display: inline-block;
+        overflow: hidden;
+        line-height: 48px;
+        white-space: nowrap;
+        text-overflow: ellipsis;
+        vertical-align: top;
+    }
+    &-lists_h {
+        position: relative;
+        display: inline-block;
+        box-sizing: border-box;
+        height: 48px;
+        padding-top: 8px;
+        padding-bottom: 8px;
+        padding-left: 12px;
+        line-height: @line-height-base;
+        vertical-align: top;
+    }
+    .vtx-search-item__v {
+        flex-direction: column;
+        padding: 8px 0;
+    }
+    &-label_v {
+        overflow: hidden;
+        line-height: 21px;
+        white-space: nowrap;
+        text-overflow: ellipsis;
+        vertical-align: top;
+    }
+    &-lists_v {
+        position: relative;
+        box-sizing: border-box;
+        height: 42px;
+        padding-top: 8px;
+        padding-bottom: 8px;
+        line-height: 32px;
+        vertical-align: top;
+    }
+    &-list {
+        width: 100%;
+    }
+    &-element {
+        display: inline-block;
+        /* stylelint-disable */
+        width: calc(100% - @buttons-width - 24px);
+        margin-right: 24px;
+    }
+    &-buttons {
+        display: inline-block;
+        box-sizing: border-box;
+        width: @buttons-width;
+        height: 100%;
+        vertical-align: top;
+    }
+    .vtx-search-more {
+        height: 32px;
+        color: @primary-color;
+        line-height: 32px;
+        cursor: pointer;
+    }
+}
+
+.vtx-row {
+    overflow: hidden;
+}

package/lib/live-player/demo/src/components/lib/vtx-select/style/index.css

@@ -0,0 +1,68 @@
+.vtx-select {
+  position: relative;
+  display: inline-block;
+  width: 100%;
+}
+.vtx-select .vtx-select-count {
+  position: absolute;
+  top: 0;
+  vertical-align: top;
+}
+.vtx-select .vtx-all-list {
+  position: absolute;
+  z-index: 999;
+  -webkit-box-sizing: border-box;
+          box-sizing: border-box;
+  width: 100%;
+  padding: 5px;
+  background-color: #fff;
+  border-radius: 2px;
+  -webkit-box-shadow: 0 2px 8px #d9d9d9;
+          box-shadow: 0 2px 8px #d9d9d9;
+}
+.vtx-select .ant-select-selection--multiple {
+  max-height: 32px;
+  overflow: hidden;
+}
+.vtx-multi-select {
+  position: relative;
+  display: inline-block;
+  width: 100%;
+}
+.vtx-multi-select .vtx-select-count {
+  position: absolute;
+  top: 0;
+  right: 0;
+  vertical-align: top;
+  border-left: none;
+  border-top-left-radius: 0;
+  border-bottom-left-radius: 0;
+}
+.vtx-multi-select .vtx-all-list {
+  position: absolute;
+  z-index: 999;
+  -webkit-box-sizing: border-box;
+          box-sizing: border-box;
+  width: 100%;
+  padding: 5px;
+  background-color: #fff;
+  border-radius: 2px;
+  -webkit-box-shadow: 0 2px 8px #d9d9d9;
+          box-shadow: 0 2px 8px #d9d9d9;
+}
+.vtx-multi-select .ant-select-selection {
+  border-top-right-radius: 0;
+  border-bottom-right-radius: 0;
+}
+.vtx-multi-select .ant-select-selection--multiple {
+  max-height: 32px;
+  overflow: hidden;
+}
+.vtx-multi-select .ant-btn:hover,
+.vtx-multi-select .ant-btn:focus {
+  border-color: #d9d9d9;
+}
+.vtx-multi-select-all {
+  padding: 4px 8px;
+  text-align: right;
+}

package/lib/live-player/demo/src/components/lib/vtx-select/style/index.less

@@ -0,0 +1,68 @@
+@import (reference) '~antd/lib/style/themes/index.less';
+
+.vtx-select {
+    position: relative;
+    display: inline-block;
+    width: 100%;
+    .vtx-select-count {
+        position: absolute;
+        top: 0;
+        vertical-align: top;
+    }
+    .vtx-all-list {
+        position: absolute;
+        z-index: 999;
+        box-sizing: border-box;
+        width: 100%;
+        padding: 5px;
+        background-color: @component-background;
+        border-radius: @border-radius-base;
+        box-shadow: 0 2px 8px #d9d9d9;
+    }
+    .ant-select-selection--multiple {
+        max-height: 32px;
+        overflow: hidden;
+    }
+}
+
+.vtx-multi-select {
+    position: relative;
+    display: inline-block;
+    width: 100%;
+    .vtx-select-count {
+        position: absolute;
+        top: 0;
+        right: 0;
+        vertical-align: top;
+        border-left: none;
+        border-top-left-radius: 0;
+        border-bottom-left-radius: 0;
+    }
+    .vtx-all-list {
+        position: absolute;
+        z-index: 999;
+        box-sizing: border-box;
+        width: 100%;
+        padding: 5px;
+        background-color: @component-background;
+        border-radius: @border-radius-base;
+        box-shadow: 0 2px 8px #d9d9d9;
+    }
+    .ant-select-selection {
+        border-top-right-radius: 0;
+        border-bottom-right-radius: 0;
+    }
+    .ant-select-selection--multiple {
+        max-height: 32px;
+        overflow: hidden;
+    }
+    .ant-btn:hover,
+    .ant-btn:focus {
+        border-color: #d9d9d9;
+    }
+}
+
+.vtx-multi-select-all {
+    padding: 4px 8px;
+    text-align: right;
+}

package/lib/live-player/demo/src/components/lib/vtx-signature/style/index.css

@@ -0,0 +1,35 @@
+.vtx-signature {
+  position: relative;
+  display: -webkit-box;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-box-orient: vertical;
+  -webkit-box-direction: normal;
+      -ms-flex-direction: column;
+          flex-direction: column;
+  height: 300px;
+  padding: 16px;
+  background-color: #fff;
+  border: 1px solid #f0f0f0;
+  border-radius: 2px;
+}
+.vtx-signature--body {
+  position: relative;
+  height: 100%;
+  border: 1px dotted #c1c1c1;
+}
+.vtx-signature--body canvas {
+  position: absolute;
+  top: 0;
+  left: 0;
+  width: 100%;
+  height: 100%;
+  border-radius: 2px;
+}
+.vtx-signature--footer {
+  margin-top: 8px;
+  line-height: 1;
+}
+.vtx-signature--footer button + button {
+  margin-left: 8px;
+}