Improved display of home page on smaller devices

rpg-docs/client/views/home/intro/intro.css

@@ -21,10 +21,15 @@
 	max-width: 300px;
 	padding: 16px;
 	text-align: center;
+    min-width: 0;
+}
+
+.intro .section .columns {
+	max-width: 100%;
 }
 
 .intro paper-button {
-	min-width: 200px;
+	flex-basis: 200px;
 }
 
 

rpg-docs/client/views/home/intro/intro.html

@@ -64,7 +64,7 @@
 		</div>
 		<div class="section white-text" style="background: #282828">
 			<div class="columns layout horizontal around-justified wrap">
-				<div>
+				<div class="layout vertical center">
 					<div class="paper-font-headline">
 						Guide
 					</div>
@@ -78,7 +78,7 @@
 						</paper-button>
 					</a>
 				</div>
-				<div>
+				<div class="layout vertical center">
 					<div class="paper-font-headline">
 						Discuss
 					</div>
@@ -91,7 +91,7 @@
 						</paper-button>
 					</a>
 				</div>
-				<div>
+				<div class="layout vertical center">
 					<div class="paper-font-headline">
 						Get involved
 					</div>