From 015d70afb63e9e6320f2143de2e47cf7b224b1a4 Mon Sep 17 00:00:00 2001
From: Elian Doran <contact@eliandoran.me>
Date: Mon, 24 Nov 2025 21:45:33 +0200
Subject: [PATCH] feat(popup_editor): enable floating buttons

---
 apps/client/src/stylesheets/theme-next/shell.css | 6 +++---
 apps/client/src/widgets/dialogs/PopupEditor.tsx  | 4 ++++
 2 files changed, 7 insertions(+), 3 deletions(-)

diff --git a/apps/client/src/stylesheets/theme-next/shell.css b/apps/client/src/stylesheets/theme-next/shell.css
index e42ac2685..19ac27477 100644
--- a/apps/client/src/stylesheets/theme-next/shell.css
+++ b/apps/client/src/stylesheets/theme-next/shell.css
@@ -1453,7 +1453,7 @@ div.promoted-attribute-cell .multiplicity:has(span) span {
  */
 
  /* Floating buttons container */
-div#center-pane .floating-buttons-children {
+.floating-buttons-children {
     opacity: 1;
     min-height: var(--floating-button-height);
     transform-origin: right;
@@ -1465,12 +1465,12 @@ div#center-pane .floating-buttons-children {
                 opacity 250ms ease-out;
 }
 
-body[dir=rtl] div#center-pane .floating-buttons-children {
+body[dir=rtl] .floating-buttons-children {
     transform-origin: left;
 }
 
  /* Floating buttons container (collapsed) */
- div#center-pane .floating-buttons-children.temporarily-hidden {
+ .floating-buttons-children.temporarily-hidden {
     display: flex !important;
     opacity: 0;
     transform: scaleX(0);
diff --git a/apps/client/src/widgets/dialogs/PopupEditor.tsx b/apps/client/src/widgets/dialogs/PopupEditor.tsx
index a9c6b75ab..1db0b24bd 100644
--- a/apps/client/src/widgets/dialogs/PopupEditor.tsx
+++ b/apps/client/src/widgets/dialogs/PopupEditor.tsx
@@ -12,6 +12,9 @@ import NoteList from "../collections/NoteList";
 import StandaloneRibbonAdapter from "../ribbon/components/StandaloneRibbonAdapter";
 import FormattingToolbar from "../ribbon/FormattingToolbar";
 import PromotedAttributes from "../PromotedAttributes";
+import FloatingButtons from "../FloatingButtons";
+import { DESKTOP_FLOATING_BUTTONS, MOBILE_FLOATING_BUTTONS } from "../FloatingButtonsDefinitions";
+import utils from "../../services/utils";
 
 export default function PopupEditor() {
     const [ shown, setShown ] = useState(false);
@@ -51,6 +54,7 @@ export default function PopupEditor() {
                 >
                     <PromotedAttributes />
                     <StandaloneRibbonAdapter component={FormattingToolbar} />
+                    <FloatingButtons items={utils.isMobile() ? MOBILE_FLOATING_BUTTONS : DESKTOP_FLOATING_BUTTONS} />
                     <NoteDetail />
                     <NoteList media="screen" displayOnlyCollections />
                 </Modal>