wwl-ui-msg-yy/style.css

一个简单的ui组件库,elementui测试3

.btn[data-v-a08ed7f3]{display:inline-block;border-radius:20px;background-color:#f4511e;border:none;color:#fff;text-align:center;font-size:28px;font-weight:400;padding:18px;width:200px;transition:all .5s;cursor:pointer;margin:5px;vertical-align:middle}.btn span[data-v-a08ed7f3]{cursor:pointer;display:inline-block;position:relative;transition:.5s}.btn span[data-v-a08ed7f3]:after{content:">";position:absolute;opacity:0;top:0;right:-20px;transition:.5s}.btn:hover span[data-v-a08ed7f3]{padding-right:30px}.btn:hover span[data-v-a08ed7f3]:after{opacity:1;right:0}.msg[data-v-9efb94cb]{height:22px;position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:0;min-height:0;text-align:center;background-color:#00000080;border-radius:5px;color:#fff;transition:all .5s;z-index:-1;opacity:0}.msg.active[data-v-9efb94cb]{width:150px;min-height:25px;opacity:1;z-index:11}