cy-element-ui 1.0.46 → 1.0.48

package/lib/theme-chalk/src/mixins/function.scss

@@ -0,0 +1,44 @@
+@import "config";
+
+/* BEM support Func
+ -------------------------- */
+@function selectorToString($selector) {
+	$selector: inspect($selector);
+	$selector: str-slice($selector, 2, -2);
+	@return $selector;
+}
+
+@function containsModifier($selector) {
+	$selector: selectorToString($selector);
+
+	@if str-index($selector, $modifier-separator) {
+		@return true;
+	} @else {
+		@return false;
+	}
+}
+
+@function containWhenFlag($selector) {
+	$selector: selectorToString($selector);
+
+	@if str-index($selector, '.' + $state-prefix) {
+		@return true
+	} @else {
+		@return false
+	}
+}
+
+@function containPseudoClass($selector) {
+	$selector: selectorToString($selector);
+
+	@if str-index($selector, ':') {
+		@return true
+	} @else {
+		@return false
+	}
+}
+
+@function hitAllSpecialNestRule($selector) {
+
+	@return containsModifier($selector) or containWhenFlag($selector) or containPseudoClass($selector);
+}

package/lib/theme-chalk/src/mixins/mixins.scss

@@ -0,0 +1,190 @@
+@import "function";
+@import "../common/var";
+
+/* Break-points
+ -------------------------- */
+@mixin res($key, $map: $--breakpoints) {
+	// 循环断点Map，如果存在则返回
+	@if map-has-key($map, $key) {
+		@media only screen and #{inspect(map-get($map, $key))} {
+			@content;
+		}
+	} @else {
+		@warn "Undefeined points: `#{$map}`";
+	}
+}
+
+/* Scrollbar
+ -------------------------- */
+@mixin scroll-bar {
+	$--scrollbar-thumb-background: #b4bccc;
+	$--scrollbar-track-background: #fff;
+
+	&::-webkit-scrollbar {
+		z-index: 11;
+		width: 6px;
+
+		&:horizontal {
+			height: 6px;
+		}
+
+		&-thumb {
+			border-radius: 5px;
+			width: 6px;
+			background: $--scrollbar-thumb-background;
+		}
+
+		&-corner {
+			background: $--scrollbar-track-background;
+		}
+
+		&-track {
+			background: $--scrollbar-track-background;
+
+			&-piece {
+				background: $--scrollbar-track-background;
+				width: 6px;
+			}
+		}
+	}
+}
+
+/* Placeholder
+ -------------------------- */
+@mixin placeholder {
+	&::-webkit-input-placeholder {
+		@content
+	}
+
+	&::-moz-placeholder {
+		@content
+	}
+
+	&:-ms-input-placeholder {
+		@content
+	}
+}
+
+/* BEM
+ -------------------------- */
+@mixin b($block) {
+	$B: $namespace+'-'+$block !global;
+
+	.#{$B} {
+		@content;
+	}
+}
+
+@mixin e($element) {
+	$E: $element !global;
+	$selector: &;
+	$currentSelector: "";
+	@each $unit in $element {
+		$currentSelector: #{$currentSelector + "." + $B + $element-separator + $unit + ","};
+	}
+
+	@if hitAllSpecialNestRule($selector) {
+		@at-root {
+			#{$selector} {
+				#{$currentSelector} {
+					@content;
+				}
+			}
+		}
+	} @else {
+		@at-root {
+			#{$currentSelector} {
+				@content;
+			}
+		}
+	}
+}
+
+@mixin m($modifier) {
+	$selector: &;
+	$currentSelector: "";
+	@each $unit in $modifier {
+		$currentSelector: #{$currentSelector + & + $modifier-separator + $unit + ","};
+	}
+
+	@at-root {
+		#{$currentSelector} {
+			@content;
+		}
+	}
+}
+
+@mixin configurable-m($modifier, $E-flag: false) {
+	$selector: &;
+	$interpolation: '';
+
+	@if $E-flag {
+		$interpolation: $element-separator + $E-flag;
+	}
+
+	@at-root {
+		#{$selector} {
+			.#{$B+$interpolation+$modifier-separator+$modifier} {
+				@content;
+			}
+		}
+	}
+}
+
+@mixin spec-selector($specSelector: '', $element: $E, $modifier: false, $block: $B) {
+	$modifierCombo: '';
+
+	@if $modifier {
+		$modifierCombo: $modifier-separator + $modifier;
+	}
+
+	@at-root {
+		#{&}#{$specSelector}.#{$block+$element-separator+$element+$modifierCombo} {
+			@content
+		}
+	}
+}
+
+@mixin meb($modifier: false, $element: $E, $block: $B) {
+	$selector: &;
+	$modifierCombo: '';
+
+	@if $modifier {
+		$modifierCombo: $modifier-separator + $modifier;
+	}
+
+	@at-root {
+		#{$selector} {
+			.#{$block+$element-separator+$element+$modifierCombo} {
+				@content
+			}
+		}
+	}
+}
+
+@mixin when($state) {
+	@at-root {
+		&.#{$state-prefix + $state} {
+			@content;
+		}
+	}
+}
+
+@mixin extend-rule($name) {
+	@extend #{'%shared-'+$name};
+}
+
+@mixin share-rule($name) {
+	$rule-name: '%shared-'+$name;
+
+	@at-root #{$rule-name} {
+		@content
+	}
+}
+
+@mixin pseudo($pseudo) {
+	@at-root #{&}#{':#{$pseudo}'} {
+		@content
+	}
+}
+

