drip-public/iview
5
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

🔥 remove transition,transform,use-select mixin

Browse source
This commit is contained in:
jingsam 2016-11-27 00:25:19 +08:00
parent 192e2cb849
commit e26450485c
35 changed files with 104 additions and 175 deletions
Download patch file Download diff file Expand all files Collapse all files

6
src/styles/components/back-top.less
View file

@ -13,8 +13,8 @@
&-inner {
background-color: rgba(0,0,0,.6);
border-radius: 2px;
.box-shadow(0 1px 3px rgba(0,0,0,.2));
.transition(all @transition-time @ease-in-out);
box-shadow: 0 1px 3px rgba(0,0,0,.2);
transition: all @transition-time @ease-in-out;
&:hover {
background-color: rgba(0,0,0,.7);
@ -26,4 +26,4 @@
font-size: 24px;
padding: 8px 12px;
}
}
}

16
src/styles/components/badge.less
View file

@ -8,7 +8,7 @@
&-count {
position: absolute;
.transform(translateX(50%));
transform: translateX(50%);
top: -10px;
right: 0;
height: 20px;
@ -22,9 +22,9 @@
padding: 0 6px;
font-size: 12px;
white-space: nowrap;
.transform-origin(-10% center);
transform-origin: -10% center;
z-index: 10;
.box-shadow(0 0 0 1px #fff);
box-shadow: 0 0 0 1px #fff;
a,
a:hover {
@ -35,14 +35,14 @@
top: auto;
display: block;
position: relative;
.transform(translateX(0));
transform: translateX(0);
}
}
&-dot {
position: absolute;
.transform(translateX(-50%));
.transform-origin(0 center);
transform: translateX(-50%);
transform-origin: 0 center;
top: -4px;
right: -8px;
height: 8px;
@ -50,6 +50,6 @@
border-radius: 100%;
background: @error-color;
z-index: 10;
.box-shadow(0 0 0 1px #fff);
box-shadow: 0 0 0 1px #fff;
}
}
}

4
src/styles/components/button.less
View file

@ -82,7 +82,7 @@
content: '';
border-radius: inherit;
z-index: 1;
.transition(opacity @transition-time);
transition: opacity @transition-time;
pointer-events: none;
display: none;
}
@ -99,4 +99,4 @@
&-group {
.btn-group(@btn-prefix-cls);
}
}
}

8
src/styles/components/cascader.less
View file

@ -29,8 +29,8 @@
&-arrow {
.inner-arrow();
}
&-visible &-arrow:nth-of-type(2){
.transform(rotate(180deg));
&-visible &-arrow:nth-of-type(2) {
transform: rotate(180deg);
}
.@{select-dropdown-prefix-cls} {
@ -67,7 +67,7 @@
& &-item{
position: relative;
padding-right: 24px;
.transition(all @transition-time @ease-in-out);
transition: all @transition-time @ease-in-out;
i{
font-size: @font-size-small;
@ -83,4 +83,4 @@
}
}
}
}
}

4
src/styles/components/circle.less
View file

@ -10,7 +10,7 @@
position: absolute;
left: 0;
top: 50%;
.transform(translateY(-50%));
transform: translateY(-50%);
line-height: 1;
}
}
}

6
src/styles/components/collapse.less
View file

@ -20,12 +20,12 @@
position: relative;
> i{
.transition(transform @transition-time @ease-in-out);
transition: transform @transition-time @ease-in-out;
}
}
}
& > &-item&-item-active > &-header > i{
.transform(rotate(90deg));
transform: rotate(90deg);
}
&-content{
@ -48,4 +48,4 @@
border-radius: 0 0 3px 3px;
}
}
}
}

10
src/styles/components/input-number.less
View file

@ -30,7 +30,7 @@
top: 0;
right: 0;
opacity: 0;
.transition(opacity @transition-time @ease-in-out);
transition: opacity @transition-time @ease-in-out;
}
&:hover &-handler-wrap {
@ -73,10 +73,10 @@
line-height: 12px;
font-size: 14px;
color: #999;
.user-select();
user-select: none;
position: absolute;
right: 4px;
.transition(all @transition-time linear);
transition: all @transition-time linear;
}
&:hover {
@ -107,7 +107,7 @@
color: #666;
border: 0;
border-radius: @btn-border-radius;
.transition(all @transition-time linear);
transition: all @transition-time linear;
&[disabled] {
.disabled();
@ -183,4 +183,4 @@
.handler-disabled();
}
}
}
}

