feat:first commit

src/static/style/public.scss

@@ -0,0 +1,101 @@
+@import './uni-scss/index';
+page,
+view,
+scroll-view,
+swiper,
+swiper-item,
+movable-area,
+movable-view,
+cover-view,
+cover-image,
+icon,
+text,
+rich-text,
+progress,
+button,
+checkbox-group,
+checkbox,
+form,
+input,
+label,
+picker,
+picker-view,
+radio-group,
+radio,
+slider,
+switch,
+textarea,
+navigator,
+functional-page-navigator,
+image,
+video,
+camera,
+live-player,
+live-pusher,
+map,
+canvas,
+open-data,
+web-view,
+ad {
+  box-sizing: border-box;
+
+  &::after {
+    box-sizing: border-box;
+  }
+
+  &::before {
+    box-sizing: border-box;
+  }
+
+  &::-webkit-scrollbar {
+    display: none;
+  }
+}
+
+pre {
+  white-space: pre-wrap;
+}
+
+/*清除浮动*/
+.clearfix:after {
+  content: '';
+  display: block;
+  height: 0;
+  overflow: hidden;
+  clear: both;
+  position: relative;
+}
+
+/*单行文本切割*/
+.text-ellipsis {
+  white-space: nowrap;
+  word-break: keep-all;
+  overflow: hidden;
+  text-overflow: ellipsis;
+}
+
+/*多行省略*/
+@mixin text_multiline($line: 2) {
+  display: -webkit-box;
+  -webkit-box-orient: vertical;
+  -webkit-line-clamp: $line;
+  overflow: hidden;
+  word-break: break-all;
+}
+
+.icon {
+  position: relative;
+  display: inline-block;
+  background-repeat: no-repeat;
+  background-position: center center;
+  background-size: contain;
+}
+
+.flex-center {
+  display: flex;
+  align-items: center;
+}
+
+.uni-modal .uni-modal__bd {
+  word-break: keep-all;
+}

src/static/style/uni-scss/index.scss

@@ -0,0 +1 @@
+@import 'styles/index';

src/static/style/uni-scss/styles/index.scss

@@ -0,0 +1,7 @@
+@import 'setting/variables';
+@import 'setting/border';
+@import 'setting/color';
+@import 'setting/space';
+@import 'setting/radius';
+@import 'setting/text';
+@import 'setting/styles';

src/static/style/uni-scss/styles/setting/_border.scss

@@ -0,0 +1,3 @@
+.uni-border {
+  border: 1px $uni-border-1 solid;
+}

src/static/style/uni-scss/styles/setting/_color.scss

@@ -0,0 +1,65 @@
+// TODO 暂时不需要 class ，需要用户使用变量实现 ，如果使用类名其实并不推荐
+// @mixin get-styles($k,$c) {
+// 	@if $k == size or $k == weight{
+// 		font-#{$k}:#{$c}
+// 	}@else{
+// 		#{$k}:#{$c}
+// 	}
+// }
+$uni-ui-color: (
+  // 主色
+  primary: $uni-primary,
+  primary-disable: $uni-primary-disable,
+  primary-light: $uni-primary-light,
+  // 辅助色
+  success: $uni-success,
+  success-disable: $uni-success-disable,
+  success-light: $uni-success-light,
+  warning: $uni-warning,
+  warning-disable: $uni-warning-disable,
+  warning-light: $uni-warning-light,
+  error: $uni-error,
+  error-disable: $uni-error-disable,
+  error-light: $uni-error-light,
+  info: $uni-info,
+  info-disable: $uni-info-disable,
+  info-light: $uni-info-light,
+  // 中性色
+  main-color: $uni-main-color,
+  base-color: $uni-base-color,
+  secondary-color: $uni-secondary-color,
+  extra-color: $uni-extra-color,
+  // 背景色
+  bg-color: $uni-bg-color,
+  // 边框颜色
+  border-1: $uni-border-1,
+  border-2: $uni-border-2,
+  border-3: $uni-border-3,
+  border-4: $uni-border-4,
+  // 黑色
+  black: $uni-black,
+  // 白色
+  white: $uni-white,
+  // 透明
+  transparent: $uni-transparent
+) !default;
+@each $key, $child in $uni-ui-color {
+  .uni-#{'' + $key} {
+    color: $child;
+  }
+  .uni-#{'' + $key}-bg {
+    background-color: $child;
+  }
+}
+.uni-shadow-sm {
+  box-shadow: $uni-shadow-sm;
+}
+.uni-shadow-base {
+  box-shadow: $uni-shadow-base;
+}
+.uni-shadow-lg {
+  box-shadow: $uni-shadow-lg;
+}
+.uni-mask {
+  background-color: $uni-mask;
+}

