feat(*): add new style

src/assets/css/tailwind.css

@@ -912,9 +912,23 @@ video {
 .bg-blue-900 {
     background-color: #2a4365;
 }
+
 .bg-purple {
     background: #0d134d;
 }
+
+.bg-purple-100 {
+    background: #3944ad;
+}
+
+.bg-purple-200 {
+    background: #3944ad;
+}
+
+.bg-purple-300 {
+    background: #515dc3;
+}
+
 .bg-bottom {
     background-position: bottom;
 }

src/components/vote-item/vote-item.vue

@@ -3,24 +3,26 @@
  * @Author: Steven
  * @Date: 2020-09-08 09:24:24
  * @LastEditors: Steven
- * @LastEditTime: 2020-09-10 09:20:08
+ * @LastEditTime: 2020-09-10 10:23:02
 -->
 <template>
-  <view class="flex flex-col w-1-2 text-center justify-center">
-    <view class="code">{{ item.id }}</view>
+  <view
+    class="flex flex-col w-1-2 text-center justify-center border border-solid border-gray-600 bg-purple-100 my-2 p-2"
+  >
+    <view class="text-gray-500 my-1">{{ item.id }} 号</view>
     <navigator url="#">
-      <image :src="item.img" mode=""></image>
-      <view class="name">{{ item.name }}</view>
-      <view class="group">{{ item.group }}</view>
+      <image :src="item.img" mode="widthFix" style="width: 100%; background-color: #eeeeee;"></image>
+      <view class="text-gray-100 text-lg font-bold mt-1">{{ item.name }}</view>
+      <view class="text-gray-500 my-1">{{ item.group }}</view>
     </navigator>
 
-    <view class="flex w-4-5">
+    <view class="flex w-full">
       <view
-        class="border border-solid border-gray-500 bg-gray-500 text-white p-2"
+        class="flex-1 border border-solid border-gray-500 bg-purple-300 text-white p-2"
         >{{ item.vote }}</view
       >
       <view
-        class="border border-solid border-orange-500 bg-orange-500 text-white p-2"
+        class="flex-1 border border-solid border-orange-500 bg-orange-500 text-white p-2"
         >投票</view
       >
     </view>

src/pages/index/index.vue

@@ -3,7 +3,7 @@
  * @Author: Steven
  * @Date: 2020-08-26 16:08:15
  * @LastEditors: Steven
- * @LastEditTime: 2020-09-09 16:12:21
+ * @LastEditTime: 2020-09-10 10:25:37
 -->
 <template>
   <view class="bg-purple">
@@ -12,6 +12,7 @@
     <brief-desc></brief-desc>
     <search-bar></search-bar>
     <vote-list :items="items" :pageType="pageType"></vote-list>
+    <vote-footer></vote-footer>
   </view>
 </template>
 
@@ -22,6 +23,7 @@ import stats from "@/components/stats/stats.vue"
 import briefDesc from "@/components/brief-desc/brief-desc.vue"
 import searchBar from "@/components/search-bar/search-bar.vue"
 import voteList from "@/components/vote-list/vote-list.vue"
+import voteFooter from "@/components/footer/footer.vue"
 import { items } from "@/mock/store"
 export default Vue.extend({
   data() {
@@ -38,6 +40,7 @@ export default Vue.extend({
     briefDesc,
     searchBar,
     voteList,
+    voteFooter,
   },
 })
 </script>