4
src/styles/components/loading-bar.less
View file

@ -9,7 +9,7 @@
z-index: @zindex-loading-bar;
&-inner {
.transition(width @transition-time linear);
transition: width @transition-time linear;
&-color-primary {
background-color: @primary-color;
@ -19,4 +19,4 @@
background-color: @error-color;
}
}
}
}

12
src/styles/components/page.less
View file

@ -19,18 +19,18 @@
text-align: center;
list-style: none;
background-color: #fff;
.user-select();
user-select: none;
cursor: pointer;
font-family: Arial;
border: 1px solid @border-color-base;
border-radius: @btn-border-radius;
.transition(all @transition-time @ease-in-out);
transition: all @transition-time @ease-in-out;
a {
margin: 0 6px;
text-decoration: none;
color: @text-color;
//.transition(none);
//transition: none;
}
&:hover {
@ -114,7 +114,7 @@
font-family: Arial;
border: 1px solid @border-color-base;
border-radius: @btn-border-radius;
.transition(all @transition-time @ease-in-out);
transition: all @transition-time @ease-in-out;
}
&-prev,
@ -202,7 +202,7 @@
outline: none;
border: 1px solid @border-color-base;
border-radius: @btn-border-radius;
.transition(border-color @transition-time @ease-in-out);
transition: border-color @transition-time @ease-in-out;
&:hover {
border-color: @primary-color;
@ -266,4 +266,4 @@
}
}
}
}
}

6
src/styles/components/progress.less
View file

@ -29,7 +29,7 @@
&-bg {
border-radius: 100px;
background-color: @info-color;
.transition(all @transition-time linear);
transition: all @transition-time linear;
position: relative;
}
@ -52,7 +52,7 @@
bottom: 0;
background: #fff;
border-radius: 10px;
.animation(ivu-progress-active 2s @ease-in-out infinite);
animation: ivu-progress-active 2s @ease-in-out infinite;
}
}
@ -84,4 +84,4 @@
opacity: 0;
width: 100%;
}
}
}

16
src/styles/components/radio.less
View file

@ -42,7 +42,7 @@
background-color: #fff;
border: 1px solid @border-color-base;
border-radius: 50%;
.transition(all @transition-time @ease-in-out);
transition: all @transition-time @ease-in-out;
&:after {
position: absolute;
@ -57,8 +57,8 @@
content: ' ';
background-color: @primary-color;
opacity: 0;
.transition(all @transition-time @ease-in-out);
.transform(scale(0));
transition: all @transition-time @ease-in-out;
transform: scale(0);
}
}
@ -80,8 +80,8 @@
border-color: @primary-color;
&:after {
opacity: 1;
.transform(scale(1));
.transition(all @transition-time @ease-in-out);
transform: scale(1);
transition: all @transition-time @ease-in-out;
}
}
&:hover {
@ -138,7 +138,7 @@ span.@{radio-prefix-cls} + * {
padding: 0 16px;
font-size: @font-size-small;
color: @btn-default-color;
.transition(all @transition-time ease-in-out);
transition: all @transition-time ease-in-out;
cursor: pointer;
border: 1px solid @border-color-base;
border-left: 0;
@ -156,7 +156,7 @@ span.@{radio-prefix-cls} + * {
left: -1px;
background: @border-color-base;
visibility: hidden;
.transition(all @transition-time ease-in-out);
transition: all @transition-time ease-in-out;
}
&:first-child {
@ -254,4 +254,4 @@ span.@{radio-prefix-cls} + * {
&:last-child {
border-radius: 0 @btn-border-radius-small @btn-border-radius-small 0;
}
}
}

8
src/styles/components/select.less
View file

@ -15,13 +15,13 @@
display: block;
box-sizing: border-box;
outline: none;
.user-select();
user-select: none;
cursor: pointer;
background-color: #fff;
border-radius: @btn-border-radius;
border: 1px solid @border-color-base;
.transition(all @transition-time @ease-in-out);
transition: all @transition-time @ease-in-out;
.@{select-prefix-cls}-arrow:nth-of-type(1) {
display: none;
@ -50,7 +50,7 @@
}
.@{select-prefix-cls}-arrow:nth-of-type(2) {
.transform(rotate(180deg));
transform: rotate(180deg);
}
}
@ -214,4 +214,4 @@
height: 30px;
line-height: 30px;
}
}
}

