Commit 9075bd15f0d1793775a3df17b3324d1624d4c1cc
1 parent
f8613ffe
Exists in
master
feat:每日一习调整,添加视频列
Showing
6 changed files
with
87 additions
and
63 deletions
Show diff stats
323 KB
310 KB
106 KB
src/views/answerRank/stars.vue
src/views/dayStudy/dayStudy.vue
1 | 1 | <template> |
2 | - <div> | |
2 | + <div class="box"> | |
3 | 3 | <div class="card" v-for="(v, i) in dataList" :key="i" @click="toPath(v)"> |
4 | 4 | <div class="card_pic"> |
5 | 5 | <img :src="v.url" /> |
6 | 6 | </div> |
7 | 7 | <div class="card_context"> |
8 | - <div class="title">建党百年党课</div> | |
9 | - <div class="group_font">走进红色故地,重温红色精神</div> | |
8 | + <div class="title">{{v.title}}</div> | |
9 | + <div class="group_font">{{v.greyTitle}}</div> | |
10 | 10 | </div> |
11 | 11 | </div> |
12 | 12 | |
... | ... | @@ -17,17 +17,31 @@ |
17 | 17 | <script> |
18 | 18 | import Tabbar4 from "@/component/Tabbar4"; |
19 | 19 | import videoList from '@/views/dayStudy/data.json' |
20 | +import main1 from '@/assets/main1.png' | |
21 | +import main2 from '@/assets/main2.png' | |
22 | +import main3 from '@/assets/main3.png' | |
20 | 23 | export default { |
21 | 24 | components: { Tabbar4 }, |
22 | 25 | data() { |
23 | 26 | return { |
24 | 27 | dataList: [ |
25 | 28 | { |
26 | - url: "https://szyundisk.oss-cn-hangzhou.aliyuncs.com/null/fe0668e6-ecd1-4df4-b416-f9bd6802c06c.png", | |
29 | + url: main2, | |
30 | + title: "研学红色历史 守好红色根脉", | |
31 | + greyTitle: "红色研学实践成果", | |
27 | 32 | path: 'studyList' |
28 | 33 | }, |
29 | 34 | { |
30 | - url: "https://szyundisk.oss-cn-hangzhou.aliyuncs.com/null/fe0668e6-ecd1-4df4-b416-f9bd6802c06c.png", | |
35 | + url: main1, | |
36 | + title: "重温总书记寄语 重走光辉百年路", | |
37 | + greyTitle: "主题教育成果展示", | |
38 | + path: 'YanxuePage' | |
39 | + }, | |
40 | + { | |
41 | + url: main3, | |
42 | + title: "每日一题", | |
43 | + greyTitle: "红色网上游知识竞赛", | |
44 | + path: 'stars' | |
31 | 45 | }, |
32 | 46 | ], |
33 | 47 | }; |
... | ... | @@ -42,36 +56,41 @@ export default { |
42 | 56 | </script> |
43 | 57 | |
44 | 58 | <style lang="scss" scoped> |
45 | -.card { | |
46 | - width: 100vw; | |
47 | - height: 530px; | |
48 | - background-color: #fff; | |
49 | - margin-bottom: 30px; | |
50 | - | |
51 | - .card_pic { | |
52 | - height: 400px; | |
53 | - | |
54 | - img { | |
55 | - width: 100%; | |
56 | - height: 100%; | |
57 | - } | |
58 | - } | |
59 | - .card_context { | |
60 | - height: calc(530px - 400px); | |
61 | - padding: 20px 50px 10px; | |
62 | - box-sizing: border-box; | |
63 | - display: flex; | |
64 | - align-content: space-between; | |
65 | - flex-wrap: wrap; | |
59 | +.box { | |
60 | + padding-bottom: 150px; | |
61 | + box-sizing: border-box; | |
66 | 62 | |
67 | - .title { | |
68 | - width: 100%; | |
69 | - font-weight: bold; | |
70 | - font-size: 32px; | |
63 | + .card { | |
64 | + width: 100vw; | |
65 | + height: 535px; | |
66 | + background-color: #fff; | |
67 | + margin-bottom: 35px; | |
68 | + | |
69 | + .card_pic { | |
70 | + height: 400px; | |
71 | + | |
72 | + img { | |
73 | + width: 100%; | |
74 | + height: 100%; | |
75 | + } | |
71 | 76 | } |
72 | - .group_font { | |
73 | - font-size: 28px; | |
74 | - color: #999; | |
77 | + .card_context { | |
78 | + height: calc(535px - 400px); | |
79 | + padding: 25px 50px 10px; | |
80 | + box-sizing: border-box; | |
81 | + display: flex; | |
82 | + align-content: space-between; | |
83 | + flex-wrap: wrap; | |
84 | + | |
85 | + .title { | |
86 | + width: 100%; | |
87 | + font-weight: bold; | |
88 | + font-size: 32px; | |
89 | + } | |
90 | + .group_font { | |
91 | + font-size: 28px; | |
92 | + color: #999; | |
93 | + } | |
75 | 94 | } |
76 | 95 | } |
77 | 96 | } | ... | ... |
src/views/dayStudy/studyList.vue
1 | 1 | <template> |
2 | - <div> | |
2 | + <div class="box"> | |
3 | 3 | <div class="card" v-for="(v, i) in videoList" :key="i" @click="toPath(v)"> |
4 | 4 | <div class="card_pic"> |
5 | 5 | <img :src="v.url" /> |
... | ... | @@ -35,36 +35,41 @@ export default { |
35 | 35 | </script> |
36 | 36 | |
37 | 37 | <style lang="scss" scoped> |
38 | -.card { | |
39 | - width: 100vw; | |
40 | - height: 530px; | |
41 | - background-color: #fff; | |
42 | - margin-bottom: 30px; | |
38 | +.box { | |
39 | + padding-bottom: 30px; | |
40 | + box-sizing: border-box; | |
43 | 41 | |
44 | - .card_pic { | |
45 | - height: 400px; | |
46 | - | |
47 | - img { | |
48 | - width: 100%; | |
49 | - height: 100%; | |
50 | - } | |
51 | - } | |
52 | - .card_context { | |
53 | - height: calc(530px - 400px); | |
54 | - padding: 20px 50px 10px; | |
55 | - box-sizing: border-box; | |
56 | - display: flex; | |
57 | - align-content: space-between; | |
58 | - flex-wrap: wrap; | |
59 | - | |
60 | - .title { | |
61 | - width: 100%; | |
62 | - font-weight: bold; | |
63 | - font-size: 32px; | |
42 | + .card { | |
43 | + width: 100vw; | |
44 | + height: 535px; | |
45 | + background-color: #fff; | |
46 | + margin-bottom: 30px; | |
47 | + | |
48 | + .card_pic { | |
49 | + height: 400px; | |
50 | + | |
51 | + img { | |
52 | + width: 100%; | |
53 | + height: 100%; | |
54 | + } | |
64 | 55 | } |
65 | - .group_font { | |
66 | - font-size: 28px; | |
67 | - color: #999; | |
56 | + .card_context { | |
57 | + height: calc(535px - 400px); | |
58 | + padding: 25px 50px 10px; | |
59 | + box-sizing: border-box; | |
60 | + display: flex; | |
61 | + align-content: space-between; | |
62 | + flex-wrap: wrap; | |
63 | + | |
64 | + .title { | |
65 | + width: 100%; | |
66 | + font-weight: bold; | |
67 | + font-size: 32px; | |
68 | + } | |
69 | + .group_font { | |
70 | + font-size: 28px; | |
71 | + color: #999; | |
72 | + } | |
68 | 73 | } |
69 | 74 | } |
70 | 75 | } | ... | ... |