From 0d49eb3e05e60fa8a7f5e8e773ef2c2d2e10a633 Mon Sep 17 00:00:00 2001
From: Aakansha Doshi <aakansha1216@gmail.com>
Date: Mon, 4 Sep 2023 13:59:47 +0530
Subject: [PATCH] make design responsive

---
 src/components/MermaidToExcalidraw.scss | 20 ++++++++++++++++++++
 1 file changed, 20 insertions(+)

diff --git a/src/components/MermaidToExcalidraw.scss b/src/components/MermaidToExcalidraw.scss
index 4eb30e348..73fe26ea5 100644
--- a/src/components/MermaidToExcalidraw.scss
+++ b/src/components/MermaidToExcalidraw.scss
@@ -11,6 +11,10 @@
       font-weight: 600;
       margin-bottom: 4px;
       margin-left: 4px;
+
+      @media screen and (max-width: 860px) {
+        margin-top: 4px;
+      }
     }
 
     &-text {
@@ -23,6 +27,11 @@
         resize: none;
         border-radius: 8px;
         padding: 1rem;
+
+        @media screen and (max-width: 860px) {
+          width: 100%;
+          height: 10rem;
+        }
       }
     }
 
@@ -38,6 +47,10 @@
         left center;
       border-radius: 8px;
       border: 1px solid #e4e4eb;
+
+      @media screen and (max-width: 860px) {
+        width: 100%;
+      }
     }
 
     &-preview-insert.excalidraw-button {
@@ -57,6 +70,13 @@
       }
 
       color: $oc-white;
+
+      @media screen and (max-width: 860px) {
+        width: 100%;
+      }
+    }
+    @media screen and (max-width: 860px) {
+      flex-direction: column;
     }
   }
 }