Initial commit

webmural · Sep 10, 2023 · 7819f7e · 7819f7e
commit 7819f7e
Show file tree

Hide file tree

Showing 9 changed files with 203 additions and 0 deletions.
diff --git a/.editorconfig b/.editorconfig
@@ -0,0 +1,7 @@
+root = true
+
+[*]
+end_of_line = lf
+insert_final_newline = true
+indent_style = space
+indent_size = 2
diff --git a/.gitignore b/.gitignore
@@ -0,0 +1,2 @@
+node_modules
+.DS_Store
diff --git a/README.md b/README.md
@@ -0,0 +1,5 @@
+### [O3 mural](https://webmural.com/o3)
+
+* [ozone figure](index.html)
+* [ultra flex](ultra.css)
+* [violet flow](violet.css)
diff --git a/UNLICENSE.txt b/UNLICENSE.txt
@@ -0,0 +1,24 @@
+This is free and unencumbered software released into the public domain.
+
+Anyone is free to copy, modify, publish, use, compile, sell, or
+distribute this software, either in source code form or as a compiled
+binary, for any purpose, commercial or non-commercial, and by any
+means.
+
+In jurisdictions that recognize copyright laws, the author or authors
+of this software dedicate any and all copyright interest in the
+software to the public domain. We make this dedication for the benefit
+of the public at large and to the detriment of our heirs and
+successors. We intend this dedication to be an overt act of
+relinquishment in perpetuity of all present and future rights to this
+software under copyright law.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND,
+EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF
+MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT.
+IN NO EVENT SHALL THE AUTHORS BE LIABLE FOR ANY CLAIM, DAMAGES OR
+OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE,
+ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR
+OTHER DEALINGS IN THE SOFTWARE.
+
+For more information, please refer to <http://unlicense.org/>
diff --git a/index.html b/index.html
@@ -0,0 +1,40 @@
+<!DOCTYPE html>
+<html lang="en-US">
+<meta charset="utf-8">
+
+<title>o3 ≈ ozone</title>
+
+<meta name=viewport content="width=device-width">
+<meta name=color-scheme content="dark light">
+<meta name=theme-color content="salmon">
+<meta name=description content="o3 mural of ozone layer uv abc">
+
+<link rel="stylesheet" href="violet.css" media=(color)>
+<link rel="stylesheet" href="ultra.css" media="all">
+<link rel="license" href="UNLICENSE.txt">
+<link rel="icon" href="ooo.svg">
+
+<base href="https://webmural.com">
+
+<link rel="prev" href="/aya">
+<link rel="next" href="/airwaves">
+<link rel="next" href="/octopus">
+<link rel="prev" href="/deev">
+
+<figure aria-label="ozone flow">
+  <ul>
+    <li><a href="/lllllllllll">UV-a</a>
+    <li><a href="/bruv">UV-b</a>
+    <li><a href="/violetttear">UV-c</a>
+  </ul>
+  <a href="/opacity">
+    <abbr title="ozone">O3</abbr>
+  </a>
+  <ul>
+    <li><a href="/supra">UV-a</a>
+    <li><a href="/broove"><small>UV-b</small></a>
+  </ul>
+  <figcaption>
+    All UV-a and some UV-b perme<wbr>ate Ear<wbr>thz oz<wbr>one layer
+  </figcaption>
+</figure>
diff --git a/ooo.svg b/ooo.svg
diff --git a/package.json b/package.json
@@ -0,0 +1,9 @@
+{
+  "scripts": {
+    "ff": "npm run firefox",
+    "firefox": "open -a firefox index.html || start firefox index.html",
+    "start": "npm run firefox",
+    "test": "npm run firefox",
+    "posttest": "echo 'validate online'"
+  }
+}
diff --git a/ultra.css b/ultra.css
@@ -0,0 +1,77 @@
+* {
+  box-sizing: border-box;
+}
+
+a {
+  border-radius: 100%;
+  display: inline-flex;
+  padding: 1ch;
+  text-decoration: dotted line-through;
+}
+
+html {
+  font-family: sans-serif;
+  font-size: max(3ch, 3vmax + 2vmin);
+  line-height: 1.618;
+}
+
+body {
+  margin: auto;
+  overflow-wrap: anywhere;
+  padding: 3ch;
+}
+
+figure {
+  align-items: space-between;
+  contain: layout;
+  display: flex;
+  justify-content: center; 
+  flex-flow: column;
+  min-height: 100vh;
+}
+
+figcaption {
+  flex-basis: calc(10em / 3);
+  font-family: monospace;
+  line-height: calc(4 / 3);
+  margin: auto;
+  text-transform: lowercase;
+}
+
+ul {
+  align-items: center;
+  contain: layout;
+  display: flex;
+  justify-content: space-around;
+  font-size: 1.236em;
+}
+
+ul ~ ul {
+ font-size: 1em; 
+}
+
+li {
+  display: inline-flex;
+}
+
+abbr {
+  font-size: 1.618em;
+  line-height: 1;
+  margin: auto;
+}
+
+small {
+  font-size: .8rem;
+}
+
+@media (orientation: portrait) {
+  ul {
+    flex-flow: column;
+  }
+}
+
+@media (orientation: landscape) {
+  figcaption {
+    writing-mode: sideways-lr;
+  }
+}
diff --git a/violet.css b/violet.css
@@ -0,0 +1,30 @@
+::selection {
+  background: #323;
+  color: #de1;
+}
+
+:any-link {
+  background: hotpink;
+  color: inherit;
+  transition: 333ms ease-out;
+}
+
+:any-link:only-child {
+  background: salmon;
+}
+
+:focus {
+  filter: hue-rotate(-36deg);
+  outline: .2ch double;
+}
+
+:active {
+  filter: hue-rotate(-72deg);
+}
+
+html {
+  background: mediumpurple;
+  background-image: linear-gradient(0turn, #1ed 0%, transparent 38%, transparent 62%, #cd2);
+  color: #121113;
+  transition: 333ms ease-in;
+}