Authored by ccbikai

修改地址页面样式

@@ -98,3 +98,77 @@ @@ -98,3 +98,77 @@
98 } 98 }
99 } 99 }
100 } 100 }
  101 +
  102 +.my-edit-address-page {
  103 + position: absolute;
  104 + bottom: 0;
  105 + top: pxToRem(90px);
  106 + width: 100%;
  107 + color: #d0d0d0;
  108 + background: #f0f0f0;
  109 +
  110 + .edit-address {
  111 + padding: 0 pxToRem(30px);
  112 + background: #fff;
  113 + font-size: pxToRem(30px);
  114 + line-height: pxToRem(88px);
  115 + border-bottom: 1px solid #e0e0e0;
  116 +
  117 + label {
  118 + display: block;
  119 + position: relative;
  120 +
  121 + &:after {
  122 + content: "";
  123 + position: absolute;
  124 + right: pxToRem(-30px);
  125 + bottom: 0;
  126 + width: pxToRem(610px);
  127 + height: 0;
  128 + border-top: 1px solid #e0e0e0;
  129 + }
  130 +
  131 + &:last-of-type:after {
  132 + content: none;
  133 + }
  134 +
  135 + .iconfont {
  136 + position: absolute;
  137 + right: 0;
  138 + top: 0;
  139 + }
  140 + }
  141 +
  142 + input, textarea {
  143 + position: absolute;
  144 + top: 0;
  145 + right: 0;
  146 + width: pxToRem(400px);
  147 + height: pxToRem(88px);
  148 + color: #444;
  149 + padding: 0;
  150 + border: none;
  151 + -webkit-appearance: none;
  152 + }
  153 +
  154 + .address {
  155 + height: pxToRem(88px) * 2;
  156 + }
  157 +
  158 + textarea {
  159 + height: pxToRem(58px) * 2;
  160 + padding: pxToRem(20px) pxToRem(10px);
  161 + }
  162 + }
  163 +
  164 + .submit {
  165 + margin: pxToRem(30px) auto 0;
  166 + width: pxToRem(470px);
  167 + height: pxToRem(88px);
  168 + color: #fff;
  169 + background: #444;
  170 + text-align: center;
  171 + font-size: pxToRem(32px);
  172 + line-height: pxToRem(88px);
  173 + }
  174 +}
  1 +{{> layout/header}}
  2 +<div class="my-edit-address-page yoho-page">
  3 + <form class="edit-address">
  4 + <label class="username">
  5 + 用户名
  6 + <input type="text" name="name" value="张三">
  7 + </label>
  8 + <label class="mobile">
  9 + 手机号码
  10 + <input type="text" name="mobile" value="18911110110">
  11 + </label>
  12 + <label class="area">
  13 + 省市区
  14 + <input type="text" name="area" value="江苏省南京市栖霞区">
  15 + <span class="iconfont">&#xe604;</span>
  16 + </label>
  17 + <label class="address">
  18 + 详细地址
  19 + <textarea name="address">东大街西大66号茶馆东大街西大66号茶馆东大街西大66号茶馆</textarea>
  20 + </label>
  21 +
  22 + </form>
  23 +
  24 + <div class="submit">
  25 + 确认
  26 + </div>
  27 +</div>
  28 +{{> layout/footer}}