fix search box, fix color
This commit is contained in:
parent
c82f0d73cd
commit
7bf4439a08
|
@ -44,7 +44,7 @@ defineProps(['isMainPage'])
|
||||||
<style lang="scss" scoped>
|
<style lang="scss" scoped>
|
||||||
/* 搜索帖子 */
|
/* 搜索帖子 */
|
||||||
.container {
|
.container {
|
||||||
height: 40px;
|
height: 39px;
|
||||||
width: 1px;
|
width: 1px;
|
||||||
justify-content: center;
|
justify-content: center;
|
||||||
align-items: center;
|
align-items: center;
|
||||||
|
@ -55,7 +55,6 @@ defineProps(['isMainPage'])
|
||||||
/* 相对于二级菜单定位 */
|
/* 相对于二级菜单定位 */
|
||||||
position: relative;
|
position: relative;
|
||||||
display: flex;
|
display: flex;
|
||||||
border-bottom: 1px solid var(--kungalgame-trans-blue-4);
|
|
||||||
box-sizing: border-box;
|
box-sizing: border-box;
|
||||||
&:hover {
|
&:hover {
|
||||||
background-color: var(--kungalgame-trans-white-5);
|
background-color: var(--kungalgame-trans-white-5);
|
||||||
|
@ -68,7 +67,7 @@ defineProps(['isMainPage'])
|
||||||
/* 搜索框表单 */
|
/* 搜索框表单 */
|
||||||
.search-form {
|
.search-form {
|
||||||
display: flex;
|
display: flex;
|
||||||
height: 40px;
|
height: 39px;
|
||||||
/* 随着页面自增长 */
|
/* 随着页面自增长 */
|
||||||
width: 1px;
|
width: 1px;
|
||||||
flex-grow: 1;
|
flex-grow: 1;
|
||||||
|
@ -83,7 +82,7 @@ defineProps(['isMainPage'])
|
||||||
/* 框体 */
|
/* 框体 */
|
||||||
.input {
|
.input {
|
||||||
padding: 0 15px;
|
padding: 0 15px;
|
||||||
height: 40px;
|
height: 39px;
|
||||||
width: 100%;
|
width: 100%;
|
||||||
/* 搜索时输入的字体大小 */
|
/* 搜索时输入的字体大小 */
|
||||||
font-size: 16px;
|
font-size: 16px;
|
||||||
|
@ -96,8 +95,8 @@ defineProps(['isMainPage'])
|
||||||
/* 搜索按钮 */
|
/* 搜索按钮 */
|
||||||
.search-btn {
|
.search-btn {
|
||||||
/* 正方形,不缩小 */
|
/* 正方形,不缩小 */
|
||||||
height: 40px;
|
height: 39px;
|
||||||
width: 40px;
|
width: 39px;
|
||||||
flex-shrink: 0;
|
flex-shrink: 0;
|
||||||
border-left: 1px solid var(--kungalgame-trans-blue-4);
|
border-left: 1px solid var(--kungalgame-trans-blue-4);
|
||||||
/* 搜索图标居中 */
|
/* 搜索图标居中 */
|
||||||
|
@ -120,12 +119,12 @@ defineProps(['isMainPage'])
|
||||||
/* 相对于 nav 的搜索区域绝对定位 */
|
/* 相对于 nav 的搜索区域绝对定位 */
|
||||||
position: absolute;
|
position: absolute;
|
||||||
/* 紧贴搜索区定位 */
|
/* 紧贴搜索区定位 */
|
||||||
top: 40px;
|
top: 39px;
|
||||||
left: 0;
|
left: 0;
|
||||||
/* 无 hover 时不显示搜索历史 */
|
/* 无 hover 时不显示搜索历史 */
|
||||||
display: none;
|
display: none;
|
||||||
flex-direction: column;
|
flex-direction: column;
|
||||||
background-color: var(--kungalgame-trans-white-5);
|
background-color: var(--kungalgame-white);
|
||||||
color: var(--kungalgame-font-color-3);
|
color: var(--kungalgame-font-color-3);
|
||||||
border: 1px solid var(--kungalgame-red-1);
|
border: 1px solid var(--kungalgame-red-1);
|
||||||
border-radius: 7px;
|
border-radius: 7px;
|
||||||
|
|
|
@ -58,6 +58,7 @@ import KUNGalgameSearchBox from '@/components/KUNGalgameSearchBox.vue'
|
||||||
flex-shrink: 0;
|
flex-shrink: 0;
|
||||||
/* 交互区距离外面半透明总容器的距离 */
|
/* 交互区距离外面半透明总容器的距离 */
|
||||||
margin-top: 5px;
|
margin-top: 5px;
|
||||||
|
border-bottom: 1px solid var(--kungalgame-trans-blue-4);
|
||||||
}
|
}
|
||||||
/* 筛选、搜索帖子、更多 */
|
/* 筛选、搜索帖子、更多 */
|
||||||
.nav-article-sort-container {
|
.nav-article-sort-container {
|
||||||
|
@ -76,7 +77,6 @@ import KUNGalgameSearchBox from '@/components/KUNGalgameSearchBox.vue'
|
||||||
flex-grow: 1;
|
flex-grow: 1;
|
||||||
border-radius: 5px 0 0 0;
|
border-radius: 5px 0 0 0;
|
||||||
position: relative;
|
position: relative;
|
||||||
border-bottom: 1px solid var(--kungalgame-trans-blue-4);
|
|
||||||
border-right: 1px solid var(--kungalgame-trans-blue-4);
|
border-right: 1px solid var(--kungalgame-trans-blue-4);
|
||||||
box-sizing: border-box;
|
box-sizing: border-box;
|
||||||
cursor: pointer;
|
cursor: pointer;
|
||||||
|
@ -103,7 +103,7 @@ import KUNGalgameSearchBox from '@/components/KUNGalgameSearchBox.vue'
|
||||||
}
|
}
|
||||||
.sort-submenu > div {
|
.sort-submenu > div {
|
||||||
padding: 10px 0;
|
padding: 10px 0;
|
||||||
background-color: var(--kungalgame-trans-white-5);
|
background-color: var(--kungalgame-trans-white-2);
|
||||||
font-size: 14px;
|
font-size: 14px;
|
||||||
color: var(--kungalgame-font-color-3);
|
color: var(--kungalgame-font-color-3);
|
||||||
text-decoration: none;
|
text-decoration: none;
|
||||||
|
@ -136,7 +136,6 @@ import KUNGalgameSearchBox from '@/components/KUNGalgameSearchBox.vue'
|
||||||
flex-grow: 1;
|
flex-grow: 1;
|
||||||
border-radius: 0 5px 0 0;
|
border-radius: 0 5px 0 0;
|
||||||
cursor: pointer;
|
cursor: pointer;
|
||||||
border-bottom: 1px solid var(--kungalgame-trans-blue-4);
|
|
||||||
border-left: 1px solid var(--kungalgame-trans-blue-4);
|
border-left: 1px solid var(--kungalgame-trans-blue-4);
|
||||||
box-sizing: border-box;
|
box-sizing: border-box;
|
||||||
}
|
}
|
||||||
|
|
|
@ -49,7 +49,7 @@ import KUNGalgameFooter from '@/components/KUNGalgameFooter.vue'
|
||||||
max-width: 1350px;
|
max-width: 1350px;
|
||||||
max-width: 1200px;
|
max-width: 1200px;
|
||||||
/* 背景色和边框阴影 */
|
/* 背景色和边框阴影 */
|
||||||
background-color: var(--kungalgame-trans-white-5);
|
background-color: var(--kungalgame-trans-white-2);
|
||||||
border: 1px solid var(--kungalgame-blue-4);
|
border: 1px solid var(--kungalgame-blue-4);
|
||||||
box-shadow: var(--shadow);
|
box-shadow: var(--shadow);
|
||||||
border-radius: 7px;
|
border-radius: 7px;
|
||||||
|
|
|
@ -60,7 +60,7 @@ import { Icon } from '@iconify/vue'
|
||||||
border-radius: 5px;
|
border-radius: 5px;
|
||||||
/* 帖子内容距离边的距离 */
|
/* 帖子内容距离边的距离 */
|
||||||
padding: 0 10px;
|
padding: 0 10px;
|
||||||
background-color: var(--kungalgame-trans-white-5);
|
background-color: var(--kungalgame-trans-white-2);
|
||||||
/* 相对于底部状态的定位 */
|
/* 相对于底部状态的定位 */
|
||||||
position: relative;
|
position: relative;
|
||||||
display: inline-block;
|
display: inline-block;
|
||||||
|
|
Loading…
Reference in a new issue