css

common/common.scss

@@ -19,4 +19,179 @@ uni-toast{
 /* ==================
         覆盖ColorUI
  ==================== */
+.wrap{
+	flex-wrap: wrap;
+}
+
+.direction{
+	flex-direction: column;
+}
+
+.item-center{
+	align-items: center;
+}
+
+.item-end{
+	align-items: flex-end;
+}
+
+.content-center{
+	justify-content: center;
+}
+
+.content-between{
+	justify-content: space-between;
+}
+
+.relative{
+	position: relative;
+}
+
+.absolute{
+	position: absolute;
+}
+
+.fixed{
+	position: fixed;
+}
+
+.b0{
+	bottom: 0;
+}
+
+.l0{
+	left: 0;
+}
+
+.t0{
+	top: 0;
+}
+
+.r0{
+	right: 0;
+}
+
+.fff{
+	color: #fff;
+}
+
+.p-5{
+	padding: 5px;
+}
+
+.p-10{
+	padding: 10px;
+}
+
+.p-15{
+	padding: 15px;
+}
+
+.p-20{
+	padding: 20px;
+}
+
+.mr-10{
+	margin-right: 10px;
+}
+
+.ml-auto{
+	margin-left: auto;
+}
+
+.w100{
+	width: 100%;
+}
+
+.h100{
+	height: 100%;
+}
+
+.gap{
+	gap: 10px;
+}
+
+.space-nowrap{
+	white-space: nowrap;
+}
+
+.overflow-ellipsis{
+	text-overflow: ellipsis;
+}
+
+.overflow-hidden{
+	overflow: hidden;
+}
+
+.grow{
+	flex-grow: 1;
+}
+
+.cursor-pointer {
+	cursor: pointer;
+}
+
+// 悬浮变色
+.hover:hover{
+	background-color: #8d8da01a;
+	transition-duration: 0.2s;
+}
+
+// 边框颜色
+[class*="border"]{
+	border-width: 1px;
+	border-style: solid;
+}
+
+[class*="border-info"]{
+	border-color: #FFF3;
+}
+
+[class*="border-gray"]{
+	border-color: rgba(0,0,0, 0.1);
+}
+
+.radius{
+	border-radius: 8px;
+}
+
+.z-index{
+	z-index: 999;
+}
+
+// 字大小
+[class*="size-mini"]{
+	font-size: 12px;
+}
+
+[class*="size-normal"]{
+	font-size: 14px;
+}
+
+[class*="size-large"]{
+	font-size: 16px;
+}
+
+[class*="size-huge"]{
+	font-size: 18px;
+}
+
+.box-shadow{
+	box-shadow: 0 0 15px rgba(0,0,0,.1);
+}
+
+.background-color-white{
+	background-color: #FFF;
+}
+
+.background-color-gray{
+	background-color: #ececf1;
+}
+
+.background-color-active{
+	background-color: #8d8da01a;
+}
 
+.button-none::after{
+	border: none;
+}