v2.0.2 (单位全局使用rpx)

v2.0.2 (单位全局使用rpx)
This commit is contained in:
Weilanwl
2018-12-28 00:03:00 +08:00
parent ec50ad8a7b
commit 2cd0b9366e
5 changed files with 3003 additions and 33 deletions

View File

@@ -1,19 +1,20 @@
@import "icon.wxss"; @import "icon.wxss";
@import "colorui.wxss"; @import "colorui-rpx.wxss";
@import "/pages/plugin/animation/animation.wxss";
.nav-list { .nav-list {
display: flex; display: flex;
flex-wrap: wrap; flex-wrap: wrap;
padding: 0px 20px 0px; padding: 0px 40rpx 0px;
justify-content: space-between; justify-content: space-between;
} }
.nav-li { .nav-li {
color: #666; color: #666;
padding: 15px; padding: 30rpx;
border-radius: 6px; border-radius: 12rpx;
width: 45%; width: 45%;
margin: 0 2.5% 20px; margin: 0 2.5% 40rpx;
background-image: url(https://image.weilanwl.com/color2.0/cardBg.png); background-image: url(https://image.weilanwl.com/color2.0/cardBg.png);
background-size: cover; background-size: cover;
background-position: center; background-position: center;
@@ -30,7 +31,7 @@
height: 100%; height: 100%;
left: 0; left: 0;
bottom: -10%; bottom: -10%;
border-radius: 5px; border-radius: 10rpx;
opacity: 0.2; opacity: 0.2;
transform: scale(0.9, 0.9); transform: scale(0.9, 0.9);
} }
@@ -38,23 +39,23 @@
.nav-li.cur { .nav-li.cur {
color: #fff; color: #fff;
background: rgb(94, 185, 94); background: rgb(94, 185, 94);
box-shadow: 2px 2px 3px rgba(94, 185, 94, 0.4); box-shadow: 4rpx 4rpx 6rpx rgba(94, 185, 94, 0.4);
} }
.nav-title { .nav-title {
font-size: 16px; font-size: 32rpx;
font-weight: 300; font-weight: 300;
} }
.nav-title::first-letter { .nav-title::first-letter {
font-size: 20px; font-size: 40rpx;
margin-right: 2px; margin-right: 4rpx;
} }
.nav-name { .nav-name {
font-size: 14px; font-size: 28rpx;
text-transform: Capitalize; text-transform: Capitalize;
margin-top: 10px; margin-top: 20rpx;
position: relative; position: relative;
} }
@@ -62,8 +63,8 @@
content: ""; content: "";
position: absolute; position: absolute;
display: block; display: block;
width: 20px; width: 40rpx;
height: 3px; height: 6rpx;
background: #fff; background: #fff;
bottom: 0; bottom: 0;
right: 0; right: 0;
@@ -74,29 +75,29 @@
content: ""; content: "";
position: absolute; position: absolute;
display: block; display: block;
width: 50px; width: 100rpx;
height: 1px; height: 1px;
background: #fff; background: #fff;
bottom: 0; bottom: 0;
right: 20px; right: 40rpx;
opacity: 0.3; opacity: 0.3;
} }
.nav-name::first-letter { .nav-name::first-letter {
font-weight: bold; font-weight: bold;
font-size: 18px; font-size: 36rpx;
margin-right: 1px; margin-right: 1px;
} }
.nav-li icon { .nav-li icon {
position: absolute; position: absolute;
right: 15px; right: 30rpx;
top: 15px; top: 30rpx;
font-size: 26px; font-size: 52rpx;
width: 30px; width: 60rpx;
height: 30px; height: 60rpx;
text-align: center; text-align: center;
line-height: 30px; line-height: 60rpx;
} }
.text-light { .text-light {
@@ -109,7 +110,7 @@
} }
60% { 60% {
transform: translateY(20px); transform: translateY(40rpx);
} }
100% { 100% {
@@ -123,7 +124,7 @@
} }
60% { 60% {
transform: translateY(20px); transform: translateY(40rpx);
} }
100% { 100% {

View File

@@ -1,5 +1,6 @@
/* /*
Color UI v2.0.2 | by 文晓港 Color UI v2.0.2 | by 文晓港
单位为多种混合(px,rpx,vw,vh,em)
仅供学习交流,如作它用所承受的法律责任一概与作者无关 仅供学习交流,如作它用所承受的法律责任一概与作者无关
QQ交流群240787041 QQ交流群240787041
文档http://www.color-ui.com/ 文档http://www.color-ui.com/
@@ -2414,6 +2415,7 @@ timeline>item>.content {
border-radius: 3px; border-radius: 3px;
display: block; display: block;
color: #666; color: #666;
line-height: 1.6;
} }
timeline>item>.content+.content { timeline>item>.content+.content {

2968
demo/colorui-rpx.wxss Normal file

File diff suppressed because it is too large Load Diff

View File

View File

@@ -615,7 +615,7 @@ switch, checkbox, radio {
position: relative; position: relative;
} }
switch::after ,switch::before{ switch::after, switch::before {
font-family: "iconfont" !important; font-family: "iconfont" !important;
content: "\e645"; content: "\e645";
position: absolute; position: absolute;
@@ -635,19 +635,18 @@ switch::after ,switch::before{
switch::before { switch::before {
content: "\e646"; content: "\e646";
right: 0; right: 0;
transform: scale(1, 1); transform: scale(1, 1);
left: auto; left: auto;
} }
switch[checked]::after { switch[checked]::after {
transform: scale(1, 1); transform: scale(1, 1);
} }
switch[checked]::before { switch[checked]::before {
transform: scale(0, 0); transform: scale(0, 0);
} }
radio::before, checkbox::before { radio::before, checkbox::before {
font-family: "iconfont" !important; font-family: "iconfont" !important;
content: "\e645"; content: "\e645";
@@ -670,7 +669,7 @@ switch[checked]::before {
switch .wx-switch-input { switch .wx-switch-input {
background: #aaa !important; background: #aaa !important;
border:none; border: none;
padding: 0 60rpx; padding: 0 60rpx;
height: 64rpx; height: 64rpx;
margin: 0; margin: 0;
@@ -689,11 +688,13 @@ switch .wx-switch-input::after {
transform: scale(0.9, 0.9) !important; transform: scale(0.9, 0.9) !important;
transition: all 0.1s ease-in-out 0s; transition: all 0.1s ease-in-out 0s;
} }
switch .wx-switch-input-checked::after { switch .wx-switch-input-checked::after {
margin: auto !important; margin: auto !important;
left: 54rpx !important; left: 54rpx !important;
box-shadow: none !important; box-shadow: none !important;
} }
radio-group { radio-group {
display: inline-block; display: inline-block;
} }
@@ -708,8 +709,6 @@ checkbox.round .wx-checkbox-input {
border-radius: 100rpx; border-radius: 100rpx;
} }
switch.radius .wx-switch-input::after, switch.radius .wx-switch-input, switch.radius .wx-switch-input::after, switch.radius .wx-switch-input,
switch.radius .wx-switch-input::before { switch.radius .wx-switch-input::before {
border-radius: 10rpx; border-radius: 10rpx;