Skip to content

T
techbook
Commit 7ab74273 authored by zhangyanni's avatar zhangyanni
Browse files
Options

首页样式

parent e222f13a
Hide whitespace changes
Inline Side-by-side
Showing with 53 additions and 22 deletions
public/css/common.scss
View file @ 7ab74273
......@@ -229,6 +229,7 @@ input.el-input__inner {
width: 50px;
height: 50px;
cursor: pointer;
border: 1px solid #dcdff1;
}
.requireContent .companyInfo .rightInfo {
......@@ -919,6 +920,9 @@ i {
background-color: #5C5E81;
margin-right: 10px;
}
.el-menu-item.is-active{
font-weight: bold;
}
& .el-submenu .el-menu-item {
height: 40px !important;
line-height:40px !important;
......@@ -928,6 +932,11 @@ i {
& .el-submenu__title:focus, .el-submenu__title:hover, & .el-menu-item:focus, .el-menu-item:hover {
background: #242438 !important;
color: #fff !important;
font-weight: bold;
.nav-count{
color: #fff;
background: #727382;
}
}
& .el-submenu__title:focus i.iconfont, .el-submenu__title:hover i.iconfont, & .el-menu-item:focus i.iconfont, .el-menu-item:hover i.iconfont{
......
src/assets/img/index/Bitmap@2x.jpg
View replaced file @ e222f13a View file @ 7ab74273
src/assets/img/index/Bitmap@2x.jpg

380 KB | W: | H:

src/assets/img/index/Bitmap@2x.jpg

339 KB | W: | H:

src/assets/img/index/Bitmap@2x.jpg
src/assets/img/index/Bitmap@2x.jpg
src/assets/img/index/Bitmap@2x.jpg
src/assets/img/index/Bitmap@2x.jpg
  • 2-up
  • Swipe
  • Onion skin
src/components/index/PageTop.vue
View file @ 7ab74273
......@@ -19,10 +19,10 @@
</div>
<div class="header-right" :class="userInfo&&!isShow?'top15px':''">
<span @click="handleSearch" v-if="isShow"><i class="iconfont icon-iconsearch"></i></span>
<span @click="handleSearch" class="searchIcon" v-if="isShow"><i class="iconfont icon-iconsearch"></i></span>
<span class="positionIpt" v-if="searchVisible"><el-input style="width: 307px;" placeholder="输入项目名称/企业名称/技术关键词" v-model="searchword" @keyup.enter.native="handleSearchDetail(searchword)"><i slot="prefix" class="el-input__icon el-icon-search"></i></el-input></span>
<span class="right-search" v-if="userInfo&&!isShow"><el-input size="small" style="width: 307px;border-radius: 100px;" placeholder="输入项目名称/企业名称/技术关键词" v-model="keyword"></el-input><i class="iconfont icon-iconsearch" @click="handleSearchDetail(keyword)"></i></span>
<span v-if="!userInfo"><i @click="handleLogin">{{$t("topNav.login")}}/</i><i @click="handleRegister">{{$t("topNav.register")}}</i></span>
<span v-if="!userInfo" class="loginRegister"><i @click="handleLogin">{{$t("topNav.login")}}/</i><i @click="handleRegister">{{$t("topNav.register")}}</i></span>
<span v-if="userInfo" class="user-info hoverSpan" @click="handleOpen">{{userInfo.empName?userInfo.empName:userInfo.empAccount}}</span>
<span class="roleSpan">
<span style="margin-right: 5px;" v-if="userInfo&&userInfo.authenticationState==2">
......@@ -42,7 +42,7 @@
<i style="background: #5D78FF;border-radius: 3px;" v-if="userInfo&&userInfo.roleList[0].roleType==1"><img
src="../../assets/img/adminIcon@2x.png" alt=""></i>
</span>
<span style="margin: 0;margin-top: -2px;">|</span>
<span style="margin: 0;margin-top: -2px;" v-if="userInfo">|</span>
<span @click="changeLangEvent()" class="langHoverSpan"><i :class="lang==='zh-CN'?'selectedLang':''">中文</i><i> / </i><i
:class="lang==='en'?'selectedLang':''">En</i></span>
</div>
......@@ -360,7 +360,7 @@
color: #C8CBE0;
font-weight: bold;
}
.header-content li:not(:last-child):hover{
.header-content li:not(.workPlaceLi):hover{
color: #fff;
}
& li.activeLi {
......@@ -369,6 +369,9 @@
& .header-right {
color: #C8CBE0;
}
.searchIcon:hover,.loginRegister>i:hover{
color: #fff;
}
.header-right span.hoverSpan:hover{
color: #5D78FF;
}
......@@ -384,7 +387,10 @@
color: #3F3F53;
font-weight: bold;
}
.header-content li:not(:last-child):hover{
.header-content li:not(.workPlaceLi):hover{
color: #5D78FF;
}
.searchIcon:hover,.loginRegister>i:hover{
color: #5D78FF;
}
& li.activeLi {
......@@ -485,7 +491,7 @@
padding-bottom: 7px;
}
& li:last-of-type.workPlaceLi{
padding-left: 30px;
padding-left: 0;
color: #FF9E29;
}
& li.activeLi {
......
src/views/index/pages/index.vue
View file @ 7ab74273
......@@ -3,7 +3,9 @@
<div id="bannerWrapper">
<swiper :options="swiperOption" class="swiper-wrap" ref="mySwiper" v-if="list.length!=0">
<swiper-slide v-for="(item,index) in list" :key="index">
<img :src="item.image" alt=""/>
<div class="imgSwiper" :style="{background:index==0?'unset':'#072074'}">
<img :src="item.image" alt="" :style="{width:index==0?'100%':'auto'}"/>
</div>
</swiper-slide>
<!-- 常见的小圆点 -->
<div class="swiper-pagination" v-for="(item,index) in list" :key="index" slot="pagination"></div>
......@@ -113,7 +115,7 @@
</div>
<div class="requireContent">
<ul>
<li v-for="item in projectInfo">
<li v-for="(item,index) in projectInfo" :style="{marginLeft:index==0||index==4?'9px':'7px'}">
<div class="companyInfo">
<div class="leftInfo">
<img :src="item.logoUrl?item.logoUrl:require('../../../assets/img/index/prodefaultLogo.png')" alt="">
......@@ -127,7 +129,7 @@
<div class="contentInfo">
<p>
<span>{{$t("indexCount.industryFlag")}}</span>
<span v-if="item.flagItem.length>0"><i class="buttonNoBack" :title="item.flagItem[0]">{{item.flagItem[0]}}</i><i class="buttonNoBack" v-if="item.flagItem[1]" :title="item.flagItem[1]">{{item.flagItem[1]}}</i></span>
<span v-if="item.flagItem.length>0" style="font-weight:normal;"><i class="buttonNoBack" style="margin-right:0;" :title="item.flagItem[0]">{{item.flagItem[0]}}</i><i class="buttonNoBack" v-if="item.flagItem[1]" :title="item.flagItem[1]">{{item.flagItem[1]}}</i></span>
<span v-if="item.flagItem.length==0">暂无</span>
</p>
<p><span>{{$t("indexCount.addressBy")}}</span><span>{{item.local}}</span></p>
......@@ -222,7 +224,7 @@
//滑动方向
direction: "vertical",
//小手掌抓取滑动
grabCursor: true,
grabCursor: false,
on: {
//滑动之后回调函数
slideChangeTransitionStart: function () {
......@@ -255,7 +257,7 @@
//滑动方向
direction: "horizontal",
//小手掌抓取滑动
grabCursor: true,
grabCursor: false,
on: {
//滑动之后回调函数
slideChangeTransitionStart: function () {
......@@ -288,19 +290,13 @@
//滑动方向
direction: "horizontal",
//小手掌抓取滑动
grabCursor: true,
grabCursor: false,
on: {
//滑动之后回调函数
slideChangeTransitionStart: function () {
/* realIndex为滚动到当前的slide索引值 */
},
},
//分页器设置
pagination: {
el: ".swiper-pagination",
clickable: true,
type: "bullets"
}
},
list: [
......@@ -483,8 +479,10 @@
<style scoped lang="scss">
#bannerWrapper {
& img {
& div.imgSwiper{
width: 100%;
}
& img {
height: 530px;
}
}
......@@ -681,6 +679,18 @@
border-color: #FF9E29;
}
}
.requireContent ul{
display: -webkit-flex; /*新版本语法：chrome 21+*/
display: -webkit-box; /*老版本语法：Safari,iOS,Android browser,old Webkit browser*/
display: -moz-box; /*老版本语法：Firefox(buggy)*/
display: -ms-flexbox; /*混合版本语法：IE 10*/
display: flex; /*新版本语法:opera 12.1,Firefox 22+*/
/*justify-content: center;*/
flex-wrap: wrap;
li{
margin: 7px;
}
}
.requireContent .contentInfo p > span:first-child {
width: 45%;
height: 22px;
......@@ -694,9 +704,9 @@
.buttonNoBack{
height: 22px;
border-radius: 3px;
border: 1px solid #c8cbe0;
color: #69697A;
padding: 3px 7px;
border: 1px solid #ff9e29;
color: #ff9e29;
padding: 2px 7px;
font-size: 12px;
font-style: normal;
width: 45%;
......@@ -751,6 +761,12 @@
}
& > ul {
width: 1220px;
display: -webkit-flex;/*新版本语法：chrome 21+*/
display: -webkit-box;/*老版本语法：Safari,iOS,Android browser,old Webkit browser*/
display: -moz-box;/*老版本语法：Firefox(buggy)*/
display: -ms-flexbox;/*混合版本语法：IE 10*/
display: flex;/*新版本语法:opera 12.1,Firefox 22+*/
justify-content: space-around;
& p {
color: #3F3F53;
padding-top: 15px;
......
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