From ac7fb315d60bb8c0c57e50ba044a044971b5da8b Mon Sep 17 00:00:00 2001
From: Ammar Ahmed <ammarahmed6506@gmail.com>
Date: Mon, 11 Mar 2024 11:50:00 +0500
Subject: [PATCH] mobile: fix colors and size of icons in editor header

---
 .../editor-mobile/src/components/header.tsx   | 23 +++++++++++--------
 1 file changed, 13 insertions(+), 10 deletions(-)

diff --git a/packages/editor-mobile/src/components/header.tsx b/packages/editor-mobile/src/components/header.tsx
index a8baa3668..c9ad1f379 100644
--- a/packages/editor-mobile/src/components/header.tsx
+++ b/packages/editor-mobile/src/components/header.tsx
@@ -149,7 +149,7 @@ function Header({
                 style={{
                   position: "absolute"
                 }}
-                color="var(--nn_primary_paragraph)"
+                color="var(--nn_primary_icon)"
               />
             </Button>
           )}
@@ -214,7 +214,7 @@ function Header({
                   style={{
                     position: "absolute"
                   }}
-                  color="var(--nn_primary_paragraph)"
+                  color="var(--nn_primary_icon)"
                 />
               </Button>
             ) : null}
@@ -239,7 +239,7 @@ function Header({
             >
               <div
                 style={{
-                  border: "2.5px solid var(--nn_primary_icon)",
+                  border: "2px solid var(--nn_primary_icon)",
                   width: 19 * settings.fontScale,
                   height: 19 * settings.fontScale,
                   minWidth: 19 * settings.fontScale,
@@ -251,7 +251,10 @@ function Header({
               >
                 <p
                   style={{
-                    fontSize: 15 * settings.fontScale
+                    fontSize:
+                      openedTabsCount > 100
+                        ? 10 * settings.fontScale
+                        : 12 * settings.fontScale
                   }}
                 >
                   {openedTabsCount}
@@ -283,7 +286,7 @@ function Header({
                 style={{
                   position: "absolute"
                 }}
-                color="var(--nn_primary_paragraph)"
+                color="var(--nn_primary_icon)"
               />
             </Button>
 
@@ -346,7 +349,7 @@ function Header({
                     color={
                       !hasUndo
                         ? "var(--nn_secondary_border)"
-                        : "var(--nn_primary_paragraph)"
+                        : "var(--nn_primary_icon)"
                     }
                     size={25 * settings.fontScale}
                     style={{
@@ -376,7 +379,7 @@ function Header({
                     color={
                       !hasRedo
                         ? "var(--nn_secondary_border)"
-                        : "var(--nn_primary_paragraph)"
+                        : "var(--nn_primary_icon)"
                     }
                     size={25 * settings.fontScale}
                     style={{
@@ -407,7 +410,7 @@ function Header({
                     style={{
                       position: "absolute"
                     }}
-                    color="var(--nn_primary_paragraph)"
+                    color="var(--nn_primary_icon)"
                   />
                 </Button>
               </div>
@@ -421,7 +424,7 @@ function Header({
               >
                 <TableOfContentsIcon
                   size={22 * settings.fontScale}
-                  color="var(--nn_primary_paragraph)"
+                  color="var(--nn_primary_icon)"
                 />
                 Table of contents
               </MenuItem>
@@ -434,7 +437,7 @@ function Header({
               >
                 <DotsHorizontalIcon
                   size={22 * settings.fontScale}
-                  color="var(--nn_primary_paragraph)"
+                  color="var(--nn_primary_icon)"
                 />
                 Note Properties
               </MenuItem>