@oceanbase/ui 1.0.0-alpha.3 → 1.0.0-alpha.5

package/es/Login/index.less

@@ -1,268 +0,0 @@
-@import '../variable.less';
-
-@prefix: ob-login;
-
-.@{prefix}-container {
-  display: flex;
-  justify-content: space-between;
-  min-width: 960px;
-  height: 100vh;
-  min-height: 600px;
-  overflow: auto;
-
-  .@{prefix}-bg {
-    width: 40%;
-    height: 100%;
-    background-repeat: no-repeat;
-    background-size: cover;
-    background-position: center;
-
-    .@{prefix}-info {
-      margin: 185px 48px 0 48px;
-      color: #fff;
-      font-weight: 600;
-      font-size: 56px;
-      font-family: PingFangSC;
-
-      .@{prefix}-start {
-        margin-top: 22px;
-        color: #f4f4f4;
-        font-weight: 500;
-        font-size: 32px;
-        letter-spacing: 0;
-      }
-    }
-  }
-  .@{prefix}-card {
-    display: flex;
-    flex: 1;
-    align-items: center;
-    justify-content: center;
-    height: 100%;
-    min-height: 600px;
-    background-color: #fff;
-
-    .@{prefix}-locale {
-      position: absolute;
-      top: 24px;
-      right: 24px;
-      color: @colorTextTertiary;
-      font-family: PingFangSC-Regular;
-      cursor: pointer;
-    }
-
-    .@{prefix}-board {
-      position: absolute;
-      top: 48px;
-    }
-
-    .@{prefix}-content {
-      margin-top: -60px;
-      width: 404px;
-      .@{prefix}-logo {
-        display: block;
-        height: 68px;
-        margin: 0 auto;
-        margin-bottom: 40px;
-      }
-
-      .@{prefix}-activate-logo,
-      .@{prefix}-reigster-logo {
-        display: block;
-        height: 68px;
-        margin: 0 auto;
-      }
-
-      .@{prefix}-register,
-      .@{prefix}-activate {
-        .@{prefixCls}-form-item-with-help {
-          margin-bottom: 24px;
-        }
-      }
-
-      .@{prefix}-form {
-        width: 100%;
-
-        input::placeholder {
-          font-size: 14px;
-        }
-
-        .@{prefixCls}-form-item {
-          margin-bottom: 24px;
-          padding-bottom: 0;
-        }
-
-        .@{prefixCls}-input-affix-wrapper {
-          height: 40px;
-          border-radius: 8px;
-
-          .@{prefixCls}-input-prefix {
-            .@{iconPrefixCls} {
-              font-size: 20px;
-            }
-          }
-
-          // 覆盖 input:-internal-autofill-selected 自带背景色样式问题
-          .@{prefixCls}-input:not(.@{prefixCls}-input-disabled) {
-            box-shadow: inset 0 0 0 1000px white !important;
-          }
-
-          .@{prefixCls}-input:-internal-autofill-selected {
-            box-shadow: inset 0 0 0 1000px white !important;
-          }
-          .@{prefixCls}-input:focus:-internal-autofill-selected {
-            box-shadow: inset 0 0 0 1000px white !important;
-          }
-        }
-
-        .@{prefixCls}-input-affix-wrapper .@{prefixCls}-input:not(:first-child) {
-          padding-left: 8px;
-        }
-
-        .@{prefixCls}-input-affix-wrapper-focused {
-          border-color: @colorPrimary;
-        }
-
-        .@{prefix}-form-focus-input {
-          .@{prefixCls}-input-prefix {
-            .@{iconPrefixCls} {
-              color: @colorPrimary;
-            }
-          }
-        }
-      }
-
-      .@{prefix}-auth-code {
-        display: flex;
-        align-items: start;
-        width: 100%;
-        margin-bottom: 24px;
-        padding-bottom: 0;
-        & > .@{prefixCls}-space-item:first-child {
-          flex: 1;
-        }
-        .@{prefixCls}-form-item {
-          margin-bottom: 0;
-        }
-        .@{prefix}-code-btn {
-          position: relative;
-          height: 38px;
-          border: 1px solid @colorBorder;
-          border-radius: 8px;
-          cursor: pointer;
-          img {
-            height: 38px;
-            border-radius: 8px;
-          }
-          .@{prefix}-code-mask {
-            position: absolute;
-            display: flex;
-            align-items: center;
-            justify-content: center;
-            height: 38px;
-            color: #fff;
-            background: rgba(0, 0, 0, 0.5);
-            border-radius: 8px;
-            cursor: pointer;
-            opacity: 0;
-            transition: opacity 0.3s;
-            inset: 0;
-          }
-          &.@{prefix}-error,
-          &:hover {
-            .@{prefix}-code-mask {
-              opacity: 1;
-            }
-          }
-        }
-      }
-      .@{prefix}-submit-btn {
-        height: 40px;
-        border-radius: 8px;
-      }
-
-      .@{prefix}-switch-btn {
-        margin-top: 24px;
-        text-align: center;
-        cursor: pointer;
-      }
-
-      .@{prefix}-watermark-wrapper {
-        position: absolute;
-        bottom: 40px;
-        width: 404px;
-        text-align: center;
-
-        .@{prefix}-watermark {
-          height: 16px;
-        }
-      }
-
-      .@{prefix}-alert {
-        margin-bottom: 24px;
-        border-radius: 8px;
-      }
-    }
-  }
-}
-
-// 设置的登录页最小高度，防止 logo 偏移位置偏移遮住输入框
-@media (max-height: 650px) {
-  .@{prefix}-container {
-    .@{prefix}-watermark-wrapper {
-      position: absolute;
-      top: 600px;
-    }
-  }
-}
-
-.@{prefix}-container-with-board {
-  .@{prefix}-card {
-    .@{prefix}-content {
-      margin-top: 0;
-    }
-  }
-}
-
-.@{prefix}-container-mobile {
-  flex-direction: column;
-  min-width: auto;
-  .@{prefix}-banner {
-    // 移动端设置百分比高度，避免使用 vh，否则安卓端打开软键盘会重新计算高度，导致 banner 图片高度出现跳变
-    height: 25%;
-  }
-  .@{prefix}-bg {
-    width: 100%;
-  }
-  .@{prefix}-card {
-    align-items: start;
-    width: 100%;
-    height: 75%;
-    margin-top: -48px;
-    padding: 0 32px;
-    border-radius: 16px 16px 0 0;
-    position: relative;
-    .@{prefix}-board {
-      top: 8px;
-      left: 24px;
-    }
-    .@{prefix}-locale {
-      top: 8px;
-    }
-    .@{prefix}-content {
-      width: 100%;
-      margin-top: 40px;
-      .@{prefix}-logo {
-        height: 48px;
-        margin-bottom: 24px;
-      }
-      .@{prefix}-watermark-wrapper {
-        // 移动端改为正常文档流，避免安卓端被软键盘顶起
-        width: calc(100% - 64px);
-        position: static;
-        width: 100%;
-        margin-top: 96px;
-      }
-    }
-  }
-}

