From 2aa00936a7e5e586b0e1f111b59f901807de6241 Mon Sep 17 00:00:00 2001
From: lillian rose winter <fen@tilde.pw>
Date: Mon, 9 Mar 2020 15:12:29 +0000
Subject: [PATCH] use flexbox for styling

---
 index.php | 16 ++++++++--------
 style.css |  9 +++++++--
 2 files changed, 15 insertions(+), 10 deletions(-)

diff --git a/index.php b/index.php
index 954069a..d0d2fd7 100644
--- a/index.php
+++ b/index.php
@@ -6,9 +6,9 @@
 
 	<p class="advisory"></p>
 
-	<table>
-		<tr>
-			<td>
+	<div class="grid">
+		<div class="row">
+			<div class="col">
 				<p>
 					tilde.club is not a social network it is one tiny totally 
 					standard unix computer that people respectfully use together 
@@ -40,9 +40,9 @@
 						<li><a href="/~<?=$user?>/">~<?=$user?></a></li>
 					<?php } ?>
 				</ol>
-			</td>
+			</div>
 
-			<td valign="top">
+			<div class="col">
                                 <h2>UPDATE: March 2020:</h2>
                                 <p>
                                         Things at tilde.club are going well, Thank you to all our new and existing users.
@@ -110,9 +110,9 @@
 					<li>10/3/2014 | <a href="/~englishm">~englishm</a></li>
 					<li>10/3/2014 | <a href="/~danbri">~danbri</a></li>
 				</ul>
-			</td>
-		</tr>
-	</table>
+			</div>
+		</div>
+	</div>
 
 	<p>big kudos and thanks to the people who built the original tilde.club!</p>
 
diff --git a/style.css b/style.css
index 22ca642..4fe2626 100644
--- a/style.css
+++ b/style.css
@@ -1,9 +1,14 @@
 /* {font-size:13pt;font-weight:normal;} */
 
-table {
+@media (min-width: 30em) {
+    .row { display: flex; flex-wrap: nowrap; }
+    .col { flex-grow: 1; }
+}
+
+.grid {
   border-collapse: collapse;
 }
-td {
+.col {
   border: 6px double #fb5;
   padding: 1em;
 }