diff --git a/index-new.html b/index-new.html
index 4be2616..b606799 100644
--- a/index-new.html
+++ b/index-new.html
@@ -488,16 +488,40 @@
border-radius: 28px;
width: 100%;
max-width: 400px;
+ max-height: 80vh; /* Limit height to 80% of viewport height */
box-shadow: var(--elevation-level-3);
transform: scale(0.9);
transition: transform 0.3s;
color: var(--on-surface-color);
+ display: flex;
+ flex-direction: column; /* Organize content vertically */
+ overflow: hidden; /* Hide overflow but allow internal scrolling */
}
.modal.visible .modal-content {
transform: scale(1);
}
+ /* Ensuring modal content areas are properly scrollable */
+ .markdown-content {
+ overflow-y: auto; /* Make content scrollable */
+ max-height: 60vh; /* Limit height to leave room for buttons */
+ margin-bottom: 16px; /* Space before buttons */
+ padding-right: 8px; /* Room for scrollbar */
+ }
+
+ /* News modal specific styles */
+ #newsModal .modal-content {
+ display: flex;
+ flex-direction: column;
+ }
+
+ #newsContent {
+ flex: 1;
+ overflow-y: auto;
+ margin-bottom: 16px;
+ }
+
.modal-title {
font-size: 1.5rem;
font-weight: 500;
@@ -1018,7 +1042,7 @@
-
+
diff --git a/index.html b/index.html
index 4be2616..ba5f38c 100644
--- a/index.html
+++ b/index.html
@@ -488,16 +488,40 @@
border-radius: 28px;
width: 100%;
max-width: 400px;
+ max-height: 80vh; /* Limit height to 80% of viewport height */
box-shadow: var(--elevation-level-3);
transform: scale(0.9);
transition: transform 0.3s;
color: var(--on-surface-color);
+ display: flex;
+ flex-direction: column; /* Organize content vertically */
+ overflow: hidden; /* Hide overflow but allow internal scrolling */
}
.modal.visible .modal-content {
transform: scale(1);
}
+ /* Ensuring modal content areas are properly scrollable */
+ .markdown-content {
+ overflow-y: auto; /* Make content scrollable */
+ max-height: 60vh; /* Limit height to leave room for buttons */
+ margin-bottom: 16px; /* Space before buttons */
+ padding-right: 8px; /* Room for scrollbar */
+ }
+
+ /* News modal specific styles */
+ #newsModal .modal-content {
+ display: flex;
+ flex-direction: column;
+ }
+
+ #newsContent {
+ flex: 1;
+ overflow-y: auto;
+ margin-bottom: 16px;
+ }
+
.modal-title {
font-size: 1.5rem;
font-weight: 500;
@@ -1018,7 +1042,7 @@
-