From afdca5cb7b8d5c735ab70926e4f5853d904991c6 Mon Sep 17 00:00:00 2001
From: 马宇豪 <978517621@qq.com>
Date: 星期四, 14 十二月 2023 13:54:53 +0800
Subject: [PATCH] 修改样式
---
src/views/components/home.vue | 51 +++++++++++++++++++++------------------------------
1 files changed, 21 insertions(+), 30 deletions(-)
diff --git a/src/views/components/home.vue b/src/views/components/home.vue
index e3cd338..94d2fac 100644
--- a/src/views/components/home.vue
+++ b/src/views/components/home.vue
@@ -19,8 +19,7 @@
</div>
</div>
</div>
-
- <div class="login-container list-container">
+ <div class="login-container">
<login-form ref="loginRef"/>
</div>
@@ -42,7 +41,6 @@
</div>
</div>
</div>
-
<div class="list-container">
<div class="tit">
<div>
@@ -127,7 +125,7 @@
const getPubList = async ()=>{
const res = await getPublish({title: '', content: '', pageNum: 1, pageSize: 5})
if(res.code == 200){
- state.pubList = res.data.list
+ state.pubList = res.data.list.filter(item => item.publication == 0)
}else{
ElMessage.warning(res.message)
}
@@ -147,37 +145,40 @@
display: flex;
flex-direction: column;
align-items: center;
- margin-top: 160px;
+ margin-top: 150px;
.main-content{
width: 1200px;
- height: calc(100vh - 250px);
- margin: 15px 0;
+ margin: 15px 0 50px;
+ display: grid;
+ grid-gap: 15px;
+ grid-template-columns: repeat(2, 1fr);
+ grid-template-rows: repeat(2, 350px);
+ grid-auto-flow: row;
+ justify-content: center;
color: #333;
- display: flex;
- flex-wrap: wrap;
- align-items: center;
+
+ .login-container{
+ border-radius: 4px;
+ box-shadow: 1px 1px 3px rgba(0,0,0,.04);
+ padding: 0 15px;
+ overflow: hidden;
+ background: url("../../assets/images/login-bg.jpg");
+ }
.list-container{
border-radius: 4px;
- width: calc(50% - 7.5px);
- height: calc(50% - 7.5px);
- margin-bottom: 15px;
box-shadow: 1px 1px 3px rgba(0,0,0,.04);
padding: 0 15px;
overflow: hidden;
background: #fff url("../../assets/images/city-bg.png") no-repeat right bottom;
background-size: 40% auto;
- &:nth-of-type(2n+1){
- margin-right: 15px;
- }
-
.tit{
display: flex;
align-items: center;
justify-content: space-between;
- height: 50px;
+ padding: 10px 0;
border-bottom: 1px solid #ebeef5;
&>div{
display: flex;
@@ -189,20 +190,14 @@
}
.list{
width: 100%;
- height: calc(100% - 60px);
- padding: 5px 0;
- margin-top: 5px;
- display: flex;
- flex-direction: column;
- justify-content: space-around;
+ margin-top: 10px;
&>div{
width: 100%;
- padding: 5px;
display: flex;
align-items: center;
cursor: pointer;
-
+ padding: 5px;
border-radius: 4px;
&>div:first-of-type{
@@ -240,10 +235,6 @@
}
}
}
- .login-container{
- background: url("../../assets/images/login-bg.jpg");
- }
-
}
}
</style>
--
Gitblit v1.9.2