Added whitespace, reduced text brightness

7 years ago · 5213c9e033
2 changed files with 26 additions and 38 deletions
--- a/index.html
+++ b/index.html
@ -18,25 +18,14 @@
 <body class="logged-in env-production">

 	<article class="markdown-body entry-content" itemprop="text">
-		<p>
-			<br>
-			<br>
-			<br>
-			<br>
-			<br>
-		</p>
+		<div class="hero">
 			<p alt="up—quick server blocks in one command" align="center">
 				<img src="./icon.png" style="max-width:100%;" height="60">
 			</p>
 			<p align="center">quick
 				<em>nginx</em> server blocks in one command</p>
-		<p>
-			<br>
-			<br>
-			<br>
-			<br>
-			<br>
 			</p>
+		</div>
 		<h1>
 			<a href="#up" aria-hidden="true" class="anchor" id="up">
 				<svg fill="#AAA" aria-hidden="true" class="octicon octicon-link" height="16" version="1.1" viewBox="0 0 16 16" width="16">
@ -47,7 +36,8 @@
 		<p>
 			Quickly deploy code from anywhere using
 			<code>up</code>
-		</p><br>
+		</p>
+		<br>
 		<blockquote>
 			<p>Current version:
 				<code>up v.0.1.5 (Pre-Alpha)</code>
@ -148,7 +138,8 @@
 		</p>
 		<p class="se-icon" style="margin-bottom: 0 !important">
 			<a href="http://js.org" target="_blank" title="JS.ORG | JavaScript Community">
-			<img src="http://logo.js.org/dark_tiny.png" width="77" alt="JS.ORG Logo"/></a>
+				<img src="http://logo.js.org/dark_tiny.png" width="77" alt="JS.ORG Logo" />
+			</a>
 		</p>
 	</article>

--- a/style.css
+++ b/style.css
@ -6,7 +6,7 @@ html {

 body {
 	background: #000;
-	color: #fff;
+	color: #ddd;
 	margin: auto 8%;
 	word-wrap: break-word;
 	font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
@ -14,6 +14,10 @@ body {
 	line-height: 1.5;
 }

+.hero {
+	padding: 30vh 0;
+}
+
 .octicon {
 	display: inline-block;
 	vertical-align: text-top;
@ -42,11 +46,6 @@ strong {
 	font-weight: bolder
 }

-h1 {
-	font-size: 2em;
-	margin: 0.67em 0
-}
-
 img {
 	border-style: none
 }
@ -127,13 +126,13 @@ button {

 h1,
 h2 {
-	margin-top: 0;
-	margin-bottom: 0
+	margin: 30px 0;
+	color: #ccc
 }

 h1 {
 	font-size: 32px;
-	font-weight: 600
+	font-weight: 600;
 }

 h2 {
@ -266,8 +265,6 @@ code {

 .markdown-body h1,
 .markdown-body h2 {
-	margin-top: 24px;
-	margin-bottom: 16px;
 	font-weight: 600;
 	line-height: 1.25
 }