Style empty repo list

Author: Greg Bowler

log.txt

@@ -12,4 +12,5 @@ Check accessibility of controls
 Add hero section and iframe for presentation
 Smooth scroll clicking logo
 Begin styling concertina (complex due to different display on mobile/desktop)
-Add pips to centre of concertina circles
+Add pips to centre of concertina circles
+Style empty repo list

page/index.html

@@ -122,6 +122,25 @@ <h1>
 		The repositories of PHP.Gt
 	</h1>
 
+	<p>
+		PHP.Gt is a collection of open source programming tools that bring modern web development to PHP.
+	</p>
+	<p>
+		Each PHP.Gt code repository can be used individually within existing projects, or used together within WebEngine.
+	</p>
+	<p>
+		Sorted by number of Github stars.
+	</p>
+
+	<ul>
+		<li>
+			<a href="/docs/{repo}">
+				<h1>Repo Name</h1>
+				<p>Repo description.</p>
+			</a>
+		</li>
+	</ul>
+
 </section>
 
 <section class="_contributing">

page/index.php

@@ -0,0 +1,10 @@
+<?php
+namespace Gt\Website\Page;
+
+use Gt\WebEngine\Logic\Page;
+
+class IndexPage extends Page {
+	public function go() {
+		$this->document->querySelector("._repo-list");
+	}
+}

style/component/intro-features.scss

@@ -74,7 +74,7 @@
 
 				> div {
 					position: relative;
-					width: 100vw;
+					//width: 100vw;
 					height: 75vw;
 					max-width: $break-s;
 					max-height: 26rem;

style/component/repo-list.scss

@@ -0,0 +1,14 @@
+._repo-list {
+	background: $palette-panel-dark;
+	color: $palette-text-alt;
+
+	>h1 {
+		@extend %gutter, %padding-m;
+		color: $palette-6;
+		font-size: $font-size-l;
+	}
+
+	>p {
+		@extend %gutter, %padding-m, %padding-horizontal, %reading-column-s;
+	}
+}

style/main.scss

@@ -31,4 +31,5 @@
 @import "component/site-nav";
 @import "component/hero";
 @import "component/intro";
-@import "component/intro-features";
+@import "component/intro-features";
+@import "component/repo-list";

style/var/palette.scss

@@ -11,5 +11,5 @@ $palette-1-dark: #034B67;
 $palette-panel-light: #F0F4F4;
 $palette-panel-dark: #3D3D44;
 
-$palette-positive: $palette-5;
-$palette-negative: $palette-3;
+$palette-text: #034B67;
+$palette-text-alt: #F0F4F4