提交 0feee6c8 authored 作者: coderBryanFu's avatar coderBryanFu

update

上级 8c81c52f
...@@ -153,7 +153,6 @@ body { ...@@ -153,7 +153,6 @@ body {
display: flex; display: flex;
justify-content: center; justify-content: center;
align-items: center; align-items: center;
padding: 0 24px;
background: white; background: white;
color: #333; color: #333;
height: 100%; height: 100%;
...@@ -161,7 +160,7 @@ body { ...@@ -161,7 +160,7 @@ body {
box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1); box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
position: relative; position: relative;
box-sizing: border-box; box-sizing: border-box;
height: 96px; height: 64px;
} }
.main-container { .main-container {
...@@ -176,8 +175,7 @@ body { ...@@ -176,8 +175,7 @@ body {
align-items: center; align-items: center;
gap: 12px; gap: 12px;
position: absolute; position: absolute;
left: 160px; left: 13px;
.brand-icon { .brand-icon {
width: 48px; width: 48px;
height: 48px; height: 48px;
...@@ -196,12 +194,12 @@ body { ...@@ -196,12 +194,12 @@ body {
.brand-text { .brand-text {
.text-ch { .text-ch {
height: 42px; height: 37px;
color: rgba(10, 18, 30, 1); color: rgba(10, 18, 30, 1);
font-family: Microsoft YaHei; font-family: Microsoft YaHei;
font-size: 32px; font-size: 28px;
font-weight: 700; font-weight: 700;
line-height: 42px; line-height: 37px;
} }
.text-en { .text-en {
...@@ -264,7 +262,7 @@ body { ...@@ -264,7 +262,7 @@ body {
border-radius: 6px; border-radius: 6px;
color: #333; color: #333;
position: absolute; position: absolute;
right: 159px; right: 37px;
.email { .email {
width: 20px; width: 20px;
...@@ -335,15 +333,16 @@ body { ...@@ -335,15 +333,16 @@ body {
.el-header { .el-header {
padding: 0; padding: 0;
height: 96px; height: 64px;
position: relative; position: relative;
z-index: 1; z-index: 1;
} }
.el-main { .el-main {
padding: 0; padding: 0;
height: calc(100vh - 96px); height: calc(100vh - 64px);
overflow: hidden; overflow: hidden;
overflow-y: auto;
background-color: rgba(246, 251, 255, 1); background-color: rgba(246, 251, 255, 1);
} }
</style> </style>
...@@ -118,17 +118,6 @@ ...@@ -118,17 +118,6 @@
</div> </div>
</div> </div>
</div> </div>
<div class="tool-box">
<div class="tool1">
<img src="./assets/icons/tool-icon1.png" alt="" />
</div>
<div class="tool2">
<img src="./assets/icons/tool-icon2.png" alt="" />
</div>
<div class="tool3">
<img src="./assets/icons/tool-icon3.png" alt="" />
</div>
</div>
</div> </div>
</template> </template>
...@@ -136,23 +125,6 @@ ...@@ -136,23 +125,6 @@
import { ref, onMounted } from "vue"; import { ref, onMounted } from "vue";
import router from "@/router"; import router from "@/router";
import GJKJAQImg from "./assets/images/icon1.png";
import GJKJAQActiveImg from "./assets/images/icon1.png";
import KJLYImg from "./assets/images/icon2.png";
import KJLYActiveImg from "./assets/images/icon2.png";
import KJYSImg from "./assets/images/icon3.png";
import KJYSActiveImg from "./assets/images/icon3.png";
import ZDKJAQImg from "./assets/images/icon4.png";
import ZDKJAQActiveImg from "./assets/images/icon4.png";
import ZBTXImg from "./assets/images/icon5.png";
import ZBTXActiveImg from "./assets/images/icon5.png";
import ZJKImg from "./assets/images/icon6.png";
import ZJKActiveImg from "./assets/images/icon6.png";
import XTGLImg from "./assets/images/icon7.png";
import XTGLActiveImg from "./assets/images/icon7.png";
import search from "./assets/images/search.png";
import mail from "./assets/images/mail.png";
import icon1 from "./assets/icons/icon1.png"; import icon1 from "./assets/icons/icon1.png";
import icon1Active from "./assets/icons/icon1_active.png"; import icon1Active from "./assets/icons/icon1_active.png";
import icon2 from "./assets/icons/icon2.png"; import icon2 from "./assets/icons/icon2.png";
...@@ -162,12 +134,6 @@ import icon3Active from "./assets/icons/icon3_active.png"; ...@@ -162,12 +134,6 @@ import icon3Active from "./assets/icons/icon3_active.png";
import icon4 from "./assets/icons/icon4.png"; import icon4 from "./assets/icons/icon4.png";
import icon4Active from "./assets/icons/icon4_active.png"; import icon4Active from "./assets/icons/icon4_active.png";
import headerIcon1 from "./assets/icons/header-icon1.png";
import headerIcon2 from "./assets/icons/header-icon2.png";
import headerIcon3 from "./assets/icons/header-icon3.png";
import headerIcon4 from "./assets/icons/header-icon4.png";
import headerIcon5 from "./assets/icons/header-icon5.png";
const activeName = ref("分析报告"); const activeName = ref("分析报告");
const handleSwitchActiveName = (name) => { const handleSwitchActiveName = (name) => {
...@@ -222,13 +188,6 @@ const handleClickMainHeaderBtn = (item) => { ...@@ -222,13 +188,6 @@ const handleClickMainHeaderBtn = (item) => {
router.push(item.path); router.push(item.path);
}; };
const activeNavIndex = ref(0);
const handleClickNav = (index, item) => {
activeNavIndex.value = index;
router.push(item.path);
};
onMounted(() => { onMounted(() => {
if(window.sessionStorage.getItem('activeTitle')) { if(window.sessionStorage.getItem('activeTitle')) {
activeTitle.value = window.sessionStorage.getItem('activeTitle') activeTitle.value = window.sessionStorage.getItem('activeTitle')
...@@ -239,7 +198,6 @@ onMounted(() => { ...@@ -239,7 +198,6 @@ onMounted(() => {
<style lang="scss" scoped> <style lang="scss" scoped>
.layout-container { .layout-container {
width: 1920px; width: 1920px;
// height: 1080px;
height: 1016px; height: 1016px;
background: rgba(249, 250, 252, 1); background: rgba(249, 250, 252, 1);
position: relative; position: relative;
...@@ -623,49 +581,5 @@ onMounted(() => { ...@@ -623,49 +581,5 @@ onMounted(() => {
} }
} }
} }
.tool-box {
position: fixed;
z-index: 10000;
bottom: 80px;
left: 0;
width: 48px;
height: 144px;
border-radius: 0px 10px 10px 0px;
box-shadow: 0px 0px 15px 0px rgba(22, 119, 255, 0.1);
background: rgba(255, 255, 255, 1);
.tool1 {
width: 17px;
height: 18px;
margin-top: 17px;
margin-left: 16px;
cursor: pointer;
img {
width: 100%;
height: 100%;
}
}
.tool2 {
width: 22px;
height: 20px;
margin-top: 26px;
margin-left: 14px;
cursor: pointer;
img {
width: 100%;
height: 100%;
}
}
.tool3 {
width: 20px;
height: 20px;
margin-top: 25px;
margin-left: 15px;
cursor: pointer;
img {
width: 100%;
height: 100%;
}
}
}
} }
</style> </style>
\ No newline at end of file
...@@ -635,7 +635,7 @@ onMounted(() => { ...@@ -635,7 +635,7 @@ onMounted(() => {
<style lang="scss" scoped> <style lang="scss" scoped>
.introduction-wrap { .introduction-wrap {
width: 100%; width: 100%;
height: 100%; height: 880px;
display: flex; display: flex;
.box-header { .box-header {
height: 56px; height: 56px;
...@@ -768,8 +768,8 @@ onMounted(() => { ...@@ -768,8 +768,8 @@ onMounted(() => {
} }
.item-right4 { .item-right4 {
// width: 500px; // width: 500px;
margin-top: -2px; margin-top: -4px;
height: 26px; height: 28px;
display: flex; display: flex;
padding-left: -10px; padding-left: -10px;
border: 2px solid #5f656c; border: 2px solid #5f656c;
......
...@@ -586,7 +586,7 @@ onMounted(async () => { ...@@ -586,7 +586,7 @@ onMounted(async () => {
.tag { .tag {
height: 18px; height: 18px;
line-height: 18px; line-height: 18px;
padding: 1px 8px 1px 8px; padding: 0 8px;
border-radius: 4px; border-radius: 4px;
margin-left: 5px; margin-left: 5px;
font-size: 12px; font-size: 12px;
......
<template> <template>
<!-- 面包屑导航 --> <!-- 面包屑导航 -->
<div class="breadcrumb"> <div class="breadcrumb">
<span>国家科技安全 </span>> <span>中美博弈概览 </span>> <div class="header-item">国家科技安全</div>
<span>科技智库 </span> <div class="header-item">></div>
<div class="header-item back-item" @click="handleBackHome">中美博弈概览</div>
<div class="header-item">></div>
<div class="header-item">科技智库</div>
</div> </div>
<div class="tech-think-tank"> <div class="tech-think-tank">
<!-- 搜索区域 --> <!-- 搜索区域 -->
<div class="search-section"> <div class="search-section">
<el-input v-model="searchText" placeholder="搜索智库、报告或政策建议" class="search-input" size="large"> <!-- <el-input v-model="searchText" placeholder="搜索智库、报告或政策建议" class="search-input" size="large">
<template #append> <template #append>
<el-button type="primary" style="background: #1677ff; color: #fff" :icon="Search">搜索</el-button> <el-button type="primary" style="background: #1677ff; color: #fff" :icon="Search">搜索</el-button>
</template> </template>
</el-input> </el-input> -->
<el-input v-model="searchText" style="width: 800px; height: 100%" placeholder="搜索智库、报告或政策建议" />
<div class="search">
<div class="search-icon">
<img src="@/assets/icons/search-icon.png" alt="" />
</div>
<div class="search-text">搜索</div>
</div>
</div> </div>
<!-- 统计数据 --> <!-- 统计数据 -->
...@@ -33,14 +43,14 @@ ...@@ -33,14 +43,14 @@
<div class="stat-label">热点科技领域</div> <div class="stat-label">热点科技领域</div>
</div> </div>
</div> </div>
<div class="home-main-header-footer-link"> <div class="home-main-header-footer-link">
<ClickableCard text="最新动态" link="/billHome" target="_blank" /> <ClickableCard text="最新动态" link="/billHome" target="_blank" />
<ClickableCard text="资讯要闻" link="/billHome" target="_blank" /> <ClickableCard text="资讯要闻" link="/billHome" target="_blank" />
<ClickableCard text="数据总览" link="/billHome" target="_blank" /> <ClickableCard text="数据总览" link="/billHome" target="_blank" />
<ClickableCard text="资源库" link="/billHome" target="_blank" /> <ClickableCard text="资源库" link="/billHome" target="_blank" />
</div> </div>
<!-- 智库展示区域 --> <!-- 智库展示区域 -->
<div class="think-tanks-section"> <div class="think-tanks-section">
<div v-for="tank in thinkTanks" :key="tank.id" class="think-tank-card" @click="handleClick(tank)"> <div v-for="tank in thinkTanks" :key="tank.id" class="think-tank-card" @click="handleClick(tank)">
<div class="tank-header"> <div class="tank-header">
...@@ -63,7 +73,7 @@ ...@@ -63,7 +73,7 @@
</div> </div>
</div> </div>
<DivideHeader style="margin: 30px auto" :titleText="'最新动态'"></DivideHeader> <DivideHeader style="margin: 30px auto" :titleText="'最新动态'"></DivideHeader>
<!-- 主要内容区域 --> <!-- 主要内容区域 -->
<div class="main-content"> <div class="main-content">
<!-- 左侧数据分布 --> <!-- 左侧数据分布 -->
...@@ -112,61 +122,61 @@ ...@@ -112,61 +122,61 @@
</el-button> </el-button>
</div> </div>
</div> </div>
<DivideHeader style="margin: 30px auto" :titleText="'资讯要闻'"></DivideHeader> <DivideHeader style="margin: 30px auto" :titleText="'资讯要闻'"></DivideHeader>
<!-- 资讯要闻 --> <!-- 资讯要闻 -->
<div class="center-center"> <div class="center-center">
<div class="box3"> <div class="box3">
<div class="box3-header"> <div class="box3-header">
<div class="box3-header-left"> <div class="box3-header-left">
<div class="box3-header-icon"> <div class="box3-header-icon">
<img src="@/views/bill/billHome/assets/images/box3-header-icon.png" alt="" /> <img src="@/views/bill/billHome/assets/images/box3-header-icon.png" alt="" />
</div> </div>
<div class="box3-header-title">{{ "新闻资讯" }}</div> <div class="box3-header-title">{{ "新闻资讯" }}</div>
<div class="more">{{ "更多 +" }}</div> <div class="more">{{ "更多 +" }}</div>
</div> </div>
</div> </div>
<div class="box3-main"> <div class="box3-main">
<div class="box3-item" v-for="(news, index) in newsList" :key="index"> <div class="box3-item" v-for="(news, index) in newsList" :key="index">
<div class="left"> <div class="left">
<img :src="news.img" alt="" /> <img :src="news.img" alt="" />
</div> </div>
<div class="right"> <div class="right">
<div class="right-top"> <div class="right-top">
<div class="title">{{ news.title }}</div> <div class="title">{{ news.title }}</div>
<div class="time">{{ news.from }}</div> <div class="time">{{ news.from }}</div>
</div> </div>
<div class="right-footer">{{ news.content }}</div> <div class="right-footer">{{ news.content }}</div>
</div> </div>
</div> </div>
</div> </div>
</div> </div>
<div class="box4"> <div class="box4">
<div class="box4-header"> <div class="box4-header">
<div class="header-icon"> <div class="header-icon">
<img src="@/views/bill/billHome/assets/images/box4-header-icon.png" alt="" /> <img src="@/views/bill/billHome/assets/images/box4-header-icon.png" alt="" />
</div> </div>
<div class="header-title">{{ "智库人物动态" }}</div> <div class="header-title">{{ "智库人物动态" }}</div>
<div class="more">{{ "更多 +" }}</div> <div class="more">{{ "更多 +" }}</div>
</div> </div>
<div class="box4-main"> <div class="box4-main">
<div class="box4-main-item" v-for="(item, index) in messageList" :key="index"> <div class="box4-main-item" v-for="(item, index) in messageList" :key="index">
<div class="left"> <div class="left">
<img :src="item.img" alt="" /> <img :src="item.img" alt="" />
</div> </div>
<div class="right"> <div class="right">
<div class="right-top"> <div class="right-top">
<div class="name">{{ item.name }}</div> <div class="name">{{ item.name }}</div>
<div class="time">{{ item.time }}</div> <div class="time">{{ item.time }}</div>
</div> </div>
<div class="content">{{ item.content }}</div> <div class="content">{{ item.content }}</div>
</div> </div>
</div> </div>
</div> </div>
</div> </div>
</div> </div>
<DivideHeader style="margin: 30px auto" :titleText="'数据总览'"></DivideHeader> <DivideHeader style="margin: 30px auto" :titleText="'数据总览'"></DivideHeader>
<DataOverview /> <DataOverview />
<DivideHeader style="margin: 30px auto" :titleText="'资源库'"></DivideHeader> <DivideHeader style="margin: 30px auto" :titleText="'资源库'"></DivideHeader>
<ReportList /> <ReportList />
</div> </div>
</template> </template>
...@@ -516,6 +526,16 @@ onMounted(() => { ...@@ -516,6 +526,16 @@ onMounted(() => {
line-height: 64px; line-height: 64px;
box-sizing: border-box; box-sizing: border-box;
padding-left: 160px; padding-left: 160px;
display: flex;
.header-item {
margin: 0 3px;
}
.back-item {
cursor: pointer;
&:hover {
color: #ccc;
}
}
} }
.tech-think-tank { .tech-think-tank {
...@@ -527,243 +547,283 @@ onMounted(() => { ...@@ -527,243 +547,283 @@ onMounted(() => {
background-position: center -100px; background-position: center -100px;
background-size: 100% 100%; background-size: 100% 100%;
min-height: 100vh; min-height: 100vh;
.home-main-header-footer-link { .home-main-header-footer-link {
display: flex; display: flex;
gap: 30px; gap: 30px;
padding: 30px 0; padding: 30px 0;
justify-content: center; justify-content: center;
} }
.center-center { .center-center {
margin-top: 21px; margin-top: 21px;
height: 450px; height: 450px;
display: flex; display: flex;
.box3 { .box3 {
width: 792px; width: 792px;
height: 450px; height: 450px;
box-shadow: 0px 0px 15px 0px rgba(25, 69, 130, 0.2); box-shadow: 0px 0px 15px 0px rgba(25, 69, 130, 0.2);
background: rgba(255, 255, 255, 1); background: rgba(255, 255, 255, 1);
.box3-header { .box3-header {
height: 48px; height: 48px;
border-bottom: 1px solid rgba(240, 242, 244, 1); border-bottom: 1px solid rgba(240, 242, 244, 1);
margin: 0 auto; margin: 0 auto;
display: flex; display: flex;
justify-content: space-between; justify-content: space-between;
padding: 0 20px; padding: 0 20px;
position: relative; position: relative;
.box3-header-left { .box3-header-left {
display: flex; display: flex;
.box3-header-icon { .box3-header-icon {
margin-top: 16px; margin-top: 16px;
width: 19px; width: 19px;
height: 19px; height: 19px;
img { img {
width: 100%; width: 100%;
height: 100%; height: 100%;
} }
} }
.box3-header-title { .box3-header-title {
margin-top: 16px; margin-top: 16px;
margin-left: 19px; margin-left: 19px;
height: 22px; height: 22px;
color: rgba(20, 89, 187, 1); color: rgba(20, 89, 187, 1);
font-family: Microsoft YaHei; font-family: Microsoft YaHei;
font-size: 20px; font-size: 20px;
font-weight: 700; font-weight: 700;
line-height: 22px; line-height: 22px;
} }
.more { .more {
width: 49px; width: 49px;
height: 24px; height: 24px;
position: absolute; position: absolute;
top: 14px; top: 14px;
right: 27px; right: 27px;
color: rgba(20, 89, 187, 1); color: rgba(20, 89, 187, 1);
font-family: Microsoft YaHei; font-family: Microsoft YaHei;
font-size: 16px; font-size: 16px;
font-weight: 400; font-weight: 400;
line-height: 24px; line-height: 24px;
cursor: pointer; cursor: pointer;
} }
} }
} }
.box3-main { .box3-main {
height: 402px; height: 402px;
overflow-y: auto; overflow-y: auto;
overflow-x: hidden; overflow-x: hidden;
padding-top: 6px; padding-top: 6px;
.box3-item { .box3-item {
display: flex; display: flex;
height: 77px; height: 77px;
width: 749px; width: 749px;
margin-left: 21px; margin-left: 21px;
border-bottom: 1px solid rgba(240, 242, 244, 1); border-bottom: 1px solid rgba(240, 242, 244, 1);
.left { .left {
width: 72px; width: 72px;
height: 48px; height: 48px;
margin-top: 15px; margin-top: 15px;
img { img {
width: 100%; width: 100%;
height: 100%; height: 100%;
} }
} }
.right { .right {
width: 657px; width: 657px;
margin-left: 20px; margin-left: 20px;
.right-top { .right-top {
width: 657px; width: 657px;
display: flex; display: flex;
justify-content: space-between; justify-content: space-between;
.title { .title {
margin-top: 13px; margin-top: 13px;
width: 520px; width: 520px;
height: 24px; height: 24px;
color: rgba(59, 65, 75, 1); color: rgba(59, 65, 75, 1);
font-family: Microsoft YaHei; font-family: Microsoft YaHei;
font-size: 16px; font-size: 16px;
font-weight: 700; font-weight: 700;
line-height: 24px; line-height: 24px;
overflow: hidden; overflow: hidden;
text-overflow: ellipsis; text-overflow: ellipsis;
white-space: nowrap; white-space: nowrap;
} }
.time { .time {
flex: 1; flex: 1;
text-align: right; text-align: right;
height: 22px; height: 22px;
margin-top: 19px; margin-top: 19px;
color: rgba(95, 101, 108, 1); color: rgba(95, 101, 108, 1);
font-family: Microsoft YaHei; font-family: Microsoft YaHei;
font-size: 14px; font-size: 14px;
font-weight: 400; font-weight: 400;
line-height: 22px; line-height: 22px;
} }
} }
.right-footer { .right-footer {
width: 657px; width: 657px;
height: 24px; height: 24px;
color: rgba(59, 65, 75, 1); color: rgba(59, 65, 75, 1);
font-family: Microsoft YaHei; font-family: Microsoft YaHei;
font-size: 16px; font-size: 16px;
font-weight: 400; font-weight: 400;
line-height: 24px; line-height: 24px;
overflow: hidden; overflow: hidden;
text-overflow: ellipsis; text-overflow: ellipsis;
white-space: nowrap; white-space: nowrap;
} }
} }
} }
} }
} }
.box4 { .box4 {
margin-left: 20px; margin-left: 20px;
width: 792px; width: 792px;
height: 450px; height: 450px;
box-shadow: 0px 0px 15px 0px rgba(25, 69, 130, 0.2); box-shadow: 0px 0px 15px 0px rgba(25, 69, 130, 0.2);
background: rgba(255, 255, 255, 1); background: rgba(255, 255, 255, 1);
.box4-header { .box4-header {
width: 792px; width: 792px;
height: 48px; height: 48px;
border-bottom: 1px solid rgba(240, 242, 244, 1); border-bottom: 1px solid rgba(240, 242, 244, 1);
display: flex; display: flex;
box-sizing: border-box; box-sizing: border-box;
padding-left: 22px; padding-left: 22px;
position: relative; position: relative;
.header-icon { .header-icon {
margin-top: 15px; margin-top: 15px;
width: 20px; width: 20px;
height: 20px; height: 20px;
img { img {
width: 100%; width: 100%;
height: 100%; height: 100%;
} }
} }
.header-title { .header-title {
margin-top: 16px; margin-top: 16px;
margin-left: 18px; margin-left: 18px;
height: 22px; height: 22px;
color: var(--color-main-active); color: var(--color-main-active);
font-family: Microsoft YaHei; font-family: Microsoft YaHei;
font-size: 20px; font-size: 20px;
font-weight: 700; font-weight: 700;
line-height: 22px; line-height: 22px;
} }
.more { .more {
width: 49px; width: 49px;
height: 24px; height: 24px;
position: absolute; position: absolute;
top: 14px; top: 14px;
right: 27px; right: 27px;
color: rgba(20, 89, 187, 1); color: rgba(20, 89, 187, 1);
font-family: Microsoft YaHei; font-family: Microsoft YaHei;
font-size: 16px; font-size: 16px;
font-weight: 400; font-weight: 400;
line-height: 24px; line-height: 24px;
cursor: pointer; cursor: pointer;
} }
} }
.box4-main { .box4-main {
height: 402px; height: 402px;
overflow-y: auto; overflow-y: auto;
box-sizing: border-box; box-sizing: border-box;
padding-top: 8px; padding-top: 8px;
.box4-main-item { .box4-main-item {
margin-top: 16px; margin-top: 16px;
display: flex; display: flex;
margin-left: 21px; margin-left: 21px;
.left { .left {
margin-top: 5px; margin-top: 5px;
width: 36px; width: 36px;
height: 36px; height: 36px;
img { img {
width: 100%; width: 100%;
height: 100%; height: 100%;
} }
} }
.right { .right {
margin-left: 10px; margin-left: 10px;
width: 690px; width: 690px;
box-sizing: border-box; box-sizing: border-box;
border: 1px solid rgba(231, 243, 255, 1); border: 1px solid rgba(231, 243, 255, 1);
background: rgba(246, 250, 255, 1); background: rgba(246, 250, 255, 1);
padding: 10px 15px; padding: 10px 15px;
.right-top { .right-top {
display: flex; display: flex;
justify-content: space-between; justify-content: space-between;
.name { .name {
height: 24px; height: 24px;
color: rgba(59, 65, 75, 1); color: rgba(59, 65, 75, 1);
font-family: Microsoft YaHei; font-family: Microsoft YaHei;
font-size: 16px; font-size: 16px;
font-weight: 700; font-weight: 700;
line-height: 24px; line-height: 24px;
} }
.time { .time {
height: 30px; height: 30px;
color: rgba(95, 101, 108, 1); color: rgba(95, 101, 108, 1);
font-family: Microsoft YaHei; font-family: Microsoft YaHei;
font-size: 16px; font-size: 16px;
font-weight: 400; font-weight: 400;
line-height: 30px; line-height: 30px;
} }
} }
.content { .content {
color: rgba(59, 65, 75, 1); color: rgba(59, 65, 75, 1);
font-family: Microsoft YaHei; font-family: Microsoft YaHei;
font-size: 16px; font-size: 16px;
font-weight: 400; font-weight: 400;
line-height: 24px; line-height: 24px;
} }
} }
} }
} }
} }
} }
} }
.search-section { .search-section {
margin-bottom: 30px; margin-bottom: 30px;
display: flex; // display: flex;
justify-content: center; // justify-content: center;
// margin-top: 20px;
margin-left: 200px;
width: 800px;
height: 48px;
border-radius: 10px;
box-shadow: 0px 0px 15px 0px rgba(22, 119, 255, 0.1);
background: rgba(255, 255, 255, 1);
box-sizing: border-box;
padding: 1px;
position: relative;
.search {
position: absolute;
right: 1px;
top: 2px;
width: 120px;
height: 44px;
border-radius: 10px;
background: var(--color-main-active);
display: flex;
justify-content: center;
align-items: center;
cursor: pointer;
.search-icon {
width: 18px;
height: 18px;
img {
width: 100%;
height: 100%;
}
}
.search-text {
margin-left: 8px;
height: 22px;
color: #fff;
font-family: Microsoft YaHei;
font-size: 16px;
font-weight: 400;
line-height: 22px;
}
}
} }
.search-input { .search-input {
...@@ -1074,4 +1134,19 @@ onMounted(() => { ...@@ -1074,4 +1134,19 @@ onMounted(() => {
.view-all-link:hover { .view-all-link:hover {
text-decoration: underline; text-decoration: underline;
} }
:deep(.el-input__wrapper) {
box-shadow: none;
}
:deep(.el-input__wrapper) {
box-shadow: none;
}
:deep(.el-input__wrapper:hover) {
box-shadow: none !important;
}
:deep(.el-input__wrapper.is-focus) {
box-shadow: none !important;
}
</style> </style>
\ No newline at end of file
Markdown 格式
0%
您添加了 0 到此讨论。请谨慎行事。
请先完成此评论的编辑!
注册 或者 后发表评论