package/es/NavMenu/index.less

@@ -1,50 +0,0 @@
-@import '../variable.less';
-
-@prefix: ob-menu;
-
-.@{prefix}-container {
-  margin-top: 21px;
-  background-color: transparent;
-  user-select: none;
-
-  ul {
-    background-color: transparent;
-
-    li {
-      padding-right: 0 !important;
-
-      .@{prefixCls}-menu-title-content {
-        padding: 0 20px;
-        border-radius: 10px;
-        transition: 0.6s;
-
-        &:hover {
-          background-color: #e4e8f5;
-        }
-      }
-    }
-
-    .@{prefixCls}-menu-item:not(.@{prefixCls}-menu-item-selected):hover {
-      background-color: transparent !important;
-    }
-
-    .@{prefixCls}-menu-item-selected {
-      background-color: transparent !important;
-
-      .@{prefixCls}-menu-title-content {
-        background-color: #d7e2fc;
-
-        a {
-          color: transparent;
-          font-family: SourceSansPro-Semibold, SourceSansPro-Regular;
-          background: linear-gradient(-45deg, #002bff 0%, #0080ff 100%);
-          background-clip: text;
-        }
-      }
-
-      &::after {
-        display: none;
-      }
-    }
-  }
-}

package/es/Ranger/index.less

@@ -1,57 +0,0 @@
-@import '../variable.less';
-
-@prefix: ob-ranger;
-
-.@{prefix} {
-  .@{prefixCls}-space-item:nth-child(2) {
-    flex: 1;
-    width: 100%;
-
-    .@{prefixCls}-picker,
-    .@{prefixCls}-picker-range,
-    .ob-ranger-range-picker {
-      width: 100%;
-      // 去掉左侧圆角，以与下拉选择紧密组合在一起
-      border-top-left-radius: 0;
-      border-bottom-left-radius: 0;
-
-      input {
-        text-align: center;
-      }
-    }
-  }
-
-  .ob-ranger-date-picker {
-    .@{prefixCls}-select-selector {
-      border-top-left-radius: 0;
-      border-bottom-left-radius: 0;
-
-      &:hover {
-        z-index: 1;
-      }
-    }
-
-    .@{prefixCls}-select-arrow {
-      z-index: 1;
-    }
-  }
-}
-
-.@{prefix}-show-range {
-  .ob-ranger-quick-picker.ob-ranger-quick-picker-select {
-    margin-right: -1px;
-
-    .@{prefixCls}-select-selector {
-      border-top-right-radius: 0 !important;
-      border-bottom-right-radius: 0 !important;
-
-      &:hover {
-        z-index: 1;
-      }
-    }
-
-    .@{prefixCls}-select-arrow {
-      z-index: 1;
-    }
-  }
-}

package/es/SideTip/index.less

@@ -1,180 +0,0 @@
-@import '../variable.less';
-
-@prefix: ob-sidetip;
-
-.@{prefix}-container {
-  position: fixed;
-  z-index: 0;
-  font-size: 14px;
-  cursor: pointer;
-  inset-inline-end: 24px;
-  inset-block-end: 24px;
-
-  &.@{prefix}-container-dragged {
-    cursor: grab;
-  }
-
-  &.@{prefix}-container-hide {
-    transition: all 0.3s;
-  }
-
-  @media screen and (max-width: 768px) {
-    display: none;
-  }
-
-  &.@{prefix}-container-hide-not-dragged:hover {
-    inset-inline-end: 0 !important;
-  }
-
-  .@{prefix}-hide {
-    position: absolute;
-    z-index: 0;
-    display: flex;
-    align-items: center;
-    justify-content: center;
-    width: 20px;
-    height: 20px;
-    background: rgba(0, 0, 0, 0.15);
-    border-radius: 20px;
-    transform: scale(0);
-    cursor: pointer;
-    opacity: 0;
-    transition: all 0.18s ease-out 0.18s;
-    inset-block-start: 0;
-    inset-inline-end: -22px;
-
-    &:hover {
-      background: rgba(0, 0, 0, 0.35);
-    }
-
-    .@{prefix}-hide-icon {
-      width: 6px;
-      height: 2px;
-      background: #fff;
-      border-radius: 4px;
-    }
-
-    &.@{prefix}-hide-hovered {
-      transform: scale(1);
-      opacity: 1;
-    }
-  }
-
-  .@{prefix}-button {
-    position: relative;
-    display: flex;
-    align-items: center;
-    justify-content: center;
-    width: 56px;
-    height: 56px;
-    background-color: #fff;
-    border-radius: 50%;
-    box-shadow: @boxShadowSecondary;
-    cursor: pointer;
-    transition:
-      background-color 0.2s ease 0.1s,
-      opacity 0.2s ease 0s,
-      transform 0.2s ease 0.1s;
-    user-select: none;
-
-    &.@{prefix}-button-primary {
-      background-color: #006aff;
-    }
-
-    &.@{prefix}-button-small {
-      width: 40px;
-      height: 40px;
-    }
-
-    &.@{prefix}-button-disabled {
-      background-color: @colorTextQuaternary;
-    }
-
-    &:hover {
-      opacity: 1;
-    }
-
-    .@{prefix}-button-loading {
-      position: absolute;
-      width: 56px;
-      height: 56px;
-      color: #006aff;
-      font-size: 56px;
-      inset-block-start: 0;
-      inset-inline-end: 0;
-
-      &.@{prefix}-button-loading-primary {
-        color: #fff;
-      }
-
-      &.@{prefix}-button-loading-small {
-        width: 40px;
-        height: 40px;
-        font-size: 40px;
-      }
-    }
-
-    .@{prefix}-button-close {
-      position: absolute;
-      width: 24px;
-      height: 24px;
-      color: @colorTextSecondary;
-      font-size: 24px;
-      transform: translateY(-50%) scale(0.4) rotate(-45deg);
-      opacity: 0;
-      transition: all 0.3s linear;
-      user-select: none;
-      inset-block-start: 50%;
-
-      &.@{prefix}-button-close-primary {
-        color: #fff;
-      }
-
-      &.@{prefix}-button-close-show {
-        transform: translateY(-50%);
-        opacity: 1;
-      }
-
-      &.@{prefix}-button-close-small {
-        width: 16px;
-        height: 16px;
-        font-size: 16px;
-        line-height: 16px;
-      }
-    }
-
-    .@{prefix}-button-icon {
-      position: absolute;
-      width: 24px;
-      height: 24px;
-      color: @colorTextSecondary;
-      font-size: 24px;
-      line-height: 24px;
-      transform: translateY(-50%);
-      opacity: 1;
-      transition: all 0.3s linear;
-      user-select: none;
-      inset-block-start: 50%;
-
-      &.@{prefix}-button-icon-open {
-        transform: translateY(-50%) scale(0.4) rotate(45deg);
-        opacity: 0;
-      }
-
-      &.@{prefix}-button-icon-disabled {
-        color: @colorTextQuaternary;
-      }
-
-      &.@{prefix}-button-icon-primary {
-        color: #fff;
-      }
-
-      &.@{prefix}-button-icon-small {
-        width: 16px;
-        height: 16px;
-        font-size: 16px;
-        line-height: 16px;
-      }
-    }
-  }
-}

package/es/TaskGraph/graph.less

@@ -1,23 +0,0 @@
-@import '../variable.less';
-
-@prefix: ob-task-graph-item;
-
-.@{prefix}-menu {
-  // 设置 fixed，避免下拉菜单占据空间导致底部出现白色方块
-  position: fixed;
-
-  .@{prefix}-task-id-wrapper {
-    padding: 5px 12px;
-
-    .@{prefixCls}-typography {
-      display: flex;
-      align-items: center;
-      justify-content: space-between;
-      color: @colorTextTertiary;
-
-      .@{prefixCls}-typography-copy {
-        color: @colorTextTertiary;
-      }
-    }
-  }
-}

package/es/TaskGraph/index.less

@@ -1,117 +0,0 @@
-@import '../variable.less';
-
-@prefix: ob-task-graph;
-
-.container {
-  position: relative;
-  padding-bottom: 0 !important;
-
-  .@{prefixCls}-page-header {
-    padding-top: 12px;
-    padding-bottom: 12px;
-  }
-
-  .tech-page-container-header-inner {
-    background-color: #fafbff;
-
-    .@{prefixCls}-page-header-heading .@{prefixCls}-page-header-heading-title {
-      font-size: 16px;
-    }
-  }
-
-  .@{prefix}-split-pane {
-    top: auto !important;
-    height: calc(100% - 36px) !important;
-    min-height: calc(100% - 36px) !important;
-    margin: -24px;
-
-    .@{prefix}-tabs-wrapper {
-      width: 100%;
-    }
-
-    .@{prefixCls}-tabs {
-      height: 100%;
-
-      .@{prefixCls}-tabs-nav-container {
-        height: 32px;
-        padding-top: 4px;
-      }
-
-      .@{prefixCls}-tabs-bar {
-        margin-bottom: 0;
-        background-color: #fff;
-        border-bottom: none;
-      }
-
-      .@{prefixCls}-tabs-tab {
-        min-width: 120px;
-        height: 28px;
-        margin: 0;
-        padding: 0;
-        font-size: 12px;
-        line-height: 28px;
-        background-color: #fff;
-        border: none;
-        border-bottom: 1px solid #e8e8e8;
-        border-radius: 0;
-        transition: none;
-
-        &:hover {
-          color: @colorTextSecondary;
-        }
-
-        div {
-          display: flex;
-          align-items: center;
-          justify-content: space-between;
-          height: 20px;
-          margin-top: 4px;
-          padding: 0 8px;
-          border-left: 1px solid #e8e8e8;
-        }
-      }
-
-      .@{prefixCls}-tabs-tab:last-child {
-        div {
-          border-left: none;
-        }
-      }
-
-      .@{prefixCls}-tabs-tab-active {
-        color: @colorText;
-        font-weight: normal;
-        background-color: #f7f8fc;
-        border-bottom: none;
-        border-left: none;
-        border-radius: 2px;
-
-        div {
-          border-left: none;
-        }
-
-        & + .@{prefixCls}-tabs-tab {
-          div {
-            border-left: none;
-          }
-        }
-      }
-
-      .@{prefixCls}-tabs-extra-content {
-        margin-right: 16px;
-        line-height: 32px;
-      }
-
-      .@{prefixCls}-tabs-content {
-        // TODO: 需要减去 64px，否则部分结尾的日志看不到，原因待排查
-        height: calc(100% - 64px);
-        padding: 16px;
-        overflow: scroll;
-        color: @colorTextSecondary;
-        line-height: 22px;
-        white-space: pre-wrap;
-        word-break: break-all;
-        background-color: #f7f8fc;
-      }
-    }
-  }
-}