package/lib/theme-chalk/src/mixins/utils.scss

@@ -0,0 +1,39 @@
+@mixin utils-user-select($value) {
+	-moz-user-select: $value;
+	-webkit-user-select: $value;
+	-ms-user-select: $value;
+}
+
+@mixin utils-clearfix {
+	$selector: &;
+
+	@at-root {
+		#{$selector}::before,
+		#{$selector}::after {
+			display: table;
+			content: "";
+		}
+		#{$selector}::after {
+			clear: both
+		}
+	}
+}
+
+@mixin utils-vertical-center {
+	$selector: &;
+
+	@at-root {
+		#{$selector}::after {
+			display: inline-block;
+			content: "";
+			height: 100%;
+			vertical-align: middle
+		}
+	}
+}
+
+@mixin utils-ellipsis {
+	overflow: hidden;
+	text-overflow: ellipsis;
+	white-space: nowrap;
+}

package/lib/theme-chalk/src/notification.scss

@@ -0,0 +1,99 @@
+@import "mixins/mixins";
+@import "common/var";
+
+@include b(notification) {
+	display: flex;
+	width: $--notification-width;
+	padding: $--notification-padding;
+	border-radius: $--notification-radius;
+	box-sizing: border-box;
+	border: 1px solid $--notification-border-color;
+	position: fixed;
+	background-color: $--color-white;
+	box-shadow: $--notification-shadow;
+	transition: opacity .3s, transform .3s, left .3s, right .3s, top 0.4s, bottom .3s;
+	overflow: hidden;
+
+	&.right {
+		right: 16px;
+	}
+
+	&.left {
+		left: 16px;
+	}
+
+	@include e(group) {
+		margin-left: $--notification-group-margin-left;
+		margin-right: $--notification-group-margin-right;
+	}
+
+	@include e(title) {
+		font-weight: bold;
+		font-size: $--notification-title-font-size;
+		color: $--notification-title-color;
+		margin: 0;
+	}
+
+	@include e(content) {
+		font-size: $--notification-content-font-size;
+		line-height: 21px;
+		margin: 6px 0 0 0;
+		color: $--notification-content-color;
+		text-align: justify;
+
+		p {
+			margin: 0;
+		}
+	}
+
+	@include e(icon) {
+		height: $--notification-icon-size;
+		width: $--notification-icon-size;
+		font-size: $--notification-icon-size;
+	}
+
+	@include e(closeBtn) {
+		position: absolute;
+		top: 18px;
+		right: 15px;
+		cursor: pointer;
+		color: $--notification-close-color;
+		font-size: $--notification-close-font-size;
+
+		&:hover {
+			color: $--notification-close-hover-color;
+		}
+	}
+
+	.el-icon-success {
+		color: $--notification-success-icon-color;
+	}
+
+	.el-icon-error {
+		color: $--notification-danger-icon-color;
+	}
+
+	.el-icon-info {
+		color: $--notification-info-icon-color;
+	}
+
+	.el-icon-warning {
+		color: $--notification-warning-icon-color;
+	}
+}
+
+.el-notification-fade-enter {
+	&.right {
+		right: 0;
+		transform: translateX(100%);
+	}
+
+	&.left {
+		left: 0;
+		transform: translateX(-100%);
+	}
+}
+
+.el-notification-fade-leave-active {
+	opacity: 0;
+}

