From f0a2a3ea587db8c82a09801a2f61da02cabd8b1e Mon Sep 17 00:00:00 2001
From: crowetic <jason@crowetic.com>
Date: Wed, 11 Dec 2024 18:57:50 -0800
Subject: [PATCH] increased font sizes and fixed comments not displaying
 correctly

---
 assets/css/forum-styles.css | 43 +++++++++++++++++++++----------------
 assets/js/MinterBoard.js    |  6 +-----
 index.html                  |  2 +-
 3 files changed, 27 insertions(+), 24 deletions(-)

diff --git a/assets/css/forum-styles.css b/assets/css/forum-styles.css
index 8e7ced5..94ad1a2 100644
--- a/assets/css/forum-styles.css
+++ b/assets/css/forum-styles.css
@@ -541,17 +541,20 @@ body {
     padding: 1.2vh;
   }
 }
-@media (max-width: 768px) {
-  .minter-card {
-    flex: 1 1 calc(50% - 20px); /* Two cards per row on medium screens */
-  }
-}
+/* Two cards per row on medium screens */
 
-@media (max-width: 480px) {
+/* @media (max-width: 768px) {
   .minter-card {
-    flex: 1 1 100%; /* Full-width cards on small screens */
+    flex: 1 1 calc(50% - 20px); 
   }
-}
+} */
+/* Full-width cards on small screens */
+
+/* @media (max-width: 480px) {
+  .minter-card {
+    flex: 1 1 100%; 
+  }
+} */
 
 .minter-card {
   background-color: #1e1e2e; /* Dark background */
@@ -581,19 +584,22 @@ body {
 
 .minter-card-header h3 {
   margin: 0;
-  font-size: 1.5em;
+  font-size: 1.6em;
   color: #ffae42; /* Highlight for the header */
 }
 
 .minter-card h5 {
   margin: 0;
-  font-size: 1.0em;
+  font-size: 1.4em;
   color: lightgreen;
   text-align: center;
 }
+.minter-card p {
+  font-size: 1.12em;
+}
 
 .minter-card-header p {
-  font-size: 0.9em;
+  font-size: 1.15em;
   color: #cccccc; /* Subdued color for additional header info */
 }
 
@@ -609,7 +615,7 @@ body {
 
 .minter-card-results h5 {
   margin-bottom: 1vh;
-  font-size: 1.1vh;
+  font-size: 1.3em;
   color: lightgreen;
   text-align: center;
 }
@@ -622,7 +628,7 @@ body {
 .minter-card-results span {
   padding: 5px 10px;
   border-radius: 8px;
-  font-size: 0.9em;
+  font-size: 1.1em;
 }
 
 .minter-card-results .admin-yes {
@@ -665,7 +671,7 @@ body {
   border: 1px solid #d3d3d3; /* Light grey border */
   padding: 1rem; /* Add padding inside the section */
   margin: 1rem 0; /* Add margin outside the section for spacing */
-  font-size: 0.75em; /* Set the font size */
+  font-size: 1.1em; /* Set the font size */
   line-height: 1.5; /* Optional: Adjust line spacing for better readability */
   height: calc(1.5 * 750 / 66 * 0.8em); /* Dynamically calculate height to fit 1000 characters */
   overflow-y: auto; /* Enable vertical scrolling if content overflows */
@@ -769,6 +775,10 @@ body {
   box-shadow: inset 0 0 5px rgba(0, 0, 0, 0.5);
 }
 
+.comments {
+  font-size: 1.15em;
+}
+
 .comments-container {
   margin-bottom: 10px;
   max-height: 150px;
@@ -801,10 +811,7 @@ textarea::placeholder {
   background-color: #0055cc;
 }
 
-.minter-card p {
-  font-size: 12px;
-  color: gray;
-}
+
 
 
 
diff --git a/assets/js/MinterBoard.js b/assets/js/MinterBoard.js
index e775b02..8463405 100644
--- a/assets/js/MinterBoard.js
+++ b/assets/js/MinterBoard.js
@@ -33,7 +33,7 @@ async function loadMinterBoardPage() {
   mainContent.innerHTML = `
     <div class="minter-board-main" style="padding: 20px; text-align: center;">
       <h1 style="color: lightblue;">Minter Board</h1>
-      <p> The Minter Board is a place to publish information about yourself in order to obtain support from existing Minters and Minter Admins on the Qortal network. You may publish a header, content, and links to other QDN-published content in order to support you in your mission. Minter Admins and Existing Minters will then support you (or not) by way of a vote on your card. Card details you publish, along with existing poll results, and comments from others, will be displayed here. Good Luck on your Qortal journey to becoming a minter!</p>
+      <p style="font-size: 1.25em;"> The Minter Board is a place to publish information about yourself in order to obtain support from existing Minters and Minter Admins on the Qortal network. You may publish a header, content, and links to other QDN-published content in order to support you in your mission. Minter Admins and Existing Minters will then support you (or not) by way of a vote on your card. Card details you publish, along with existing poll results, and comments from others, will be displayed here. Good Luck on your Qortal journey to becoming a minter!</p>
       <button id="publish-card-button" class="publish-card-button" style="margin: 20px; padding: 10px;">Publish Minter Card</button>
       <div id="cards-container" class="cards-container" style="margin-top: 20px;"></div>
       <div id="publish-card-view" class="publish-card-view" style="display: none; text-align: left; padding: 20px;">
@@ -389,9 +389,6 @@ const displayComments = async (cardIdentifier) => {
   try {
     const comments = await fetchCommentsForCard(cardIdentifier);
     const commentsContainer = document.getElementById(`comments-container-${cardIdentifier}`);
-    
-    // Clear previous comments
-    commentsContainer.innerHTML = '';
 
     // Fetch and display each comment
     for (const comment of comments) {
@@ -457,7 +454,6 @@ async function createCardHTML(cardData, pollResults, cardIdentifier) {
   const { adminYes = 0, adminNo = 0, minterYes = 0, minterNo = 0, totalYes = 0, totalNo = 0 } =
     calculatePollResults(pollResults, minterGroupMembers) || {};
 
-
   return `
   <div class="minter-card">
     <div class="minter-card-header">
diff --git a/index.html b/index.html
index 084f5e9..85933e3 100644
--- a/index.html
+++ b/index.html
@@ -229,7 +229,7 @@
                 </div>
                 
                 <a class="link-wrap" href="#">
-                    <p class="mbr-link mbr-fonts-style display-4">Q-Mintership v0.22beta</p>
+                    <p class="mbr-link mbr-fonts-style display-4">Q-Mintership v0.24beta</p>
                 </a>
             </div>
             <div class="col-12 col-lg-6">