commit 28c178bbddbc66f9088afbf160e4ebeb5dc2cc4a Author: Damian Johnson atagar@torproject.org Date: Sun Jul 23 21:39:27 2017 -0700
Stub content for a page
Filling in just a bit of the content for our front page so we can see how the white foreground looks. Too much contrast with our dark striped background, but think this works well. --- web/images/diagonal-stripes.png | Bin 152 -> 0 bytes web/images/grid.png | Bin 0 -> 145 bytes web/index.html | 11 ++++++++++- web/styles.css | 42 +++++++++++++++++++++++++++++++++++++--- 4 files changed, 49 insertions(+), 4 deletions(-)
diff --git a/web/images/diagonal-stripes.png b/web/images/diagonal-stripes.png deleted file mode 100644 index d057205..0000000 Binary files a/web/images/diagonal-stripes.png and /dev/null differ diff --git a/web/images/grid.png b/web/images/grid.png new file mode 100644 index 0000000..1c62058 Binary files /dev/null and b/web/images/grid.png differ diff --git a/web/index.html b/web/index.html index 4143ba1..278e282 100644 --- a/web/index.html +++ b/web/index.html @@ -11,6 +11,7 @@ <body> <div class="header"> <div class="header-body"> + <span id="logo"></span> <div class="nav"> <ul class="tabs nav"> <li><a id="t1" href="#what_is_it">What Is It?</a></li> @@ -18,8 +19,16 @@ <li><a id="t3" href="#download">Download</a></li> </ul> </div> - <span id="logo"></span> </div> </div> + + <div id="home" class="content"> + <div class="header-line first"></div> + <h1>Welcome to Nyx</h1> + + <p>Nyx is a command-line monitor for <a href="https://www.torproject.org/">Tor</a>. With this you can get detailed real-time information about your relay such as bandwidth usage, connections, logs, and much more.</p> + + <p>Nyx's latest version is <b>1.4.5</b>, released April 28th, 2012.</p> + </div> </body> </html> diff --git a/web/styles.css b/web/styles.css index 67fda84..f784237 100644 --- a/web/styles.css +++ b/web/styles.css @@ -1,11 +1,13 @@ body { - background: #202228 url("images/diagonal-stripes.png"); + background: #202228 url("images/grid.png"); + font-family: "FreeSans", "Arial", "Helvetica", sans-serif; line-height: 1.231; - color: white; margin: 0px; }
a { + color: #856231; + font-weight: bold; text-decoration: none; }
@@ -19,7 +21,6 @@ a { .header-body { margin: 0px auto; text-align: center; - font-family: "FreeSans", "Arial", "Helvetica", sans-serif; max-width: 770px; }
@@ -42,6 +43,7 @@ a { }
.nav a { + font-weight: normal; display: inline-block; padding: 6px 15px; background: #825d27; @@ -73,3 +75,37 @@ a { color: #666666; }
+.content { + background: white; + margin: 50px auto 0px auto; + max-width: 630px; + border-radius: 10px; + text-align: center; + padding: 50px; + box-shadow: 0px 0px 25px rgba(0, 0, 0, 0.80); +} + +.header-line { + border-top: 1px solid #856231; + margin-bottom: -16px; +} + +.first { + margin-top: 5px; +} + +.content h1 { + display: inline-block; + position: relative; + color: #856231; + margin: 0px auto; + background: white; + font-size: 28px; + padding: 0 15px; +} + +.content p { + margin: 20px 0px 0px; + text-align: justify; +} +