update index

author: lens <lens@neural.garden> 2021-02-05 15:17:38 +0000
committer: lens <lens@neural.garden> 2021-02-05 15:17:38 +0000
commit: 78afb7006924411d0178fffa16b002170d4939d0 (patch)
tree: fb6a0e728bed6cce989de30b211ea41e0beee76c /docs/magisphere
parent: 8f077f24cd597eeb22b90374b5423dbdf3a7cd06 (diff)
5 files changed, 110 insertions, 24 deletions
diff --git a/docs/magisphere/index.html b/docs/magisphere/index.html
index 6edae78..f4bc554 100644
--- a/docs/magisphere/index.html
+++ b/docs/magisphere/index.html
@@ -1,20 +1,62 @@
 <!doctype html>
 <html>
 <head>
-<title>Xena Vectra</title>
+<title>Magisphere</title>
 <meta charset="utf-8">
 <link rel="stylesheet" href="magisphere.css" />
 <meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=yes" />
 </head>
 <body class='loading'>
+	<div class='bg'><img src='https://s3.amazonaws.com/i.asdf.us/im/14/imGrid_1425570589_bike_1425669497_1425669516.gif'></div>
+	<div class='bg'><img src='https://s3.amazonaws.com/i.asdf.us/im/29/imgrid_1328915738_pepper.png'></div>
+	<div class='bg'><img src='https://s3.amazonaws.com/i.asdf.us/im/37/imgrid_1326148678_pepper.png'></div>
 <div class='content'>
-  <b>MAGISPHERE</b> IS 
-    <a href="/">XENA VECTRA</a>
-    and
-    <a href="https://asdf.us/">COSMIC SANDS</a>
-    cosmic analog underwater excursion / debut and cassette release at <a href="http://panke.gallery/">panke . gallery</a> Gerichtstr. 23, Hof 5, 13347 Berlin. SATURDAY 19-01-2019.
-    descent into THETA-5 / sonar wave shadows. benthic illumination.
-    magma atrium and the chamber of glyphs. C20. Produced in 2019.
+	<br>
+<span>
+  <b>MAGISPHERE</b>:
+    a cosmic analog underwater excursion.
+</span>
+<br>
+    <br><br>
+    <a href="https://lfolobster.bandcamp.com/"><img src="magisphere-theta5-tape.jpg"></a>
+    <br><br>
+<span>
+    <a href="https://lfolobster.bandcamp.com/">"THETA-5"</a> cassette. 2019<br>
+<br>
+a1. descent into THETA-5 / sonar wave shadows.<br>
+b1. benthic illumination.<br>
+b2. magma atrium and the chamber of glyphs.<br>
+</span>
+    <br>
+<span><a href="/">BETH</a> - LEADS and BASS</span>
+&nbsp;
+<span><a href="https://asdf.us/">JULES</a> - PADS and ARPS</span>
+<br>
+<br>
+<div style='max-width: 800px;'>
+<span style='color: #b05;'>
+Magisphere presents a cosmic analog underwater excursion.  Bethany Barrett and Jules LaPlace make live cosmic music using a variety of synthesizers.  "Theta-5" is a journey to the bottom of the sea, across the abyss and beyond.
+</span>
+</div>
+<br>
+
+<span>
+    MESSAGES: <a href="https://twitter.com/lfolobster">Twitter</a></span>
+</span>
+&nbsp;
+<span>
+    TRANSMISSIONS: <a href="https://lfolobster.bandcamp.com">Bandcamp</a><br>
+</span>
+<br>
+    <br>
+    <img src="magisphere-loophole.jpg">
+    <br>
+    LOOPHOLE, Berlin, Germany. April 2019<br>
+    <br>
+    <img src="magisphere-panke.jpg">
+    <br>
+    PANKE GALLERY, Berlin, Germany. January 2019<br>
+    <br>
 </div>
 <!--     <div class="player paused">
       <div class="icon"></div>
