From 94dbfad535e0f068fa459f510f75de20ebcb8263 Mon Sep 17 00:00:00 2001
From: Freya Murphy <freya@freyacat.org>
Date: Fri, 20 Dec 2024 11:31:20 -0500
Subject: [PATCH] fix about modal

---
 src/scss/common.scss           | 14 +++++++++++++-
 src/web/_views/modal/about.php | 28 ++++++----------------------
 2 files changed, 19 insertions(+), 23 deletions(-)

diff --git a/src/scss/common.scss b/src/scss/common.scss
index 222aba8..4a9a291 100644
--- a/src/scss/common.scss
+++ b/src/scss/common.scss
@@ -120,7 +120,6 @@ header#header {
       }
     }
   }
-
 }
 
 @media (min-width: 800px) {
@@ -598,3 +597,16 @@ form {
     }
   }
 }
+
+#about-menu {
+  @include column;
+  justify-content: center;
+  align-items: center;
+
+  .logo {
+    color: $blue;
+    font-family: $header-font;
+    font-size: 2.25rem;
+    margin-bottom: $inner-gap;
+  }
+}
diff --git a/src/web/_views/modal/about.php b/src/web/_views/modal/about.php
index 55ea3f0..4bc7a4f 100644
--- a/src/web/_views/modal/about.php
+++ b/src/web/_views/modal/about.php
@@ -1,25 +1,9 @@
 <?php /* Copyright (c) 2024 Freya Murphy */ ?>
 <?php /* vi: syntax=php */ ?>
-<div id="about-modal-body">
-	<span class="logo">xssbook</span>
-	<span class="mb"><?=ucfirst(lang('version'))?></span>
-	<span><?=ucfirst(lang('copyright'))?></span>
-	<a class="btn btn-primary mt" href="https://g.freya.cat/freya/xssbook2">Source Code</a>
-	<p>For reports of abuse, please email <a class="btn-primary" href="mailto:contact@freyacat.org">contact@freyacat.org</a></p>
+<div id="about-menu" class="modal-content">
+	<div><span class="logo">xssbook</span></div>
+	<div><span class="mb"><?=ucfirst(lang('version'))?></span></div>
+	<div><span><?=ucfirst(lang('copyright'))?></span></div>
+	<div><a class="btn btn-primary mt" href="https://g.freya.cat/freya/xssbook2">Source Code</a></div>
+	<div><p>For reports of abuse, please email <a class="btn-primary" href="mailto:contact@freyacat.org">contact@freyacat.org</a></p></div>
 </div>
-<style>
-#about-modal-body {
-	display: flex;
-	margin-top: 50px;
-	flex-direction: column;
-	justify-content: center;
-	align-items: center;
-	padding: 1rem;
-}
-#about-modal-body .logo {
-	color: var(--blue);
-	font-family: facebook;
-	font-size: 2.25rem;
-	margin-bottom: 1rem;
-}
-</style>