From d6c4ec68ee78b273cccf3f046ffd8a6023e30e24 Mon Sep 17 00:00:00 2001
From: kvakazyambra <kvakazyambra@gmail.com>
Date: Wed, 25 Oct 2023 00:43:50 +0300
Subject: [PATCH] Confirm modal style fixes

---
 src/components/Article/Comment/Comment.module.scss       | 2 +-
 src/components/Nav/ConfirmModal/ConfirmModal.module.scss | 9 ++++++---
 src/components/Nav/Modal/Modal.module.scss               | 8 ++++++--
 src/styles/app.scss                                      | 2 +-
 4 files changed, 14 insertions(+), 7 deletions(-)

diff --git a/src/components/Article/Comment/Comment.module.scss b/src/components/Article/Comment/Comment.module.scss
index 31abe6db..c0cc356b 100644
--- a/src/components/Article/Comment/Comment.module.scss
+++ b/src/components/Article/Comment/Comment.module.scss
@@ -207,7 +207,7 @@
 
 .articleLinkIcon {
   display: inline-block;
-  margin-right: 1em;
+  margin: 0 1em;
   vertical-align: middle;
   width: 1em;
 }
diff --git a/src/components/Nav/ConfirmModal/ConfirmModal.module.scss b/src/components/Nav/ConfirmModal/ConfirmModal.module.scss
index b955ec59..fc56f732 100644
--- a/src/components/Nav/ConfirmModal/ConfirmModal.module.scss
+++ b/src/components/Nav/ConfirmModal/ConfirmModal.module.scss
@@ -2,18 +2,21 @@
   position: relative;
 
   .confirmModalTitle {
-    @include font-size(2rem);
-
+    @include font-size(3.2rem);
     font-weight: 700;
     color: var(--default-color);
     text-align: center;
+
+    @include media-breakpoint-up(sm) {
+      margin: 0 10%;
+    }
   }
 
   .confirmModalActions {
     display: flex;
     justify-content: space-between;
     margin-top: 4rem;
-    gap: 2rem;
+    gap: 0.5rem;
 
     .confirmAction {
       flex: 1;
diff --git a/src/components/Nav/Modal/Modal.module.scss b/src/components/Nav/Modal/Modal.module.scss
index 9dafa21a..54e71ee7 100644
--- a/src/components/Nav/Modal/Modal.module.scss
+++ b/src/components/Nav/Modal/Modal.module.scss
@@ -63,17 +63,21 @@
     width: 100%;
 
     @include media-breakpoint-up(sm) {
-      max-width: 460px;
+      max-width: 600px;
     }
 
     @include media-breakpoint-up(md) {
-      width: 50%;
+      width: 65%;
     }
 
     .close {
       right: 1.6rem;
       top: 1.6rem;
     }
+
+    .modalInner {
+      padding: 3.8rem 2rem 2rem;
+    }
   }
 }
 
diff --git a/src/styles/app.scss b/src/styles/app.scss
index 46347217..44b7e5a0 100644
--- a/src/styles/app.scss
+++ b/src/styles/app.scss
@@ -18,7 +18,7 @@
   --secondary-color: #85878a;
   --placeholder-color: #9fa1a7;
   --placeholder-color-semi: rgba(159, 169, 167, 0.2);
-  --danger-color: #fc6847;
+  --danger-color: #d00820;
   --lightgray-color: rgb(84 16 17 / 6%);
   --font: -apple-system, blinkmacsystemfont, 'Segoe UI', roboto, oxygen, ubuntu, cantarell, 'Open Sans',
     'Helvetica Neue', sans-serif;