diff --git a/docs/magisphere/magisphere-loophole.jpg b/docs/magisphere/magisphere-loophole.jpg
new file mode 100644
index 0000000..e514735
--- /dev/null
+++ b/docs/magisphere/magisphere-loophole.jpg
diff --git a/docs/magisphere/magisphere-panke.jpg b/docs/magisphere/magisphere-panke.jpg
new file mode 100644
index 0000000..81bed7e
--- /dev/null
+++ b/docs/magisphere/magisphere-panke.jpg
diff --git a/docs/magisphere/magisphere-theta5-tape.jpg b/docs/magisphere/magisphere-theta5-tape.jpg
new file mode 100644
index 0000000..6915ea5
--- /dev/null
+++ b/docs/magisphere/magisphere-theta5-tape.jpg
diff --git a/docs/magisphere/magisphere.css b/docs/magisphere/magisphere.css
index 1ba88c9..63845ca 100644
--- a/docs/magisphere/magisphere.css
+++ b/docs/magisphere/magisphere.css
@@ -34,11 +34,10 @@ html, body {
   margin: 0; padding: 0; width: 100%; height: 100%;
   font-family: nhg, sans-serif;
   color: rgba(255,255,255,0.9);
-  overflow: hidden;
 }
 html {
   background-color: rgb(0,0,0);
-  background-image: linear-gradient(rgba(30, 0, 0, 1.0), rgba(30, 0, 0, 0.0));
+  background-image: linear-gradient(rgba(30, 0, 90, 1.0), rgba(30, 0, 0, 0.0));
   background-attachment: fixed;
   transition: background-color 1s;
 }
@@ -64,7 +63,6 @@ body.loading {
   background-color: rgba(0,0,0,0.9);
   background-image: linear-gradient(rgba(10,0,0,1.0), rgba(0,0,20,1.0));
   opacity: 0.4;
-  transform: skewY(3deg);
   overflow: hidden;
   pointer-events: none;
 }
@@ -74,7 +72,6 @@ body.loading {
   width: 100%; height: 80%;
   background-color: rgba(0,0,0,1.0);
   background-image: linear-gradient(rgba(0,0,0,1.0), rgba(10,0,0,1.0));
-  transform: skewY(3deg);
   overflow: hidden;
   pointer-events: none;
 }
@@ -117,21 +114,28 @@ img.cover {
   justify-content: space-between;
 }
 .content {
-  position: absolute;
-  top: 50%;
-  left: 50%;
-  transform: translate3d(-50%, -50%, 0) skewY(3deg);
-  background: black;
   padding: 20px;
   font-family: 'alarmclock', monospace;
-  color: #800;
+  color: #f88;
   font-size: 32px;
-  margin: 0;
+  margin: 20px;
   letter-spacing: -2px;
-  cursor: pointer;
   opacity: 0.9;
   transition: opacity 500ms;
-  text-align: justify;
+  text-align: left;
+  text-transform: uppercase;
+}
+.content img {
+  width: 600px;
+  max-width: 100%;
+}
+.content span {
+  box-shadow: 
+    -5px -5px 0 #000, 
+    5px -5px 0 #000, 
+    -5px 5px 0 #000, 
+    5px 5px 0 #000;
+  background: #000;
 }
 .loading .content b,
 .loading .content a {
@@ -139,11 +143,11 @@ img.cover {
 }
 .content b {
   transition: color 1500ms;
-  color: red;
+  color: #f08;
 }
 .content a {
   transition: color 1500ms;
-  color: red;
+  color: #f08;
   border: 0;
   text-decoration: none;
 }
@@ -154,6 +158,45 @@ img.cover {
 .desktop h1:hover {
   opacity: 1;
 }
+.bg {
+  position: fixed;
+  bottom: 0; right: 0;
+  z-index: -1;
+  width: 60%;
+  height: 70%;
+  text-align: right;
+}
+.bg:nth-child(3n) img {
+  transform: skew(10deg, -10deg) rotate(5deg);
+  opacity: 0.09;
+}
+.bg:nth-child(3n+1) {
+  width: 100%;
+  height: 100%;
+  -webkit-filter: invert(100%);
+  opacity: 0.1;
+}
+.bg:nth-child(3n+1) img {
+  transform: skew(20deg, 10deg) rotate(-20deg);
+  opacity: 0.25;
+  width: 100%;
+}
+.bg:nth-child(3n+2) {
+  width: 100%;
+  height: 100%;
+  -webkit-filter: invert(100%);
+  opacity: 0.3;
+}
+.bg:nth-child(3n+2) img {
+  transform: rotate(10deg);
+  opacity: 0.25;
+  width: 100%;
+}
+.bg img {
+  max-width: 100%;
+  height: 100%;
+  -webkit-filter: blur(2px);
+}
 h2 {
   margin: 0;
   padding: 0 0 15px 0;
@@ -339,4 +382,5 @@ section {
     width: 36px;
     height: 36px;
   }
-}
-\ No newline at end of file
+}
+
author	lens <lens@neural.garden>	2021-02-05 15:17:38 +0000
committer	lens <lens@neural.garden>	2021-02-05 15:17:38 +0000
commit	78afb7006924411d0178fffa16b002170d4939d0 (patch)
tree	fb6a0e728bed6cce989de30b211ea41e0beee76c /docs/magisphere
parent	8f077f24cd597eeb22b90374b5423dbdf3a7cd06 (diff)