@oceanbase/ui 1.0.0-alpha.4 → 1.0.0-alpha.6

package/lib/Highlight/index.less

@@ -1,381 +0,0 @@
-@import '../variable.less';
-
-@prefix: ob-highlight;
-
-.@{prefix} {
-  box-sizing: border-box;
-  margin: 0;
-  padding: 0;
-  color: rgba(0, 0, 0, 0.88);
-  font-size: 14px;
-  line-height: 1.5714285714285714;
-  list-style: none;
-  border-radius: @borderRadius;
-
-  &:not(:hover) .@{prefix}-copy {
-    visibility: hidden;
-    opacity: 0;
-  }
-
-  @keyframes copy-button-trans {
-    0% {
-      opacity: 0.8;
-      margin-block-start: 0;
-    }
-    10% {
-      opacity: 0.8;
-      margin-block-start: -16px;
-    }
-    90% {
-      opacity: 0.8;
-      margin-block-start: -16px;
-    }
-    100% {
-      opacity: 0.8;
-      margin-block-start: 0;
-    }
-  }
-
-  .@{prefix}-json-view {
-    padding: 0;
-
-    .react-json-view {
-      padding: 0.5em;
-      overflow: auto;
-
-      .icon-container svg {
-        transform: translateY(5px);
-      }
-    }
-  }
-
-  &.@{prefix}-light {
-    .react-json-view {
-      background: @colorBgLayout;
-    }
-
-    .@{prefix}-light-index {
-      border-inline-end: 1px solid rgba(0, 0, 0, 0.05);
-    }
-
-    display: block;
-    padding: 0.5em;
-    overflow-x: auto;
-    color: #383a42;
-    background: @colorBgLayout;
-
-    .hljs-comment,
-    .hljs-quote {
-      color: #a0a1a7;
-      font-style: italic;
-    }
-
-    .hljs-doctag,
-    .hljs-keyword,
-    .hljs-formula {
-      color: #a626a4;
-    }
-
-    .hljs-section,
-    .hljs-name,
-    .hljs-selector-tag,
-    .hljs-deletion,
-    .hljs-subst {
-      color: #e45649;
-    }
-
-    .hljs-literal {
-      color: #0184bb;
-    }
-
-    .hljs-string,
-    .hljs-regexp,
-    .hljs-addition,
-    .hljs-attribute,
-    .hljs-meta-string {
-      color: #50a14f;
-    }
-
-    .hljs-built_in,
-    .hljs-class,
-    .hljs-title {
-      color: #c18401;
-    }
-
-    .hljs-attr,
-    .hljs-variable,
-    .hljs-template-variable,
-    .hljs-type,
-    .hljs-selector-class,
-    .hljs-selector-attr,
-    .hljs-selector-pseudo,
-    .hljs-number {
-      color: #986801;
-    }
-
-    .hljs-symbol,
-    .hljs-bullet,
-    .hljs-link,
-    .hljs-meta,
-    .hljs-selector-id,
-    .hljs-title {
-      color: #4078f2;
-    }
-
-    .hljs-emphasis {
-      font-style: italic;
-    }
-
-    .hljs-strong {
-      font-weight: @fontWeightStrong;
-    }
-
-    .hljs-link {
-      text-decoration: underline;
-    }
-  }
-
-  .@{prefix}-index {
-    box-sizing: border-box;
-    width: 40px;
-    min-width: 40px;
-    color: #aaa;
-    text-align: end;
-    background: rgba(255, 255, 255, 0.03);
-    user-select: none;
-    padding-block: 2px;
-    padding-inline: 8px;
-  }
-  .@{prefix}-content {
-    padding-block: 2px;
-    padding-inline: 8px;
-  }
-  .@{prefix}-copy {
-    position: absolute;
-    display: flex;
-    flex-direction: column;
-    width: 16px;
-    height: 16px;
-    padding: 0;
-    overflow: hidden;
-    border: 0;
-    outline: none;
-    cursor: pointer;
-    opacity: 0.6;
-    transition: opacity 0.2s;
-    inset-block-start: 16px;
-    inset-inline-end: 16px;
-
-    &:hover {
-      opacity: 0.8;
-    }
-  }
-  &:not(:hover) &.@{prefix}-copy {
-    visibility: hidden;
-    opacity: 0;
-  }
-
-  .@{prefix}-copy-icon {
-    width: 16px;
-    height: 16px;
-    font-size: 16px;
-
-    &.scoll {
-      animation: copy-button-trans 2s;
-      animation-play-state: running;
-    }
-  }
-
-  .@{prefix}-dark {
-    display: block;
-    padding: 0.5em;
-    overflow-x: auto;
-    color: #c0c5ce;
-    background: #2b303b;
-    border-radius: @borderRadius;
-
-    &.@{prefix}-index {
-      border-inline-end: 1px solid rgba(255, 255, 255, 0.05);
-    }
-
-    /* Ocean Comment */
-    .hljs-comment,
-    .hljs-quote {
-      color: #65737e;
-    }
-
-    /* Ocean Red */
-    .hljs-variable,
-    .hljs-template-variable,
-    .hljs-tag,
-    .hljs-name,
-    .hljs-selector-id,
-    .hljs-selector-class,
-    .hljs-regexp,
-    .hljs-deletion {
-      color: #bf616a;
-    }
-
-    /* Ocean Orange */
-    .hljs-number,
-    .hljs-built_in,
-    .hljs-builtin-name,
-    .hljs-literal,
-    .hljs-type,
-    .hljs-params,
-    .hljs-meta,
-    .hljs-link {
-      color: #d08770;
-    }
-
-    /* Ocean Yellow */
-    .hljs-attribute {
-      color: #ebcb8b;
-    }
-
-    /* Ocean Green */
-    .hljs-string,
-    .hljs-symbol,
-    .hljs-bullet,
-    .hljs-addition {
-      color: #a3be8c;
-    }
-
-    /* Ocean Blue */
-    .hljs-title,
-    .hljs-section {
-      color: #8fa1b3;
-    }
-
-    /* Ocean Purple */
-    .hljs-keyword,
-    .hljs-selector-tag {
-      color: #b48ead;
-    }
-
-    .hljs-emphasis {
-      font-style: italic;
-    }
-
-    .hljs-strong {
-      font-weight: @fontWeightStrong;
-    }
-  }
-
-  &.@{prefix}-diff {
-    overflow-y: auto;
-
-    // &.@{prefix} {
-    //   padding: 0;
-    // }
-
-    table {
-      width: 100%;
-      font-family: 'SFMono-Regular, Consolas, Liberation Mono, Menlo, Courier, monospace';
-      border-collapse: collapse;
-      border-spacing: 0;
-
-      td {
-        vertical-align: top;
-      }
-    }
-
-    .@{prefix}-diff-index,
-    .@{prefix}-diff-mark,
-    .@{prefix}-diff-code {
-      padding-block: 2px;
-      padding-inline: 8px;
-    }
-
-    .@{prefix}-diff-index,
-    .@{prefix}-diff-mark {
-      user-select: none;
-    }
-
-    .@{prefix}-diff-index {
-      width: 40px;
-      min-width: 40px;
-      text-align: end;
-      font-variant-numeric: tabular-nums;
-    }
-
-    .@{prefix}-diff-mark {
-      width: 10px;
-      min-width: 10px;
-      text-align: center;
-    }
-
-    .@{prefix}-diff-code {
-      white-space: pre-wrap;
-      word-break: break-word;
-    }
-
-    // ======================= Theme =======================
-    // Light
-    &.@{prefix}-light {
-      .@{prefix}-diff-index,
-      .@{prefix}-diff-mark {
-        color: #aaa;
-      }
-
-      .@{prefix}-diff-index {
-        background: rgba(0, 0, 0, 0.01);
-        border-inline-end: 1px solid rgba(0, 0, 0, 0.05);
-        border-inline-start: 1px solid rgba(0, 0, 0, 0.1);
-
-        &:first-child {
-          border-inline-start: none;
-        }
-      }
-
-      // &.@{prefix}-diff-cell {
-      .@{prefix}-diff-cell-add {
-        background: #e7f1e2;
-        // .mix(##fafafa; 90)
-        // .toHexString();
-      }
-      .@{prefix}-diff-cell-remove {
-        background: #f6e3e4;
-        // .mix(##fafafa; 90)
-        // .toHexString();
-      }
-      .@{prefix}-diff-cell-empty {
-        background: rgba(0, 0, 0, 0.03);
-      }
-      // }
-    }
-
-    // Dark
-    &.@{prefix}-dark {
-      .@{prefix}-diff-index,
-      .@{prefix}-diff-mark {
-        color: #aaa;
-      }
-
-      .@{prefix}-diff-index {
-        background: rgba(255, 255, 255, 0.01);
-        border-inline-end: 1px solid rgba(255, 255, 255, 0.05);
-        border-inline-start: 1px solid rgba(255, 255, 255, 0.1);
-
-        &:first-child {
-          border-inline-start: none;
-        }
-      }
-
-      .@{prefix}-diff-cell-add {
-        background: #305c29;
-        // .mix(#2b303b; 60)
-        // .toHexString();
-      }
-      .@{prefix}-diff-cell-remove {
-        background: #6d2431;
-        // .mix(#2b303b; 60)
-        // .toHexString();
-      }
-
-      .@{prefix}-diff-cell-empty {
-        background: rgba(255, 255, 255, 0.03);
-      }
-    }
-  }
-}

package/lib/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: @fontWeightStrong;
-      font-size: 56px;
-      font-family: PingFangSC;
-
-      .@{prefix}-start {
-        margin-top: 22px;
-        color: #f4f4f4;
-        font-weight: @fontWeightStrong;
-        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/lib/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;
-      }
-    }
-  }
-}