From dd6d70e4662fd97cb0b274932d195491bb1e68fb Mon Sep 17 00:00:00 2001
From: thecodrr <thecodrr@protonmail.com>
Date: Sat, 24 Jul 2021 12:01:08 +0500
Subject: [PATCH] fix: increase tags under title size

---
 apps/web/src/components/editor/header.js  | 10 ++++------
 apps/web/src/components/icon-tag/index.js |  5 ++++-
 2 files changed, 8 insertions(+), 7 deletions(-)

diff --git a/apps/web/src/components/editor/header.js b/apps/web/src/components/editor/header.js
index 76e5e116b..602fc710e 100644
--- a/apps/web/src/components/editor/header.js
+++ b/apps/web/src/components/editor/header.js
@@ -27,11 +27,7 @@ function Header() {
       />
 
       {id && (
-        <Flex
-          alignItems="flex-start"
-          justifyContent="flex-start"
-          flexWrap="wrap"
-        >
+        <Flex alignItems="center" flexWrap="wrap">
           {tags.map((tag) => (
             <IconTag
               testId={`tag-${tag}`}
@@ -40,10 +36,11 @@ function Header() {
               icon={Icon.Tag}
               title={`Click to remove`}
               onClick={() => setTag(tag)}
-              styles={{ container: { mb: 1 } }}
+              styles={{ container: { mb: 1 }, text: { fontSize: "body" } }}
             />
           ))}
           <Autosuggest
+            sx={{ ml: 1 }}
             getData={() => db.tags.all}
             getFields={(item) => [item.title, item.alias]}
             limit={5}
@@ -113,6 +110,7 @@ function Autosuggest({
         sx={{ width: "auto", border: "none", p: 0 }}
         placeholder="Add a tag..."
         data-test-id="editor-tag-input"
+        fontSize="body"
         onChange={(e) => {
           const { value } = e.target;
           if (!value.length) {
diff --git a/apps/web/src/components/icon-tag/index.js b/apps/web/src/components/icon-tag/index.js
index be88709b8..f8b0a83af 100644
--- a/apps/web/src/components/icon-tag/index.js
+++ b/apps/web/src/components/icon-tag/index.js
@@ -31,7 +31,10 @@ function IconTag({ text, title, icon: Icon, onClick, styles, testId }) {
       py="2px"
     >
       <Icon size={11} color={styles?.icon?.color} sx={{ ...styles?.icon }} />
-      <Text variant="body" p={0} fontSize={11} ml={"2px"}>
+      <Text
+        variant="body"
+        sx={{ fontSize: 11, ml: "2px", p: 0, ...styles?.text }}
+      >
         {text}
       </Text>
     </Flex>