Browse Source

fix: 字体设置

wangyue217 5 years ago
parent
commit
346521c1a8
1 changed files with 156 additions and 156 deletions
  1. 156 156
      src/packages/button/button.scss

+ 156 - 156
src/packages/button/button.scss

@@ -1,161 +1,161 @@
 @mixin small {
-	height: $btn-height-small;
-	padding: 0 $btn-height-small/2;
-	font-size: $font-size-small;
+  height: $btn-height-small;
+  padding: 0 $btn-height-small/2;
+  font-size: $font-size-small;
 }
 
 .nut-button {
-	display: inline-block;
-	position: relative;
-	box-sizing: border-box;
-	cursor: pointer;
-	height: $btn-height-big;
-	padding: 0 $btn-height-big;
-	outline: none;
-	font-size: $font-size-base;
-	color: $btn-gradient-color;
-	background: $btn-gradient-bg;
-	border: none;
-	border-radius: $btn-border-radius-base;
-	transition: opacity .2s;
-
-	&::before {
-		position: absolute;
-		top: 50%;
-		left: 50%;
-		width: 100%;
-		height: 100%;
-		background-color: black;
-		border: inherit;
-		border-color: black;
-		border-radius: inherit; /* inherit parent's border radius */
-		transform: translate(-50%, -50%);
-		opacity: 0;
-		content: ' ';
-	}
-
-	&:active::before {
-		opacity: .1;
-	}
-
-	&[disabled] {
-		cursor: not-allowed;
-		background: $btn-disable-bg;
-		color: $btn-gradient-color;
-	}
-
-	// type-label
-	.txt-icon {
-		vertical-align: text-top;
-		margin-right: $btn-icon-margin;
-		color: $primary-color;
-	}
-
-	&.bottom {
-		background: $btn-primary-color;
-		border: $border-width-base solid $split-line-color;
-		color: $text-black-3;
-	}
-
-	&.red {
-		background: $btn-default-bg;
-		border: $border-width-base solid $primary-color;
-		color: $primary-color;
-	}
-
-	&.gray {
-		background: $light-color;
-		color: $title-color;
-	}
-
-	&.light {
-		color: $title-color;
-		background: $btn-default-bg;
-		border: $border-width-base solid $dark-color;
-	}
-
-	&.lightred {
-		background: $btn-label-light-bg;
-		color: $title-color;
-		border: none;
-	}
-
-	&.primary {
-		background: $primary-color;
-		color: $btn-primary-color;
-	}
-
-	&.default {
-		background: $btn-default-bg;
-		color: $title-color;
-		border: $border-width-base solid $btn-default-border;
-	}
-
-	&.actived {
-		background: $btn-label-light-bg;
-		color: $primary-color;
-		border: $border-width-base solid $primary-color;
-	}
-
-	&.dashed {
-		background: $btn-default-bg;
-		color: $title-color;
-		border: $border-width-base dashed $dark-color;
-	}
-
-	// 通栏样式
-	&.block {
-		width: 100%;
-		border-radius: 0;
-	}
-	// size-大号
-	&.big {
-		height: $btn-height-big;
-		padding: 0 $btn-height-big/2;
-		font-size: $font-size-big;
-	}
-	// size-中号
-	&.middle {
-		height: $btn-height-middle;
-		padding: 0 $btn-height-middle/2;
-		font-size: $font-size-middle;
-	}
-	// size-小号
-	&.small {
-		height: $btn-height-small;
-		padding: 0 $btn-height-small/2;
-		font-size: $font-size-small;
-	}
-
-	&.no-txt-big {
-		width: $btn-height-big;
-		padding: 0;
-
-		.txt-icon {
-			margin: 0;
-		}
-	}
-
-	&.no-tx-middle {
-		width: $btn-height-middle;
-		padding: 0;
-
-		.txt-icon {
-			margin: 0;
-		}
-	}
-
-	&.no-txt-small {
-		width: $btn-height-small;
-		padding: 0;
-
-		.txt-icon {
-			margin: 0;
-		}
-	}
-
-	// shape-圆角
-	&.circle {
-		border-radius: $btn-border-radius-large;
-	}
+  display: inline-block;
+  position: relative;
+  box-sizing: border-box;
+  cursor: pointer;
+  height: $btn-height-big;
+  padding: 0 $btn-height-big;
+  outline: none;
+  font-size: $font-size-base;
+  color: $btn-gradient-color;
+  background: $btn-gradient-bg;
+  border: none;
+  border-radius: $btn-border-radius-base;
+  transition: opacity 0.2s;
+  font-family: PingFang-SC-Medium;
+  &::before {
+    position: absolute;
+    top: 50%;
+    left: 50%;
+    width: 100%;
+    height: 100%;
+    background-color: black;
+    border: inherit;
+    border-color: black;
+    border-radius: inherit; /* inherit parent's border radius */
+    transform: translate(-50%, -50%);
+    opacity: 0;
+    content: ' ';
+  }
+
+  &:active::before {
+    opacity: 0.1;
+  }
+
+  &[disabled] {
+    cursor: not-allowed;
+    background: $btn-disable-bg;
+    color: $btn-gradient-color;
+  }
+
+  // type-label
+  .txt-icon {
+    vertical-align: text-top;
+    margin-right: $btn-icon-margin;
+    color: $primary-color;
+  }
+
+  &.bottom {
+    background: $btn-primary-color;
+    border: $border-width-base solid $split-line-color;
+    color: $text-black-3;
+  }
+
+  &.red {
+    background: $btn-default-bg;
+    border: $border-width-base solid $primary-color;
+    color: $primary-color;
+  }
+
+  &.gray {
+    background: $light-color;
+    color: $title-color;
+  }
+
+  &.light {
+    color: $title-color;
+    background: $btn-default-bg;
+    border: $border-width-base solid $dark-color;
+  }
+
+  &.lightred {
+    background: $btn-label-light-bg;
+    color: $title-color;
+    border: none;
+  }
+
+  &.primary {
+    background: $primary-color;
+    color: $btn-primary-color;
+  }
+
+  &.default {
+    background: $btn-default-bg;
+    color: $title-color;
+    border: $border-width-base solid $btn-default-border;
+  }
+
+  &.actived {
+    background: $btn-label-light-bg;
+    color: $primary-color;
+    border: $border-width-base solid $primary-color;
+  }
+
+  &.dashed {
+    background: $btn-default-bg;
+    color: $title-color;
+    border: $border-width-base dashed $dark-color;
+  }
+
+  // 通栏样式
+  &.block {
+    width: 100%;
+    border-radius: 0;
+  }
+  // size-大号
+  &.big {
+    height: $btn-height-big;
+    padding: 0 $btn-height-big/2;
+    font-size: $font-size-big;
+  }
+  // size-中号
+  &.middle {
+    height: $btn-height-middle;
+    padding: 0 $btn-height-middle/2;
+    font-size: $font-size-middle;
+  }
+  // size-小号
+  &.small {
+    height: $btn-height-small;
+    padding: 0 $btn-height-small/2;
+    font-size: $font-size-small;
+  }
+
+  &.no-txt-big {
+    width: $btn-height-big;
+    padding: 0;
+
+    .txt-icon {
+      margin: 0;
+    }
+  }
+
+  &.no-tx-middle {
+    width: $btn-height-middle;
+    padding: 0;
+
+    .txt-icon {
+      margin: 0;
+    }
+  }
+
+  &.no-txt-small {
+    width: $btn-height-small;
+    padding: 0;
+
+    .txt-icon {
+      margin: 0;
+    }
+  }
+
+  // shape-圆角
+  &.circle {
+    border-radius: $btn-border-radius-large;
+  }
 }