File: usage/demo/page/ani-text.scss
@charset "utf-8";
@import "../layout/layout";
@import "../module/m-demo";
@import "../module/m-code";
@import "../../../lib/element/yo-btn";
/**
* Page Animation Switch 演示页面
* Author: joy.du(飘零雾雨)
* Time: 2015.2.5
*/
// layout
.m-demo .device .stage {
background-color: #0ac2d2;
@include responsive(mobile) {
position: absolute;
top: 0;
right: 0;
bottom: 0;
left: 0;
height: auto;
}
}
.content {
@include alignment(2.8rem, 3rem);
z-index: 2;
> h1 {
color: rgba(255, 255, 255, .6);
font-size: .64rem;
}
> h2 {
color: rgba(0, 0, 0, .2);
font-size: .3rem;
}
> .text {
height: 1rem;
color: rgba(255, 255, 255, .9);
font-size: .36rem;
line-height: 1rem;
}
> select {
position: relative;
width: 70%;
height: .44rem;
margin: .1rem 0;
padding: 0 .15rem;
border: 0;
border-radius: .02rem;
line-height: .44rem;
box-shadow: 0 .03rem 0 rgba(0, 0, 0, .1);
background: #fff;
color: #aaa;
cursor: pointer;
font-size: .16rem;
@include appearance;
text-transform: capitalize;
background-size: .1rem .1rem;
background-repeat: no-repeat;
background-position: right .1rem center;
background-image: radial-gradient(circle, #0ac2d2, #0ac2d2 50%, transparent, transparent);
}
}