Stuff

wesweb01/evil_infosite/public/css/style.css

@@ -1,3 +1,42 @@
+body {
+	display: flex;
+	justify-content: center;
+	align-items: center;
+	flex-direction: column;
+}
+
+.persons-container {
+	display: flex;
+	flex-wrap: wrap;
+}
+
 .person {
-	background-color: #f00;
+	display: grid;
+	grid-template-columns: 1fr 1fr 1fr;
+	grid-template-rows: 1fr 1fr;
+	grid-template-areas: 
+		"av in in"
+		"av in in"
+	;
+	width: 400px;
+	margin: 1rem;
+	background-color: #aaaaaaaa;
+	border: 1px solid #dccf;
+}
+
+.avatar {
+	grid-area: av;
+}
+
+.info {
+	grid-area: in;
+}
+
+.person ul {
+	list-style-type: none;
+}
+
+.person label {
+	font-weight: bold;
+	color: #000;
 }

wesweb01/evil_infosite/views/layout.slim

@@ -12,5 +12,6 @@ html
   body
     h1 Evil Info Site
     h2 A person registry. No we don't care about GDPR.
-    == yield
+    .persons-container
+      == yield