Hooke / hager

Go to a project
Toggle navigation Toggle navigation pinning
hookehuyr
b83d2028 1 parent 8660e4f3

fix 登录显示问题优化

Inline Side-by-side
Showing 4 changed files with 8 additions and 7 deletions
1 <!-- 1 <!--
2 * @Date: 2024-10-20 09:59:52 2 * @Date: 2024-10-20 09:59:52
3 * @LastEditors: hookehuyr hookehuyr@gmail.com 3 * @LastEditors: hookehuyr hookehuyr@gmail.com
4 - * @LastEditTime: 2024-10-20 11:22:12 4 + * @LastEditTime: 2024-10-21 09:35:58
5 * @FilePath: /hager/src/components/common/hagerInput.vue 5 * @FilePath: /hager/src/components/common/hagerInput.vue
6 * @Description: 文件描述 6 * @Description: 文件描述
7 --> 7 -->
...@@ -100,6 +100,7 @@ export default { ...@@ -100,6 +100,7 @@ export default {
100 display: flex; 100 display: flex;
101 align-items: center; 101 align-items: center;
102 justify-content: space-between; 102 justify-content: space-between;
103 + box-sizing: border-box; /* 确保内边距和边框不会增加总宽度 */
103 &.disable { 104 &.disable {
104 background-color:#F9F9F9; 105 background-color:#F9F9F9;
105 border: 1px solid #F9F9F9; 106 border: 1px solid #F9F9F9;
...@@ -118,7 +119,7 @@ export default { ...@@ -118,7 +119,7 @@ export default {
118 } 119 }
119 input { 120 input {
120 border: 0; 121 border: 0;
121 - width: 100%; 122 + width: calc(100% - 2rem); /* 调整输入框的宽度 */
122 } 123 }
123 } 124 }
124 } 125 }
......
...@@ -8,7 +8,7 @@ ...@@ -8,7 +8,7 @@
8 <template> 8 <template>
9 <div class="hager-info-page"> 9 <div class="hager-info-page">
10 <div class="input-title">我的信息</div> 10 <div class="input-title">我的信息</div>
11 - <div style="padding: 1rem;"> 11 + <div style="padding: 1rem 1.5rem 1rem 1rem;">
12 <hagerInput type="email" :disable="status !== 'edit'" required v-model="email" placeholder="请输入注册邮箱地址" /> 12 <hagerInput type="email" :disable="status !== 'edit'" required v-model="email" placeholder="请输入注册邮箱地址" />
13 <hagerInput type="pwd" :disable="status !== 'edit'" required v-model="pwd" placeholder="请输入登录密码" /> 13 <hagerInput type="pwd" :disable="status !== 'edit'" required v-model="pwd" placeholder="请输入登录密码" />
14 <hagerInput type="username" :disable="status !== 'edit'" v-model="username" placeholder="请输入姓名" /> 14 <hagerInput type="username" :disable="status !== 'edit'" v-model="username" placeholder="请输入姓名" />
......
1 <!-- 1 <!--
2 * @Date: 2024-10-18 18:00:47 2 * @Date: 2024-10-18 18:00:47
3 * @LastEditors: hookehuyr hookehuyr@gmail.com 3 * @LastEditors: hookehuyr hookehuyr@gmail.com
4 - * @LastEditTime: 2024-10-20 12:10:35 4 + * @LastEditTime: 2024-10-21 09:41:08
5 * @FilePath: /hager/src/views/user/login.vue 5 * @FilePath: /hager/src/views/user/login.vue
6 * @Description: 文件描述 6 * @Description: 文件描述
7 --> 7 -->
8 <template> 8 <template>
9 <div class="hager-login-page"> 9 <div class="hager-login-page">
10 <div class="input-title">用户登录</div> 10 <div class="input-title">用户登录</div>
11 - <div style="padding: 1rem;"> 11 + <div style="padding: 1rem 1.5rem 1rem 1rem;">
12 <hagerInput type="email" required v-model="email" placeholder="请输入注册邮箱地址" /> 12 <hagerInput type="email" required v-model="email" placeholder="请输入注册邮箱地址" />
13 <hagerInput type="pwd" required v-model="pwd" placeholder="请输入登录密码" /> 13 <hagerInput type="pwd" required v-model="pwd" placeholder="请输入登录密码" />
14 <!-- TODO: 记住密码和忘记密码业务显示的问题？ --> 14 <!-- TODO: 记住密码和忘记密码业务显示的问题？ -->
......
1 <!-- 1 <!--
2 * @Date: 2024-10-18 18:00:47 2 * @Date: 2024-10-18 18:00:47
3 * @LastEditors: hookehuyr hookehuyr@gmail.com 3 * @LastEditors: hookehuyr hookehuyr@gmail.com
4 - * @LastEditTime: 2024-10-20 12:06:47 4 + * @LastEditTime: 2024-10-21 09:47:23
5 * @FilePath: /hager/src/views/user/register.vue 5 * @FilePath: /hager/src/views/user/register.vue
6 * @Description: 文件描述 6 * @Description: 文件描述
7 --> 7 -->
8 <template> 8 <template>
9 <div class="hager-register-page"> 9 <div class="hager-register-page">
10 <div class="input-title">用户注册</div> 10 <div class="input-title">用户注册</div>
11 - <div style="padding: 1rem;"> 11 + <div style="padding: 1rem 1.5rem 1rem 1rem;">
12 <hagerInput type="email" required v-model="email" placeholder="请输入注册邮箱地址" /> 12 <hagerInput type="email" required v-model="email" placeholder="请输入注册邮箱地址" />
13 <hagerInput type="pwd" required v-model="pwd" placeholder="请输入登录密码" /> 13 <hagerInput type="pwd" required v-model="pwd" placeholder="请输入登录密码" />
14 <hagerInput type="username" v-model="username" placeholder="请输入姓名" /> 14 <hagerInput type="username" v-model="username" placeholder="请输入姓名" />
......