diff --git a/public/index.html b/public/index.html
index c2c9394..6a95273 100755
--- a/public/index.html
+++ b/public/index.html
@@ -1,14 +1,28 @@
-
+
+
- CodePen - Globe
+ The Mycelial Network
-
+
-
-
-
+
+
+
+
\ No newline at end of file
diff --git a/public/script.js b/public/script.js
index 2ca669f..68c0642 100755
--- a/public/script.js
+++ b/public/script.js
@@ -99,7 +99,9 @@
const v = (2 * y) / height - 1;
for (let x = 0; x < width; x++) {
const u = ratio * ((2 * x) / width - 1);
- if (globe(x, y, u, v, time)) set(pixels, x, y);
+ const shiftedU = u + 1.2;
+ if (globe(x, y, shiftedU, v, time)) set(pixels, x, y);
+
}
}
@@ -109,3 +111,4 @@
main();
})();
+
diff --git a/public/style.css b/public/style.css
index c7db824..43978ef 100755
--- a/public/style.css
+++ b/public/style.css
@@ -14,14 +14,14 @@ body {
body {
margin: 0;
background: #241917;
- color: #f3bbae;
+ color: #f3bbae !important;
}
body,
.braille {
display: flex;
align-items: center;
- justify-content: center;
+ justify-content: flex-start;
flex-flow: row;
}
@@ -43,7 +43,29 @@ body,
right: 100%;
}
-.visible {
- display: fixed !important;
- left: 2;
+.center-text {
+ position: absolute;
+ top: 50%;
+ transform: translate(-50%, -50%);
+ left: 75%;
+ font-size: 14px;
+ font-family: Monaco, monospace;
+ direction: rtl;
+ text-align: right;
}
+
+@media only screen and (max-width: 665px) {
+ .center-text {
+ top: 20%;
+ }
+}
+
+.center-text a {
+ color: #f3bbae;
+ transition: color 0.5s ease;
+}
+
+.center-text a:hover {
+ color: #ffffff;
+}
+