@vtx/player 0.0.14 → 0.0.17

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

@@ -0,0 +1,95 @@
+@import (reference) '~antd/lib/style/themes/index.less';
+
+.vtx-modal-maxClass {
+    .ant-modal {
+        top: 0 !important;
+        left: 0 !important;
+        width: 100% !important;
+        height: 100% !important;
+        padding-bottom: 0 !important;
+        overflow: hidden;
+    }
+    .ant-modal-body {
+        height: e('calc(100% - 108px)') !important;
+    }
+}
+.vtx-modal {
+    .ant-modal {
+        top: 10%;
+        padding-bottom: 0;
+        .ant-modal-content {
+            height: 100%;
+            .ant-modal-body {
+                max-height: e('calc(100% - 108px)');
+                padding: 20px 24px;
+                overflow: auto;
+            }
+        }
+    }
+    .vtx-modal-title {
+        position: relative;
+        width: 100%;
+        .vtx-modal-title_name {
+            width: 100%;
+            color: @primary-color;
+        }
+        .vtx-modal-close,
+        .vtx-modal-maximizeIcon {
+            position: absolute;
+            top: -13px;
+            right: -16px;
+            p {
+                position: absolute;
+                top: 0;
+                right: 0;
+                z-index: 10;
+                display: inline-block;
+                width: 36px;
+                height: 48px;
+                color: @text-color-secondary;
+                font-weight: 700;
+                line-height: 48px;
+                text-align: center;
+                text-decoration: none;
+                background: transparent;
+                border: 0;
+                outline: 0;
+                cursor: pointer;
+                -webkit-transition: color 0.3s ease;
+                transition: color 0.3s ease;
+                &:hover {
+                    color: @icon-color-hover;
+                    text-decoration: none;
+                }
+            }
+        }
+        .vtx-modal-maximizeIcon {
+            right: 20px;
+        }
+    }
+}
+
+.vtx-modal-header-title {
+    .vtx-modal-header-text {
+        font-weight: 400;
+    }
+    .vtx-modal-header-text when(@theme=dark) {
+        color: @text-color;
+    }
+    .vtx-modal-header-text when(@theme=default) {
+        color: fade(@black, 65%);
+    }
+    .vtx-modal-header-text + .vtx-modal-header-subtitle {
+        &::before {
+            margin: 0 4px;
+            font-weight: 400;
+            content: '>';
+        }
+        &::before when(@theme=dark) {
+            color: @text-color;
+        }
+        &::before when(@theme=default) {
+            color: fade(@black, 65%);
+        }
+    }
+}

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

@@ -0,0 +1,115 @@
+.overflow-y {
+  overflow: hidden;
+  overflow-y: auto;
+}
+.vtx-page {
+  position: relative;
+  width: 100%;
+  height: 100%;
+  overflow-x: hidden;
+  font-size: 14px;
+}
+.vtx-page .ant-table-footer {
+  padding: 0 !important;
+}
+.vtx-page .vtx-ui-date-normal {
+  width: 100%;
+}
+.vtx-page .vtx-ui-grid-normal {
+  z-index: 999;
+}
+.vtx-page .ant-tabs {
+  height: 100%;
+}
+.vtx-page .ant-tabs-content {
+  height: calc(100% - 56px);
+}
+.vtx-page .ant-tabs-tabpane {
+  height: 100%;
+}
+.vtx-page .td {
+  position: relative;
+}
+.vtx-button-wrap button + button {
+  margin-left: 8px;
+}
+.vtx-content-absolute {
+  position: absolute;
+  top: 0;
+  right: 0;
+  bottom: 0;
+  left: 0;
+}
+.vtx-content-relative {
+  position: relative;
+  width: 100%;
+  height: 100%;
+}
+.vtx-content-scroll-y {
+  overflow: hidden;
+  overflow-y: auto;
+}
+.vtx-table-wrapper-absolute {
+  position: absolute;
+  top: 0;
+  right: 0;
+  bottom: 0;
+  left: 0;
+  padding: 0 5px;
+}
+.vtx-table-wrapper-relative {
+  position: relative;
+  width: 100%;
+  height: 100%;
+  max-height: 500px;
+  padding: 0 5px;
+}
+.vtx-page--table {
+  position: relative;
+  width: 100%;
+  height: 100%;
+  padding: 16px 20px 16px 20px;
+  overflow-x: hidden;
+  font-size: 14px;
+  background-color: #f0f2f5;
+}
+.vtx-table-search {
+  margin-bottom: 16px;
+  background: #fff;
+  border-radius: 2px;
+}
+.vtx-table-content {
+  position: absolute;
+  top: 0;
+  right: 0;
+  bottom: 0;
+  left: 0;
+  right: 20px;
+  bottom: 16px;
+  left: 20px;
+  -webkit-transition-duration: 0.3s;
+          transition-duration: 0.3s;
+  -webkit-transition-property: top;
+  transition-property: top;
+}
+.vtx-table-wrap {
+  position: absolute;
+  top: 0;
+  right: 0;
+  bottom: 0;
+  left: 0;
+  padding: 0 24px;
+  background-color: #fff;
+}
+.vtx-table-card {
+  background: #fff;
+  border-radius: 2px;
+}
+.vtx-table-left,
+.vtx-table-right {
+  height: 100%;
+  overflow: hidden;
+}
+.vtx-table-left .vtx-ztree-search {
+  right: 0;
+}

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;
+}