Last active
January 13, 2020 20:42
-
-
Save adamki/240c2df899d7f11fa86b1ec89ec56195 to your computer and use it in GitHub Desktop.
heist
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| body { | |
| padding: 0; | |
| margin: 0; | |
| overflow: hidden; /* Don't display any scroll bars */ | |
| } | |
| #app { | |
| height: 100vh; | |
| width: 100%; | |
| text-align: center; | |
| margin: auto; | |
| font-family: 'Orbitron'; | |
| color: #00FF00; | |
| } | |
| .flex { | |
| display: flex; | |
| height: 100%; | |
| } | |
| .left { | |
| height: 100%; | |
| } | |
| .bt { | |
| border-top: 3px solid grey; | |
| } | |
| .bb { | |
| border-bottom: 3px solid grey; | |
| } | |
| .bl { | |
| border-left: 3px solid grey; | |
| } | |
| .br { | |
| border-right: 3px solid grey; | |
| } | |
| .timerText { font-size: 5rem; } | |
| #gif { | |
| background: url("https://www.microage.ca/st-johns/wp-content/uploads/sites/21/2019/07/managed-it-services-it-solutions-banner.png"); | |
| height: 100%; | |
| width: 100%; | |
| } | |
| .right { | |
| flex-direction: column; | |
| height: 100%; | |
| } | |
| .clue-text { | |
| align-items: center; | |
| height: 10rem; | |
| font-size: 5rem; | |
| font-weight: 800; | |
| width: 100%; | |
| } | |
| .marquee { | |
| font-size: 5rem; | |
| font-weight: 800; | |
| } | |
| /* background: url("https://www.microage.ca/st-johns/wp-content/uploads/sites/21/2019/07/managed-it-services-it-solutions-banner.png"); */ |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| <!doctype html> | |
| <html lang="en"> | |
| <head> | |
| <!-- Put your own custom styles in here --> | |
| <link rel="stylesheet" href="./index.css" media="all"> | |
| <!-- Include Webfont to style text in custom font --> | |
| <link href='https://fonts.googleapis.com/css?family=Orbitron' rel='stylesheet' type='text/css'> | |
| </head> | |
| <body> | |
| <!-- The "app" element contains any content that receives dynamic updates --> | |
| <div id="app"> | |
| <div class="flex"> | |
| <div class="left br" style="width: 33%"> | |
| <div class="flex clue-text bb" style="justify-content: center"> | |
| <h3 class="timerText">12:12:49</h3> | |
| </div> | |
| <div id="guard-progress"> | |
| <h1>guard progress</h1> | |
| <img :src="msg.guardProgress"> | |
| </div> | |
| </div> | |
| <div class="flex right" style="width: 67%"> | |
| <div class="flex clue-text bb"> | |
| <marquee><h3>Here's a clue</h3></marquee> | |
| </div> | |
| <div class="flex"> | |
| <div class="left br" style="width: 50%"> | |
| <div> | |
| <h1>Encryption Software Password</h1> | |
| </div> | |
| <div id="gif"> | |
| </div> | |
| </div> | |
| <div class="right" style="width: 50%"> | |
| <h1>Motion Detector Status</h1> | |
| </div> | |
| </div> | |
| </div> | |
| </div> | |
| </div> | |
| <!-- uibuilder script libraries --> | |
| <script src="../uibuilder/vendor/socket.io/socket.io.js"></script> | |
| <script src="../uibuilder/vendor/vue/dist/vue.min.js"></script> | |
| <script src="./uibuilderfe.min.js"></script> | |
| <!-- Put any additional custom code in here --> | |
| <script src="./index.js"></script> | |
| </body> | |
| </html> |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment