JimmyZhong (Talk | contribs) |
|||
Line 1: | Line 1: | ||
− | |||
<html> | <html> | ||
− | |||
− | |||
<style> | <style> | ||
− | + | body { background: #9cb8b3; } | |
− | + | ||
− | + | ||
− | + | ||
− | body { | + | |
− | + | ||
− | + | ||
− | + | ||
− | } | + | |
− | + | h1 { | |
− | + | font: 600 1.5em/1 'Raleway', sans-serif; | |
− | + | color: rgba(0,0,0,.5); | |
− | + | ||
text-align: center; | text-align: center; | ||
− | + | text-transform: uppercase; | |
+ | letter-spacing: .5em; | ||
+ | position: absolute; | ||
+ | top: 25%; | ||
+ | width: 100%; | ||
+ | padding-top: 50px; | ||
} | } | ||
− | + | span, span:after { | |
+ | font-weight: 900; | ||
+ | color: #efedce; | ||
+ | white-space: nowrap; | ||
+ | display: inline-block; | ||
+ | position: relative; | ||
+ | letter-spacing: .1em; | ||
+ | padding: .2em 0 .25em 0; | ||
} | } | ||
− | + | span { | |
− | + | font-size: 4em; | |
− | + | z-index: 100; | |
− | + | text-shadow: .04em .04em 0 #9cb8b3; | |
− | + | ||
} | } | ||
− | + | span:after { | |
− | + | content: attr(data-shadow-text); | |
− | + | color: rgba(0,0,0,.35); | |
− | + | text-shadow: none; | |
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | color: | + | |
− | + | ||
− | . | + | |
− | + | ||
− | text- | + | |
− | + | ||
− | + | ||
− | + | ||
− | + | ||
position: absolute; | position: absolute; | ||
− | + | left: .0875em; | |
− | left: | + | top: .0875em; |
− | + | z-index: -1; | |
− | + | -webkit-mask-image: url(https://f.cl.ly/items/1t1C0W3y040g1J172r3h/mask.png); | |
− | + | ||
− | + | ||
− | . | + | |
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | / | + | |
− | . | + | |
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
} | } | ||
</style> | </style> | ||
− | |||
<body> | <body> | ||
− | < | + | <!-- The following reset code was given by William Kwok from the UW iGEM team --> |
− | + | <!-- Add on-page javascript for destroying default iGEM CSS and adding a loading animation --> | |
− | + | <!-- I do it twice to run once so the page loading animation gets correct styling the first run --> | |
− | + | <!-- Second run is just to make sure everything gets ran --> | |
− | + | <script type="text/javascript"> | |
− | + | $('div#content').removeAttr('id').attr('id', 'contentBox'); | |
− | + | $('a#top').remove(); | |
− | + | $('div#top_title').remove(); | |
− | + | $('div#HQ_page').removeAttr('id'); | |
− | + | $('div.mw-body').removeAttr('class'); | |
− | </ | + | $('div#mw-content-text').removeAttr('id'); |
− | + | $('div#bodyContent').removeAttr('id'); | |
+ | $('div.mw-content-ltr>p').addClass('meta'); | ||
+ | $('div.mw-content-ltr').removeAttr('class'); | ||
+ | document.getElementById("root").innerText = "Page loading..."; | ||
+ | $(document).ready(function () { | ||
+ | $('div#content').removeAttr('id').attr('id', 'contentBox'); | ||
+ | $('a#top').remove(); | ||
+ | $('div#top_title').remove(); | ||
+ | $('div#HQ_page').removeAttr('id'); | ||
+ | $('div.mw-body').removeAttr('class'); | ||
+ | $('div#mw-content-text').removeAttr('id'); | ||
+ | $('div#bodyContent').removeAttr('id'); | ||
+ | $('div.mw-content-ltr>p').addClass('meta'); | ||
+ | $('div.mw-content-ltr').removeAttr('class'); | ||
+ | }) | ||
+ | </script> | ||
+ | <body> | ||
+ | <h1>We are sorry but our page is<br><span data-shadow-text="Under Construction">Under Construction</span><br> Please check back later</h1> | ||
+ | </body> | ||
</html> | </html> |
Revision as of 06:47, 3 August 2018