Skip to content

Commit 4c4a288

Browse files
author
nimwunnan
committed
updates text, makes look websiteish
1 parent 7466e58 commit 4c4a288

File tree

5 files changed

+213
-8
lines changed

5 files changed

+213
-8
lines changed

CNAME

+1
Original file line numberDiff line numberDiff line change
@@ -0,0 +1 @@
1+
aphorism.com

asphorisms.md

+19-8
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
Asphorisms 1.0.1
22
---------------------------------
3-
##Giving you the doubt to drive self-improvement
3+
## Giving you the doubt to drive self-improvement
44

55

66
---------------------------------
@@ -13,13 +13,24 @@ Ask better questions
1313

1414
No teachers without books, no books without teachers
1515

16-
Freedom means free time. Anyone who tells you different wants you to be their slave
16+
Freedom means free time. Anyone who tells you different wants something from you
1717

18-
Work is hard when it dehumanizes you
18+
Any work that dehumanizes you is hard work
1919

20-
The helping matrix are the conditions that form the four kinds of helping
20+
### The Helping Matrix
2121

22-
| What you are doing | Its effect on the situation |
23-
| -------------------| --------------------------- |
24-
| helping | helpful |
25-
| not-helping | not helpful |
22+
The Helping Matrix allows you to locate how your efforts are manifesting in the world. Are you helping, but not helpful? Maybe you are Helping and Helpful. Good job. Don't underrate the power of Not Helping Helpful.
23+
24+
| | Helpful | Not Helpful |
25+
| -------------------| --------|------------ |
26+
| Helping | | |
27+
| Not Helping | | |
28+
29+
### The Functionality Matrix
30+
31+
The Functionality Matrix allows you to locate what type of system, project, or relationship you are stuck in. Is it Dysfunctional yet Functioning? Or perhaps it is shiny, Functional, and totally Not Functioning. Good luck, sucker.
32+
33+
| | Functioning | Not Functioning |
34+
| -------------------| --------|------------ |
35+
| Functional | | |
36+
| Dysfunctional | | |

images/helping matrix.pdf

833 KB
Binary file not shown.

index.html

+62
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,62 @@
1+
<!DOCTYPE html>
2+
<html>
3+
<head>
4+
<title>Asphorisms</title>
5+
<script src="http://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
6+
<link href="http://fonts.googleapis.com/css?family=Rubik" rel="stylesheet" type="text/css" />
7+
<link href="http://fonts.googleapis.com/css?family=Roboto+Mono" rel="stylesheet" type="text/css" />
8+
9+
<link rel="stylesheet" type="text/css" href="style.css">
10+
<!-- favicon bs -->
11+
<!-- <link rel="apple-touch-icon" sizes="57x57" href="/favicon/apple-icon-57x57.png">
12+
<link rel="apple-touch-icon" sizes="60x60" href="/favicon/apple-icon-60x60.png">
13+
<link rel="apple-touch-icon" sizes="72x72" href="/favicon/apple-icon-72x72.png">
14+
<link rel="apple-touch-icon" sizes="76x76" href="/favicon/apple-icon-76x76.png">
15+
<link rel="apple-touch-icon" sizes="114x114" href="/favicon/apple-icon-114x114.png">
16+
<link rel="apple-touch-icon" sizes="120x120" href="/favicon/apple-icon-120x120.png">
17+
<link rel="apple-touch-icon" sizes="144x144" href="/favicon/apple-icon-144x144.png">
18+
<link rel="apple-touch-icon" sizes="152x152" href="/favicon/apple-icon-152x152.png">
19+
<link rel="apple-touch-icon" sizes="180x180" href="/favicon/apple-icon-180x180.png">
20+
<link rel="icon" type="image/png" sizes="192x192" href="/favicon/android-icon-192x192.png">
21+
<link rel="icon" type="image/png" sizes="32x32" href="/favicon/favicon-32x32.png">
22+
<link rel="icon" type="image/png" sizes="96x96" href="/favicon/favicon-96x96.png">
23+
<link rel="icon" type="image/png" sizes="16x16" href="/favicon/favicon-16x16.png">
24+
<link rel="manifest" href="/favicon/manifest.json">
25+
<meta name="msapplication-TileColor" content="#ffffff">
26+
<meta name="msapplication-TileImage" content="/favicon/ms-icon-144x144.png"> -->
27+
<meta name="theme-color" content="#ffffff">
28+
<!-- favicon bs -->
29+
</head>
30+
<body>
31+
32+
<section id="hero">
33+
<div>
34+
<h1>Asphorism:</h1>
35+
<h3>an aspirational aphorism, often posted on the walls of offices to reframe technological work as an ennobling mental exercise that should be done for its own sake, regardless of conditions or impact.</h3>
36+
<h3>Aphorisms make you feel better about your work without having to do anything.</h3>
37+
<p><a href="#about">about</a> // <a href="https://github.com/nimwunnan/asphorisms/blob/master/asphorisms.md">current spec</a> // <a href="mailto:[email protected]">get in touch</a> // <a href="/images/helping-matrix.pdf">helping matrix .pdf</a></p>
38+
</div>
39+
</section>
40+
<section id="about">
41+
<div>
42+
<h2>About</h2>
43+
<p>This project is an attempt to collaboratively create a spec for a new set of aspirational aphorisms or &#8220;asphorisms&#8221; to post on the walls of offices full of people using computers.</p>
44+
45+
<p>So far, the most common high-level instructions we give to ourselves while working have been <a href="http://xkcd.com/1428/">written haphazardly</a>, distributed by <a href="http://www.keepcalmandcarryon.com/">fads</a> and memes, and often reflect an <a href="http://gizmodo.com/5878987/its-official-google-is-evil-now">unexamined position</a> in the society the authors claim to be helping make into a <a href="http://youtu.be/J-GVd_HLlps?t=37s">better place</a>. For example, &#8220;Move Fast and Break Things&#8221; works well for those with freedom of movement and spare things, but that type of work is not inherently better than work done by confined and impoverished workers.</p>
46+
47+
<p>This project is an attempt to create an open source set of new asphorisms, collaboratively written to reflect a set of ideas we and the people who use our work can live with. The first release will be considered Asphorisms 2.0</p>
48+
49+
<p>If you want to get involved, contribute to the <a href="https://github.com/nimwunnan/asphorisms">Github project</a> or <a href="mailto:[email protected]">get in touch</a></p>
50+
51+
<h3><a href="https://github.com/nimwunnan/asphorisms/blob/master/asphorisms.md">View the current spec</a></h3>
52+
</div>
53+
54+
</section>
55+
56+
57+
58+
59+
60+
61+
</body>
62+
</html>

