summaryrefslogtreecommitdiff
path: root/dino/css
diff options
context:
space:
mode:
authors1n <[email protected]>2020-03-28 10:31:08 -0700
committers1n <[email protected]>2020-03-28 10:31:08 -0700
commit6b81836e6b9815a2996a55ad37dcaa4d89f99e42 (patch)
tree74bb9aa78ca31a6acfffd908e34dfb0df433c707 /dino/css
parentCreate .gitignore (diff)
downloadcyne.cf-backup-master.tar.xz
cyne.cf-backup-master.zip
3/28/2020, 10:30HEADmaster
Diffstat (limited to 'dino/css')
-rw-r--r--dino/css/main.css170
1 files changed, 170 insertions, 0 deletions
diff --git a/dino/css/main.css b/dino/css/main.css
new file mode 100644
index 0000000..f5774fa
--- /dev/null
+++ b/dino/css/main.css
@@ -0,0 +1,170 @@
+/* latin */
+@font-face {
+ font-family: 'Press Start 2P';
+ font-style: normal;
+ font-weight: 400;
+ src: local('Press Start 2P Regular'), local('PressStart2P-Regular'), url(https://fonts.gstatic.com/s/pressstart2p/v8/e3t4euO8T-267oIAQAu6jDQyK3nVivM.woff2) format('woff2');
+ unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
+ }
+
+html,
+body {
+ padding: 0;
+ margin: 0;
+ width: 100%;
+ height: 100%;
+}
+
+.icon {
+ -webkit-user-select: none;
+ user-select: none;
+ display: inline-block;
+}
+
+.icon-offline {
+ content: -webkit-image-set(
+ url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAEgAAABIAQMAAABvIyEEAAAABlBMVEUAAABTU1OoaSf/AAAAAXRSTlMAQObYZgAAAGxJREFUeF7tyMEJwkAQRuFf5ipMKxYQiJ3Z2nSwrWwBA0+DQZcdxEOueaePp9+dQZFB7GpUcURSVU66yVNFj6LFICatThZB6r/ko/pbRpUgilY0Cbw5sNmb9txGXUKyuH7eV25x39DtJXUNPQGJtWFV+BT/QAAAAABJRU5ErkJggg==)
+ 1x,
+ url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAJAAAACQBAMAAAAVaP+LAAAAGFBMVEUAAABTU1NNTU1TU1NPT09SUlJSUlJTU1O8B7DEAAAAB3RSTlMAoArVKvVgBuEdKgAAAJ1JREFUeF7t1TEOwyAMQNG0Q6/UE+RMXD9d/tC6womIFSL9P+MnAYOXeTIzMzMzMzMzaz8J9Ri6HoITmuHXhISE8nEh9yxDh55aCEUoTGbbQwjqHwIkRAEiIaG0+0aa9vbmae89rogeoww936mqrwdbr4gn/z0IAdQ6nQ/FIpRXDwHcA+JIJcQowQAlFUA0MfQpXLlVQfkzR4igS6ENjknm/wiaGhsAAAAASUVORK5CYII=)
+ 2x
+ );
+ position: relative;
+}
+
+.hidden {
+ display: none;
+}
+
+/* Offline page */
+
+.offline .interstitial-wrapper {
+ color: #2b2b2b;
+ font-size: 1em;
+ line-height: 1.55;
+ margin: 0 auto;
+ max-width: 600px;
+ padding-top: 100px;
+ width: 100%;
+}
+
+.offline .runner-container {
+ height: 150px;
+ max-width: 600px;
+ overflow: hidden;
+ position: absolute;
+ top: 35px;
+ width: 44px;
+}
+
+.offline .runner-canvas {
+ height: 150px;
+ max-width: 600px;
+ opacity: 1;
+ overflow: hidden;
+ position: absolute;
+ top: 0;
+ z-index: 2;
+}
+
+.offline .controller {
+ background: rgba(247, 247, 247, 0.1);
+ height: 100vh;
+ left: 0;
+ position: absolute;
+ top: 0;
+ width: 100vw;
+ z-index: 1;
+}
+
+#offline-resources {
+ display: none;
+}
+
+#instructions {
+ margin: 2em;
+ text-align: center;
+}
+
+@media (max-width: 420px) {
+ .suggested-left > #control-buttons,
+ .suggested-right > #control-buttons {
+ float: none;
+ }
+ .snackbar {
+ left: 0;
+ bottom: 0;
+ width: 100%;
+ border-radius: 0;
+ }
+}
+
+@media (max-height: 350px) {
+ h1 {
+ margin: 0 0 15px;
+ }
+ .icon-offline {
+ margin: 0 0 10px;
+ }
+ .interstitial-wrapper {
+ margin-top: 5%;
+ }
+ .nav-wrapper {
+ margin-top: 30px;
+ }
+}
+
+@media (min-width: 600px) and (max-width: 736px) and (orientation: landscape) {
+ .offline .interstitial-wrapper {
+ margin-left: 0;
+ margin-right: 0;
+ }
+}
+
+@media (min-width: 420px) and (max-width: 736px) and (min-height: 240px) and (max-height: 420px) and (orientation: landscape) {
+ .interstitial-wrapper {
+ margin-bottom: 100px;
+ }
+}
+
+@media (min-height: 240px) and (orientation: landscape) {
+ .offline .interstitial-wrapper {
+ margin-bottom: 90px;
+ }
+ .icon-offline {
+ margin-bottom: 20px;
+ }
+}
+
+@media (max-height: 320px) and (orientation: landscape) {
+ .icon-offline {
+ margin-bottom: 0;
+ }
+ .offline .runner-container {
+ top: 10px;
+ }
+}
+
+@media (max-width: 240px) {
+ .interstitial-wrapper {
+ overflow: inherit;
+ padding: 0 8px;
+ }
+}
+
+.footer{
+ position: fixed;
+ text-align: center;
+ bottom: 5px;
+ width: 100%;
+ left: 0%;
+ font-family: 'Press Start 2P';
+ font-size: 75%;
+ color: #535353;
+}
+
+a:link {
+ text-decoration: none;
+ }
+
+
+