From 37cdc6e62d0a6689a68927a80358706486dc0fbe Mon Sep 17 00:00:00 2001
From: Fedor Indutny <79877362+indutny-signal@users.noreply.github.com>
Date: Tue, 14 Jun 2022 12:54:10 -0700
Subject: [PATCH] Simplify quote alignment and position of toggle

---
 stylesheets/components/CompositionArea.scss | 14 ++++++++++----
 1 file changed, 10 insertions(+), 4 deletions(-)

diff --git a/stylesheets/components/CompositionArea.scss b/stylesheets/components/CompositionArea.scss
index b48f0b26d5bb..b36b3adb50f5 100644
--- a/stylesheets/components/CompositionArea.scss
+++ b/stylesheets/components/CompositionArea.scss
@@ -29,6 +29,7 @@
     }
     &--column {
       flex-direction: column;
+      align-items: stretch;
     }
   }
 
@@ -73,11 +74,16 @@
   }
   $comp-area: &;
   &__toggle-large {
-    width: 48px;
-    height: 24px;
+    $width: 48px;
+    $height: 24px;
+
+    width: $width;
+    height: $height;
     position: absolute;
-    left: calc(50% - 24px);
-    top: -19px;
+    left: calc(50% - $width / 2);
+
+    // 6px coming from padding-top, 1px from outline
+    top: calc(0px - $height / 2 - 6px - 1px);
     border-radius: 12px 12px 0 0;
     pointer-events: none;