mirror of
https://github.com/alibaba/anyproxy.git
synced 2025-04-20 18:34:21 +00:00
295 lines
6.4 KiB
CSS
295 lines
6.4 KiB
CSS
@font-face {
|
|
font-family: 'iconfont';
|
|
src: url('//at.alicdn.com/t/font_1438330832_106274.eot');
|
|
src: url('//at.alicdn.com/t/font_1438330832_106274.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */ url('//at.alicdn.com/t/font_1438330832_106274.woff') format('woff'), /* chrome、firefox */ url('//at.alicdn.com/t/font_1438330832_106274.ttf') format('truetype'), /* chrome、firefox、opera、Safari, Android, iOS 4.2+*/ url('//at.alicdn.com/t/font_1438330832_106274.svg#iconfont') format('svg');
|
|
|
|
/* IE9*/
|
|
/* iOS 4.1- */
|
|
}
|
|
i.iconfont {
|
|
font-family: "iconfont";
|
|
font-style: normal;
|
|
}
|
|
body {
|
|
margin: 0;
|
|
padding: 0;
|
|
font-family: 'Source Sans Pro', 'Helvetica Neue', Arial, sans-serif;
|
|
-webkit-font-smoothing: antialiased;
|
|
-moz-osx-font-smoothing: grayscale;
|
|
}
|
|
.wrapper .cornerBtn {
|
|
position: absolute;
|
|
right: 10px;
|
|
top: 10px;
|
|
z-index: 1;
|
|
}
|
|
.wrapper a,
|
|
.wrapper a:hover {
|
|
text-decoration: none;
|
|
}
|
|
.wrapper a {
|
|
font-size: 16px;
|
|
color: #00aaee;
|
|
}
|
|
.wrapper h4.subTitle {
|
|
font-size: 30px;
|
|
margin: 0;
|
|
padding: 50px 0 10px 0;
|
|
width: 100%;
|
|
text-align: center;
|
|
color: #5a5a5a;
|
|
}
|
|
.wrapper h4.subTitle.white {
|
|
color: #FFF;
|
|
}
|
|
.wrapper code {
|
|
display: inline-block;
|
|
}
|
|
.wrapper .actionBtn.actionBtnWhite {
|
|
color: #FFF;
|
|
border: 1px solid #FFF;
|
|
}
|
|
.wrapper .actionBtn.actionBtnWhite:hover {
|
|
background: #f9f9f9;
|
|
color: #326eeb;
|
|
}
|
|
.wrapper .actionBtn {
|
|
color: #326eeb;
|
|
border: 1px solid #326eeb;
|
|
line-height: 30px;
|
|
font-size: 30px;
|
|
padding: 20px 45px;
|
|
border-radius: 30px;
|
|
display: inline-block;
|
|
transition: 0.3s;
|
|
}
|
|
@media only screen and (min-device-width: 320px) and (max-device-width: 480px) and (-webkit-min-device-pixel-ratio: 2) {
|
|
.wrapper .actionBtn {
|
|
font-size: 20px;
|
|
padding: 10px 20px;
|
|
}
|
|
}
|
|
.wrapper .actionBtn:hover {
|
|
background: #326eeb;
|
|
color: #f9f9f9;
|
|
}
|
|
.wrapper > div {
|
|
width: 100%;
|
|
min-width: 890px;
|
|
}
|
|
@media only screen and (min-device-width: 320px) and (max-device-width: 480px) and (-webkit-min-device-pixel-ratio: 2) {
|
|
.wrapper > div {
|
|
min-width: 100%;
|
|
}
|
|
}
|
|
.brief {
|
|
height: 300px;
|
|
text-align: center;
|
|
padding: 100px 0;
|
|
position: relative;
|
|
margin-top: 20px;
|
|
}
|
|
@media only screen and (min-device-width: 320px) and (max-device-width: 480px) and (-webkit-min-device-pixel-ratio: 2) {
|
|
.brief {
|
|
padding: 60px 0 90px;
|
|
}
|
|
}
|
|
.brief .slogan {
|
|
font-size: 16px;
|
|
color: #5a5a5a;
|
|
padding: 0 20px;
|
|
}
|
|
.feature {
|
|
background: #dedede;
|
|
}
|
|
.feature .featureContent {
|
|
width: 1200px;
|
|
margin: 0 auto;
|
|
}
|
|
@media only screen and (min-device-width: 320px) and (max-device-width: 480px) and (-webkit-min-device-pixel-ratio: 2) {
|
|
.feature .featureContent {
|
|
width: 100%;
|
|
}
|
|
}
|
|
.feature .featureContent .item {
|
|
padding: 30px 0 20px;
|
|
width: 280px;
|
|
/*border: 1px solid #AAA;*/
|
|
margin: 0 10px;
|
|
float: left;
|
|
box-sizing: border-box;
|
|
-webkit-box-sizing: border-box;
|
|
font-size: 30px;
|
|
text-align: center;
|
|
}
|
|
.feature .featureContent .iconWrapper {
|
|
display: inline-block;
|
|
line-height: 40px;
|
|
width: 70px;
|
|
text-align: center;
|
|
font-size: 40px;
|
|
color: #5a5a5a;
|
|
}
|
|
.feature .featureContent .iconWrapper .bigger {
|
|
font-size: 44px;
|
|
}
|
|
.feature .featureContent h4 {
|
|
color: #5a5a5a;
|
|
margin: 12px auto 8px;
|
|
font-size: 20px;
|
|
}
|
|
.feature .featureContent h5 {
|
|
color: #777777;
|
|
margin: 0;
|
|
}
|
|
.feature .featureContent h5,
|
|
.feature .featureContent a {
|
|
font-size: 14px;
|
|
line-height: 20px;
|
|
}
|
|
@media only screen and (min-device-width: 320px) and (max-device-width: 480px) and (-webkit-min-device-pixel-ratio: 2) {
|
|
.feature .featureContent .item {
|
|
padding: 20px 0;
|
|
float: none;
|
|
margin: 0 auto;
|
|
font-size: 24px;
|
|
}
|
|
.feature .featureContent .iconWrapper {
|
|
font-size: 25px;
|
|
line-height: 25px;
|
|
}
|
|
.feature .featureContent .iconWrapper .bigger {
|
|
font-size: 30px;
|
|
}
|
|
.feature .featureContent h4 {
|
|
font-size: 16px;
|
|
margin: 4px;
|
|
}
|
|
}
|
|
.quickstart {
|
|
background: #f9f9f9;
|
|
}
|
|
.quickstart .quickstartContent {
|
|
position: relative;
|
|
}
|
|
.quickstart .screenshot {
|
|
position: absolute;
|
|
right: 0;
|
|
bottom: 0;
|
|
}
|
|
@media only screen and (min-device-width: 320px) and (max-device-width: 480px) and (-webkit-min-device-pixel-ratio: 2) {
|
|
.quickstart .screenshot {
|
|
display: none;
|
|
}
|
|
}
|
|
.quickstart code.simpleBash {
|
|
font-family: monospace;
|
|
font-weight: bold;
|
|
color: #333;
|
|
padding: 0;
|
|
}
|
|
.listSection .listContent {
|
|
width: 890px;
|
|
margin: 0 auto;
|
|
}
|
|
@media only screen and (min-device-width: 320px) and (max-device-width: 480px) and (-webkit-min-device-pixel-ratio: 2) {
|
|
.listSection .listContent {
|
|
width: 100%;
|
|
}
|
|
}
|
|
.listSection ul {
|
|
margin: 0 auto;
|
|
}
|
|
@media only screen and (min-device-width: 320px) and (max-device-width: 480px) and (-webkit-min-device-pixel-ratio: 2) {
|
|
.listSection ul {
|
|
padding: 0 20px 0 30px;
|
|
}
|
|
}
|
|
.listSection li {
|
|
color: #5a5a5a;
|
|
font-size: 16px;
|
|
line-height: 40px;
|
|
}
|
|
.sample {
|
|
background: #f9f9f9;
|
|
}
|
|
.sample .sampleContent {
|
|
width: 890px;
|
|
margin: 0 auto;
|
|
}
|
|
@media only screen and (min-device-width: 320px) and (max-device-width: 480px) and (-webkit-min-device-pixel-ratio: 2) {
|
|
.sample .sampleContent {
|
|
width: 100%;
|
|
}
|
|
}
|
|
.sample .item {
|
|
margin: 10px;
|
|
}
|
|
.sample .itemTitle {
|
|
font-size: 16px;
|
|
margin: 0px 10px;
|
|
color: #5a5a5a;
|
|
}
|
|
@media only screen and (min-device-width: 320px) and (max-device-width: 480px) and (-webkit-min-device-pixel-ratio: 2) {
|
|
.sample .itemTitle {
|
|
margin: 0;
|
|
}
|
|
}
|
|
.sample .figure {
|
|
vertical-align: top;
|
|
}
|
|
.sample pre {
|
|
margin: 0;
|
|
display: inline-block;
|
|
vertical-align: top;
|
|
}
|
|
@media only screen and (min-device-width: 320px) and (max-device-width: 480px) and (-webkit-min-device-pixel-ratio: 2) {
|
|
.sample pre {
|
|
width: 100%;
|
|
}
|
|
}
|
|
.sample code {
|
|
width: 495px;
|
|
}
|
|
@media only screen and (min-device-width: 320px) and (max-device-width: 480px) and (-webkit-min-device-pixel-ratio: 2) {
|
|
.sample code {
|
|
width: 100%;
|
|
margin: 0 auto;
|
|
word-wrap: break-word;
|
|
padding: 0;
|
|
}
|
|
}
|
|
.sample hr {
|
|
border: none;
|
|
border-top: 1px solid #777777;
|
|
width: 80%;
|
|
margin: 0 auto;
|
|
padding: 15px 0;
|
|
}
|
|
.sample .readmoreBtn {
|
|
margin-left: 10px;
|
|
padding-bottom: 20px;
|
|
}
|
|
.readMore {
|
|
background: #f9f9f9;
|
|
padding-bottom: 50px;
|
|
}
|
|
.learnMore {
|
|
background: #326eeb;
|
|
text-align: center;
|
|
position: relative;
|
|
padding: 120px 0;
|
|
}
|
|
@media only screen and (min-device-width: 320px) and (max-device-width: 480px) and (-webkit-min-device-pixel-ratio: 2) {
|
|
.learnMore {
|
|
padding: 70px 0;
|
|
}
|
|
}
|
|
.learnMore h4.subtitle {
|
|
padding: 0;
|
|
margin-bottom: 30px;
|
|
}
|
|
.learnMore .btnWrapper {
|
|
text-align: center;
|
|
}
|