embark-area-51/lib/modules/code_generator/code_templates/embark-building-placeholder...

28 lines
7.8 KiB
Plaintext
Raw Normal View History

<!doctype html>
<html>
<head>
<title><%- buildingMsg %></title>
<meta http-equiv="refresh" content="4">
<style>
body{background:#f2f2f5;background-size:cover;font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Helvetica,Arial,sans-serif}.blobs{-webkit-filter:url("#goo");filter:url("#goo");position:absolute;top:0;left:-2.5%;bottom:0;right:0}@-webkit-keyframes blob-left-top-anim{0%{-webkit-transform:scale(1.1) translate(0,0);transform:scale(1.1) translate(0,0)}33%{-webkit-transform:scale(.9) translate(-95px,0);transform:scale(.9) translate(-95px,0)}62%{-webkit-transform:scale(.7) translate(-95px,-95px);transform:scale(.7) translate(-95px,-95px)}94%{-webkit-transform:scale(1.1) translate(0,0);transform:scale(1.1) translate(0,0)}}@keyframes blob-left-top-anim{0%{-webkit-transform:scale(1.1) translate(0,0);transform:scale(1.1) translate(0,0)}33%{-webkit-transform:scale(.9) translate(-95px,0);transform:scale(.9) translate(-95px,0)}62%{-webkit-transform:scale(.7) translate(-95px,-95px);transform:scale(.7) translate(-95px,-95px)}94%{-webkit-transform:scale(1.1) translate(0,0);transform:scale(1.1) translate(0,0)}}@-webkit-keyframes blob-right-top-anim{0%{-webkit-transform:scale(1.1) translate(0,0);transform:scale(1.1) translate(0,0)}33%{-webkit-transform:scale(.9) translate(95px,0);transform:scale(.9) translate(95px,0)}64%{-webkit-transform:scale(.7) translate(95px,-95px);transform:scale(.7) translate(95px,-95px)}96%{-webkit-transform:scale(1.1) translate(0,0);transform:scale(1.1) translate(0,0)}}@keyframes blob-right-top-anim{0%{-webkit-transform:scale(1.1) translate(0,0);transform:scale(1.1) translate(0,0)}33%{-webkit-transform:scale(.9) translate(95px,0);transform:scale(.9) translate(95px,0)}64%{-webkit-transform:scale(.7) translate(95px,-95px);transform:scale(.7) translate(95px,-95px)}96%{-webkit-transform:scale(1.1) translate(0,0);transform:scale(1.1) translate(0,0)}}@-webkit-keyframes blob-left-bottom-anim{0%{-webkit-transform:scale(1.1) translate(0,0);transform:scale(1.1) translate(0,0)}33%{-webkit-transform:scale(.9) translate(-95px,0);transform:scale(.9) translate(-95px,0)}66%{-webkit-transform:scale(.7) translate(-95px,95px);transform:scale(.7) translate(-95px,95px)}98%{-webkit-transform:scale(1.1) translate(0,0);transform:scale(1.1) translate(0,0)}}@keyframes blob-left-bottom-anim{0%{-webkit-transform:scale(1.1) translate(0,0);transform:scale(1.1) translate(0,0)}33%{-webkit-transform:scale(.9) translate(-95px,0);transform:scale(.9) translate(-95px,0)}66%{-webkit-transform:scale(.7) translate(-95px,95px);transform:scale(.7) translate(-95px,95px)}98%{-webkit-transform:scale(1.1) translate(0,0);transform:scale(1.1) translate(0,0)}}@-webkit-keyframes blob-right-bottom-anim{0%{-webkit-transform:scale(1.1) translate(0,0);transform:scale(1.1) translate(0,0)}33%{-webkit-transform:scale(.9) translate(95px,0);transform:scale(.9) translate(95px,0)}68%{-webkit-transform:scale(.7) translate(95px,95px);transform:scale(.7) translate(95px,95px)}100%{-webkit-transform:scale(1.1) translate(0,0);transform:scale(1.1) translate(0,0)}}@keyframes blob-right-bottom-anim{0%{-webkit-transform:scale(1.1) translate(0,0);transform:scale(1.1) translate(0,0)}33%{-webkit-transform:scale(.9) translate(95px,0);transform:scale(.9) translate(95px,0)}68%{-webkit-transform:scale(.7) translate(95px,95px);transform:scale(.7) translate(95px,95px)}100%{-webkit-transform:scale(1.1) translate(0,0);transform:scale(1.1) translate(0,0)}}.blob{position:absolute;background-color:#363763;background-image:url('data:image/svg+xml;charset=UTF-8,<svg width="24" height="24" xmlns="http://www.w3.org/2000/svg"><path d="M20 17H4l8-10z" fill-rule="evenodd" opacity=".05"/></svg>');left:50%;top:50%;width:150px;height:150px;line-height:150px;text-align:center;color:white;font-size:40px;border-radius:100%;margin-top:-50px;margin-left:-50px;-webkit-animation:blob-left-top-anim cubic-bezier(.77,0,.175,1) 4s infinite;animation:blob-left-top-anim cubic-bezier(.77,0,.175,1) 4s infinite}.blob:before{position:absolute;width:100%;height:100%;background-repeat:no-repeat;background-image:url('data:image/svg+xml;charset=UTF-8,<svg width="117" height="27" xmlns="http://www.w3.org/2000/svg"><pa
</style>
</head>
<body>
<div class="blobs">
<div class="blob"></div>
<div class="blob"></div>
<div class="blob"></div>
<div class="blob"></div>
</div>
<svg xmlns="http://www.w3.org/2000/svg" version="1.1">
<defs>
<filter id="goo">
<feGaussianBlur in="SourceGraphic" stdDeviation="10" result="blur" />
<feColorMatrix in="blur" mode="matrix" values="1 0 0 0 0 0 1 0 0 0 0 0 1 0 0 0 0 0 18 -7" result="goo" />
<feBlend in="SourceGraphic" in2="goo" />
</filter>
</defs>
</svg>
<h1 class="loading-msg"><%- buildingMsg %></h1>
</body>
</html>