From 9be9ba2afcfc712b35410310ae94a63be93224e1 Mon Sep 17 00:00:00 2001
From: Antonella Sgarlatta <antonella@standardnotes.org>
Date: Wed, 2 Jun 2021 20:30:03 -0300
Subject: [PATCH] fix: fix tags container max width

---
 app/assets/javascripts/components/NoteTagsContainer.tsx     | 2 +-
 .../javascripts/ui_models/app_state/active_note_state.ts    | 6 +-----
 app/assets/stylesheets/_sn.scss                             | 4 ++++
 3 files changed, 6 insertions(+), 6 deletions(-)

diff --git a/app/assets/javascripts/components/NoteTagsContainer.tsx b/app/assets/javascripts/components/NoteTagsContainer.tsx
index f029e888c..ff0d2e087 100644
--- a/app/assets/javascripts/components/NoteTagsContainer.tsx
+++ b/app/assets/javascripts/components/NoteTagsContainer.tsx
@@ -23,7 +23,7 @@ const NoteTagsContainer = observer(({ application, appState }: Props) => {
 
   return (
       <div
-        className="bg-default flex flex-wrap pl-1 -ml-1"
+        className="bg-default flex flex-wrap pl-1 -ml-1 -ml-2"
         style={{
           maxWidth: tagsContainerMaxWidth,
         }}
diff --git a/app/assets/javascripts/ui_models/app_state/active_note_state.ts b/app/assets/javascripts/ui_models/app_state/active_note_state.ts
index f78e06f9e..9956f4fb0 100644
--- a/app/assets/javascripts/ui_models/app_state/active_note_state.ts
+++ b/app/assets/javascripts/ui_models/app_state/active_note_state.ts
@@ -105,14 +105,10 @@ export class ActiveNoteState {
 
   reloadTagsContainerMaxWidth(): void {
     const EDITOR_ELEMENT_ID = 'editor-column';
-    const defaultFontSize = parseFloat(window.getComputedStyle(
-      document.documentElement
-    ).fontSize);
-    const margins = defaultFontSize * 1.5;
     const editorWidth = document.getElementById(EDITOR_ELEMENT_ID)?.clientWidth;
     if (editorWidth) {
       this.appState.activeNote.setTagsContainerMaxWidth(
-        editorWidth - margins
+        editorWidth
       );
     }
   }
diff --git a/app/assets/stylesheets/_sn.scss b/app/assets/stylesheets/_sn.scss
index c816550f8..15d42111b 100644
--- a/app/assets/stylesheets/_sn.scss
+++ b/app/assets/stylesheets/_sn.scss
@@ -69,6 +69,10 @@
   margin-left: -0.25rem;
 }
 
+.-ml-2 {
+  margin-right: -0.5rem;
+}
+
 .-mr-1 {
   margin-right: -0.25rem;
 }