src/static/style/uni-scss/styles/setting/_radius.scss

@@ -0,0 +1,55 @@
+@mixin radius($r, $d: null, $important: false) {
+  $radius-value: map-get($uni-radius, $r) if($important, !important, null);
+  // Key exists within the $uni-radius variable
+  @if (map-has-key($uni-radius, $r) and $d) {
+    @if $d == t {
+      border-top-left-radius: $radius-value;
+      border-top-right-radius: $radius-value;
+    } @else if $d == r {
+      border-top-right-radius: $radius-value;
+      border-bottom-right-radius: $radius-value;
+    } @else if $d == b {
+      border-bottom-left-radius: $radius-value;
+      border-bottom-right-radius: $radius-value;
+    } @else if $d == l {
+      border-top-left-radius: $radius-value;
+      border-bottom-left-radius: $radius-value;
+    } @else if $d == tl {
+      border-top-left-radius: $radius-value;
+    } @else if $d == tr {
+      border-top-right-radius: $radius-value;
+    } @else if $d == br {
+      border-bottom-right-radius: $radius-value;
+    } @else if $d == bl {
+      border-bottom-left-radius: $radius-value;
+    }
+  } @else {
+    border-radius: $radius-value;
+  }
+}
+
+@each $key, $child in $uni-radius {
+  @if ($key) {
+    .uni-radius-#{'' + $key} {
+      @include radius($key);
+    }
+  } @else {
+    .uni-radius {
+      @include radius($key);
+    }
+  }
+}
+
+@each $direction in t, r, b, l, tl, tr, br, bl {
+  @each $key, $child in $uni-radius {
+    @if ($key) {
+      .uni-radius-#{'' + $direction}-#{'' + $key} {
+        @include radius($key, $direction, false);
+      }
+    } @else {
+      .uni-radius-#{$direction} {
+        @include radius($key, $direction, false);
+      }
+    }
+  }
+}

src/static/style/uni-scss/styles/setting/_space.scss

@@ -0,0 +1,55 @@
+@mixin fn($space, $direction, $size, $n) {
+  @if $n {
+    #{$space}-#{$direction}: #{$size * $uni-space-root}px;
+  } @else {
+    #{$space}-#{$direction}: #{-$size * $uni-space-root}px;
+  }
+}
+@mixin get-styles($direction, $i, $space, $n) {
+  @if $direction == t {
+    @include fn($space, top, $i, $n);
+  }
+  @if $direction == r {
+    @include fn($space, right, $i, $n);
+  }
+  @if $direction == b {
+    @include fn($space, bottom, $i, $n);
+  }
+  @if $direction == l {
+    @include fn($space, left, $i, $n);
+  }
+  @if $direction == x {
+    @include fn($space, left, $i, $n);
+    @include fn($space, right, $i, $n);
+  }
+  @if $direction == y {
+    @include fn($space, top, $i, $n);
+    @include fn($space, bottom, $i, $n);
+  }
+  @if $direction == a {
+    @if $n {
+      #{$space}: #{$i * $uni-space-root}px;
+    } @else {
+      #{$space}: #{-$i * $uni-space-root}px;
+    }
+  }
+}
+
+@each $orientation in m, p {
+  $space: margin;
+  @if $orientation == m {
+    $space: margin;
+  } @else {
+    $space: padding;
+  }
+  @for $i from 0 through 16 {
+    @each $direction in t, r, b, l, x, y, a {
+      .uni-#{$orientation}#{$direction}-#{$i} {
+        @include get-styles($direction, $i, $space, true);
+      }
+      .uni-#{$orientation}#{$direction}-n#{$i} {
+        @include get-styles($direction, $i, $space, false);
+      }
+    }
+  }
+}

