other / mew-iview

Commit 5f78b0a662d0ec61bd8052161b3c25027513195d

Authored by Aresn
1 parent c0478e27

update Page style #1252

Showing 2 changed files with 19 additions and 15 deletions   Show diff stats
Inline Side-by-side
examples/routers/page.vue
  Show/Hide comments   View file @5f78b0a
1 1 <template>
2   - <div style="margin: 100px;">
3   - <Page :total="100" :current="val" show-sizer placement="top"></Page>
4   - </div>
  2 + <Page :total="100" show-sizer show-elevator show-total></Page>
5 3 </template>
6 4 <script>
7 5 export default {
8   - data () {
9   - return {
10   - val: 2
11   - }
12   - }
  6 +
13 7 }
14 8 </script>
... ...
src/styles/components/page.less
  Show/Hide comments   View file @5f78b0a
... ... @@ -11,7 +11,9 @@
11 11 }
12 12  
13 13 &-item {
14   - float: left;
  14 + display: inline-block;
  15 + //float: left;
  16 + vertical-align: middle;
15 17 min-width: @btn-circle-size;
16 18 height: @btn-circle-size;
17 19 line-height: @btn-circle-size - 2px;
... ... @@ -104,7 +106,8 @@
104 106 &-item-jump-prev,
105 107 &-item-jump-next {
106 108 display: inline-block;
107   - float: left;
  109 + vertical-align: middle;
  110 + //float: left;
108 111 min-width: @btn-circle-size;
109 112 height: @btn-circle-size;
110 113 line-height: @btn-circle-size - 2px;
... ... @@ -151,15 +154,20 @@
151 154 }
152 155  
153 156 &-options {
154   - float: left;
  157 + display: inline-block;
  158 + vertical-align: middle;
  159 + //float: left;
155 160 margin-left: 15px;
156 161 &-sizer {
157   - float: left;
  162 + display: inline-block;
  163 + //float: left;
158 164 margin-right: 10px;
159 165 }
160 166  
161 167 &-elevator {
162   - float: left;
  168 + display: inline-block;
  169 + vertical-align: middle;
  170 + //float: left;
163 171 height: @btn-circle-size;
164 172 line-height: @btn-circle-size;
165 173  
... ... @@ -173,7 +181,8 @@
173 181 }
174 182  
175 183 &-total {
176   - float: left;
  184 + display: inline-block;
  185 + //float: left;
177 186 height: @btn-circle-size;
178 187 line-height: @btn-circle-size;
179 188 margin-right: 10px;
... ... @@ -189,7 +198,8 @@
189 198 }
190 199  
191 200 &-simple &-simple-pager {
192   - float: left;
  201 + display: inline-block;
  202 + //float: left;
193 203 margin-right: 8px;
194 204  
195 205 input {
... ...