Skip to content

W
www.fudou6.com
Commit 0d2bf917 authored by liaili's avatar liaili
Browse files
Options

Merge branch 'express' of http://gitlab.yanky.cn/liaili/www.fudou6.com into express 

# Conflicts:
#	public/stylesheets/index.less
parents 69908ba1 23c3773f
Show whitespace changes
Inline Side-by-side
Showing with 254 additions and 45 deletions
public/stylesheets/index.css
View file @ 0d2bf917
......@@ -6,7 +6,7 @@
padding-bottom: 160px;
}
.banner .banner-box {
width: 1000px;
width: 1150px;
margin: 0 auto;
color: #fff;
}
......@@ -26,7 +26,7 @@
.download {
position: relative;
padding-top: 400px;
width: 1000px;
width: 1150px;
margin: 0 auto;
}
.download .android,
......@@ -85,7 +85,7 @@
/*download end*/
/*character begin*/
.character ul {
width: 1000px;
width: 1150px;
margin: 80px auto;
}
.character ul li {
......@@ -137,8 +137,8 @@
}
.projects > header > div:first-child > div {
position: relative;
width: 300px;
margin-right: 200px;
width: 337.5px;
margin-right: 237.5px;
float: right;
height: 300px;
}
......@@ -157,8 +157,8 @@
}
.projects > header > div:last-child > div {
position: relative;
width: 700px;
margin-left: -200px;
width: 812.5px;
margin-left: -237.5px;
background-color: #2e2e2e;
height: 300px;
}
......@@ -174,12 +174,12 @@
background: url(/images/index/icon_02.jpg) no-repeat left bottom;
}
.projects > section {
width: 1000px;
width: 1150px;
height: 500px;
margin: 0 auto;
}
.projects > section > div:first-child {
width: 379px;
width: 454px;
float: left;
margin-top: 50px;
margin-left: 20px;
......@@ -200,7 +200,7 @@
top: -3px;
}
.projects > section > div:last-child {
width: 600px;
width: 675px;
float: left;
position: relative;
}
......@@ -218,7 +218,7 @@
background-color: #f6f6f6;
}
.products ul {
width: 1000px;
width: 1150px;
margin: 0 auto;
padding-bottom: 50px;
}
......@@ -237,14 +237,14 @@
}
.products ul li:nth-child(1) > div:first-child,
.products ul li:nth-child(2) > div:first-child {
width: 656.66666667px;
width: 756.66666667px;
margin-right: 30px;
-webkit-background-size: cover;
background-size: cover;
}
.products ul li:nth-child(1) > div:last-child,
.products ul li:nth-child(2) > div:last-child {
width: 313.33333333px;
width: 363.33333333px;
background-color: #2e2e2e;
text-align: center;
}
......@@ -284,7 +284,7 @@
}
.products ul li:nth-child(n+3) {
float: left;
width: 313.33333333px;
width: 363.33333333px;
height: 400px;
position: relative;
margin-right: 30px;
......@@ -317,7 +317,7 @@
margin-bottom: 24px;
position: absolute;
left: 0;
top: 72px;
top: 63px;
}
.products ul li:nth-child(n+3) > div:last-child > div:nth-child(3) span {
width: 33%;
......@@ -341,3 +341,132 @@
color: #fff;
}
/*product end*/
@media screen and (min-width: 769px) {
body .banner .banner-box {
width: 990px;
}
body .download {
width: 990px;
}
body .character ul {
width: 990px;
}
body .projects > header > div:first-child > div {
width: 297.5px;
margin-right: 197.5px;
}
body .projects > header > div:last-child > div {
width: 692.5px;
margin-left: -197.5px;
}
body .projects > section {
width: 990px;
}
body .projects > section > div:first-child {
width: 374px;
}
body .projects > section > div:last-child {
width: 595px;
}
body .products ul {
width: 990px;
}
body .products ul li:nth-child(1) > div:first-child,
body .products ul li:nth-child(2) > div:first-child {
width: 650px;
margin-right: 30px;
}
body .products ul li:nth-child(1) > div:last-child,
body .products ul li:nth-child(2) > div:last-child {
width: 310px;
}
body .products ul li:nth-child(n+3) {
width: 310px;
}
}
@media screen and (min-width: 1281px) {
body .banner .banner-box {
width: 1150px;
}
body .download {
width: 1150px;
}
body .character ul {
width: 1150px;
}
body .projects > header > div:first-child > div {
width: 337.5px;
margin-right: 237.5px;
}
body .projects > header > div:last-child > div {
width: 812.5px;
margin-left: -237.5px;
}
body .projects > section {
width: 1150px;
}
body .projects > section > div:first-child {
width: 454px;
}
body .projects > section > div:last-child {
width: 675px;
}
body .products ul {
width: 1150px;
}
body .products ul li:nth-child(1) > div:first-child,
body .products ul li:nth-child(2) > div:first-child {
width: 756.66666667px;
margin-right: 30px;
}
body .products ul li:nth-child(1) > div:last-child,
body .products ul li:nth-child(2) > div:last-child {
width: 363.33333333px;
}
body .products ul li:nth-child(n+3) {
width: 363.33333333px;
}
}
@media screen and (min-width: 1441px) {
body .banner .banner-box {
width: 1360px;
}
body .download {
width: 1360px;
}
body .character ul {
width: 1360px;
}
body .projects > header > div:first-child > div {
width: 390px;
margin-right: 290px;
}
body .projects > header > div:last-child > div {
width: 970px;
margin-left: -290px;
}
body .projects > section {
width: 1360px;
}
body .projects > section > div:first-child {
width: 559px;
}
body .projects > section > div:last-child {
width: 780px;
}
body .products ul {
width: 1360px;
}
body .products ul li:nth-child(1) > div:first-child,
body .products ul li:nth-child(2) > div:first-child {
width: 896.66666667px;
margin-right: 30px;
}
body .products ul li:nth-child(1) > div:last-child,
body .products ul li:nth-child(2) > div:last-child {
width: 433.33333333px;
}
body .products ul li:nth-child(n+3) {
width: 433.33333333px;
}
}
public/stylesheets/index.less
View file @ 0d2bf917
......@@ -249,10 +249,8 @@
height: 400px;
float: left;
&:first-child {
//width: (@container-width + 30)/3*2-30;
//margin-right: 30px;
.cwidth(@container-width);
width: (@container-width + 30)/3*2-30;
margin-right: 30px;
-webkit-background-size: cover;
background-size: cover;
......@@ -309,7 +307,7 @@
background-size: cover;
}
}
& >div:last-child {
& > div:last-child {
position: relative;
h3 {
font-size: 25px;
......@@ -325,7 +323,7 @@
margin-bottom: 24px;
position: absolute;
left: 0;
top:72px;
top: 63px;
span {
width: 33%;
display: block;
......@@ -338,9 +336,9 @@
}
}
& > div:last-child {
position:absolute;
top:160px;
left:0;
position: absolute;
top: 160px;
left: 0;
width: 100%;
text-align: center;
font-size: 24px;
......@@ -352,16 +350,15 @@
}
}
}
}
}
/*product end*/
.screen() {
.media(1281px, 1000px);
.media(1441px, 1200px);
.media(@screen-width-small, @container-width-small);
.media(@screen-width, @container-width);
.media(@screen-width-large, @container-width-large);
}
.media(@sw, @cw) {
......@@ -371,6 +368,51 @@
}
.rules(@container-width) {
.banner {
.banner-box {
width: @container-width;
}
}
.download {
width: @container-width;
}
.character {
ul {
width: @container-width;
}
}
.projects {
& > header {
& > div {
&:first-child {
& > div {
width: @container-width/4 + 50;
margin-right: @container-width/4 - 50;
}
}
&:last-child {
& > div {
width: @container-width / 4 * 3 - 50;
margin-left: -@container-width/4 + 50;
}
}
}
}
& > section {
width: @container-width;
& > div {
&:first-child {
width: @container-width/2-121;
}
&:last-child {
width: @container-width/2+100;
}
}
}
}
.products {
ul {
width: @container-width;
......@@ -379,7 +421,8 @@
&:nth-child(2) {
& > div {
&:first-child {
.cwidth(@container-width);
width: (@container-width + 30)/3*2-30;
margin-right: 30px;
}
&:last-child {
width: (@container-width + 30)/3-30;
......@@ -393,3 +436,7 @@
}
}
}
body {
.screen();
}
\ No newline at end of file
public/stylesheets/style.css
View file @ 0d2bf917
......@@ -455,7 +455,7 @@ hr.line-separate:after {
}
/*header begin*/
#header .container {
width: 1000px;
width: 1150px;
margin: 0 auto;
position: relative;
}
......@@ -466,13 +466,13 @@ hr.line-separate:after {
z-index: 999;
}
#header nav {
padding-left: 250px;
padding-left: 287.5px;
font-size: 16px;
}
#header nav span {
float: left;
padding: 20px 0 10px;
margin-right: 30px;
margin-right: 34.84848485px;
}
#header nav span:last-child {
margin-right: 0;
......@@ -521,3 +521,27 @@ hr.line-separate:after {
color: #fff;
}
/*footer end*/
@media screen and (min-width: 769px) {
body #header .container {
width: 990px;
}
body #header .container nav {
padding-left: 247.5px;
}
}
@media screen and (min-width: 1281px) {
body #header .container {
width: 1150px;
}
body #header .container nav {
padding-left: 287.5px;
}
}
@media screen and (min-width: 1441px) {
body #header .container {
width: 1360px;
}
body #header .container nav {
padding-left: 340px;
}
}
public/stylesheets/style.less
View file @ 0d2bf917
......@@ -67,12 +67,12 @@ hr.line-separate {
z-index: 999;
}
nav {
padding-left: 250px;
padding-left:@container-width / 4;
font-size: 16px;
span {
float: left;
padding: 20px 0 10px;
margin-right: 30px;
margin-right: @container-width / 33; // 30px;
&:last-child {
margin-right: 0;
}
......@@ -89,6 +89,7 @@ hr.line-separate {
}
}
}
}
/*header end*/
......@@ -126,8 +127,9 @@ hr.line-separate {
/*footer end*/
.screen() {
.media(1281px, 1000px);
.media(1441px, 1200px);
.media(@screen-width-small, @container-width-small);
.media(@screen-width, @container-width);
.media(@screen-width-large, @container-width-large);
}
.media(@sw, @cw) {
......@@ -140,6 +142,13 @@ hr.line-separate {
#header {
.container {
width: @container-width;
nav {
padding-left: @container-width / 4;
}
}
}
}
body{
.screen();
}
\ No newline at end of file
public/stylesheets/variable.less
View file @ 0d2bf917
@container-width: 1000px;
@container-width-small: 990px;
@screen-width-small: 769px;
@container-width-max: 1200px;
@container-width: 1150px;
@screen-width:1281px;
@container-width-large: 1360px;
@screen-width-large:1441px;
@container-width-1441: 1400px;
.cwidth(@conWidth){
width:(@conWidth + 30)/3*2-30;
margin-right: 30px;
}
\ No newline at end of file
views/index.hbs
View file @ 0d2bf917
......@@ -19,7 +19,7 @@
下载iPhone版
</a>
<a class="qr-code" href="">
<img src="/images/index/QR_Code.jpg" alt="">
<img src="https://res.fudou6.com/c/4/20160730/e9e5a+M6LGG5LyY5oqV5LiL6L295LqM57u056CB_280x280.png" width="124" alt="">
<span>扫描下载富豆APP</span>
</a>
<img class="app-screen" src="/images/index/iphone.png" alt="app screen">
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment