fe / YOHOOD · Commits

Go to a project

Authored by microTT
Commit a33e6d3b5916c490f391ba66e24d8fd6c2afcc68 1 parent 4cc915d8

删除3.0 sass文件，直接在原sass文件上修改

Inline Side-by-side
Showing 24 changed files with 152 additions and 2353 deletions
... ... @@ -3,7 +3,7 @@
<head>
<meta charset="UTF-8">
<title>Activity</title>
<link rel="stylesheet" href="../../res/css/index3.0.css"/>
<link rel="stylesheet" href="../../res/css/index.css"/>
</head>
<body>
<div class="yoho-nav clearfix">
... ...
... ... @@ -3,7 +3,7 @@
<head>
<meta charset="UTF-8">
<title>Brands</title>
<link rel="stylesheet" href="../../res/css/index3.0.css"/>
<link rel="stylesheet" href="../../res/css/index.css"/>
</head>
<body>
<div class="yoho-nav clearfix">
... ...
... ... @@ -3,7 +3,7 @@
<head>
<meta charset="UTF-8">
<title>Home</title>
<link rel="stylesheet" href="../../res/css/index3.0.css"/>
<link rel="stylesheet" href="../../res/css/index.css"/>
</head>
<body>
<div class="yoho-nav clearfix">
... ...
... ... @@ -3,7 +3,7 @@
<head>
<meta charset="UTF-8">
<title>detail</title>
<link rel="stylesheet" href="../../res/css/index3.0.css"/>
<link rel="stylesheet" href="../../res/css/index.css"/>
</head>
<body>
<div class="yoho-nav clearfix">
... ...
... ... @@ -4,7 +4,7 @@
<head>
<meta charset="UTF-8">
<title>Home</title>
<link rel="stylesheet" href="../../res/css/index3.0.css" />
<link rel="stylesheet" href="../../res/css/index.css" />
</head>
<body>
... ... @@ -138,6 +138,7 @@
<a href="javascript:;">
<img src="http://img02.res.yoho.cn/blogimg/2014/10/23/17/020aba6cb71b6620e4e8dd50658a1daf03.jpg" alt="">
</a>
<span class="play-icon"></span>
</div>
<div class="item-info">
<a class="fluid-tag item-tag activity-intro" href="javascript:;">活动介绍</a>
... ... @@ -321,7 +322,6 @@
</div>
</div>
</div>
<div id="pageContent" style="text-align: center;" class="pagination">
<div class="pagination-inner" id="img_page" model="default" rel="">
<a class="current" p="1">1</a>
... ... @@ -399,14 +399,14 @@
</div>
</div>
</div>
</div>
<div class="cooperation-slide-control">
<a class="cooperation-slide-prev iconfont" href="javascript:void(0);">&#xe600;</a>
<a class="cooperation-slide-next iconfont" href="javascript:void(0);">&#xe602;</a>
<div class="cooperation-slide-control">
<a class="cooperation-slide-prev iconfont" href="javascript:void(0);">&#xe600;</a>
<a class="cooperation-slide-next iconfont" href="javascript:void(0);">&#xe602;</a>
</div>
</div>
</div>
</div>
<div id="right_banner" style="display:none;" num="3">
<!-- <div id="right_banner" style="display:none;" num="3">
<div class="fluid-item layout-item tiled">
<div class="image-box" style="padding-bottom: 30px;">
<a href="http://www.baidu.com" target="_blank" style="height:411px;width:308px;overflow:hidden;">
... ... @@ -419,9 +419,8 @@
</a>
</div>
</div>
</div>
</div> -->
<div class="ft">
</div>
<div class="return-top">
<a href="javascript:void(0);" id="toTop" class="ifont" style="display: inline;">
... ...
... ... @@ -3,7 +3,7 @@
<head>
<meta charset="UTF-8">
<title>News</title>
<link rel="stylesheet" href="../../res/css/index3.0.css"/>
<link rel="stylesheet" href="../../res/css/index.css"/>
</head>
<body>
<div class="yoho-nav clearfix">
... ...
... ... @@ -3,7 +3,7 @@
<head>
<meta charset="UTF-8">
<title>Activity</title>
<link rel="stylesheet" href="../../res/css/index3.0.css"/>
<link rel="stylesheet" href="../../res/css/index.css"/>
</head>
<body>
<div class="sh-hd"></div>
... ...
... ... @@ -3,7 +3,7 @@
<head>
<meta charset="UTF-8">
<title>show</title>
<link rel="stylesheet" href="../../res/css/index3.0.css"/>
<link rel="stylesheet" href="../../res/css/index.css"/>
</head>
<body>
<div class="yoho-nav clearfix">
... ...
... ... @@ -3,7 +3,7 @@
<head>
<meta charset="UTF-8">
<title>video</title>
<link rel="stylesheet" href="../../res/css/index3.0.css"/>
<link rel="stylesheet" href="../../res/css/index.css"/>
</head>
<body>
<div class="yoho-nav clearfix">
... ...
@charset "utf-8";
@import "_base";
@import "style3.0/_common3.0";
@import "style3.0/_home3.0";
@import "style3.0/_activity3.0";
@import "style3.0/_news3.0";
@import "style3.0/_brand3.0";
@import "style3.0/_video3.0";
@import "style3.0/_site-activity3.0";
@import "style3.0/_show3.0";
@import "style3.0/_detail3.0";
@import "style3.0/_other3.0";
@import "style3.0/_shanghai3.0";
// 表单提交
@import "style3.0/submit3.0";
\ No newline at end of file
$pageMainWidth: 1180px;
.yoho-nav {
width: 100%;
height: 34px;
... ... @@ -68,13 +69,13 @@
@keyframes rainbow {
90% {
border-radius: 50%;
width: 144px;
width: $pageMainWidth / 6;
height: 144px;
margin: -50px 0 0 -16px;
}
100% {
border-radius: 0;
width: 122px;
width: $pageMainWidth / 6;
height: 44px;
top: 0;
left: 0;
... ... @@ -82,17 +83,16 @@
}
}
@-webkit-keyframes rainbow {
90% {
border-radius: 50%;
width: 144px;
width: $pageMainWidth / 6;
height: 144px;
margin: -50px 0 0 -16px;
}
100% {
border-radius: 0;
width: 126px;
width: $pageMainWidth / 6;
height: 44px;
top: 0;
left: 0;
... ... @@ -100,17 +100,16 @@
}
}
@-moz-keyframes rainbow {
90% {
border-radius: 50%;
width: 144px;
width: $pageMainWidth / 6;
height: 144px;
margin: -50px 0 0 -16px;
}
100% {
border-radius: 0;
width: 126px;
width: $pageMainWidth / 6;
height: 44px;
top: 0;
left: 0;
... ... @@ -118,17 +117,16 @@
}
}
@-ms-keyframes rainbow {
90% {
border-radius: 50%;
width: 144px;
width: $pageMainWidth / 6;
height: 144px;
margin: -50px 0 0 -16px;
}
100% {
border-radius: 0;
width: 126px;
width: $pageMainWidth / 6;
height: 44px;
top: 0;
left: 0;
... ... @@ -136,17 +134,16 @@
}
}
@keyframes rainbow {
90% {
border-radius: 50%;
width: 144px;
width: $pageMainWidth / 6;
height: 144px;
margin: -50px 0 0 -16px;
}
100% {
border-radius: 0;
width: 126px;
width: $pageMainWidth / 6;
height: 44px;
top: 0;
left: 0;
... ... @@ -154,24 +151,24 @@
}
}
.nav {
border-top: 2px solid #000;
border-bottom: 2px solid #000;
border-top: 1px solid #000;
border-bottom: 1px solid #000;
overflow: hidden;
ul {
width: 980px;
width: $pageMainWidth;
$navItemWidth: $pageMainWidth / 6;
margin: 0 auto;
li {
position: relative;
float: left;
line-height: 44px;
height: 44px;
width: 122px;
width: $navItemWidth;
em {
position: relative;
z-index: 10;
width: 122px;
width: $navItemWidth;
display: none;
font-size: 14px;
color: #fff;
... ... @@ -201,7 +198,8 @@
z-index: 9;
}
}
li.animate, li.current {
li.animate,
li.current {
span {
display: none;
}
... ... @@ -240,12 +238,14 @@
}
.slide-main {
width: $pageMainWidth;
margin: 0 auto;
position: relative;
}
.slide-box {
position: relative;
margin: 16px 0 0 0;
margin: 0;
overflow: hidden;
.slide-wrap {
height: 468px;
... ... @@ -267,7 +267,7 @@
position: absolute;
left: 0;
right: 0;
bottom: -32px;
bottom: 10px;
text-align: center;
.dib {
display: inline-block;
... ... @@ -299,16 +299,16 @@
top: 50%;
margin: -28px 0 0 0;
font-size: 48px;
color: #000;
color: #FFF;
&:focus {
outline: none;
}
}
.slide-prev {
left: -70px;
left: 70px;
}
.slide-next {
right: -70px;
right: 70px;
}
}
... ... @@ -346,14 +346,20 @@
}
.main-layout {
width: 1008px;
$mainLayoutWidth: $pageMainWidth;
$layoutItemWidth: 342px;
margin: 0 auto;
.layout-item {
float: left;
width: 308px;
margin: 0 28px 26px 0;
overflow: hidden;
width: $layoutItemWidth;
height: 420px;
margin: 0 floor(($mainLayoutWidth - $layoutItemWidth * 3) / 6) 26px;
.image-box {
position: relative;
overflow: hidden;
width: 342px;
height: 218px;
a {
img {
display: block;
... ... @@ -364,19 +370,6 @@
outline: none;
}
}
.item-tag {
position: absolute;
display: block;
width: auto;
height: auto;
bottom: 0;
left: 0;
padding: 0 11px;
background: #000;
line-height: 26px;
font-size: 14px;
color: #fff;
}
.play-icon {
position: absolute;
width: 50px;
... ... @@ -391,9 +384,43 @@
background: url("../images/yohood/play-small.png");
}
}
.item-info {
$itemInfoHeight: 20px;
height: $itemInfoHeight;
line-height: $itemInfoHeight;
margin: 26px 0 0;
.item-tag {
display: inline-block;
width: auto;
height: auto;
padding: 0 11px;
background: #000;
line-height: $itemInfoHeight;
color: #fff;
}
.brand-info {
background: #1a72ff;
}
.activity-intro {
background-color: #ffc000;
}
.spotlight-activity {
background-color: #ff365c;
}
.limited-edition {
background-color: #21dbcc;
}
.item-time {
float: right;
margin: 0;
color: #b2b2b2;
font-size: 12px;
background: #fff;
}
}
.content {
margin: 26px 0 0 0;
h2 {
margin: 15px 0 0 0;
a {
line-height: 24px;
font-size: 20px;
... ... @@ -408,18 +435,12 @@
color: #000;
}
p {
margin: 8px 0 0 0;
margin: 24px 0 0 0;
font-size: 14px;
color: #000;
line-height: 20px;
word-wrap: break-word;
}
.time {
margin: 0;
color: #b2b2b2;
font-size: 12px;
background: #fff;
}
}
}
}
... ... @@ -433,11 +454,13 @@
zoom: 1;
a {
float: left;
width: 36px;
margin: 0 10px 0;
width: 30px;
height: 30px;
line-height: 30px;
font-size: 14px;
color: #999997;
border: 1px solid #000;
&:focus {
outline: none;
}
... ... @@ -635,7 +658,7 @@
bottom: 0;
background: rgba(0, 0, 0, 0.5);
background: #000 \9;
filter: alpha(opacity = 50) \9;
filter: alpha(opacity=50) \9;
width: 100% \9;
height: 100% \9;
z-index: 101;
... ... @@ -696,4 +719,4 @@
.ft {
width: 100%;
}
\ No newline at end of file
}
... ...
$pageMainWidth: 1180px;
.bd {
width: 980px;
// width: 1180px;
margin: 0 auto;
}
... ... @@ -8,51 +9,70 @@
margin: 0 auto;
}
.slide-main {
position: relative;
}
.slide-control {
a {
position: absolute;
top: 50%;
margin: -28px 0 0 0;
font-size: 48px;
color: #000;
}
.slide-prev {
left: -70px;
}
.slide-next {
right: -70px;
}
}
// .slide-main {
// width: 1180px;
// margin: 0 auto;
// position: relative;
// }
// .slide-control {
// a {
// position: absolute;
// top: 50%;
// margin: -28px 0 0 0;
// font-size: 48px;
// color: #000;
// }
// .slide-prev {
// left: -70px;
// }
// .slide-next {
// right: -70px;
// }
// }
.content-wrap {
margin: 50px 0 30px;
width: 1180px;
margin: 50px auto 30px;
}
.cooperation {
position: relative;
margin: 43px 0;
height: 118px;
border: 1px solid #000;
}
.cooperation-slide-box {
position: relative;
width: 800px;
margin: 0 auto;
height: 90px;
padding: 28px 0 0 0;
overflow: hidden;
.slide-wrap {
margin: 50px 0;
height: 240px;
background: #f5f5f5;
.cooperation-slide-box {
position: relative;
width: $pageMainWidth;
margin: 0 auto;
// height: 90px;
padding: 28px 0 0 0;
overflow: hidden;
.box {
.slide-wrap {
position: relative;
float: left;
width: 800px;
overflow: hidden;
.box {
position: relative;
float: left;
width: 800px;
}
}
.cooperation-slide-control {
a {
position: absolute;
top: 50%;
margin-top: -16px;
color: #000;
font-size: 26px;
}
.cooperation-slide-prev {
left: -20px;
}
.cooperation-slide-next {
right: -20px;
}
.disable {
color: #d9d9d9;
cursor: default;
}
}
}
}
... ... @@ -86,7 +106,8 @@
}
}
}
.partner ul, .media ul {
.partner ul,
.media ul {
li {
width: 115px;
a {
... ... @@ -95,23 +116,3 @@
}
}
}
.cooperation-slide-control {
a {
position: absolute;
top: 50%;
margin-top: -16px;
color: #000;
font-size: 26px;
}
.cooperation-slide-prev {
left: 20px;
}
.cooperation-slide-next {
right: 20px;
}
.disable {
color: #d9d9d9;
cursor: default;
}
}
\ No newline at end of file
... ...
.activity-main {
margin: 30px 0 50px 0;
}
.activity-content {
display: none;
&:first-child {
display: block;
}
&.current {
display: block;
}
}
.activity-content .section {
width: 820px;
text-align: center;
margin: 0 auto 20px;
p {
text-align: left;
font-size: 14px;
line-height: 18px;
color: #000;
}
h4 {
text-align: left;
font-weight: bold;
}
}
.video-wrap {
.layout-item {
height: 362px;
margin: 0 28px 0 0;
.image-box {
height: 198px;
overflow: hidden;
img {
width: 100%;
height: 100%;
}
}
}
}
.activity-cooperation .section {
text-align: left;
margin: 0 0 12px 0;
h2 {
color: #000;
line-height: 20px;
font-size: 18px;
font-weight: bold;
}
}
.contant-tab {
margin: 30px 0 0 0;
text-align: center;
ul {
display: inline-block;
li {
float: left;
margin-left: 18px;
a {
display: block;
padding: 0 10px;
line-height: 30px;
color: #000;
border: 2px solid #7e7e7e;
border-radius: 2px;
font-size: 14px;
}
}
&:first-child {
margin-left: 0;
}
li.current a {
background: #000;
color: #fff;
}
}
}
\ No newline at end of file
.brand-main {
margin: 50px 0;
}
.search-wrap {
position: relative;
width: 306px;
height: 36px;
margin: 0 auto;
padding: 0;
line-height: 36px;
input {
width: 260px;
height: 36px;
line-height: 36px\9;
padding: 0 36px 0 10px;
margin: 0;
border: none;
background: url("../images/yohood/search-bg.png");
outline: none;
}
.search-btn {
position: absolute;
top: 0px;
right: 10px;
color: #000;
font-weight: bold;
&:focus {
outline: none;
}
}
}
.brand-content {
margin: 38px 0 0 0;
.no-search {
display: none;
margin: 100px 0 120px 0;
text-align: center;
line-height: 22px;
font-size: 16px;
a {
font-size: 16px;
color: #000;
&:hover {
text-decoration: underline;
}
}
}
}
.brand-list {
li {
float: left;
}
}
.brand-introduction {
display: none;
position: fixed;
width: 644px;
max-height: 560px;
top: 50%;
left: 50%;
margin: -288px 0 0 -352px;
padding: 16px 30px 0;
z-index: 102;
background: #fff;
h2 {
font-size: 18px;
color: #000;
line-height: 20px;
}
.brand-info {
margin: 20px 0 0 0;
padding-bottom: 20px;
border-bottom: 1px solid #e0e0e0;
.pic {
float: left;
width: 200px;
height: 200px;
overflow: hidden;
margin-top: 6px;
img {
width: 100%;
}
}
.text {
float: left;
margin: 0 0 0 29px;
p {
width: 414px;
max-height: 192px;
overflow-x: hidden;
overflow-y: auto;
margin: 0;
line-height: 24px;
font-size: 14px;
}
a {
display: block;
width: 94px;
height: 33px;
margin-top: 15px;
padding-left: 34px;
line-height: 35px;
border: 1px solid #000;
border-radius: 4px;
background: #fff;
color: #000;
background: url("../images/yohood/enter-store.png") no-repeat 10px center;
}
}
}
.brand-close-btn {
position: absolute;
color: #b2b2b2;
top: 10px;
right: 10px;
}
}
.related-post {
h3 {
margin-top: 20px;
line-height: 22px;
font-size: 18px;
}
.post-list {
margin-top: 17px;
width: 666px;
.layout-item {
float: left;
width: 200px;
margin-right: 22px;
.image-box {
height: 128px;
overflow: hidden;
a{
display: table-cell;
width: 200px;
height: 128px;
vertical-align: middle;
img{
margin: 0 auto;
}
}
}
.content {
h2 {
margin: 8px 0 0 0;
line-height: 20px;
a {
font-size: 14px;
font-weight: normal;
}
}
}
}
}
}
\ No newline at end of file
$pageMainWidth: 1180px;
.yoho-nav {
width: 100%;
height: 34px;
line-height: 34px;
background: #f4f4f4;
border-bottom: 1px solid #d8d8d8;
ul {
float: left;
padding-left: 10px;
li {
float: left;
position: relative;
width: 100px;
cursor: pointer;
span {
display: block;
width: 100%;
height: 100%;
line-height: 37px;
text-align: center;
}
a {
width: 100%;
height: 100%;
text-align: center;
color: #000000;
line-height: 37px;
display: none;
&:focus {
outline: none;
}
}
}
li.current {
height: 35px;
line-height: 35px;
border-right: 1px solid #d8d8d8;
border-left: 1px solid #d8d8d8;
background: #fff;
}
li:hover {
span {
display: none;
}
a {
display: block;
}
}
}
.contact-btn {
float: right;
margin: 0 15px;
color: #aaaaaa;
}
}
.header {
width: 100%;
padding: 14px 0 0 0;
}
.logo {
margin: 0 0 21px 0;
height: 88px;
background: url("../images/yohood/logo.png") no-repeat center center;
}
@keyframes rainbow {
90% {
border-radius: 50%;
width: $pageMainWidth / 6;
height: 144px;
margin: -50px 0 0 -16px;
}
100% {
border-radius: 0;
width: $pageMainWidth / 6;
height: 44px;
top: 0;
left: 0;
margin: 0;
}
}
@-webkit-keyframes rainbow {
90% {
border-radius: 50%;
width: $pageMainWidth / 6;
height: 144px;
margin: -50px 0 0 -16px;
}
100% {
border-radius: 0;
width: $pageMainWidth / 6;
height: 44px;
top: 0;
left: 0;
margin: 0;
}
}
@-moz-keyframes rainbow {
90% {
border-radius: 50%;
width: $pageMainWidth / 6;
height: 144px;
margin: -50px 0 0 -16px;
}
100% {
border-radius: 0;
width: $pageMainWidth / 6;
height: 44px;
top: 0;
left: 0;
margin: 0;
}
}
@-ms-keyframes rainbow {
90% {
border-radius: 50%;
width: $pageMainWidth / 6;
height: 144px;
margin: -50px 0 0 -16px;
}
100% {
border-radius: 0;
width: $pageMainWidth / 6;
height: 44px;
top: 0;
left: 0;
margin: 0;
}
}
@keyframes rainbow {
90% {
border-radius: 50%;
width: $pageMainWidth / 6;
height: 144px;
margin: -50px 0 0 -16px;
}
100% {
border-radius: 0;
width: $pageMainWidth / 6;
height: 44px;
top: 0;
left: 0;
margin: 0;
}
}
.nav {
border-top: 1px solid #000;
border-bottom: 1px solid #000;
overflow: hidden;
ul {
width: $pageMainWidth;
$navItemWidth: $pageMainWidth / 6;
margin: 0 auto;
li {
position: relative;
float: left;
line-height: 44px;
height: 44px;
width: $navItemWidth;
em {
position: relative;
z-index: 10;
width: $navItemWidth;
display: none;
font-size: 14px;
color: #fff;
font-weight: normal;
font-style: normal;
&:focus {
outline: none;
}
}
span {
display: block;
text-align: center;
font-size: 14px;
color: #000;
}
i {
display: none;
position: absolute;
top: 50%;
left: 50%;
width: 44px;
height: 44px;
margin-left: -22px;
margin-top: -22px;
border-radius: 50%;
background: #000;
z-index: 9;
}
}
li.animate,
li.current {
span {
display: none;
}
}
li.current {
em {
display: block;
background: #000;
text-align: center;
}
i {
display: none;
}
}
li.animate em {
display: block;
text-align: center;
margin: 0 auto;
}
li.animate i {
display: block;
animation: .5s rainbow forwards;
-webkit-animation: .5s rainbow forwards;
-moz-animation: .5s rainbow forwards;
-ms-animation: .5s rainbow forwards;
width: 122px\9;
margin-left: 0\9;
left: 0\9;
width: 122px\0;
margin-left: 0\0;
left: 0\0;
border-radius: 0\0;
/* -webkit-transition: all 1s 1s; */
}
}
}
.slide-main {
width: $pageMainWidth;
margin: 0 auto;
position: relative;
}
.slide-box {
position: relative;
margin: 0;
overflow: hidden;
.slide-wrap {
height: 468px;
overflow: hidden;
position: relative;
.box {
float: left;
width: 100%;
position: relative;
img {
display: block;
width: 100%;
}
}
}
}
.slide-navigator {
position: absolute;
left: 0;
right: 0;
bottom: 10px;
text-align: center;
.dib {
display: inline-block;
*display: inline !important;
zoom: 1;
a {
float: left;
width: 11px;
height: 11px;
margin: 0 10px 0 0;
background-image: url("../images/yohood/greydot-2x.png");
background-image: url("../images/yohood/greydot.png") \9;
background-size: 100% 100%;
&:focus {
outline: none;
}
}
.on {
background-image: url("../images/yohood/blackdot-2x.png");
background-image: url("../images/yohood/blackdot.png") \9;
background-size: 100% 100%;
}
}
}
.slide-control {
a {
position: absolute;
top: 50%;
margin: -28px 0 0 0;
font-size: 48px;
color: #FFF;
&:focus {
outline: none;
}
}
.slide-prev {
left: 70px;
}
.slide-next {
right: 70px;
}
}
.content-tab {
margin: 30px 0 0 0;
text-align: center;
ul {
display: inline-block;
*display: inline !important;
*zoom: 1;
li {
float: left;
margin-left: 18px;
a {
display: block;
padding: 0 10px;
line-height: 30px;
color: #000;
border: 1px solid #000;
border-radius: 2px;
font-size: 14px;
&:focus {
outline: none;
}
}
}
&:first-child {
margin-left: 0;
}
li.current a {
background: #000;
color: #fff;
}
}
}
.main-layout {
$mainLayoutWidth: $pageMainWidth;
$layoutItemWidth: 342px;
margin: 0 auto;
.layout-item {
float: left;
overflow: hidden;
width: $layoutItemWidth;
height: 420px;
margin: 0 floor(($mainLayoutWidth - $layoutItemWidth * 3) / 6) 26px;
.image-box {
position: relative;
overflow: hidden;
width: 342px;
height: 218px;
a {
img {
display: block;
margin: 0 auto;
max-width: 100%;
}
&:focus {
outline: none;
}
}
.play-icon {
position: absolute;
width: 50px;
height: 43px;
background: url("../images/yohood/play.png");
background-size: 100% 100%;
left: 50%;
top: 50%;
margin: -22px 0 0 -25px;
}
.play-icon.small {
background: url("../images/yohood/play-small.png");
}
}
.item-info {
$itemInfoHeight: 20px;
height: $itemInfoHeight;
line-height: $itemInfoHeight;
margin: 26px 0 0;
.item-tag {
display: inline-block;
width: auto;
height: auto;
padding: 0 11px;
background: #000;
line-height: $itemInfoHeight;
color: #fff;
}
.brand-info {
background: #1a72ff;
}
.activity-intro {
background-color: #ffc000;
}
.spotlight-activity {
background-color: #ff365c;
}
.limited-edition {
background-color: #21dbcc;
}
.item-time {
float: right;
margin: 0;
color: #b2b2b2;
font-size: 12px;
background: #fff;
}
}
.content {
margin: 26px 0 0 0;
h2 {
a {
line-height: 24px;
font-size: 20px;
font-weight: bold;
color: #000;
&:focus {
outline: none;
}
}
}
a {
color: #000;
}
p {
margin: 24px 0 0 0;
font-size: 14px;
color: #000;
line-height: 20px;
word-wrap: break-word;
}
}
}
}
.pagination {
margin: 30px 0 0;
text-align: center;
.pagination-inner {
display: inline-block;
*display: inline !important;
zoom: 1;
a {
float: left;
margin: 0 10px 0;
width: 30px;
height: 30px;
line-height: 30px;
font-size: 14px;
color: #999997;
border: 1px solid #000;
&:focus {
outline: none;
}
}
.current {
background: #000;
color: #fff;
border-radius: 2px;
}
}
}
.cooperation-list {
width: 1005px;
margin: 12px 0 0 0;
li {
float: left;
margin: 0 27px 27px 0;
a {
display: block;
&:focus {
outline: none;
}
}
.img-box {
width: 172px;
height: 116px;
overflow: hidden;
border: 1px solid #e0e0e0;
display: table-cell;
vertical-align: middle;
text-align: center;
&:hover {
border: 1px solid #000;
}
}
p {
margin: 16px 0 0 0;
line-height: 16px;
text-align: center;
color: #000;
}
}
li.current {
.img-box {
border: 1px solid #000;
}
}
}
.limited-goods {
position: relative;
padding: 30px 0 50px 0;
background: #333333;
h2 {
font-size: 24px;
color: #8b8b8b;
font-weight: bold;
text-align: center;
background: url("../images/yohood/limited-line.png") no-repeat center center;
}
}
.limited-slide-box {
position: relative;
width: 944px;
margin: 28px auto 0;
overflow: hidden;
.slide-wrap {
position: relative;
overflow: hidden;
}
.box {
width: 944px;
position: relative;
float: left;
}
}
.goods-list {
float: left;
width: 992px;
background: #333333;
li {
float: left;
width: 150px;
margin: 0 48px 0 0;
.img-box {
position: relative;
height: 200px;
text-align: center;
overflow: hidden;
img {
width: 100%;
}
span {
position: absolute;
left: 0;
bottom: 0;
width: 55px;
height: 25px;
line-height: 25px;
background: #000;
color: #fff;
font-size: 14px;
text-align: center;
}
span.red {
background: #ef3d00;
}
}
.goods-name {
margin: 5px 0 0 0;
line-height: 18px;
font-size: 14px;
color: #ccc;
}
.price {
margin: 6px 0 0 0;
line-height: 18px;
color: #ccc;
font-size: 12px;
.original-price {
color: #999;
text-decoration: line-through;
margin-right: 4px;
}
}
}
}
.limited-slide-control {
position: absolute;
height: 200px;
left: 0;
right: 0;
top: 94px;
a {
position: absolute;
top: 50%;
left: 50%;
font-size: 30px;
color: #ebebeb;
margin-top: -22px;
&:focus {
outline: none;
}
}
.limited-slide-prev {
margin-left: -510px;
}
.limited-slide-next {
margin-left: 480px;
}
.disable {
color: #4a4a4a;
cursor: default;
}
}
.return-top {
position: fixed;
bottom: 440px;
left: 50%;
margin-left: 600px;
a {
color: #000;
}
span {
display: block;
}
}
.img-zoom {
display: none;
position: fixed;
z-index: 102;
left: 50%;
top: 50%;
img {
display: block;
}
}
.img-zoom.show {
display: block;
}
.overlay {
display: none;
position: fixed;
top: 0;
left: 0;
right: 0;
bottom: 0;
background: rgba(0, 0, 0, 0.5);
background: #000 \9;
filter: alpha(opacity=50) \9;
width: 100% \9;
height: 100% \9;
z-index: 101;
}
.overlay.show {
display: block;
}
.share {
position: absolute;
z-index: 99;
left: 50%;
top: 367px;
margin-left: -596px;
h4 {
font-size: 14px;
margin-bottom: 5px;
}
li {
position: relative;
width: 34px;
height: 34px;
margin-bottom: 13px;
img {
display: block;
width: 100%;
}
}
.wx-qrcode-dialog {
display: none;
position: absolute;
background: url("../images/yohood/share-wx-bg.png");
width: 223px;
height: 220px;
left: 50px;
top: -88px;
padding: 12px 0 0 0;
text-align: center;
.wx-popup-hd {
margin-bottom: 5px;
font-size: 16px;
}
.wx-popup-bd {
width: 125px;
height: 125px;
margin: 0 auto;
img {
display: block;
width: 100%;
}
}
.wx-popup-ft {
font-size: 14px;
}
}
}
.ft {
width: 100%;
}
.detail-title {
margin: 48px 0 28px;
width: 644px;
font-size: 28px;
h2, h3 {
line-height: 40px;
font-weight: bold;
}
.time {
font-size: 12px;
color: #b2b2b2;
line-height: 24px;
}
}
.detail-body {
float: left;
width: 644px;
img {
max-width: 100%;
}
}
.detail-slide {
margin-bottom: 20px;
}
.detail-slide-body {
position: relative;
width: 100%;
height: 415px;
overflow: hidden;
.detail-slide-piclist {
height: 415px;
overflow: hidden;
position: relative;
.box {
float: left;
width: 644px;
height: 415px;
line-height: 415px;
position: relative;
background: #000;
text-align: center;
img {
max-width: 100%;
vertical-align: middle;
}
}
}
}
.slide-shadow {
a {
position: absolute;
width: 322px;
top: 0;
bottom: 0;
&:focus {
outline: none;
}
}
.slide-shadow-prev {
left: 0;
}
.slide-shadow-next {
right: 0;
}
}
.detail-slide-big-ctrl {
a {
display: none;
position: absolute;
font-size: 40px;
top: 50%;
color: #fff;
margin-top: -30px;
z-index: 20;
&:focus {
outline: none;
}
}
.slide-big-ctrl-prev {
left: 5px;
}
.slide-big-ctrl-next {
right: 5px;
}
}
.detail-slide-ctrl {
padding: 15px 0 0 0;
width: 100%;
height: 65px;
overflow: hidden;
position: relative;
.detail-slide-ctrl-prev, .detail-slide-ctrl-next {
display: none;
position: absolute;
top: 15px;
width: 30px;
height: 65px;
line-height: 65px;
background: rgba(230, 230, 230, 0.9);
font-size: 18px;
text-align: center;
color: #000;
background: #fff\9;
filter: alpha(opacity = 90);
}
.detail-slide-ctrl-prev {
left: 0;
}
.detail-slide-ctrl-next {
right: 0;
}
}
.detail-slide-ctrl-tabs {
position: relative;
left: 0;
top: 0;
li {
position: relative;
float: left;
padding: 0 0 0 9px;
img {
display: block;
width: 100px;
height: 65px;
}
}
li:first-child {
padding: 0;
}
li:first-child.current, li:first-child.swiper-slide-active {
.border {
left: 0px;
}
}
li.current, li.swiper-slide-active {
.border {
position: absolute;
left: 7px;
right: 0px;
top: 0px;
bottom: 0px;
border: 2px solid #000;
}
.arrow {
position: absolute;
top: -9px;
left: 50%;
margin: 0 0 0 -9px;
width: 0;
height: 0;
border-left: 9px solid transparent;
border-right: 9px solid transparent;
border-bottom: 9px solid black;
}
}
}
.text-body {
margin: 0 0 25px 0;
font-size: 14px;
line-height: 28px;
color: #000;
p {
margin: 0 0 25px;
}
a {
color: #000;
text-decoration: underline;
}
}
.detail-related-post {
h3 {
font-weight: bold;
}
}
.detail-side {
width: 280px;
float: right;
padding-bottom: 62px;
}
.detail-ad {
margin-bottom: 28px;
li {
margin-bottom: 15px;
img {
display: block;
}
}
}
.app-download {
width: 278px;
height: 158px;
border: 1px solid #000;
.qr {
float: left;
margin: 22px 0 0 18px;
width: 114px;
height: 114px;
img {
display: block;
width: 100%;
}
}
.download-text {
float: left;
margin: 20px 0 38px 12px;
width: 108px;
img {
display: block;
width: 50px;
}
p {
font-size: 12px;
color: #666;
}
.yoho-name {
font-size: 18px;
color: #000;
font-weight: bold;
}
}
}
.side-related-post.fix {
position: fixed;
top: 0px;
left: 50%;
width: 280px;
margin-left: 210px;
}
.side-related-tab {
border-bottom: 1px solid #000;
a {
float: left;
width: 140px;
text-align: center;
font-size: 18px;
line-height: 38px;
color: #000;
font-weight: bold;
}
a.current {
border-bottom: 2px solid #000;
}
}
.side-related-list {
display: none;
&.current {
display: block;
}
.layout-item {
float: none;
margin: 20px 0 0 0;
.image-box {
float: left;
width: 82px;
height: 53px;
overflow: hidden;
img {
display: block;
width: 100%;
height: 100%;
}
.play-icon {
width: 20px;
height: 20px;
margin: -10px 0 0 -10px;
}
}
.content {
float: left;
margin-left: 16px;
width: 182px;
h2 {
margin: 0;
a {
font-size: 14px;
font-weight: normal;
line-height: 20px;
}
}
}
}
}
\ No newline at end of file
.bd {
// width: 1180px;
margin: 0 auto;
}
.wrapper {
width: 980px;
margin: 0 auto;
}
// .slide-main {
// width: 1180px;
// margin: 0 auto;
// position: relative;
// }
// .slide-control {
// a {
// position: absolute;
// top: 50%;
// margin: -28px 0 0 0;
// font-size: 48px;
// color: #000;
// }
// .slide-prev {
// left: -70px;
// }
// .slide-next {
// right: -70px;
// }
// }
.content-wrap {
width: 1180px;
margin: 50px auto 30px;
}
.cooperation {
position: relative;
margin: 43px 0;
height: 118px;
border: 1px solid #000;
}
.cooperation-slide-box {
position: relative;
width: 800px;
margin: 0 auto;
height: 90px;
padding: 28px 0 0 0;
overflow: hidden;
.slide-wrap {
position: relative;
overflow: hidden;
.box {
position: relative;
float: left;
width: 800px;
}
}
}
.cooperation {
.partner {
float: left;
margin: 0 50px 0 0;
}
.media {
float: left;
height: 68px;
padding: 0 0 0 50px;
border-left: 1px solid #000;
}
h2 {
font-size: 14px;
line-height: 20px;
}
ul {
li {
float: left;
height: 60px;
width: 132px;
a {
width: 132px;
height: 60px;
display: table-cell;
vertical-align: middle;
text-align: center;
}
}
}
.partner ul, .media ul {
li {
width: 115px;
a {
width: 115px;
}
}
}
}
.cooperation-slide-control {
a {
position: absolute;
top: 50%;
margin-top: -16px;
color: #000;
font-size: 26px;
}
.cooperation-slide-prev {
left: 20px;
}
.cooperation-slide-next {
right: 20px;
}
.disable {
color: #d9d9d9;
cursor: default;
}
}
\ No newline at end of file
.news-tab ul {
li {
margin-left: 8px;
}
}
.news-main {
margin: 30px 0 50px 0;
}
\ No newline at end of file
.contact-us {
padding: 20px 0 30px;
}
.contact-us-section {
text-align: center;
font-size: 16px;
line-height: 28px;
}
\ No newline at end of file
.sh-hd {
height: 500px;
background: url("../images/yohood/sh/img01.jpg") no-repeat center center;
}
.sh-bd {
background: #1f1d1e;
div {
height: 300px;
}
.section1 {
background: url("../images/yohood/sh/img02.jpg") no-repeat center center;
}
.section2 {
background: url("../images/yohood/sh/img03.jpg") no-repeat center center;
}
.section3 {
background: url("../images/yohood/sh/img04.jpg") no-repeat center center;
}
.section4 {
background: url("../images/yohood/sh/img05.jpg") no-repeat center center;
}
.section5 {
background: url("../images/yohood/sh/img06.jpg") no-repeat center center;
}
.section6 {
background: url("../images/yohood/sh/img07.jpg") no-repeat center center;
}
.section7 {
background: url("../images/yohood/sh/img08.jpg") no-repeat center center;
}
.section8 {
background: url("../images/yohood/sh/img09.jpg") no-repeat center center;
}
.section9 {
background: url("../images/yohood/sh/img10.jpg") no-repeat center center;
}
.section10 {
background: url("../images/yohood/sh/img11.jpg") no-repeat center center;
}
.section11 {
background: url("../images/yohood/sh/img12.jpg") no-repeat center center;
}
.section12 {
background: url("../images/yohood/sh/img13.jpg") no-repeat top center;
}
}
\ No newline at end of file
.show-title {
line-height: 98px;
font-size: 32px;
color: #0099bb;
text-align: center;
}
.show-wrap {
padding-bottom: 50px;
.layout-item {
height: 396px;
.image-box {
height: 308px;
overflow: visible;
img {
width: 100%;
height: 100%;
}
}
}
}
.img-zoom {
.close-btn {
position: absolute;
top: 6px;
right: -58px;
width: 27px;
height: 27px;
background-image: url("../images/yohood/close-btn.png");
background-size: 100% 100%;
}
}
.pic-tip {
display: block;
position: absolute;
left: 80px;
top: 80px;
background: rgba(255, 255, 255, 0.9);
color: #009abe;
text-decoration: none;
height: 18px;
line-height: 18px;
padding: 0 5px;
border-radius: 11px;
font-family: 'Helvetica';
font-weight: bold;
box-shadow: 1px 2px 2px rgba(0, 0, 0, 0.5);
background: #fff\9;
filter: alpha(opacity = 90);
white-space: nowrap;
z-index: 1;
cursor: default;
}
.pic-tip:hover {
display: block;
}
.pic-tip:after {
display: none\9;
position: absolute;
content: "";
background-image: url("../images/yohood/vedio-btn.png");
background-repeat: no-repeat;
background-position: 0 -55px;
background-size: 30px 310px;
width: 7px;
height: 5px;
top: 13px;
left: -2px;
}
\ No newline at end of file
.site-activity-date {
margin: 38px 0 0 0;
width: 120px;
line-height: 38px;
font-size: 22px;
color: #000;
border-bottom: 4px solid #000;
text-align: center;
}
.site-activity-content {
float: left;
width: 738px;
}
.site-activity-content .main-layout {
width: auto;
border-left: 2px solid #e0e0e0;
margin-left: 96px;
padding-bottom: 50px;
.layout-section {
width: auto;
position: relative;
padding-top: 84px;
.site-activity-intro {
position: absolute;
top: 28px;
left: 18px;
background: #000;
border-radius: 2px;
padding: 0 15px;
color: #fff;
line-height: 28px;
span {
position: absolute;
left: -6px;
top: 0;
width: 6px;
height: 17px;
background: url("../images/yohood/site-activity-intro-icon.png") no-repeat;
}
}
.site-activity-time {
position: absolute;
color: #000;
left: -98px;
top: 35px;
}
.site-activity-icon {
position: absolute;
width: 10px;
height: 10px;
top: 40px;
left: -6px;
background: url("../images/yohood/site-activity-icon.png") no-repeat;
}
}
}
.site-activity-content .layout-item {
float: none;
width: 630px;
margin: 0 0 0 18px;
.image-box {
float: left;
width: 310px;
height: 174px;
overflow: hidden;
a {
display: table-cell;
width: 310px;
height: 174px;
text-align: center;
vertical-align: middle;
}
}
.content {
float: left;
margin-left: 28px;
width: 290px;
a {
cursor: default;
}
}
}
.site-activity-tab.fix {
position: fixed;
top: 0;
left: 50%;
width: 134px;
margin: 10px 0 0 356px;
}
.site-activity-tab {
float: right;
margin-top: 79px;
h4 {
line-height: 42px;
padding-top: 14px;
border-top: 1px dashed #979797;
font-size: 14px;
text-align: center;
}
li {
width: 130px;
margin-bottom: 18px;
line-height: 42px;
background: #fff;
text-align: center;
font-size: 14px;
border: 2px solid #7e7e7e;
border-radius: 2px;
a {
display: block;
color: #000;
}
}
.current {
border-radius: 0;
background: #000;
border-color: #000;
a {
color: #fff;
}
}
.disable {
border-color: #ccc;
a {
color: #ccc;
cursor: default;
}
}
}
\ No newline at end of file
@import "compass";
.pull-left {
float: left;
}
.pull-right {
float: right;
}
.error {
color: #f00;
}
/*#w-submit {
padding: 0;*/
.yoho-banner-w {
width: 100%;
height: 220px;
background: image-url('online-header.jpg') center top no-repeat;
overflow: hidden;
}
.yoho-header-w {
width: 100%;
height: 184px;
background: image-url('online-banner.jpg') center top no-repeat;
overflow: hidden;
position: relative;
text-align: center;
}
.yoho-header-title {
display: inline-block;
padding: 0 65px;
height: 80px;
line-height: 80px;
top: 50%;
margin-top: -40px;
font-size: 40px;
font-weight: bold;
color: #fff;
border: 2px solid #eeb486;
position: relative;
vertical-align: middle;
}
/*}*/
.submit-content {
width: 990px;
margin: 0 auto;
height: auto;
overflow: hidden;
.page-header {
margin-top: 45px;
height: auto;
overflow: hidden;
font-size: 28px;
font-weight: bold;
color: #000;
a {
padding: 0 30px;
text-decoration: none;
cursor: pointer;
color: #b0b0b0;
&.end {
border-left: 2px solid #7f7f7f;
}
&.active {
color: #000;
text-decoration: none;
span {
padding-bottom: 3px;
border-bottom: 2px solid #000;
}
}
}
}
.pull-left {
width: 340px;
padding-top: 50px;
}
.content-sub {
height: 150px;
border: 1px solid #cfcfcf;
@include box-sizing();
padding: 28px 30px;
line-height: 28px;
color: #3f3f3f;
font-size: 14px;
span {
width: 58px;
display: block;
float: left;
text-align: justify;
text-justify: auto;
}
p {
float: left;
display: block;
width: 200px;
}
}
.pull-right {
width: 648px;
padding-top: 50px;
h2.content-header {
text-indent: 100px;
font-size: 23px;
color: #000;
font-weight: bold;
margin-bottom: 38px;
a {
width: 150px;
height: 30px;
line-height: 30px;
color: #444;
border: 1px solid #444;
text-align: center;
float: right;
font-size: 12px;
text-indent: 0;
cursor: pointer;
}
}
ul {
}
.form-leading {
float: left;
width: 210px;
text-align: right;
height: 30px;
line-height: 30px;
font-size: 14px;
color: #444;
b {
color: #ff2424;
}
}
.form-control {
float: left;
width: 438px;
line-height: 30px;
@include box-sizing();
padding-left: 30px;
}
li {
margin-bottom: 18px;
height: auto;
overflow: hidden;
&.h-auto {
height: auto;
overflow: hidden;
}
input[type="text"] {
border: 1px solid #e8e8e8;
height: 28px;
background: none;
outline: none;
line-height: 28px;
display: block;
width: 405px;
@include box-sizing();
&.pic-code {
width: 111px;
float: left;
}
}
textarea {
border: 1px solid #e8e8e8;
height: 100px;
outline: none;
display: block;
width: 405px;
max-width: 405px;
min-width: 405px;
padding: 15px;
@include box-sizing();
}
.pic-code-text {
display: block;
width: 80px;
height: 30px;
border: 1px solid #f7f7f7;
background: #e8e8e8;
line-height: 30px;
text-align: center;
float: left;
margin-left: 20px;
}
input[type="file"] {
/*display: block;
height: 30px;
width: 69px;
outline: none;
margin-right: 20px;
overflow: hidden;
float: left;
padding-top: 5px;
@include box-sizing();*/
}
.upload-tips {
font-size: 12px;
color: #b0b0b0;
&.error {
color: red;
}
}
.has-upload {
margin: 10px 0;
height: auto;
overflow: hidden;
display: none;
span {
display: block;
float: left;
padding: 0 30px 0 15px;
text-align: center;
border: 1px solid #ededed;
@include border-radius(20px);
position: relative;
b {
text-indent: -100000px;
display: inline-block;
width: 20px;
height: 20px;
background: image-url('clo.png') center center no-repeat;
cursor: pointer;
position: absolute;
top: 50%;
margin-top: -10px;
right: 5px;
}
}
}
&.upload-list {
height: auto;
overflow: hidden;
}
}
.submit-w-btn {
border: none;
display: block;
width: 112px;
height: 40px;
line-height: 40px;
text-align: center;
font-size: 14px;
color: #fff;
background: #1a1a1a;
margin: 35px 145px 400px auto;
cursor: pointer;
&.dis {
background: #ccc;
}
}
}
}
.dialog-w {
position: fixed;
width: 100%;
height: 100%;
display: block;
top: 0;
left: 0;
z-index: 1000;
background: image-url('op.png');
.dia-content {
width: 600px;
height: 430px;
background: #fff;
position: absolute;
top: 50%;
left: 50%;
margin-left: -300px;
margin-top: -215px;
span {
position: absolute;
display: block;
width: 100%;
height: 100%;
background: image-url('submit-success.png') center center no-repeat;
top: 0;
left: 0;
}
}
}
.apply-content {
width: 1080px;
margin: 0 auto;
margin-top: 45px;
.apply-enter {
width: 100%;
height: auto;
overflow: hidden;
li {
float: left;
width: 342px;
height: auto;
overflow: hidden;
position: relative;
text-align: center;
div.background {
height: 420px;
position: relative;
a {
display: block;
width: 100%;
height: 55px;
position: absolute;
bottom: 38px;
cursor: pointer;
}
}
&.apply-left {
.background {
background: image-url('czs.png') center center no-repeat;
}
}
&.apply-center {
margin: 0 27px;
.background {
background: image-url('mt.png') center center no-repeat;
}
}
&.apply-right {
.background {
background: image-url('zzs.png') center center no-repeat;
}
}
.apply-operate {
display: inline-block;
color: #444;
font-size: 16px;
margin-top: 30px;
margin-bottom: 80px;
a {
display: inline-block;
border: 1px solid #444;
width: 140px;
height: 40px;
line-height: 40px;
text-align: center;
margin: 0 5px;
cursor: pointer;
color: #444;
}
}
}
}
}
.submit-content .pull-right .media-down li {
height: 95px;
}
.media-down {
padding-left: 65px;
li {
position: relative;
border-bottom: 1px solid #cfcfcf;
h2 {
font-size: 18px;
font-weight: bold;
color: #000;
width: 465px;
}
div {
font-size: 14px;
color: #444;
margin-top: 12px;
font-weight: bold;
.media-date {
font-size: 12px;
font-weight: normal;
color: #a6a6a5;
}
}
.down-btn {
width: 112px;
height: 40px;
text-align: center;
line-height: 40px;
display: block;
position: absolute;
right: 0;
top: 50%;
margin-top: -20px;
color: #fff;
font-size: 14px;
background: #000;
cursor: pointer;
}
}
}
.submit-content .pull-right .exhibitor-down li {
height: auto;
}
.exhibitor-down {
padding: 0 15px;
margin-bottom: 100px;
ul {
height: auto;
overflow: hidden;
li {
float: left;
margin: 0 15px;
text-align: center;
width: 279px;
img {
display: block;
overflow: hidden;
width: 279px;
height: 396px;
}
span {
display: block;
width: 100%;
height: 70px;
line-height: 70px;
text-align: center;
font-size: 14px;
color: #3f3f3f;
@include ellipsis();
}
.exhibitor-btn {
width: 112px;
height: 40px;
text-align: center;
line-height: 40px;
display: inline-block;
color: #fff;
font-size: 14px;
background: #000;
cursor: pointer;
}
}
}
}
#upload-file {
display:block;
float:left;
background:#ccc;
cursor:pointer;
text-align: center;
margin-right: 15px;
position: relative;
object {
display: block;
width: 100%;
height: 100%;
position: absolute;
top: 0;
left: 0;
}
}
.uploadify-queue {
display: none;
}
\ No newline at end of file
.video-list {
margin: 28px 0 50px;
}
\ No newline at end of file