12
src/styles/components/slider.less
View file

@ -18,11 +18,11 @@
background-color: transparent;
position: absolute;
top: @slider-button-wrap-offset;
.transform(translateX(-50%));
transform: translateX(-50%);
.@{tooltip-prefix-cls} {
display: block;
.user-select();
user-select: none;
}
}
@ -32,13 +32,13 @@
border: 2px solid @slider-color;
border-radius: 50%;
background-color: #fff;
.transition(all @transition-time linear);
transition: all @transition-time linear;
&:hover,
&-dragging
{
border-color: @primary-color;
.transform(scale(1.5));
transform: scale(1.5);
}
&:hover{
@ -63,7 +63,7 @@
.square(@slider-height);
border-radius: 50%;
background-color: @slider-disabled-color;
.transform(translateX(-50%));
transform: translateX(-50%);
}
}
@ -107,4 +107,4 @@
float: right;
margin-top: -14px;
}
}
}

8
src/styles/components/spin.less
View file

@ -14,7 +14,7 @@
border-radius: 50%;
background-color: @primary-color;
.square(@spin-dot-size);
.animation(ani-spin-bounce 1s 0s ease-in-out infinite);
animation: ani-spin-bounce 1s 0s ease-in-out infinite;
}
&-large &-dot {
@ -59,11 +59,11 @@
@keyframes ani-spin-bounce {
0% {
.transform(scale(0));
transform: scale(0);
}
100% {
.transform(scale(1));
transform: scale(1);
opacity: 0;
}
}
}

6
src/styles/components/steps.less
View file

@ -61,7 +61,7 @@
.@{steps-prefix-cls}-tail > i:after {
width: 100%;
background: @primary-color;
.transition(all @transition-time @ease-in-out);
transition: all @transition-time @ease-in-out;
opacity: 1;
}
.@{steps-prefix-cls}-title {
@ -142,7 +142,7 @@
border: 1px solid @steps-wait-icon-color;
border-radius: 50%;
font-size: 14px;
.transition(background-color @transition-time @ease-in-out);
transition: background-color @transition-time @ease-in-out;
> .@{steps-prefix-cls}-icon {
line-height: 1;
@ -350,4 +350,4 @@
padding-left: 10px;
margin-left: -10px;
}
}
}

10
src/styles/components/switch.less
View file

@ -11,8 +11,8 @@
background-color: #ccc;
position: relative;
cursor: pointer;
.user-select();
.transition(all @transition-time @ease-in-out);
user-select: none;
transition: all @transition-time @ease-in-out;
&-inner {
color: #fff;
@ -20,7 +20,7 @@
position: absolute;
left: 25px;
i{
i {
width: 12px;
height: 12px;
text-align: center;
@ -37,7 +37,7 @@
left: 1px;
top: 1px;
cursor: pointer;
.transition2(left @transition-time @ease-in-out, width @transition-time @ease-in-out);
transition: left @transition-time @ease-in-out, width @transition-time @ease-in-out;
}
&:active:after {
@ -126,4 +126,4 @@
color: #ccc;
}
}
}
}

6
src/styles/components/tag.less
View file

@ -15,7 +15,7 @@
opacity: 1;
overflow: hidden;
cursor: pointer;
//.transition(all @transition-time @ease-in-out);
//transition: all @transition-time @ease-in-out;
&-dot{
height: 32px;
@ -146,7 +146,7 @@
opacity: 0.66;
position: relative;
top: 1px;
//.transition(all @transition-time @ease-in-out);
//transition: all @transition-time @ease-in-out;
&:hover {
opacity: 1;
@ -190,4 +190,4 @@
{
background: @error-color;
}
}
}

4
src/styles/components/timeline.less
View file

@ -58,7 +58,7 @@
font-size: @font-size-base;
position: absolute;
left: -13px;
.transform(translateY(-50%));
transform: translateY(-50%);
}
&-content {
@ -84,4 +84,4 @@
min-height: 48px;
}
}
}
}