diff --git a/packages/web/components/patterns/HighlightBar.tsx b/packages/web/components/patterns/HighlightBar.tsx
index f1129e089..cce7f9421 100644
--- a/packages/web/components/patterns/HighlightBar.tsx
+++ b/packages/web/components/patterns/HighlightBar.tsx
@@ -27,12 +27,12 @@ type HighlightBarProps = {
   anchorCoordinates: PageCoordinates
   isNewHighlight: boolean
   isSharedToFeed: boolean
-  displayNearCursor: boolean
+  displayAtBottom: boolean
   handleButtonClick: (action: HighlightAction) => void
 }
 
 export function HighlightBar(props: HighlightBarProps): JSX.Element {
-  if (!props.displayNearCursor) {
+  if (props.displayAtBottom) {
     return (
       <Box
         css={{
@@ -93,7 +93,7 @@ function BarContent(props: HighlightBarProps): JSX.Element {
       css={{
         height: '100%',
         alignItems: 'center',
-        width: props.displayNearCursor ? 'auto' : '100%',
+        width: props.displayAtBottom ? '100%' : 'auto',
       }}
     >
       {props.isNewHighlight ? (
diff --git a/packages/web/components/templates/article/HighlightsLayer.tsx b/packages/web/components/templates/article/HighlightsLayer.tsx
index f36476140..9d58ec9e5 100644
--- a/packages/web/components/templates/article/HighlightsLayer.tsx
+++ b/packages/web/components/templates/article/HighlightsLayer.tsx
@@ -536,7 +536,7 @@ export function HighlightsLayer(props: HighlightsLayerProps): JSX.Element {
           isNewHighlight={!!selectionData}
           handleButtonClick={handleAction}
           isSharedToFeed={focusedHighlight?.sharedAt != undefined}
-          displayNearCursor={isTouchScreenDevice()}
+          displayAtBottom={isTouchScreenDevice()}
         />
       </>
     )