From 87029b43d4e0734b2b3548cba2f2fb15cdf46606 Mon Sep 17 00:00:00 2001
From: Lim Chee Aun <cheeaun@gmail.com>
Date: Mon, 12 Dec 2022 08:46:50 +0800
Subject: [PATCH] Fix clicking on active carousel dot closes the media modal

Also make the active dot larger
---
 src/app.css               | 9 ++++++---
 src/components/status.jsx | 1 +
 2 files changed, 7 insertions(+), 3 deletions(-)

diff --git a/src/app.css b/src/app.css
index d64ce87f..14502ff0 100644
--- a/src/app.css
+++ b/src/app.css
@@ -388,11 +388,14 @@ button.carousel-dot {
   backdrop-filter: none !important;
 }
 button.carousel-dot:hover,
-button.carousel-dot.active {
+button.carousel-dot.active,
+button.carousel-dot[disabled].active {
   color: var(--link-color) !important;
 }
-button.carousel-dot.active {
-  pointer-events: none;
+button.carousel-dot.active,
+button.carousel-dot[disabled].active {
+  opacity: 1;
+  transform: scale(2) translateY(-.5px);
 }
 @media (hover: hover) {
   .carousel-top-controls {
diff --git a/src/components/status.jsx b/src/components/status.jsx
index 0f81b2b2..23ad9a1b 100644
--- a/src/components/status.jsx
+++ b/src/components/status.jsx
@@ -1005,6 +1005,7 @@ function Status({
                   <button
                     key={media.id}
                     type="button"
+                    disabled={i === showMediaModal}
                     class={`plain carousel-dot ${
                       i === showMediaModal ? 'active' : ''
                     }`}