Repos / s4g / eb4ca36e83
commit eb4ca36e836a7a23e18236197197f187a23b1426
Author: Nhân <hi@imnhan.com>
Date: Mon Jul 3 20:51:30 2023 +0700
simplify styling
diff --git a/Makefile b/Makefile
index 2e4ac8e..19126c2 100644
--- a/Makefile
+++ b/Makefile
@@ -2,7 +2,8 @@ build:
go build -o dist/
watch:
- find . -name '*.go' -or -name '*.js' -or -name '*.tmpl' | entr -rc go run .
+ find . -name '*.go' -or -name '*.js' -or -name '*.tmpl' -or -name '*.dj' \
+ | entr -rc go run .
# Cheating a little because the djot.js repo on github does not provide builds
update-djot:
diff --git a/main.go b/main.go
index 694f7e3..e2b39dd 100644
--- a/main.go
+++ b/main.go
@@ -8,6 +8,7 @@
"io/fs"
"net/http"
"path/filepath"
+ "sort"
"strings"
"time"
@@ -25,19 +26,28 @@ func main() {
if err != nil {
panic(err)
}
- fsys := WriteDirFS(absolutePath)
+ fsys := WriteDirFS(absolutePath)
site := readSiteMetadata(fsys)
- fmt.Println("Found site:", site)
- articles := findArticles(fsys)
- fmt.Printf("Found %d articles:\n", len(articles))
- for _, a := range articles {
+ posts, pages := findArticles(fsys)
+
+ // Sort posts, newest first
+ sort.Slice(posts, func(i int, j int) bool {
+ return posts[i].Meta.PostedAt.Compare(posts[j].Meta.PostedAt) > 0
+ })
+
+ fmt.Printf("Found %d posts, %d pages:\n", len(posts), len(pages))
+ for _, a := range posts {
+ fmt.Println(">", a.Path, "-", a.Meta.Title)
+ a.WriteHtmlFile(&site, pages)
+ }
+ for _, a := range pages {
fmt.Println(">", a.Path, "-", a.Meta.Title)
- a.WriteHtmlFile(&site)
+ a.WriteHtmlFile(&site, pages)
}
- WriteHomePage(fsys, site, articles)
+ WriteHomePage(fsys, site, posts, pages)
println("Serving local website at http://localhost:" + port)
http.Handle("/", http.FileServer(http.FS(fsys)))
@@ -72,13 +82,13 @@ type Article struct {
}
type ArticleMetadata struct {
- Title string
- IsPage bool
- IsDraft bool
- CreatedAt time.Time
+ Title string
+ IsPage bool
+ IsDraft bool
+ PostedAt time.Time
}
-func (a *Article) WriteHtmlFile(site *SiteMetadata) {
+func (a *Article) WriteHtmlFile(site *SiteMetadata, pages []Article) {
// First generate the main content in html
contentHtml := djot.ToHtml(a.DjotBody)
@@ -96,11 +106,13 @@ func (a *Article) WriteHtmlFile(site *SiteMetadata) {
Content template.HTML
Title string
Post *Article
+ Pages []Article
}{
Site: site,
Content: template.HTML(contentHtml),
- Title: a.Meta.Title,
+ Title: fmt.Sprintf("%s | %s", a.Meta.Title, site.Name),
Post: a,
+ Pages: pages,
})
if err != nil {
fmt.Println("Error in WriteHtmlFile:", err)
@@ -115,7 +127,7 @@ func (a *Article) WriteHtmlFile(site *SiteMetadata) {
}
}
-func WriteHomePage(fsys WritableFS, site SiteMetadata, articles []Article) {
+func WriteHomePage(fsys WritableFS, site SiteMetadata, posts, pages []Article) {
var buf bytes.Buffer
tmpl := template.Must(
template.ParseFS(
@@ -128,10 +140,12 @@ func WriteHomePage(fsys WritableFS, site SiteMetadata, articles []Article) {
Site *SiteMetadata
Title string
Posts []Article
+ Pages []Article
}{
Site: &site,
Title: fmt.Sprintf("%s - %s", site.Name, site.Tagline),
- Posts: articles,
+ Posts: posts,
+ Pages: pages,
})
if err != nil {
fmt.Println("Error in WriteHtmlFile:", err)
@@ -140,7 +154,7 @@ func WriteHomePage(fsys WritableFS, site SiteMetadata, articles []Article) {
fsys.WriteFile("index.html", buf.String())
}
-func findArticles(fsys WritableFS) (articles []Article) {
+func findArticles(fsys WritableFS) (posts, pages []Article) {
fs.WalkDir(fsys, ".", func(path string, d fs.DirEntry, err error) error {
if d.IsDir() || !strings.HasSuffix(d.Name(), DJOT_EXT) {
@@ -174,8 +188,12 @@ func findArticles(fsys WritableFS) (articles []Article) {
DjotBody: bodyText,
Meta: meta,
}
- articles = append(articles, article)
+ if article.Meta.IsPage {
+ pages = append(pages, article)
+ } else {
+ posts = append(posts, article)
+ }
return nil
})
- return articles
+ return
}
diff --git a/www/_theme/base.tmpl b/www/_theme/base.tmpl
index 352eca0..d614b60 100644
--- a/www/_theme/base.tmpl
+++ b/www/_theme/base.tmpl
@@ -1,79 +1,21 @@
<!DOCTYPE html>
<html lang="en">
- <head>
- <meta charset="utf-8" />
- <title>{{if .Title}}{{.Title}} - {{.Site.Name}}{{else}}{{.Site.Name}}{{end}}</title>
- <meta name="viewport" content="width=device-width, initial-scale=1.0" />
- <style>
- /* Global look and feel */
- * {
- box-sizing: border-box;
- }
- input,
- textarea {
- font-family: inherit;
- font-size: inherit;
- padding: 0.3rem;
- }
+<head>
+ <meta charset="utf-8" />
+ <title>{{.Title}}</title>
+ <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+ <style>
+ html {
+ font-family: serif;
+ max-width: 50rem;
+ margin: auto;
+ }
+ </style>
+</head>
+
+<body>
+{{template "body" .}}
+</body>
- html {
- font-size: 100%;
- font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto,
- Oxygen-Sans, Cantarell, "Helvetica Neue", sans-serif;
- max-width: 800px;
- margin: 1rem auto;
- }
-
- blockquote {
- border-left: 6px solid darkgrey;
- background-color: #eaeaea;
- margin: 1rem 0 1rem 5rem;
- padding: 0.7rem 1rem;
- }
- blockquote p {
- margin: 0;
- }
- blockquote p + p {
- margin-top: 1rem;
- }
-
- pre {
- border: 1px solid;
- border-radius: 4px;
- padding: 1rem;
- overflow-x: scroll;
- }
-
- content > p {
- margin: 1.7rem 0;
- }
-
- header h1 {
- margin: 0;
- }
- header .tagline {
- margin-top: 0;
- }
- header {
- border-bottom: 2px solid black;
- }
- header a {
- text-decoration: none;
- }
- </style>
- </head>
-
- <body>
-
- <header>
- <h1><a href="{{.Site.HomePath}}">{{.Site.Name}}</a></h1>
- <p class="tagline">{{.Site.Tagline}}</p>
- </header>
-
- <main>
- {{template "body" .}}
- </main>
-
- </body>
</html>
diff --git a/www/_theme/home.tmpl b/www/_theme/home.tmpl
index 20749ec..287e62a 100644
--- a/www/_theme/home.tmpl
+++ b/www/_theme/home.tmpl
@@ -1,11 +1,29 @@
{{define "body"}}
+<header>
+ <h1 class="site-title">{{.Site.Name}}</h1>
+ <p class="tagline">{{.Site.Tagline}}</p>
+</header>
+
+<hr>
+
+{{if .Pages}}
+ <div class="pages">
+ <a href="{{$.Site.HomePath}}">Home</a>
+ {{range .Pages}}
+ <a href="{{.WebPath}}">{{.Meta.Title}}</a>
+ {{end}}
+ </div>
+
+ <hr>
+{{end}}
+
<p>All posts, newest first:</p>
<ul>
{{range .Posts}}
{{if not .Meta.IsDraft}}
<li>
- {{.Meta.CreatedAt.Local.Format "2006-01-02"}}
+ {{.Meta.PostedAt.Local.Format "2006-01-02"}}
— <a href="{{.WebPath}}">{{.Meta.Title}}</a>
</li>
{{end}}
@@ -13,14 +31,21 @@
</ul>
<style>
- ul a {
- text-decoration: none;
- }
-
- ul {
- padding: 0;
- list-style-type: none;
- font-size: 1.1rem;
- }
+.site-title {
+ margin-bottom: 0;
+}
+.tagline {
+ margin-top: 0;
+}
+
+.pages a {
+ margin-right: 0.5rem;
+}
+
+ul {
+ padding: 0;
+ list-style-type: none;
+ /*font-size: 1.1rem;*/
+}
</style>
{{end}}
diff --git a/www/_theme/post.tmpl b/www/_theme/post.tmpl
index 1013b00..e8b6de0 100644
--- a/www/_theme/post.tmpl
+++ b/www/_theme/post.tmpl
@@ -1,26 +1,32 @@
{{define "body"}}
+<nav>
+ <a href="{{.Site.HomePath}}">Home</a>
+ {{range .Pages}}<a href="{{$.Site.HomePath}}{{.WebPath}}">{{.Meta.Title}}</a>{{end}}
+{{if not .Post.Meta.PostedAt.IsZero}}
+ <span class="posted-on">
+ Posted on
+ <time datetime="{{.Post.Meta.PostedAt.Local.Format "2006-01-02"}}">
+ {{.Post.Meta.PostedAt.Local.Format "Monday, 02 Jan 2006"}}
+ </time>
+ </span>
+{{end}}
+</nav>
+
+<hr>
+
<h1 class="post-title">{{.Post.Meta.Title}}</h1>
-<time class="post-time" datetime="{{.Post.Meta.CreatedAt.Local.Format "2006-01-02"}}">
- {{.Post.Meta.CreatedAt.Local.Format "Monday, 02 Jan 2006"}}
-</time>
<content>
{{.Content}}
</content>
<style>
-.post-title {
- text-align: center;
- font-size: 2rem;
- margin-bottom: 0;
+nav > a {
+ margin-right: 0.5rem;
}
-.post-time {
- display: block;
- text-align: center;
-}
-
-content img,
-content video {
- max-width: 100%;
+.posted-on {
+ float: right;
+ font-style: italic;
}
</style>
+
{{end}}
diff --git a/www/about/index.dj b/www/about/index.dj
index e3f9cfe..ddca31c 100644
--- a/www/about/index.dj
+++ b/www/about/index.dj
@@ -1,5 +1,6 @@
+++
Title = "About"
+IsPage = true
+++
## About this site
diff --git a/www/about/index.html b/www/about/index.html
index 07dc9af..9d6175a 100644
--- a/www/about/index.html
+++ b/www/about/index.html
@@ -1,82 +1,30 @@
<!DOCTYPE html>
<html lang="en">
- <head>
- <meta charset="utf-8" />
- <title>About - My Site</title>
- <meta name="viewport" content="width=device-width, initial-scale=1.0" />
- <style>
-
- * {
- box-sizing: border-box;
- }
- input,
- textarea {
- font-family: inherit;
- font-size: inherit;
- padding: 0.3rem;
- }
+<head>
+ <meta charset="utf-8" />
+ <title>About | CoolZone</title>
+ <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+ <style>
+ html {
+ font-family: serif;
+ max-width: 50rem;
+ margin: auto;
+ }
+ </style>
+</head>
- html {
- font-size: 100%;
- font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto,
- Oxygen-Sans, Cantarell, "Helvetica Neue", sans-serif;
- max-width: 800px;
- margin: 1rem auto;
- }
+<body>
- blockquote {
- border-left: 6px solid darkgrey;
- background-color: #eaeaea;
- margin: 1rem 0 1rem 5rem;
- padding: 0.7rem 1rem;
- }
- blockquote p {
- margin: 0;
- }
- blockquote p + p {
- margin-top: 1rem;
- }
+<nav>
+ <a href="/">Home</a>
+ <a href="/about/index.html">About</a>
- pre {
- border: 1px solid;
- border-radius: 4px;
- padding: 1rem;
- overflow-x: scroll;
- }
+</nav>
- content > p {
- margin: 1.7rem 0;
- }
+<hr>
- header h1 {
- margin: 0;
- }
- header .tagline {
- margin-top: 0;
- }
- header {
- border-bottom: 2px solid black;
- }
- header a {
- text-decoration: none;
- }
- </style>
- </head>
-
- <body>
-
- <header>
- <h1><a href="/">My Site</a></h1>
- <p class="tagline">And it's fine.</p>
- </header>
-
- <main>
-
<h1 class="post-title">About</h1>
-<time class="post-time" datetime="0001-01-01">
- Monday, 01 Jan 0001
-</time>
<content>
<section id="About-this-site">
<h2>About this site</h2>
@@ -91,23 +39,16 @@ <h2>No really</h2>
</content>
<style>
-.post-title {
- text-align: center;
- font-size: 2rem;
- margin-bottom: 0;
+nav > a {
+ margin-right: 0.5rem;
}
-.post-time {
- display: block;
- text-align: center;
-}
-
-content img,
-content video {
- max-width: 100%;
+.posted-on {
+ float: right;
+ font-style: italic;
}
</style>
- </main>
- </body>
+</body>
+
</html>
diff --git a/www/hello/index.dj b/www/hello/index.dj
index ff29966..b5a2185 100644
--- a/www/hello/index.dj
+++ b/www/hello/index.dj
@@ -1,6 +1,6 @@
+++
Title = "Hello"
-IsPage = false
+PostedAt = 2022-01-02
+++
Hello world.
diff --git a/www/hello/index.html b/www/hello/index.html
index 363ec7d..41ae45d 100644
--- a/www/hello/index.html
+++ b/www/hello/index.html
@@ -1,105 +1,53 @@
<!DOCTYPE html>
<html lang="en">
- <head>
- <meta charset="utf-8" />
- <title>Hello - My Site</title>
- <meta name="viewport" content="width=device-width, initial-scale=1.0" />
- <style>
-
- * {
- box-sizing: border-box;
- }
- input,
- textarea {
- font-family: inherit;
- font-size: inherit;
- padding: 0.3rem;
- }
+<head>
+ <meta charset="utf-8" />
+ <title>Hello | CoolZone</title>
+ <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+ <style>
+ html {
+ font-family: serif;
+ max-width: 50rem;
+ margin: auto;
+ }
+ </style>
+</head>
- html {
- font-size: 100%;
- font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto,
- Oxygen-Sans, Cantarell, "Helvetica Neue", sans-serif;
- max-width: 800px;
- margin: 1rem auto;
- }
+<body>
- blockquote {
- border-left: 6px solid darkgrey;
- background-color: #eaeaea;
- margin: 1rem 0 1rem 5rem;
- padding: 0.7rem 1rem;
- }
- blockquote p {
- margin: 0;
- }
- blockquote p + p {
- margin-top: 1rem;
- }
+<nav>
+ <a href="/">Home</a>
+ <a href="/about/index.html">About</a>
- pre {
- border: 1px solid;
- border-radius: 4px;
- padding: 1rem;
- overflow-x: scroll;
- }
+ <span class="posted-on">
+ Posted on
+ <time datetime="2022-01-02">
+ Sunday, 02 Jan 2022
+ </time>
+ </span>
- content > p {
- margin: 1.7rem 0;
- }
+</nav>
- header h1 {
- margin: 0;
- }
- header .tagline {
- margin-top: 0;
- }
- header {
- border-bottom: 2px solid black;
- }
- header a {
- text-decoration: none;
- }
- </style>
- </head>
+<hr>
- <body>
-
- <header>
- <h1><a href="/">My Site</a></h1>
- <p class="tagline">And it's fine.</p>
- </header>
-
- <main>
-
<h1 class="post-title">Hello</h1>
-<time class="post-time" datetime="0001-01-01">
- Monday, 01 Jan 0001
-</time>
<content>
<p>Hello world.</p>
</content>
<style>
-.post-title {
- text-align: center;
- font-size: 2rem;
- margin-bottom: 0;
+nav > a {
+ margin-right: 0.5rem;
}
-.post-time {
- display: block;
- text-align: center;
-}
-
-content img,
-content video {
- max-width: 100%;
+.posted-on {
+ float: right;
+ font-style: italic;
}
</style>
- </main>
- </body>
+</body>
+
</html>
diff --git a/www/index.html b/www/index.html
index 8a62061..c722bdf 100644
--- a/www/index.html
+++ b/www/index.html
@@ -1,92 +1,53 @@
<!DOCTYPE html>
<html lang="en">
- <head>
- <meta charset="utf-8" />
- <title>My Site - And it's fine. - My Site</title>
- <meta name="viewport" content="width=device-width, initial-scale=1.0" />
- <style>
-
- * {
- box-sizing: border-box;
- }
- input,
- textarea {
- font-family: inherit;
- font-size: inherit;
- padding: 0.3rem;
- }
+<head>
+ <meta charset="utf-8" />
+ <title>CoolZone - Cool people only.</title>
+ <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+ <style>
+ html {
+ font-family: serif;
+ max-width: 50rem;
+ margin: auto;
+ }
+ </style>
+</head>
- html {
- font-size: 100%;
- font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto,
- Oxygen-Sans, Cantarell, "Helvetica Neue", sans-serif;
- max-width: 800px;
- margin: 1rem auto;
- }
+<body>
- blockquote {
- border-left: 6px solid darkgrey;
- background-color: #eaeaea;
- margin: 1rem 0 1rem 5rem;
- padding: 0.7rem 1rem;
- }
- blockquote p {
- margin: 0;
- }
- blockquote p + p {
- margin-top: 1rem;
- }
+<header>
+ <h1 class="site-title">CoolZone</h1>
+ <p class="tagline">Cool people only.</p>
+</header>
- pre {
- border: 1px solid;
- border-radius: 4px;
- padding: 1rem;
- overflow-x: scroll;
- }
+<hr>
- content > p {
- margin: 1.7rem 0;
- }
- header h1 {
- margin: 0;
- }
- header .tagline {
- margin-top: 0;
- }
- header {
- border-bottom: 2px solid black;
- }
- header a {
- text-decoration: none;
- }
- </style>
- </head>
+ <div class="pages">
+ <a href="/">Home</a>
+
+ <a href="about/index.html">About</a>
+
+ </div>
- <body>
+ <hr>
- <header>
- <h1><a href="/">My Site</a></h1>
- <p class="tagline">And it's fine.</p>
- </header>
- <main>
-
<p>All posts, newest first:</p>
<ul>
<li>
- 0001-01-01
- — <a href="about/index.html">About</a>
+ 2023-04-05
+ — <a href="mfws.html">This is a motherfucking website.</a>
</li>
<li>
- 0001-01-01
+ 2022-01-02
— <a href="hello/index.html">Hello</a>
</li>
@@ -94,18 +55,24 @@ <h1><a href="/">My Site</a></h1>
</ul>
<style>
- ul a {
- text-decoration: none;
- }
+.site-title {
+ margin-bottom: 0;
+}
+.tagline {
+ margin-top: 0;
+}
- ul {
- padding: 0;
- list-style-type: none;
- font-size: 1.1rem;
- }
+.pages a {
+ margin-right: 0.5rem;
+}
+
+ul {
+ padding: 0;
+ list-style-type: none;
+
+}
</style>
- </main>
+</body>
- </body>
</html>
diff --git a/www/mfws.dj b/www/mfws.dj
new file mode 100644
index 0000000..953384d
--- /dev/null
+++ b/www/mfws.dj
@@ -0,0 +1,92 @@
++++
+Title = "This is a motherfucking website."
+PostedAt = 2023-04-05
++++
+
+And it's fucking perfect.
+
+## Seriously, what the fuck else do you want?
+
+You probably build websites and think your shit is special. You think your 13
+megabyte parallax-ative home page is going to get you some fucking Awwward
+banner you can glue to the top corner of your site. You think your 40-pound
+jQuery file and 83 polyfills give IE7 a boner because it finally has
+box-shadow. Wrong, motherfucker. Let me describe your perfect-ass website:
+
+- Shit's lightweight and loads fast
+- Fits on all your shitty screens
+- Looks the same in all your shitty browsers
+- The motherfucker's accessible to every asshole that visits your site
+- Shit's legible and gets your fucking point across (if you had one instead of
+just 5mb pics of hipsters drinking coffee)
+
+### Well guess what, motherfucker:
+
+You. Are. Over-designing. Look at this shit. It's a motherfucking website. Why
+the fuck do you need to animate a fucking trendy-ass banner flag when I hover
+over that useless piece of shit? You spent hours on it and added 80 kilobytes
+to your fucking site, and some motherfucker jabbing at it on their iPad with
+fat sausage fingers will never see that shit. Not to mention blind people will
+never see that shit, but they don't see any of your shitty shit.
+
+You never knew it, but this is your perfect website. Here's why.
+
+## It's fucking lightweight
+
+This entire page weighs less than the gradient-meshed facebook logo on your
+fucking Wordpress site. Did you seriously load 100kb of jQuery UI just so you
+could animate the fucking background color of a div? You loaded all 7 fontfaces
+of a shitty webfont just so you could say "Hi." at 100px height at the
+beginning of your site? You piece of shit.
+
+## It's responsive
+
+You dumbass. You thought you needed media queries to be responsive, but no.
+Responsive means that it responds to whatever motherfucking screensize it's
+viewed on. This site doesn't care if you're on an iMac or a motherfucking
+Tamagotchi.
+
+## It fucking works
+
+Look at this shit. You can read it ... that is, if you can read, motherfucker.
+It makes sense. It has motherfucking hierarchy. It's using HTML5 tags so you
+and your bitch-ass browser know what the fuck's in this fucking site. That's
+semantics, motherfucker.
+
+It has content on the fucking screen. Your site has three bylines and link to
+your dribbble account, but you spread it over 7 full screens and make me click
+some bobbing button to show me how cool the jQuery ScrollTo plugin is.
+
+Cross-browser compatibility? Load this motherfucker in IE6. I fucking dare you.
+
+## This is a website. Look at it. You've never seen one before.
+
+Like the man who's never grown out his beard has no idea what his true natural
+state is, you have no fucking idea what a website is. All you have ever seen
+are shitty skeuomorphic bastardizations of what should be text communicating a
+fucking message. This is a real, naked website. Look at it. It's fucking
+beautiful.
+
+### Yes, this is fucking satire, you fuck
+
+I'm not actually saying your shitty site should look like this. What I'm saying
+is that all the problems we have with websites are *ones we create ourselves*.
+Websites aren't broken by default, they are functional, high-performing, and
+accessible. You break them. You son-of-a-bitch.
+
+{cite="https://www.vitsoe.com/us/about/good-design"}
+> "Good design is as little design as possible."\
+> - some German motherfucker
+
+****
+
+## Epilogue
+
+From the philosophies expressed (poorly) above, [txti](http://txti.es/) was
+created. You should try it today to make your own motherfucking websites.
+
+****
+
+Lifted from <https://motherfuckingwebsite.com>.
+
+
diff --git a/www/mfws.html b/www/mfws.html
new file mode 100644
index 0000000..362bd1d
--- /dev/null
+++ b/www/mfws.html
@@ -0,0 +1,142 @@
+<!DOCTYPE html>
+<html lang="en">
+
+<head>
+ <meta charset="utf-8" />
+ <title>This is a motherfucking website. | CoolZone</title>
+ <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+ <style>
+ html {
+ font-family: serif;
+ max-width: 50rem;
+ margin: auto;
+ }
+ </style>
+</head>
+
+<body>
+
+<nav>
+ <a href="/">Home</a>
+ <a href="/about/index.html">About</a>
+
+ <span class="posted-on">
+ Posted on
+ <time datetime="2023-04-05">
+ Wednesday, 05 Apr 2023
+ </time>
+ </span>
+
+</nav>
+
+<hr>
+
+<h1 class="post-title">This is a motherfucking website.</h1>
+<content>
+<p>And it’s fucking perfect.</p>
+<section id="Seriously-what-the-fuck-else-do-you-want">
+<h2>Seriously, what the fuck else do you want?</h2>
+<p>You probably build websites and think your shit is special. You think your 13
+megabyte parallax-ative home page is going to get you some fucking Awwward
+banner you can glue to the top corner of your site. You think your 40-pound
+jQuery file and 83 polyfills give IE7 a boner because it finally has
+box-shadow. Wrong, motherfucker. Let me describe your perfect-ass website:</p>
+<ul>
+<li>
+Shit’s lightweight and loads fast
+</li>
+<li>
+Fits on all your shitty screens
+</li>
+<li>
+Looks the same in all your shitty browsers
+</li>
+<li>
+The motherfucker’s accessible to every asshole that visits your site
+</li>
+<li>
+Shit’s legible and gets your fucking point across (if you had one instead of
+just 5mb pics of hipsters drinking coffee)
+</li>
+</ul>
+<section id="Well-guess-what-motherfucker">
+<h3>Well guess what, motherfucker:</h3>
+<p>You. Are. Over-designing. Look at this shit. It’s a motherfucking website. Why
+the fuck do you need to animate a fucking trendy-ass banner flag when I hover
+over that useless piece of shit? You spent hours on it and added 80 kilobytes
+to your fucking site, and some motherfucker jabbing at it on their iPad with
+fat sausage fingers will never see that shit. Not to mention blind people will
+never see that shit, but they don’t see any of your shitty shit.</p>
+<p>You never knew it, but this is your perfect website. Here’s why.</p>
+</section>
+</section>
+<section id="It-s-fucking-lightweight">
+<h2>It’s fucking lightweight</h2>
+<p>This entire page weighs less than the gradient-meshed facebook logo on your
+fucking Wordpress site. Did you seriously load 100kb of jQuery UI just so you
+could animate the fucking background color of a div? You loaded all 7 fontfaces
+of a shitty webfont just so you could say “Hi.” at 100px height at the
+beginning of your site? You piece of shit.</p>
+</section>
+<section id="It-s-responsive">
+<h2>It’s responsive</h2>
+<p>You dumbass. You thought you needed media queries to be responsive, but no.
+Responsive means that it responds to whatever motherfucking screensize it’s
+viewed on. This site doesn’t care if you’re on an iMac or a motherfucking
+Tamagotchi.</p>
+</section>
+<section id="It-fucking-works">
+<h2>It fucking works</h2>
+<p>Look at this shit. You can read it … that is, if you can read, motherfucker.
+It makes sense. It has motherfucking hierarchy. It’s using HTML5 tags so you
+and your bitch-ass browser know what the fuck’s in this fucking site. That’s
+semantics, motherfucker.</p>
+<p>It has content on the fucking screen. Your site has three bylines and link to
+your dribbble account, but you spread it over 7 full screens and make me click
+some bobbing button to show me how cool the jQuery ScrollTo plugin is.</p>
+<p>Cross-browser compatibility? Load this motherfucker in IE6. I fucking dare you.</p>
+</section>
+<section id="This-is-a-website-Look-at-it-You-ve-never-seen-one-before">
+<h2>This is a website. Look at it. You’ve never seen one before.</h2>
+<p>Like the man who’s never grown out his beard has no idea what his true natural
+state is, you have no fucking idea what a website is. All you have ever seen
+are shitty skeuomorphic bastardizations of what should be text communicating a
+fucking message. This is a real, naked website. Look at it. It’s fucking
+beautiful.</p>
+<section id="Yes-this-is-fucking-satire-you-fuck">
+<h3>Yes, this is fucking satire, you fuck</h3>
+<p>I’m not actually saying your shitty site should look like this. What I’m saying
+is that all the problems we have with websites are <strong>ones we create ourselves</strong>.
+Websites aren’t broken by default, they are functional, high-performing, and
+accessible. You break them. You son-of-a-bitch.</p>
+<blockquote cite="https://www.vitsoe.com/us/about/good-design">
+<p>“Good design is as little design as possible.”<br>
+- some German motherfucker</p>
+</blockquote>
+<hr>
+</section>
+</section>
+<section id="Epilogue">
+<h2>Epilogue</h2>
+<p>From the philosophies expressed (poorly) above, <a href="http://txti.es/">txti</a> was
+created. You should try it today to make your own motherfucking websites.</p>
+<hr>
+<p>Lifted from <a href="https://motherfuckingwebsite.com">https://motherfuckingwebsite.com</a>.</p>
+</section>
+
+</content>
+
+<style>
+nav > a {
+ margin-right: 0.5rem;
+}
+.posted-on {
+ float: right;
+ font-style: italic;
+}
+</style>
+
+
+</body>
+
+</html>
diff --git a/www/website.toml b/www/website.toml
index 22d4218..8722c90 100644
--- a/www/website.toml
+++ b/www/website.toml
@@ -1,3 +1,3 @@
-Name = "My Site"
-Tagline = "And it's fine."
+Name = "CoolZone"
+Tagline = "Cool people only."
HomePath = "/"