diff --git a/public/assets/buttons/icon-close-red.png b/public/assets/buttons/icon-close-red.png new file mode 100644 index 00000000..28f809fc Binary files /dev/null and b/public/assets/buttons/icon-close-red.png differ diff --git a/src/components/disclaimer-modal/disclaimer-modal.module.css b/src/components/disclaimer-modal/disclaimer-modal.module.css index 1bf00443..9bcceb60 100644 --- a/src/components/disclaimer-modal/disclaimer-modal.module.css +++ b/src/components/disclaimer-modal/disclaimer-modal.module.css @@ -36,7 +36,7 @@ .hd h2 { margin: 0; padding: 0; - font-size: 13px; + font-size: 131%; font-weight: bold; } @@ -50,6 +50,10 @@ height: 18px; text-align: center; user-select: none; + background-image: var(--disclaimer-modal-close-button-background-image); + background-size: 100%; + background-position: center; + background-repeat: no-repeat; } .closeButton:hover { @@ -81,22 +85,6 @@ .disclaimerFooter { padding: 10px; display: flex; - justify-content: flex-end; + justify-content: center; gap: 10px; - border-top: 1px solid rgb(136, 0, 0); } - -.disclaimerFooter button { - padding: 4px 12px; - border: 1px solid rgb(136, 0, 0); - background-color: rgb(255, 255, 255); - color: rgb(136, 0, 0); - cursor: pointer; - font-size: 13px; - font-family: arial, helvetica, clean, sans-serif; -} - -.disclaimerFooter button:hover { - background-color: rgb(250, 250, 250); -} - diff --git a/src/components/disclaimer-modal/disclaimer-modal.tsx b/src/components/disclaimer-modal/disclaimer-modal.tsx index a2ca3b24..fe86ee81 100644 --- a/src/components/disclaimer-modal/disclaimer-modal.tsx +++ b/src/components/disclaimer-modal/disclaimer-modal.tsx @@ -25,9 +25,7 @@ const DisclaimerModal = () => {
To access boards on 5chan (the "website"), you understand and agree to the following:
diff --git a/src/themes.css b/src/themes.css index 93e6b01c..3da8c039 100644 --- a/src/themes.css +++ b/src/themes.css @@ -72,6 +72,7 @@ --homepage-box-link-text-color-hover: #e00; --homepage-box-link-text-decoration: none; --homepage-box-link-text-decoration-hover: underline; + --disclaimer-modal-close-button-background-image: url("/assets/buttons/icon-close-red.png"); /* footer */ --footer-item-background-color-desktop: #fed; @@ -284,6 +285,7 @@ --homepage-box-link-text-color-hover: #d00; --homepage-box-link-text-decoration: none; --homepage-box-link-text-decoration-hover: underline; + --disclaimer-modal-close-button-background-image: url("/assets/buttons/icon-close-red.png"); /* horizontal rule */ --hr-border: none; @@ -673,6 +675,7 @@ --homepage-box-bar-text-color: #000; --homepage-box-bar-background-color: #98e; --homepage-box-bar-text-color-hover: #fff; + --disclaimer-modal-close-button-background-image: url("/assets/buttons/icon-close-red.png"); /* media */ --media-thumbnail-background-color: rgba(0, 0, 0, 0.05); @@ -864,6 +867,7 @@ --homepage-box-border-color: rgb(45, 47, 51); --homepage-box-bar-text-color: #c5c8c6; --homepage-box-bar-text-color-hover: #c5c8c6; + --disclaimer-modal-close-button-background-image: url("/assets/buttons/icon-close-red.png"); /* horizontal rule */ --hr-border: none;