diff --git a/Gruntfile.coffee b/Gruntfile.coffee
index 4bcaf1282..f2a346132 100755
--- a/Gruntfile.coffee
+++ b/Gruntfile.coffee
@@ -169,7 +169,7 @@ module.exports = (grunt) ->
git checkout gh-pages
git pull
git merge --no-commit -s ours -
- git checkout - README.md index.html img src/General/img/icon.gif
+ git checkout - README.md index.html web.css img src/General/img/icon.gif
git commit -am "Update web page."
git checkout -
""".split('\n').join('&&')
diff --git a/template.jst b/template.jst
index 02d568641..f2034ba73 100644
--- a/template.jst
+++ b/template.jst
@@ -2,54 +2,7 @@
4chan X
-
+
@@ -70,4 +23,3 @@ for (var i = 0; i < links.length; i++) {
}
-
diff --git a/web.css b/web.css
new file mode 100644
index 000000000..e13d8303d
--- /dev/null
+++ b/web.css
@@ -0,0 +1,46 @@
+body {
+ font-family: "Helvetica Neue", Helvetica, "Segoe UI", Arial, freesans, sans-serif;
+}
+h1 {
+ text-align: center;
+ background-color: #eee;
+}
+img.screenshot {
+ display: block;
+ margin: auto;
+ width: 640px;
+ max-width: 100%;
+}
+@media (min-width: 1120px) {
+ img.screenshot {
+ float: right;
+ margin-left: 8px;
+ }
+}
+span.hover {
+ display: none;
+}
+a:hover + span.hover {
+ display: block;
+ position: fixed;
+ top: 0;
+ bottom: 0;
+ left: 0;
+ right: 0;
+ pointer-events: none;
+ background: rgba(0,0,0,0.4);
+}
+span.hover > img {
+ position: absolute;
+ top: 0;
+ bottom: 0;
+ left: 0;
+ right: 0;
+ margin: auto;
+ max-width: 100%;
+ max-height: 100%;
+ box-shadow: 5px 5px 20px rgba(0,0,0,0.4);
+}
+h2 ~ p, h2 ~ p + ul {
+ margin-left: 1em;
+}