Adjust button padding

index.js

@@ -16,19 +16,40 @@ const seriousLightItalicButton = document.getElementById(
 const newExampleTextButton = document.getElementById("newExampleTextButton");
 const newExampleText = document.getElementById("newExampleText");
 
+const seriousButtons = [
+  seriousOriginalButton,
+  seriousItalicButton,
+  seriousBoldButton,
+  seriousBoldItalicButton,
+  seriousLightButton,
+  seriousLightItalicButton,
+];
+
 entirePageRadio.addEventListener("click", function () {
   if (this.checked) {
     mainClasses.add("serious");
+    for (seriousButton of seriousButtons) {
+      seriousButton.classList.add("serious");
+    }
   } else {
     mainClasses.remove("serious");
+    for (seriousButton of seriousButtons) {
+      seriousButton.classList.remove("serious");
+    }
   }
 });
 
 exampleTextOnlyRadio.addEventListener("click", function () {
   if (this.checked) {
     mainClasses.remove("serious");
+    for (seriousButton of seriousButtons) {
+      seriousButton.classList.remove("serious");
+    }
   } else {
     mainClasses.add("serious");
+    for (seriousButton of seriousButtons) {
+      seriousButton.classList.add("serious");
+    }
   }
 });
 

style.css

@@ -86,8 +86,7 @@ button {
 
 button,
 input {
-  padding-top: 0.3em;
+  padding: 0.1em;
-  /* padding: 0.1em; */
   align-self: center;
   font-family: inherit;
   font-size: 100%;
@@ -97,6 +96,11 @@ input {
   text-transform: none;
 }
 
+button.serious,
+input.serious {
+  padding-top: 0.3em;
+}
+
 :link {
   color: #70d0fe;
 }