From d780aa52ff7d6a9ca5a1e6f4479a8ef51eb4d27b Mon Sep 17 00:00:00 2001
From: kaBeech <contact@kaBeech.com>
Date: Sat, 18 Mar 2023 21:00:10 -0700
Subject: [PATCH] Adjust button styling

---
 index.js  | 11 ++++++-----
 style.css | 13 ++++++++++++-
 2 files changed, 18 insertions(+), 6 deletions(-)

diff --git a/index.js b/index.js
index ba9ece6..0dbd2af 100644
--- a/index.js
+++ b/index.js
@@ -13,16 +13,17 @@ const seriousLightButton = document.getElementById("seriousLightButton");
 const seriousLightItalicButton = document.getElementById(
   "seriousLightItalicButton"
 );
-const newExampleTextButton = document.getElementById("newExampleTextButton");
 const newExampleText = document.getElementById("newExampleText");
+const newExampleTextButton = document.getElementById("newExampleTextButton");
 
-const seriousButtons = [
+const buttons = [
   seriousOriginalButton,
   seriousItalicButton,
   seriousBoldButton,
   seriousBoldItalicButton,
   seriousLightButton,
   seriousLightItalicButton,
+  newExampleTextButton,
 ];
 
 const seriousStyles = [
@@ -39,7 +40,7 @@ const clearClasses = () => {
     exampleTextClassList.remove(seriousStyle);
     mainClassList.remove(seriousStyle);
   }
-  for (seriousButton of seriousButtons) {
+  for (seriousButton of buttons) {
     seriousButton.classList.remove("selected");
   }
 };
@@ -51,14 +52,14 @@ const clearClassesAndSelectThisButton = (button) => {
 
 entirePageRadio.addEventListener("click", () => {
   mainClassList.add("serious");
-  for (seriousButton of seriousButtons) {
+  for (seriousButton of buttons) {
     seriousButton.classList.add("serious");
   }
 });
 
 exampleTextOnlyRadio.addEventListener("click", () => {
   mainClassList.remove("serious");
-  for (seriousButton of seriousButtons) {
+  for (seriousButton of buttons) {
     seriousButton.classList.remove("serious");
   }
 });
diff --git a/style.css b/style.css
index 3b69f88..17b9341 100644
--- a/style.css
+++ b/style.css
@@ -86,7 +86,7 @@ button {
 
 button,
 input {
-  padding-top: 0.3em;
+  padding: 0.1em;
   align-self: center;
   font-family: inherit;
   font-size: 100%;
@@ -96,6 +96,11 @@ input {
   text-transform: none;
 }
 
+button.serious,
+input.serious {
+  padding-top: 0.3em;
+}
+
 :link {
   color: #3ec0aa;
   text-decoration: none;
@@ -145,24 +150,30 @@ input {
 
 #seriousOriginalButton {
   font-family: "Serious Sans";
+  padding-top: 0.3em;
 }
 
 #seriousItalicButton {
   font-family: "Serious Sans Italic";
+  padding-top: 0.3em;
 }
 
 #seriousBoldButton {
   font-family: "Serious Sans Bold";
+  padding-top: 0.3em;
 }
 
 #seriousBoldItalicButton {
   font-family: "Serious Sans Bold Italic";
+  padding-top: 0.3em;
 }
 
 #seriousLightButton {
   font-family: "Serious Sans Light";
+  padding-top: 0.3em;
 }
 
 #seriousLightItalicButton {
   font-family: "Serious Sans Light Italic";
+  padding-top: 0.3em;
 }