src/static/style/uni-scss/styles/setting/_styles.scss

@@ -0,0 +1,162 @@
+/* #ifndef APP-NVUE */
+
+$-color-white: #fff;
+$-color-black: #000;
+@mixin base-style($color) {
+  color: #fff;
+  background-color: $color;
+  border-color: mix($-color-black, $color, 8%);
+  &:not([hover-class]):active {
+    background: mix($-color-black, $color, 10%);
+    border-color: mix($-color-black, $color, 20%);
+    color: $-color-white;
+    outline: none;
+  }
+}
+@mixin is-color($color) {
+  @include base-style($color);
+  &[loading] {
+    @include base-style($color);
+    &::before {
+      margin-right: 5px;
+    }
+  }
+  &[disabled] {
+    &,
+    &[loading],
+    &:not([hover-class]):active {
+      color: $-color-white;
+      border-color: mix(darken($color, 10%), $-color-white);
+      background-color: mix($color, $-color-white);
+    }
+  }
+}
+@mixin base-plain-style($color) {
+  color: $color;
+  background-color: mix($-color-white, $color, 90%);
+  border-color: mix($-color-white, $color, 70%);
+  &:not([hover-class]):active {
+    background: mix($-color-white, $color, 80%);
+    color: $color;
+    outline: none;
+    border-color: mix($-color-white, $color, 50%);
+  }
+}
+@mixin is-plain($color) {
+  &[plain] {
+    @include base-plain-style($color);
+    &[loading] {
+      @include base-plain-style($color);
+      &::before {
+        margin-right: 5px;
+      }
+    }
+    &[disabled] {
+      &,
+      &:active {
+        color: mix($-color-white, $color, 40%);
+        background-color: mix($-color-white, $color, 90%);
+        border-color: mix($-color-white, $color, 80%);
+      }
+    }
+  }
+}
+
+.uni-btn {
+  margin: 5px;
+  color: #393939;
+  border: 1px solid #ccc;
+  font-size: 16px;
+  font-weight: 200;
+  background-color: #f9f9f9;
+  // TODO 暂时处理边框隐藏一边的问题
+  overflow: visible;
+  &::after {
+    border: none;
+  }
+
+  &:not([type]),
+  &[type='default'] {
+    color: #999;
+    &[loading] {
+      background: none;
+      &::before {
+        margin-right: 5px;
+      }
+    }
+
+    &[disabled] {
+      color: mix($-color-white, #999, 60%);
+      &,
+      &[loading],
+      &:active {
+        color: mix($-color-white, #999, 60%);
+        background-color: mix($-color-white, $-color-black, 98%);
+        border-color: mix($-color-white, #999, 85%);
+      }
+    }
+
+    &[plain] {
+      color: #999;
+      background: none;
+      border-color: $uni-border-1;
+      &:not([hover-class]):active {
+        background: none;
+        color: mix($-color-white, $-color-black, 80%);
+        border-color: mix($-color-white, $-color-black, 90%);
+        outline: none;
+      }
+      &[disabled] {
+        &,
+        &[loading],
+        &:active {
+          background: none;
+          color: mix($-color-white, #999, 60%);
+          border-color: mix($-color-white, #999, 85%);
+        }
+      }
+    }
+  }
+
+  &:not([hover-class]):active {
+    color: mix($-color-white, $-color-black, 50%);
+  }
+
+  &[size='mini'] {
+    font-size: 16px;
+    font-weight: 200;
+    border-radius: 8px;
+  }
+
+  &.uni-btn-small {
+    font-size: 14px;
+  }
+  &.uni-btn-mini {
+    font-size: 12px;
+  }
+
+  &.uni-btn-radius {
+    border-radius: 999px;
+  }
+  &[type='primary'] {
+    @include is-color($uni-primary);
+    @include is-plain($uni-primary);
+  }
+  &[type='success'] {
+    @include is-color($uni-success);
+    @include is-plain($uni-success);
+  }
+  &[type='error'] {
+    @include is-color($uni-error);
+    @include is-plain($uni-error);
+  }
+  &[type='warning'] {
+    @include is-color($uni-warning);
+    @include is-plain($uni-warning);
+  }
+  &[type='info'] {
+    @include is-color($uni-info);
+    @include is-plain($uni-info);
+  }
+}
+/* #endif */

src/static/style/uni-scss/styles/setting/_text.scss

@@ -0,0 +1,24 @@
+@mixin get-styles($k, $c) {
+  @if $k == size or $k == weight {
+    font-#{$k}: #{$c};
+  } @else {
+    #{$k}: #{$c};
+  }
+}
+
+@each $key, $child in $uni-headings {
+  /* #ifndef APP-NVUE */
+  .uni-#{$key} {
+    @each $k, $c in $child {
+      @include get-styles($k, $c);
+    }
+  }
+  /* #endif */
+  /* #ifdef APP-NVUE */
+  .container .uni-#{$key} {
+    @each $k, $c in $child {
+      @include get-styles($k, $c);
+    }
+  }
+  /* #endif */
+}

src/static/style/uni-scss/styles/setting/_variables.scss

@@ -0,0 +1,162 @@
+// @use "sass:math";
+@import '../tools/functions';
+// 间距基础倍数
+$uni-space-root: 2 !default;
+// 边框半径默认值
+$uni-radius-root: 5px !default;
+$uni-radius: () !default;
+// 边框半径断点
+$uni-radius: map-deep-merge(
+  (
+    0: 0,
+    // TODO 当前版本暂时不支持 sm 属性
+    // 'sm': math.div($uni-radius-root, 2),
+    null: $uni-radius-root,
+    'lg': $uni-radius-root * 2,
+    'xl': $uni-radius-root * 6,
+    'pill': 9999px,
+    'circle': 50%
+  ),
+  $uni-radius
+);
+// 字体家族
+$body-font-family: 'Roboto', sans-serif !default;
+// 文本
+$heading-font-family: $body-font-family !default;
+$uni-headings: () !default;
+$letterSpacing: -0.01562em;
+$uni-headings: map-deep-merge(
+  (
+    'h1': (
+      size: 32px,
+      weight: 300,
+      line-height: 50px,
+      // letter-spacing:-0.01562em
+    ),
+    'h2': (
+      size: 28px,
+      weight: 300,
+      line-height: 40px,
+      // letter-spacing: -0.00833em
+    ),
+    'h3': (
+      size: 24px,
+      weight: 400,
+      line-height: 32px,
+      // letter-spacing: normal
+    ),
+    'h4': (
+      size: 20px,
+      weight: 400,
+      line-height: 30px,
+      // letter-spacing: 0.00735em
+    ),
+    'h5': (
+      size: 16px,
+      weight: 400,
+      line-height: 24px,
+      // letter-spacing: normal
+    ),
+    'h6': (
+      size: 14px,
+      weight: 500,
+      line-height: 18px,
+      // letter-spacing: 0.0125em
+    ),
+    'subtitle': (
+      size: 12px,
+      weight: 400,
+      line-height: 20px,
+      // letter-spacing: 0.00937em
+    ),
+    'body': (
+      font-size: 14px,
+      font-weight: 400,
+      line-height: 22px,
+      // letter-spacing: 0.03125em
+    ),
+    'caption': (
+      'size': 12px,
+      'weight': 400,
+      'line-height': 20px,
+      // 'letter-spacing': 0.03333em,
+      // 'text-transform': false
+    )
+  ),
+  $uni-headings
+);
+
+// 主色
+$uni-primary: #2979ff !default;
+$uni-primary-disable: lighten($uni-primary, 20%) !default;
+$uni-primary-light: lighten($uni-primary, 25%) !default;
+
+// 辅助色
+// 除了主色外的场景色，需要在不同的场景中使用（例如危险色表示危险的操作）。
+$uni-success: #18bc37 !default;
+$uni-success-disable: lighten($uni-success, 20%) !default;
+$uni-success-light: lighten($uni-success, 25%) !default;
+
+$uni-warning: #f3a73f !default;
+$uni-warning-disable: lighten($uni-warning, 20%) !default;
+$uni-warning-light: lighten($uni-warning, 25%) !default;
+
+$uni-error: #e43d33 !default;
+$uni-error-disable: lighten($uni-error, 20%) !default;
+$uni-error-light: lighten($uni-error, 25%) !default;
+
+$uni-info: #8f939c !default;
+$uni-info-disable: lighten($uni-info, 20%) !default;
+$uni-info-light: lighten($uni-info, 25%) !default;
+
+// 中性色
+// 中性色用于文本、背景和边框颜色。通过运用不同的中性色，来表现层次结构。
+$uni-main-color: #3a3a3a !default; // 主要文字
+$uni-base-color: #6a6a6a !default; // 常规文字
+$uni-secondary-color: #909399 !default; // 次要文字
+$uni-extra-color: #c7c7c7 !default; // 辅助说明
+
+// 边框颜色
+$uni-border-1: #f0f0f0 !default;
+$uni-border-2: #ededed !default;
+$uni-border-3: #dcdcdc !default;
+$uni-border-4: #b9b9b9 !default;
+
+// 常规色
+$uni-black: #000000 !default;
+$uni-white: #ffffff !default;
+$uni-transparent: rgba(
+  $color: #000000,
+  $alpha: 0
+) !default;
+
+// 背景色
+$uni-bg-color: #f7f7f7 !default;
+
+/* 水平间距 */
+$uni-spacing-sm: 8px !default;
+$uni-spacing-base: 15px !default;
+$uni-spacing-lg: 30px !default;
+
+// 阴影
+$uni-shadow-sm: 0 0 5px
+  rgba(
+    $color: #d8d8d8,
+    $alpha: 0.5
+  ) !default;
+$uni-shadow-base: 0 1px 8px 1px
+  rgba(
+    $color: #a5a5a5,
+    $alpha: 0.2
+  ) !default;
+$uni-shadow-lg: 0px 1px 10px 2px
+  rgba(
+    $color: #a5a4a4,
+    $alpha: 0.5
+  ) !default;
+
+// 蒙版
+$uni-mask: rgba(
+  $color: #000000,
+  $alpha: 0.4
+) !default;

src/static/style/uni-scss/styles/tools/functions.scss

@@ -0,0 +1,29 @@
+// 合并 map
+@function map-deep-merge($parent-map, $child-map) {
+  $result: $parent-map;
+  @each $key, $child in $child-map {
+    $parent-has-key: map-has-key($result, $key);
+    $parent-value: map-get($result, $key);
+    $parent-type: type-of($parent-value);
+    $child-type: type-of($child);
+    $parent-is-map: $parent-type == map;
+    $child-is-map: $child-type == map;
+
+    @if (not $parent-has-key) or ($parent-type != $child-type) or (not ($parent-is-map and $child-is-map)) {
+      $result: map-merge(
+        $result,
+        (
+          $key: $child
+        )
+      );
+    } @else {
+      $result: map-merge(
+        $result,
+        (
+          $key: map-deep-merge($parent-value, $child)
+        )
+      );
+    }
+  }
+  @return $result;
+}

src/static/style/uni-scss/theme.scss

@@ -0,0 +1,34 @@
+// 间距基础倍数
+$uni-space-root: 2;
+// 边框半径默认值
+$uni-radius-root: 5px;
+// 主色
+$uni-primary: #2979ff;
+// 辅助色
+$uni-success: #4cd964;
+// 警告色
+$uni-warning: #f0ad4e;
+// 错误色
+$uni-error: #dd524d;
+// 描述色
+$uni-info: #909399;
+// 中性色
+$uni-main-color: #303133;
+$uni-base-color: #606266;
+$uni-secondary-color: #909399;
+$uni-extra-color: #c0c4cc;
+// 背景色
+$uni-bg-color: #f5f5f5;
+// 边框颜色
+$uni-border-1: #dcdfe6;
+$uni-border-2: #e4e7ed;
+$uni-border-3: #ebeef5;
+$uni-border-4: #f2f6fc;
+
+// 常规色
+$uni-black: #000000;
+$uni-white: #ffffff;
+$uni-transparent: rgba(
+  $color: #000000,
+  $alpha: 0
+);

src/static/style/uni-scss/variables.scss

@@ -0,0 +1,80 @@
+@import 'styles/setting/variables';
+// 间距基础倍数
+$uni-space-root: 2;
+// 边框半径默认值
+$uni-radius-root: 5px;
+
+// 主色
+$uni-primary: #2979ff;
+$uni-primary-disable: mix(#fff, $uni-primary, 50%);
+$uni-primary-light: mix(#fff, $uni-primary, 80%);
+
+// 辅助色
+// 除了主色外的场景色，需要在不同的场景中使用（例如危险色表示危险的操作）。
+$uni-success: #18bc37;
+$uni-success-disable: mix(#fff, $uni-success, 50%);
+$uni-success-light: mix(#fff, $uni-success, 80%);
+
+$uni-warning: #f3a73f;
+$uni-warning-disable: mix(#fff, $uni-warning, 50%);
+$uni-warning-light: mix(#fff, $uni-warning, 80%);
+
+$uni-error: #e43d33;
+$uni-error-disable: mix(#fff, $uni-error, 50%);
+$uni-error-light: mix(#fff, $uni-error, 80%);
+
+$uni-info: #8f939c;
+$uni-info-disable: mix(#fff, $uni-info, 50%);
+$uni-info-light: mix(#fff, $uni-info, 80%);
+
+// 中性色
+// 中性色用于文本、背景和边框颜色。通过运用不同的中性色，来表现层次结构。
+$uni-main-color: #3a3a3a; // 主要文字
+$uni-base-color: #6a6a6a; // 常规文字
+$uni-secondary-color: #909399; // 次要文字
+$uni-extra-color: #c7c7c7; // 辅助说明
+
+// 边框颜色
+$uni-border-1: #f0f0f0;
+$uni-border-2: #ededed;
+$uni-border-3: #dcdcdc;
+$uni-border-4: #b9b9b9;
+
+// 常规色
+$uni-black: #000000;
+$uni-white: #ffffff;
+$uni-transparent: rgba(
+  $color: #000000,
+  $alpha: 0
+);
+
+// 背景色
+$uni-bg-color: #f7f7f7;
+
+/* 水平间距 */
+$uni-spacing-sm: 8px;
+$uni-spacing-base: 15px;
+$uni-spacing-lg: 30px;
+
+// 阴影
+$uni-shadow-sm: 0 0 5px
+  rgba(
+    $color: #d8d8d8,
+    $alpha: 0.5
+  );
+$uni-shadow-base: 0 1px 8px 1px
+  rgba(
+    $color: #a5a5a5,
+    $alpha: 0.2
+  );
+$uni-shadow-lg: 0px 1px 10px 2px
+  rgba(
+    $color: #a5a4a4,
+    $alpha: 0.5
+  );
+
+// 蒙版
+$uni-mask: rgba(
+  $color: #000000,
+  $alpha: 0.4
+);