update Spin style

This commit is contained in:
梁灏 2017-09-18 17:50:28 +08:00
parent ade5dbba52
commit 4fffb066ab
2 changed files with 13 additions and 11 deletions

View file

@ -144,11 +144,11 @@
<style> <style>
.demo-spin-article{ .demo-spin-article{
width: 400px; /*width: 400px;*/
height: 200px; /*height: 200px;*/
padding: 10px; padding: 10px;
position: relative; position: relative;
border: 1px solid #eee; border: 1px solid red;
text-align: center; text-align: center;
} }
.demo-spin-article h3{ .demo-spin-article h3{
@ -174,7 +174,10 @@
<p>三山半落青天外二水中分白鹭洲</p> <p>三山半落青天外二水中分白鹭洲</p>
<p>总为浮云能蔽日长安不见使人愁</p> <p>总为浮云能蔽日长安不见使人愁</p>
</article> </article>
<Spin size="large" fix v-if="spinShow"></Spin> <Spin size="large" fix v-if="spinShow">
<!--<Icon type="load-c" size=18 class="demo-spin-icon-load"></Icon>-->
<!--<div>Loading</div>-->
</Spin>
</div> </div>
<br> <br>
切换显示状态<i-switch @on-change="spinShow = !spinShow"></i-switch> 切换显示状态<i-switch @on-change="spinShow = !spinShow"></i-switch>

View file

@ -28,19 +28,18 @@
&-fix { &-fix {
position: absolute; position: absolute;
top: 0; top: 0;
bottom: 0;
left: 0; left: 0;
right: 0;
z-index: @zindex-spin; z-index: @zindex-spin;
display: table;
.square(100%); .square(100%);
background-color: #fff; background-color: rgba(255,255,255,.95);
} }
&-fix &-main { &-fix &-main {
display: table-cell; position: absolute;
vertical-align: middle; top: 50%;
.square(inherit); left: 50%;
-ms-transform: translate(-50%, -50%);
transform: translate(-50%, -50%);
} }
&-fix &-dot { &-fix &-dot {