Browse Source

Merge branch 'nutui-jdl' of https://github.com/jdf2e/nutui into nutui-jdl

yangkaixuan 5 years ago
parent
commit
527ca1a53b
1 changed files with 155 additions and 145 deletions
  1. 155 145
      src/packages/tabselect/tabselect.scss

+ 155 - 145
src/packages/tabselect/tabselect.scss

@@ -1,147 +1,157 @@
 .nut-tabselect {
-	.nut-tab {
-		background: none;
-		border: none;
-		padding: 0;
-	}
-
-	.nav-bar {
-		display: none;
-	}
-
-	.nut-tab-item {
-		padding: 0;
-	}
-
-	.nut-tab-link {
-		font-size: 14px;
-	}
-
-	.nut-tab-title {
-		border: none;
-		height: auto;
-		line-height: auto;
-		padding-left: 18px;
-
-		.nut-title-nav-list {
-			flex: none;
-			padding: 0 13px;
-			height: 30px;
-			line-height: 30px;
-			border: 1px solid #333;
-			border-radius: 15px;
-			margin-right: 15px;
-
-			a {
-				color: #333;
-			}
-		}
-
-		.nut-tab-active {
-			border-color: #e2231a;
-			background: #fcedeb;
-
-			a {
-				color: #e2231a;
-			}
-		}
-	}
-
-	.nut-tab-inner {
-		.nut-tab-title-leftnav {
-			min-width: 158px;
-		}
-
-		.nut-title-nav {
-			min-height: 40px;
-			line-height: 40px;
-			background: #f4f4f4;
-			padding-left: 18px;
-		}
-
-		.nut-tab-active {
-			background: #fff;
-		}
-
-		.nut-tab-link {
-			line-height: inherit;
-			font-size: 14px;
-		}
-
-		.nut-tab-item {
-			padding: 0 10px 0 17px;
-		}
-
-		.nut-tab-panel {
-			max-height: 280px;
-			overflow-y: auto;
-		}
-	}
-
-	.nut-tab-title-leftnav {
-		border: none;
-		max-height: 280px;
-		overflow-y: auto;
-		overflow-x: hidden;
-
-		.nut-title-nav {
-			border: none;
-		}
-	}
-
-	.nut-tabselect-main-title {
-		margin: 12px 0 8px 18px;
-		font-size: 18px;
-		line-height: 25px;
-		color: #000;
-		font-weight: bold;
-	}
-
-	.nut-tabselect-sub-title {
-		margin: 22px 0 11px 18px;
-		line-height: 20px;
-		color: #666;
-		font-size: 14px;
-	}
-
-	.nut-tab-panel li {
-		height: 29px;
-		line-height: 29px;
-		color: #333;
-		border: 1px solid #999;
-		padding-left: 15px;
-		margin-bottom: 10px;
-		border-radius: 2px;
-		cursor: pointer;
-
-		&.nut-tab-panel-list-active {
-			color: #e2231a;
-			border: 1px solid #e2231a;
-			background: #fcedeb;
-		}
-	}
-
-	.popup-bottom.round {
-		border-radius: 12px 12px 0 0;
-	}
-
-	.nut-tabselect-btn {
-		display: flex;
-		background: #fff;
-		position: absolute;
-		bottom: 0;
-		left: 0;
-		right: 0;
-		padding: 12px 18px;
-
-		a {
-			flex: 1;
-			height: 30px;
-			line-height: 30px;
-			background: linear-gradient(135deg, rgba(242, 20, 12, 1) 0%, rgba(242, 39, 12, 1) 70%, rgba(242, 77, 12, 1) 100%);
-			border-radius: 15px;
-			color: #fff;
-			text-align: center;
-		}
-	}
+  .nut-tab {
+    background: none;
+    border: none;
+    padding: 0;
+  }
+
+  .nav-bar {
+    display: none;
+  }
+
+  .nut-tab-item {
+    padding: 0;
+  }
+
+  .nut-tab-link {
+    font-size: 14px;
+  }
+
+  .nut-tab-title {
+    border: none;
+    height: auto;
+    line-height: auto;
+    padding-left: 18px;
+
+    .nut-title-nav-list {
+      flex: none;
+      padding: 0 13px;
+      height: 30px;
+      line-height: 30px;
+      border: 1px solid #333;
+      border-radius: 15px;
+      margin-right: 15px;
+
+      a {
+        color: #333;
+      }
+    }
+
+    .nut-tab-active {
+      border-color: #e2231a;
+      background: #fcedeb;
+
+      a {
+        color: #e2231a;
+      }
+    }
+  }
+
+  .nut-tab-inner {
+    .nut-tab-title-leftnav {
+      min-width: 158px;
+    }
+
+    .nut-title-nav {
+      min-height: 40px;
+      line-height: 40px;
+      background: #f4f4f4;
+      padding-left: 18px;
+    }
+
+    .nut-tab-active {
+      background: #fff;
+    }
+
+    .nut-tab-link {
+      line-height: inherit;
+      font-size: 14px;
+    }
+
+    .nut-tab-item {
+      padding: 0 10px 0 17px;
+    }
+
+    .nut-tab-panel {
+      max-height: 280px;
+      overflow-y: auto;
+      ul {
+        margin: 0;
+        padding: 0;
+        list-style: none;
+      }
+    }
+  }
+
+  .nut-tab-title-leftnav {
+    border: none;
+    height: 280px !important;
+    overflow-y: auto;
+    overflow-x: hidden;
+
+    .nut-title-nav {
+      border: none;
+    }
+    .nut-tab-active .tab-line::after {
+      left: auto;
+      right: 0;
+    }
+  }
+
+  .nut-tabselect-main-title {
+    margin: 12px 0 0 18px;
+    font-size: 18px;
+    line-height: 25px;
+    color: #000;
+    font-weight: bold;
+  }
+
+  .nut-tabselect-sub-title {
+    margin: 8px 0 10px 18px;
+    line-height: 20px;
+    color: #666;
+    font-size: 14px;
+  }
+
+  .nut-tab-panel li {
+    height: 29px;
+    line-height: 29px;
+    color: #333;
+    border: 1px solid #999;
+    padding-left: 15px;
+    margin-bottom: 10px;
+    border-radius: 2px;
+    cursor: pointer;
+
+    &.nut-tab-panel-list-active {
+      color: #e2231a;
+      border: 1px solid #e2231a;
+      background: #fcedeb;
+    }
+  }
+
+  .popup-bottom.round {
+    border-radius: 12px 12px 0 0;
+  }
+
+  .nut-tabselect-btn {
+    display: flex;
+    background: #fff;
+    position: absolute;
+    bottom: 0;
+    left: 0;
+    right: 0;
+    padding: 12px 18px;
+
+    a {
+      flex: 1;
+      height: 30px;
+      line-height: 30px;
+      background: linear-gradient(135deg, rgba(242, 20, 12, 1) 0%, rgba(242, 39, 12, 1) 70%, rgba(242, 77, 12, 1) 100%);
+      border-radius: 15px;
+      color: #fff;
+      text-align: center;
+      text-decoration: none;
+    }
+  }
 }