|
|
|
|
@ -2,41 +2,57 @@
|
|
|
|
|
<header class="header" id="myheader"> |
|
|
|
|
<div class="wrapper"> |
|
|
|
|
<!-- left --> |
|
|
|
|
|
|
|
|
|
<div class="nav-lf flex-1"> |
|
|
|
|
<div class="nav-logo"> |
|
|
|
|
<a href="https://home.fanruan.com/"><img src="@/assets/fine_logo_dynamic.gif" class="logo-img"/></a> |
|
|
|
|
<div class="navlf_item"> |
|
|
|
|
<div class="nav-logo"> |
|
|
|
|
<a href="https://home.fanruan.com/"><img src="@/assets/fine_logo_dynamic.gif" class="logo-img"/></a> |
|
|
|
|
</div> |
|
|
|
|
<div class="nav-line"></div> |
|
|
|
|
<a href="https://home.fanruan.com/" class="nav-title">帆软社区</a> |
|
|
|
|
</div> |
|
|
|
|
|
|
|
|
|
<div class="navlf_item navlf-item-box"> |
|
|
|
|
<a href="https://home.fanruan.com/" class="nav-item">首页</a> |
|
|
|
|
<a href="https://service.fanuan.com" class="nav-item">服务平台</a> |
|
|
|
|
<a href="https://help.fanruan.com/" class="nav-item">文档</a> |
|
|
|
|
<a href="https://edu.fanruan.com/" class="nav-item active">学院</a> |
|
|
|
|
<a href="https://bbs.fanruan.com/wenda" class="nav-item">问答</a> |
|
|
|
|
<a href="https://bbs.fanruan.com/topic" class="nav-item">论坛</a> |
|
|
|
|
<a href="https://cert.fanruan.com/" class="nav-item">认证</a> |
|
|
|
|
<a href="https://bbs.fanruan.com/jobs" class="nav-item">招聘</a> |
|
|
|
|
<a href="https://bbs.fanruan.com/task" class="nav-item">任务</a> |
|
|
|
|
<a href="https://market.fanruan.com/" class="nav-item">市场</a> |
|
|
|
|
</div> |
|
|
|
|
<div class="nav-line"></div> |
|
|
|
|
<router-link to="/" class="nav-title">帆软学院</router-link> |
|
|
|
|
</div> |
|
|
|
|
|
|
|
|
|
<!-- rigt --> |
|
|
|
|
<div class="nav-rt"> |
|
|
|
|
<!-- search --> |
|
|
|
|
<div class="search-box flex-1"> |
|
|
|
|
<form class="searchform" method="get" autocomplete="off" action="https://search.fanruan.com/?q=" target="_blank" v-if="is_search"> |
|
|
|
|
<div class="el-input el-input--small el-input--suffix topsearch flex-1"> |
|
|
|
|
<input class="el-input__inner" name="q" type="text" autocomplete="off" tabindex="" aria-label="" placeholder="请输入关键词" @focus="isfocus('focus')" @blur="isfocus('blur')" v-on:input="isinput" /> |
|
|
|
|
<button class="el-input__suffix search_sub" type="submit" :class="{ active_btn: kwbtn }"> |
|
|
|
|
<span class="el-input__suffix-inner search_btn"> |
|
|
|
|
<i class="iconfont icon-icon_icon-53 icon-ss" :class="{ active: kwfocus }"></i> |
|
|
|
|
</span> |
|
|
|
|
</button> |
|
|
|
|
</div> |
|
|
|
|
</form> |
|
|
|
|
|
|
|
|
|
<div class="searchform" v-else> |
|
|
|
|
<div class="el-input el-input--small el-input--suffix topsearch flex-1"> |
|
|
|
|
<div class="el-input__inner" style="color: #B5C1D0; line-height: 30px;">登录后方可搜索</div> |
|
|
|
|
<button class="el-input__suffix search_sub" type="submit" :class="{ active_btn: kwbtn }"> |
|
|
|
|
<span class="el-input__suffix-inner search_btn"> |
|
|
|
|
<i class="iconfont icon-icon_icon-53 icon-ss" :class="{ active: kwfocus }"></i> |
|
|
|
|
</span> |
|
|
|
|
</button> |
|
|
|
|
</div> |
|
|
|
|
<!-- search --> |
|
|
|
|
<div class="search-box flex-1"> |
|
|
|
|
<form class="searchform" method="get" autocomplete="off" action="https://search.fanruan.com/?q=" target="_blank" v-if="is_search"> |
|
|
|
|
<div class="el-input el-input--small el-input--suffix topsearch flex-1"> |
|
|
|
|
<input class="el-input__inner" name="q" type="text" autocomplete="off" tabindex="" aria-label="" placeholder="请输入关键词" @focus="isfocus('focus')" @blur="isfocus('blur')" v-on:input="isinput" /> |
|
|
|
|
<button class="el-input__suffix search_sub" type="submit" :class="{ active_btn: kwbtn }"> |
|
|
|
|
<span class="el-input__suffix-inner search_btn"> |
|
|
|
|
<i class="iconfont icon-icon_icon-53 icon-ss" :class="{ active: kwfocus }"></i> |
|
|
|
|
</span> |
|
|
|
|
</button> |
|
|
|
|
</div> |
|
|
|
|
</form> |
|
|
|
|
|
|
|
|
|
<div class="searchform" v-else> |
|
|
|
|
<div class="el-input el-input--small el-input--suffix topsearch flex-1"> |
|
|
|
|
<div class="el-input__inner" style="color: #B5C1D0; line-height: 30px;">登录后方可搜索</div> |
|
|
|
|
<button class="el-input__suffix search_sub" type="submit" :class="{ active_btn: kwbtn }"> |
|
|
|
|
<span class="el-input__suffix-inner search_btn"> |
|
|
|
|
<i class="iconfont icon-icon_icon-53 icon-ss" :class="{ active: kwfocus }"></i> |
|
|
|
|
</span> |
|
|
|
|
</button> |
|
|
|
|
</div> |
|
|
|
|
</div> |
|
|
|
|
</div> |
|
|
|
|
|
|
|
|
|
<!-- rigt --> |
|
|
|
|
<div class="nav-rt"> |
|
|
|
|
<nav class="infomation"> |
|
|
|
|
<el-dropdown v-if="com_user_token" class="personal" placement="bottom-end" popper-class="new-dropdown" :show-timeout="0"> |
|
|
|
|
<span class="el-dropdown-link"> |
|
|
|
|
@ -90,7 +106,7 @@
|
|
|
|
|
<div class="mainbox"> |
|
|
|
|
<div class="edu-head"> |
|
|
|
|
<div class="edu-nav"> |
|
|
|
|
<router-link class="item" to="/">首页</router-link> |
|
|
|
|
<router-link class="item" to="/">学院首页</router-link> |
|
|
|
|
<router-link class="item" to="/studypath/finereport" :class="$route.meta.active == 'studypath' ? 'active' : ''">学习路径 </router-link> |
|
|
|
|
<router-link class="item" to="/video" :class="$route.meta.active == 'video' ? 'active' : ''">视频课</router-link> |
|
|
|
|
<router-link class="item" to="/class" :class="$route.meta.active == 'class' ? 'active' : ''">学习班</router-link> |
|
|
|
|
@ -368,9 +384,9 @@ export default defineComponent({
|
|
|
|
|
z-index: 201; |
|
|
|
|
|
|
|
|
|
.wrapper { |
|
|
|
|
width: 1200px; |
|
|
|
|
width: 100%; |
|
|
|
|
background: #fff; |
|
|
|
|
margin: 0 auto; |
|
|
|
|
padding: 0 20px; |
|
|
|
|
display: flex; |
|
|
|
|
align-items: center; |
|
|
|
|
justify-content: space-between; |
|
|
|
|
@ -380,7 +396,7 @@ export default defineComponent({
|
|
|
|
|
width: 1px; |
|
|
|
|
height: 24px; |
|
|
|
|
background-color: #dbe3ea; |
|
|
|
|
margin: 0 20px; |
|
|
|
|
margin: 0 8px; |
|
|
|
|
} |
|
|
|
|
.nav-logo { |
|
|
|
|
width: 128px; |
|
|
|
|
@ -398,65 +414,88 @@ export default defineComponent({
|
|
|
|
|
text-decoration: none !important; |
|
|
|
|
font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji"; |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
.nav-rt { |
|
|
|
|
display: inline-flex; |
|
|
|
|
align-items: center; |
|
|
|
|
.search-box { |
|
|
|
|
height: 48px; |
|
|
|
|
margin: 0 auto; |
|
|
|
|
width: 460px; |
|
|
|
|
transition: all 0.2s; |
|
|
|
|
|
|
|
|
|
.searchform { |
|
|
|
|
width: 100%; |
|
|
|
|
.navlf_item { |
|
|
|
|
display: flex; |
|
|
|
|
align-items: center; |
|
|
|
|
} |
|
|
|
|
.navlf-item-box { |
|
|
|
|
margin-left: 32px; |
|
|
|
|
.nav-item { |
|
|
|
|
&:hover { |
|
|
|
|
color: #0082fc; |
|
|
|
|
} |
|
|
|
|
margin-right: 20px; |
|
|
|
|
font-size: 16px; |
|
|
|
|
color: #17243e; |
|
|
|
|
transition: all 0.3s; |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
.search_sub { |
|
|
|
|
border-radius: 0px 20px 20px 0px; |
|
|
|
|
height: 32px; |
|
|
|
|
cursor: pointer; |
|
|
|
|
background: none; |
|
|
|
|
border: none; |
|
|
|
|
right: 0; |
|
|
|
|
.active { |
|
|
|
|
color: #0082fc; |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
.search_btn { |
|
|
|
|
display: inline-block; |
|
|
|
|
color: #617288; |
|
|
|
|
width: 48px; |
|
|
|
|
.search-box { |
|
|
|
|
height: 48px; |
|
|
|
|
flex: 1 1; |
|
|
|
|
max-width: 500px; |
|
|
|
|
margin: 0 0 0 4px; |
|
|
|
|
transition: all 0.2s; |
|
|
|
|
|
|
|
|
|
.active { |
|
|
|
|
color: #0082fc; |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
.searchform { |
|
|
|
|
width: 100%; |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
.active_btn { |
|
|
|
|
background-color: #0082fc; |
|
|
|
|
.search_sub { |
|
|
|
|
border-radius: 0px 20px 20px 0px; |
|
|
|
|
height: 32px; |
|
|
|
|
cursor: pointer; |
|
|
|
|
background: none; |
|
|
|
|
border: none; |
|
|
|
|
right: 0; |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
.icon-ss { |
|
|
|
|
color: #fff; |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
.search_btn { |
|
|
|
|
display: inline-block; |
|
|
|
|
color: #617288; |
|
|
|
|
width: 48px; |
|
|
|
|
|
|
|
|
|
.el-input__inner { |
|
|
|
|
border: none; |
|
|
|
|
border: 1px solid #eef3fa; |
|
|
|
|
background-color: #eef3fa; |
|
|
|
|
border-radius: 100px; |
|
|
|
|
font-size: 14px; |
|
|
|
|
.active { |
|
|
|
|
color: #0082fc; |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
.el-input__inner:focus { |
|
|
|
|
border: 1px solid #0082fc; |
|
|
|
|
background-color: #fff; |
|
|
|
|
} |
|
|
|
|
.active_btn { |
|
|
|
|
background-color: #0082fc; |
|
|
|
|
|
|
|
|
|
::placeholder { |
|
|
|
|
color: #8496ab !important; |
|
|
|
|
.icon-ss { |
|
|
|
|
color: #fff; |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
.el-input__inner { |
|
|
|
|
border: none; |
|
|
|
|
border: 1px solid #eef3fa; |
|
|
|
|
background-color: #eef3fa; |
|
|
|
|
border-radius: 100px; |
|
|
|
|
font-size: 14px; |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
.el-input__inner:focus { |
|
|
|
|
border: 1px solid #0082fc; |
|
|
|
|
background-color: #fff; |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
::placeholder { |
|
|
|
|
color: #8496ab !important; |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
.nav-rt { |
|
|
|
|
display: inline-flex; |
|
|
|
|
align-items: center; |
|
|
|
|
|
|
|
|
|
.infomation { |
|
|
|
|
position: relative; |
|
|
|
|
height: 100%; |
|
|
|
|
@ -581,7 +620,7 @@ export default defineComponent({
|
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
.avatar_down { |
|
|
|
|
width: 340px; |
|
|
|
|
width: 300px; |
|
|
|
|
padding: 0 20px; |
|
|
|
|
background-color: #ffffff; |
|
|
|
|
background-clip: padding-box; |
|
|
|
|
|
