From 2c1a6c8cb52383552359d488eb807474cd0d59e0 Mon Sep 17 00:00:00 2001
From: Lim Chee Aun <cheeaun@gmail.com>
Date: Sat, 25 May 2024 13:39:11 +0800
Subject: [PATCH] Restyle the composer controls UI

---
 src/components/compose.jsx |  8 ++++----
 src/index.css              | 21 ---------------------
 2 files changed, 4 insertions(+), 25 deletions(-)

diff --git a/src/components/compose.jsx b/src/components/compose.jsx
index 83ed51f6..12a3c80e 100644
--- a/src/components/compose.jsx
+++ b/src/components/compose.jsx
@@ -697,10 +697,10 @@ function Compose({
             />
           )}
           {!standalone ? (
-            <span class="button-group">
+            <span class="compose-controls">
               <button
                 type="button"
-                class="light pop-button"
+                class="plain4 pop-button"
                 disabled={uiState === 'loading'}
                 onClick={() => {
                   // If there are non-ID media attachments (not yet uploaded), show confirmation dialog because they are not going to be passed to the new window
@@ -743,10 +743,10 @@ function Compose({
                 }}
               >
                 <Icon icon="popout" alt="Pop out" />
-              </button>{' '}
+              </button>
               <button
                 type="button"
-                class="light min-button"
+                class="plain4 min-button"
                 onClick={onMinimize}
               >
                 <Icon icon="minimize" alt="Minimize" />
diff --git a/src/index.css b/src/index.css
index a963ee03..35f75a4e 100644
--- a/src/index.css
+++ b/src/index.css
@@ -388,27 +388,6 @@ select.plain {
   background-color: transparent;
 }
 
-.button-group {
-  display: flex;
-
-  button,
-  .button {
-    margin-inline: calc(-1 * var(--hairline-width));
-
-    &:first-child:not(:only-child) {
-      border-top-right-radius: 0;
-      border-bottom-right-radius: 0;
-    }
-    &:not(:first-child, :last-child, :only-child) {
-      border-radius: 0;
-    }
-    &:last-child:not(:only-child) {
-      border-top-left-radius: 0;
-      border-bottom-left-radius: 0;
-    }
-  }
-}
-
 pre {
   tab-size: 2;
 }