Skip to content

Commit 5815dd0

Browse files
authored
progress (#2)
1 parent 4c87000 commit 5815dd0

File tree

4 files changed

+128
-96
lines changed

4 files changed

+128
-96
lines changed

.editorconfig

+7
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,7 @@
1+
root = true
2+
3+
[*]
4+
end_of_line = lf
5+
insert_final_newline = true
6+
indent_style = space
7+
indent_size = 2

index.html

+54-26
Original file line numberDiff line numberDiff line change
@@ -1,36 +1,64 @@
11
<!DOCTYPE html>
2-
<html class="sol flora mundo">
2+
<html lang="en-US" class="dew-lunar dew-wet dew-tab dew-hyper dew-diy">
33
<meta charset="utf-8">
4-
<meta name="theme-color" content="Gold">
4+
<title>web1, web2, web3</title>
5+
<meta name="viewport" content="width=device-width, initial-scale=1">
6+
<meta name="theme-color" content="black">
7+
<meta name="description" content="web eras and ethos">
58

6-
<title lang="es-CO">Mi cuerpo NO quiere tu opinion</title>
9+
<style media=(color) data-help="https://s9a.page/dew" data-tag="v0.2.0">
10+
.dew-shift,.dew-shift *{transition:var(--dew-shift)}.dew-wet,.dew-wet *{background:var(--dew-oil);color:var(--dew-ink)}.dew-rim,.dew-rim *{border-color:var(--dew-rim)}.dew-hyper,.dew-hyper :any-link{filter:var(--dew-hyper)}.dew-tab :focus,.dew-tab:focus{filter:var(--dew-focus);outline-color:var(--dew-locus)}.dew-field:disabled{filter:var(--dew-vapor)}.dew-lunar.dew-lunar,.dew-media.dew-media,.dew-polar.dew-polar,.dew-solar.dew-solar{fill:var(--dew-oil);background:var(--dew-oil);color:var(--dew-ink)}:root{--dew-hyper:none;--dew-media:var(--dew-solar);--dew-polar:var(--dew-lunar);--dew-oil:var(--dew-media);--dew-ink:var(--dew-polar);--dew-rim:var(--dew-ink);--dew-shift:none;--dew-solar:hotpink;--dew-lunar:#201;--dew-locus:currentColor;--dew-focus:invert(100%);--dew-hover:none;--dew-vapor:opacity(60%)}:any-link:hover{--dew-hyper:var(--dew-hover)}:any-link:focus{--dew-hyper:var(--dew-focus)}.dew-media{--dew-oil:var(--dew-media);--dew-ink:var(--dew-polar)}.dew-polar{--dew-oil:var(--dew-polar);--dew-ink:var(--dew-media)}.dew-solar{--dew-oil:var(--dew-solar);--dew-ink:var(--dew-lunar)}.dew-lunar{--dew-oil:var(--dew-lunar);--dew-ink:var(--dew-solar)}@media (prefers-color-scheme:dark){:root{--dew-media:var(--dew-lunar);--dew-polar:var(--dew-solar)}}
11+
</style>
712

8-
<meta
9-
name="viewport"
10-
content="width=device-width, initial-scale=1, shrink-to-fit=no">
13+
<link rel="stylesheet" href="style.css">
1114

12-
<meta
13-
name="description"
14-
content="Yellow web poster based on stencil seen IRL on a yellow wall in Colombia"
15-
lang="en-US">
15+
<h1>web eras and ethos</h1>
1616

17-
<link rel="stylesheet" href="opinion.css">
17+
<dl>
18+
<dt class="dew-solar dew1" id="1">web1
19+
<dt class="dew-solar dew1" hidden>uranus in aquarius
20+
<dd class="dew-lunar dew1">communication
21+
<dd class="dew-lunar dew1">information
22+
<dd class="dew-lunar dew1">education
23+
<dd class="dew-lunar dew1"><a href="https://webmural.com/html">semantic</a>
24+
<dd class="dew-lunar dew1"><data value="a11y">accessible</data>
25+
<dd class="dew-lunar dew1">search
1826

19-
<body class="cuerpo">
27+
<dt class="dew-solar dew2" id="2">web2
28+
<dd class="dew-lunar dew2"><abbr>ajax</abbr>
29+
<dd class="dew-lunar dew2">mashups
30+
<dd class="dew-lunar dew2">interaction
31+
<dd class="dew-lunar dew2">contribution
32+
<dd class="dew-lunar dew2">social media
33+
<dd class="dew-lunar dew2">harassment
34+
<dd class="dew-lunar dew2">retention
35+
<dd class="dew-lunar dew2">notification
36+
<dd class="dew-lunar dew2">data game
37+
<dd class="dew-lunar dew2">big players
38+
<dd class="dew-lunar dew2">distortion
39+
<dd class="dew-lunar dew2">pressure
40+
<dd class="dew-lunar dew2">profiling
41+
<dd class="dew-lunar dew2">pride
2042

21-
<h1 class="voz" lang="es-CO">
22-
Mi cuerpo NO quiere tu opinion
23-
</h1>
43+
<dt class="dew-solar dew3" id="3">web3
44+
<dd class="dew-lunar dew3"><data value="d14n">decentralization</data>
45+
<dd class="dew-lunar dew3">blockchain
46+
<dd class="dew-lunar dew3">trust
47+
<dd class="dew-lunar dew3">privacy
48+
<dd class="dew-lunar dew3">inclusion
49+
<dd class="dew-lunar dew3">any player
50+
<dd class="dew-lunar dew3">game theory
51+
<dd class="dew-lunar dew3">sustainability
52+
<dd class="dew-lunar dew3"><a href="https://s9a.page/i14y">interoperability</a>
53+
</dl>
2454

25-
<figure class="spine">
26-
<blockquote lang="es-CO" class="quote capo amor">
27-
Mi cuerpo <em class="muy">no</em> quiere tu opinión<b class"muy">.</b>
28-
</blockquote>
29-
<blockquote lang="en-US" class="quote capo amor jugo loco">
30-
My body <em class="muy">doesn't</em> want your opinion<b class"muy">.</b>
31-
</blockquote>
32-
</figure>
33-
34-
<footer hidden>
35-
Based on foto from Colombia
55+
<footer>
56+
<h2><a href="https://webmural.com">progress</a></h2>
57+
<ul>
58+
<li>these are web talking points in progress
59+
<li>discuss
60+
on <a href="https://twitter.com/webmural">twitter</a>
61+
or <a href="https://github.com/webmural/web123">github</a>
62+
or <a href="UNLICENSE.txt" rel="license">beyond</a>
63+
</ul>
3664
</footer>

opinion.css

-70
This file was deleted.

style.css

+67
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,67 @@
1+
::selection {
2+
color: var(--dew-oil, black);
3+
background: var(--dew-ink, pink);
4+
}
5+
6+
.dew-diy {
7+
--dew-solar: pink;
8+
--dew-lunar: indigo;
9+
}
10+
11+
.dew1 {
12+
--dew-solar: powderblue;
13+
--dew-lunar: mediumblue;
14+
}
15+
16+
.dew2 {
17+
--dew-solar: violet;
18+
--dew-lunar: black;
19+
}
20+
21+
.dew3 {
22+
--dew-solar: aquamarine;
23+
--dew-lunar: black;
24+
}
25+
26+
html {
27+
font-family: sans-serif;
28+
font-size: calc(1em + 1vw + 1vh);
29+
line-height: 1.5;
30+
}
31+
32+
body {
33+
box-sizing: border-box;
34+
margin: 0;
35+
padding: 0;
36+
overflow-wrap: break-word;
37+
}
38+
39+
h1 {
40+
padding-inline: 1vw;
41+
font-size: 1.5rem;
42+
font-weight: 400;
43+
}
44+
45+
h2 {
46+
margin-block: 1vh;
47+
padding-inline: 1vw;
48+
font-size: 1rem;
49+
font-weight: 400;
50+
}
51+
52+
dt,
53+
dd {
54+
padding-inline: 1vw;
55+
}
56+
57+
ul {
58+
margin-block-start: 0;
59+
margin-inline-start: 1vw;
60+
}
61+
62+
aside,
63+
footer {
64+
font-size: .8rem;
65+
padding-block: 1vh;
66+
padding-inline: 1vw;
67+
}

0 commit comments

Comments
 (0)