Dev: Touch visual effects

This commit is contained in:
surunzi
2016-05-29 09:43:19 +08:00
parent 166c792c20
commit e1a00e1af9
24 changed files with 192 additions and 71 deletions

View File

@@ -11,9 +11,12 @@
}
.breadcrumb {
background: #fff;
padding: $padding;
margin-bottom: 10px;
word-break: break-all;
padding: $padding;
font-size: $font-size-l;
min-height: 40px;
border-bottom: 1px solid $gray-light;
}
.section {
h2 {
@@ -21,6 +24,10 @@
padding: $padding;
color: #fff;
font-size: $font-size;
transition: background $anim-duration;
&.active-effect:active {
background: $blue-dark;
}
}
margin-bottom: 10px;
}
@@ -33,6 +40,17 @@
padding: $padding;
border-top: 1px solid $gray-light;
white-space: nowrap;
transition: background $anim-duration, color $anim-duration;
span {
transition: color $anim-duration;
}
&.active-effect:active {
background: $blue;
color: #fff;
span {
color: #fff;
}
}
}
}
.attributes {
@@ -76,7 +94,7 @@
padding: 5px 10px;
&.key {
white-space: nowrap;
color: $red-dark;
color: $red;
}
}
}
@@ -96,7 +114,7 @@
padding-left: 2em;
word-break: break-all;
span {
color: $red-dark;
color: $red;
}
}
&:last-child {
@@ -148,7 +166,12 @@
line-height: 40px;
width: 20%;
display: inline-block;
&:active, &.active {
transition: background $anim-duration, color $anim-duration;
&:active {
background: $blue;
color: #fff;
}
&.active {
color: $blue;
}
}