feat: update style

common/uni.css

@@ -15,6 +15,7 @@
     margin-top: 10rpx;
     font-size: 24rpx;
     color: #888;
+    font-weight: 500;
 }
 
 .uni-common-mb {
@@ -35,6 +36,7 @@
 
 .uni-hello-text {
     color: #7A7E83;
+    line-height: 22px;
 }
 
 .uni-list {
@@ -42,6 +44,7 @@
     position: relative;
     display: flex;
     flex-direction: column;
+    padding-left: 30rpx;
 }
 
 .uni-list-cell {
@@ -52,12 +55,16 @@
     align-items: center;
 }
 
+.uni-list-cell-line {
+    border-bottom: 1px solid #c8c7cc;
+}
+
 .uni-list-cell-hover {
     background-color: #eee;
 }
 
 .uni-list-cell-pd {
-    padding: 22rpx 30rpx;
+    padding: 22rpx 30rpx 22rpx 0;
 }
 
 .uni-list-cell-left {
@@ -68,14 +75,14 @@
 .uni-list-cell-db,
 .uni-list-cell-right {
     flex: 1;
-}
-
+}
+
 .uni-label {
 	width: 210rpx;
 	/* word-wrap: break-word;
 	word-break: break-all;
 	text-indent:20rpx; */
-}
+}
 
 .uni-input {
 	height: 50rpx;

main.uts

 import App from './App'
-import PageHead from './components/page-head/page-head'
-import ULink from './components/u-link/u-link'
+
 import { createSSRApp } from 'vue'
 export function createApp() {
   const app = createSSRApp(App)
-  app.component('page-head', PageHead)
-  app.component('u-link', ULink)
+
   return {
     app
   }

pages/component/button/button.uvue

@@ -65,8 +65,7 @@
     }
 
     .button-sp-area {
-        /* margin: 0 auto; */
-        padding: 0 20%;
+        margin: 0 auto;
         width: 60%;
     }
 

pages/component/checkbox/checkbox.uvue

@@ -40,7 +40,8 @@
         </view>
         <view class="uni-list">
             <checkbox-group @change="checkboxChange">
-                <view class="uni-list-cell uni-list-cell-pd" v-for="item in items" :key="item.value">
+                <view class="uni-list-cell uni-list-cell-pd" v-for="(item, index) in items" :key="item.value"
+                    :class="index < items.length - 1 ? 'uni-list-cell-line': ''">
                     <view>
                         <checkbox :value="item.value" :checked="item.checked">{{item.name}}</checkbox>
                     </view>
@@ -93,13 +94,13 @@
             }
         },
         methods: {
-            checkboxChange: function (value : string[]) {
+            checkboxChange: function (value : string[]) {
                 // TODO 后续更改参数
                 var items = this.items,
-                    values = value;
+                    values = value;
                 for (var i = 0, lenI = items.length; i < lenI; ++i) {
-                    const item = items[i]
-                    if (values.indexOf(item.value) >= 0) {
+                    const item = items[i]
+                    if (values.indexOf(item.value) >= 0) {
                         item.checked = true
                     } else {
                         item.checked = false

pages/component/radio/radio.uvue

@@ -33,7 +33,8 @@
         </view>
         <view class="uni-list">
             <radio-group @change="radioChange">
-                <view class="uni-list-cell uni-list-cell-pd" v-for="(item, index) in items" :key="item.value">
+                <view class="uni-list-cell uni-list-cell-pd" v-for="(item, index) in items" :key="item.value"
+                    :class="index < items.length - 1 ? 'uni-list-cell-line': ''">
                     <view>
                         <radio :value="item.value" :checked="index === current">{{item.name}}</radio>
                     </view>

pages/component/view/view.uvue

@@ -25,7 +25,7 @@
 
             <view class="uni-title uni-common-mt">
                 <text class="uni-title-text">
-                    column
+                    flex-direction: column
                 </text>
                 <text class="uni-subtitle-text">
                     纵向布局
@@ -78,14 +78,14 @@
                 <view class="text-box" style="width: 200rpx;"><text class="text">固定宽度</text></view>
             </view>
             <view class="uni-flex uni-row" style="-webkit-flex-wrap: wrap;flex-wrap: wrap;">
-                <view class="text-box" style="width: 280rpx;"><text class="text">一行显示不全,wrap折行</text></view>
-                <view class="text-box" style="width: 280rpx;"><text class="text">一行显示不全,wrap折行</text></view>
-                <view class="text-box" style="width: 280rpx;"><text class="text">一行显示不全,wrap折行</text></view>
+                <view class="text-box" style="width: 320rpx;"><text class="text">一行显示不全,wrap折行</text></view>
+                <view class="text-box" style="width: 320rpx;"><text class="text">一行显示不全,wrap折行</text></view>
+                <view class="text-box" style="width: 320rpx;"><text class="text">一行显示不全,wrap折行</text></view>
             </view>
             <view class="uni-flex uni-row">
                 <view class="text-box"
                     style="-webkit-flex: 1;flex: 1;height: 200rpx;-webkit-justify-content: center;justify-content: center;-webkit-align-items: flex-start;align-items: flex-start;">
-                    <text class="text">垂直居顶</text>
+                    <text class="text" style="line-height: 70rpx;">垂直居顶</text>
                 </view>
                 <view class="text-box"
                     style="-webkit-flex: 1;flex: 1;height: 200rpx;-webkit-justify-content: center;justify-content: center;-webkit-align-items: center;align-items: center;">
@@ -93,7 +93,7 @@
                 </view>
                 <view class="text-box"
                     style="-webkit-flex: 1;flex: 1;height: 200rpx;-webkit-justify-content: center;justify-content: center;-webkit-align-items: flex-end;align-items: flex-end;">
-                    <text class="text">垂直居底</text>
+                    <text class="text" style="line-height: 70rpx;">垂直居底</text>
                 </view>
             </view>
 
@@ -115,7 +115,7 @@
 
                     <view class="text-box"
                         style="height: 120rpx;justify-content: start;align-items: start;padding-left: 20rpx;">
-                        <text class="text">文字居左，留出左间距</text>
+                        <text class="text" style="line-height: 70rpx;">文字居左，留出左间距</text>
                     </view>
 
                     <view class="uni-flex uni-row">
@@ -167,7 +167,6 @@
     }
 
     .text {
-        line-height: 70rpx;
         color: #777;
         font-size: 26rpx;
     }