From 0d7c649170217ca97f9f456b9cb326a89ec3f872 Mon Sep 17 00:00:00 2001
From: Oliver <oli@worldbrain.io>
Date: Sun, 21 Jul 2024 01:13:13 +0200
Subject: [PATCH] Improve UX of auto-added button

---
 external/@worldbrain/memex-common               |  2 +-
 .../components/AnnotationEditable.tsx           | 17 +++++++++--------
 2 files changed, 10 insertions(+), 9 deletions(-)

diff --git a/external/@worldbrain/memex-common b/external/@worldbrain/memex-common
index 51a9e8cf57..90cd2e8265 160000
--- a/external/@worldbrain/memex-common
+++ b/external/@worldbrain/memex-common
@@ -1 +1 @@
-Subproject commit 51a9e8cf57efc70a14260caa4230c1dd4466ca81
+Subproject commit 90cd2e8265d3cb4d08c925ef2d0e324abb33a93a
diff --git a/src/annotations/components/AnnotationEditable.tsx b/src/annotations/components/AnnotationEditable.tsx
index 6a708c1ae5..fa84b5d658 100644
--- a/src/annotations/components/AnnotationEditable.tsx
+++ b/src/annotations/components/AnnotationEditable.tsx
@@ -732,13 +732,14 @@ export default class AnnotationEditable extends React.Component<Props, State> {
                     tooltipText={
                         this.props.isShared ? (
                             <span>
-                                Disable Auto-Add
-                                <br /> Only added to Spaces you manually select
+                                <strong>Auto-Added: ON</strong>
+                                <br />
+                                Visible in all Spaces the page is in
                             </span>
                         ) : (
                             <span>
-                                Enable Auto-Add
-                                <br /> Added to all Spaces the page is in
+                                <strong>Add-added: OFF</strong>
+                                <br /> Only visible in manually added Spaces
                             </span>
                         )
                     }
@@ -746,9 +747,9 @@ export default class AnnotationEditable extends React.Component<Props, State> {
                     getPortalRoot={this.props.getRootElement}
                 >
                     <Icon
-                        heightAndWidth="28px"
+                        heightAndWidth="26px"
                         icon={'spread'}
-                        color={this.props.isShared ? 'prime1' : 'greyScale3'}
+                        color={this.props.isShared ? 'prime1' : 'greyScale4'}
                         onClick={(event) => {
                             event.stopPropagation()
                             if (event.shiftKey) {
@@ -759,7 +760,7 @@ export default class AnnotationEditable extends React.Component<Props, State> {
                                 )(!this.props.isShared, !this.props.isShared)
                             }
                         }}
-                        padding={'1px'}
+                        padding={'2px'}
                     />
                 </TooltipBox>
             </AutoAddedIndicator>
@@ -1504,7 +1505,7 @@ export default class AnnotationEditable extends React.Component<Props, State> {
 
 const AutoAddButtonContainer = styled.div`
     position: absolute;
-    bottom: 2px;
+    bottom: 3px;
     left: 10px;
     z-index: 100;
 `