style.css

+131
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,131 @@
1+
2+
/* ######################## Shared ######################## */
3+
4+
* { box-sizing: border-box; }
5+
body {
6+
background-color: #D4D4D4;
7+
padding: 0px;
8+
margin: 0px;
9+
font-family: 'Rubik', serif;
10+
}
11+
section {
12+
float: left;
13+
width: 100%;
14+
min-height: 100vh;
15+
padding: 40px 80px;
16+
}
17+
section div {
18+
max-width: 800px;
19+
margin: auto;
20+
}
21+
p, #essay p, #classes p {
22+
font-family: 'Roboto Mono', serif;
23+
font-size: 1.3em;
24+
25+
}
26+
27+
li {
28+
color: #D4D4D4;
29+
line-height: 1.4em;
30+
font-style: italic;
31+
padding-right: 30px;
32+
}
33+
34+
h1, h2, h3, h4, h5, h6 { /*reset for mobile browsers */
35+
36+
font-weight: normal;
37+
38+
}
39+
40+
h2 {
41+
color: #ff431d;
42+
font-size: 3em;
43+
}
44+
a {
45+
color: indianred;
46+
text-decoration: none;
47+
font-weight: bold;
48+
}
49+
a:hover {
50+
color: #ff431d;
51+
}
52+
53+
/*######################## hero ########################*/
54+
55+
#hero h1 {
56+
color: #ff431d;
57+
font-weight: 800;
58+
font-size: 5em;
59+
font-family: "Rubik", sans-serif;
60+
margin-bottom: 0px;
61+
font-style: italic;
62+
}
63+
64+
65+
h3 {
66+
font-size: 2em;
67+
font-family: "Roboto Mono", sans-serif;
68+
69+
}
70+
71+
#hero a {
72+
text-transform: uppercase;
73+
}
74+
75+
/*######################## footer ########################*/
76+
77+
78+
#colophon {
79+
background-color: #7b868e;
80+
padding-top: 10vh;
81+
text-align: center;
82+
border-top: 1px solid #333;
83+
}
84+
85+
#colophon div p {
86+
font-size: .9em;
87+
color: #333;
88+
margin: 20px 40px;
89+
}
90+
91+
#colophon a {
92+
text-decoration: none;
93+
color: #1d6496;
94+
}
95+
96+
#colophon h2 {
97+
color: #D4D4D4;
98+
font-size: 1.3em;
99+
border-bottom: 1px solid #D4D4D4;
100+
line-height: 200%;
101+
margin:5px 20px;
102+
}
103+
104+
/* ######################## Mobile ######################## */
105+
@media screen and (max-width: 800px) {
106+
107+
* {
108+
box-sizing: border-box;
109+
}
110+
body {
111+
margin: 0px;
112+
padding: 0px;
113+
font-size: 20px;
114+
}
115+
116+
#hero h1 {
117+
font-size: 2.5em;
118+
}
119+
120+
#hero h3, h3 {
121+
font-size: 1em;
122+
}
123+
124+
p {
125+
font-size: .9em;
126+
}
127+
128+
129+
}
130+
131+

0 commit comments

Comments
 (0)