diff --git a/components/ProjectModal.tsx b/components/ProjectModal.tsx
index 555c86f..7f3902b 100644
--- a/components/ProjectModal.tsx
+++ b/components/ProjectModal.tsx
@@ -61,7 +61,10 @@ Last updated: ${lastUpdate} | setVisible(false)}>
-
;
};
diff --git a/styles/ProjectModal.module.css b/styles/ProjectModal.module.css
index b0efe6e..cba7710 100644
--- a/styles/ProjectModal.module.css
+++ b/styles/ProjectModal.module.css
@@ -20,18 +20,21 @@
position: relative;
}
+.modalText {
+ max-width: 45em;
+ margin: 0 auto;
+}
+
.modalClose {
float: right;
position: relative;
- background: #555;
+ background: #272b30;
border-radius: 50%;
width: 2em;
height: 2em;
font-family: sans-serif;
- margin-bottom: -20px;
+ margin-bottom: 10px;
z-index: 100;
- /*text-align: center;*/
- /*padding: auto 0;*/
}
.modalCloseAlign {
@@ -43,4 +46,27 @@
display: block;
color: #fff;
text-decoration: none;
-}
\ No newline at end of file
+}
+
+/* Firefox */
+.modalContainer {
+ scrollbar-width: auto;
+ scrollbar-color: var(--repl-color, #188a18) #272b30;
+}
+
+/* Chrome, Edge, and Safari */
+.modalContainer::-webkit-scrollbar {
+ width: 16px;
+}
+
+.modalContainer::-webkit-scrollbar-track {
+ background: #272b30;
+ border-bottom-right-radius: 20px;
+ border-top-right-radius: 20px;
+}
+
+.modalContainer::-webkit-scrollbar-thumb {
+ background-color: var(--repl-color, #188a18);
+ border-radius: 20px;
+ border: none;
+}