vue-smart-app-banner/dist/style.css

Smart banner for vue.js 2-3

.smartbanner-show[data-v-9d9043c2]{margin-top:80px}.smartbanner-show .smartbanner[data-v-9d9043c2]{display:block}.smartbanner[data-v-9d9043c2]{position:absolute;left:0;top:0;display:none;width:100%;height:80px;line-height:80px;font-family:Helvetica Neue,sans-serif;background:#f4f4f4;z-index:9998;-webkit-font-smoothing:antialiased;overflow:hidden;-webkit-text-size-adjust:none}.smartbanner-container[data-v-9d9043c2]{margin:0 auto;white-space:nowrap}.smartbanner-close[data-v-9d9043c2]{display:inline-block;vertical-align:middle;margin:0 5px;font-family:ArialRoundedMTBold,Arial;font-size:20px;text-align:center;color:#888;text-decoration:none;border:0;border-radius:14px;-webkit-font-smoothing:subpixel-antialiased}.smartbanner-close[data-v-9d9043c2]:active,.smartbanner-close[data-v-9d9043c2]:hover{color:#aaa}.smartbanner-icon[data-v-9d9043c2]{display:inline-block;vertical-align:middle;width:57px;height:57px;margin-right:12px;background-size:cover;border-radius:10px}.smartbanner-info[data-v-9d9043c2]{display:inline-block;vertical-align:middle;width:44%;font-size:11px;line-height:1.2em;font-weight:700}.smartbanner-title[data-v-9d9043c2]{font-size:13px;line-height:18px}.smartbanner-button[data-v-9d9043c2]{position:absolute;right:20px;top:0;bottom:0;margin:auto 0;height:24px;font-size:14px;line-height:24px;text-align:center;font-weight:700;color:#6a6a6a;text-transform:uppercase;text-decoration:none;text-shadow:0 1px 0 rgba(255,255,255,.8)}.smartbanner-button[data-v-9d9043c2]:active,.smartbanner-button[data-v-9d9043c2]:hover{color:#aaa}.smartbanner-ios[data-v-9d9043c2]{background:#f4f4f4;background:linear-gradient(to bottom,#f4f4f4,#cdcdcd);box-shadow:0 1px 2px #00000080;line-height:80px}.smartbanner-ios .smartbanner-close[data-v-9d9043c2]{border:0;width:18px;height:18px;line-height:18px;color:#888;text-shadow:0 1px 0 white}.smartbanner-ios .smartbanner-close[data-v-9d9043c2]:active,.smartbanner-ios .smartbanner-close[data-v-9d9043c2]:hover{color:#aaa}.smartbanner-ios .smartbanner-icon[data-v-9d9043c2]{background:rgba(0,0,0,.6);background-size:cover;box-shadow:0 1px 3px #0000004d}.smartbanner-ios .smartbanner-info[data-v-9d9043c2]{color:#6a6a6a;text-shadow:0 1px 0 rgba(255,255,255,.8)}.smartbanner-ios .smartbanner-title[data-v-9d9043c2]{color:#4d4d4d;font-weight:700}.smartbanner-ios .smartbanner-button[data-v-9d9043c2]{padding:0 10px;min-width:10%;color:#6a6a6a;background:#efefef;background:linear-gradient(to bottom,#efefef,#dcdcdc);border-radius:3px;box-shadow:inset 0 0 0 1px #bfbfbf,0 1px #fff9,0 2px #ffffffb3 inset}.smartbanner-ios .smartbanner-button[data-v-9d9043c2]:active,.smartbanner-ios .smartbanner-button[data-v-9d9043c2]:hover{background:#dcdcdc;background:linear-gradient(to bottom,#dcdcdc,#efefef)}.smartbanner-android[data-v-9d9043c2]{background:#3d3d3d url(data:image/gif;base64,R0lGODlhCAAIAIABAFVVVf///yH5BAEHAAEALAAAAAAIAAgAAAINRG4XudroGJBRsYcxKAA7);box-shadow:inset 0 4px #88b131;line-height:82px}.smartbanner-android .smartbanner-close[data-v-9d9043c2]{border:0;width:17px;height:17px;line-height:17px;margin-right:7px;color:#b1b1b3;background:#1c1e21;text-shadow:0 1px 1px #000;box-shadow:0 1px 2px #000c inset,0 1px 1px #ffffff4d}.smartbanner-android .smartbanner-close[data-v-9d9043c2]:active,.smartbanner-android .smartbanner-close[data-v-9d9043c2]:hover{color:#eee}.smartbanner-android .smartbanner-icon[data-v-9d9043c2]{background-color:transparent;box-shadow:none}.smartbanner-android .smartbanner-info[data-v-9d9043c2]{color:#ccc;text-shadow:0 1px 2px #000}.smartbanner-android .smartbanner-title[data-v-9d9043c2]{color:#fff;font-weight:700}.smartbanner-android .smartbanner-button[data-v-9d9043c2]{min-width:12%;color:#d1d1d1;padding:0;background:none;border-radius:0;box-shadow:0 0 0 1px #333,0 0 0 2px #dddcdc}.smartbanner-android .smartbanner-button[data-v-9d9043c2]:active,.smartbanner-android .smartbanner-button[data-v-9d9043c2]:hover{background:none}.smartbanner-android .smartbanner-button-text[data-v-9d9043c2]{text-align:center;display:block;padding:0 10px;background:#42b6c9;background:linear-gradient(to bottom,#42b6c9,#39a9bb);text-transform:none;text-shadow:none;box-shadow:none}.smartbanner-android .smartbanner-button-text[data-v-9d9043c2]:active,.smartbanner-android .smartbanner-button-text[data-v-9d9043c2]:hover{background:#2ac7e1}