package/lib/theme-chalk/src/option-group.scss

@@ -0,0 +1,42 @@
+@import "mixins/mixins";
+@import "common/var";
+
+@include b(select-group) {
+	$gap: 20px;
+
+	margin: 0;
+	padding: 0;
+
+	@include e(wrap) {
+		position: relative;
+		list-style: none;
+		margin: 0;
+		padding: 0;
+
+		&:not(:last-of-type) {
+			padding-bottom: 24px;
+
+			&::after {
+				content: '';
+				position: absolute;
+				display: block;
+				left: $gap;
+				right: $gap;
+				bottom: 12px;
+				height: 1px;
+				background: $--border-color-light;
+			}
+		}
+	}
+
+	@include e(title) {
+		padding-left: $gap;
+		font-size: $--select-group-font-size;
+		color: $--select-group-color;
+		line-height: $--select-group-height;
+	}
+
+	& .el-select-dropdown__item {
+		padding-left: $gap;
+	}
+}

package/lib/theme-chalk/src/option.scss

@@ -0,0 +1,36 @@
+@import "mixins/mixins";
+@import "common/var";
+
+@include b(select-dropdown) {
+	@include e(item) {
+		font-size: $--select-font-size;
+		padding: 0 20px;
+		position: relative;
+		white-space: nowrap;
+		overflow: hidden;
+		text-overflow: ellipsis;
+		color: $--select-option-color;
+		height: $--select-option-height;
+		line-height: $--select-option-height;
+		box-sizing: border-box;
+		cursor: pointer;
+
+		@include when(disabled) {
+			color: $--select-option-disabled-color;
+			cursor: not-allowed;
+
+			&:hover {
+				background-color: $--color-white;
+			}
+		}
+
+		&.hover, &:hover {
+			background-color: $--select-option-hover-background;
+		}
+
+		&.selected {
+			color: $--select-option-selected-font-color;
+			font-weight: bold;
+		}
+	}
+}

package/lib/theme-chalk/src/page-header.scss

@@ -0,0 +1,41 @@
+@import "mixins/mixins";
+@import "common/var";
+
+@include b(page-header) {
+	display: flex;
+	line-height: 24px;
+
+	@include e(left) {
+		display: flex;
+		cursor: pointer;
+		margin-right: 40px;
+		position: relative;
+
+		&::after {
+			content: "";
+			position: absolute;
+			width: 1px;
+			height: 16px;
+			right: -20px;
+			top: 50%;
+			transform: translateY(-50%);
+			background-color: $--border-color-base;
+		}
+
+		.el-icon-back {
+			font-size: 18px;
+			margin-right: 6px;
+			align-self: center;
+		}
+
+		@include e(title) {
+			font-size: 14px;
+			font-weight: 500;
+		}
+	}
+
+	@include e(content) {
+		font-size: 18px;
+		color: $--color-text-primary;
+	}
+}