From 90e5193a97e7cedd2e5ba513446eb65c806b49fe Mon Sep 17 00:00:00 2001
From: Elian Doran <contact@eliandoran.me>
Date: Thu, 16 Oct 2025 08:54:09 +0300
Subject: [PATCH] fix(collection/presentation): use floating bar styling for
 floating buttons

---
 .../collections/presentation/index.tsx        | 54 ++++++++++---------
 1 file changed, 30 insertions(+), 24 deletions(-)

diff --git a/apps/client/src/widgets/collections/presentation/index.tsx b/apps/client/src/widgets/collections/presentation/index.tsx
index 3cf3a7b8b..656940c68 100644
--- a/apps/client/src/widgets/collections/presentation/index.tsx
+++ b/apps/client/src/widgets/collections/presentation/index.tsx
@@ -68,33 +68,39 @@ function ButtonOverlay({ containerRef, api }: { containerRef: RefObject<HTMLDivE
 
     return (
         <div className="presentation-button-bar">
-            <ActionButton
-                icon="bx bx-edit"
-                text={t("presentation_view.edit-slide")}
-                onClick={e => {
-                    const currentSlide = api?.getCurrentSlide();
-                    const noteId = getNoteIdFromSlide(currentSlide);
+            <div className="floating-buttons-children">
+                <ActionButton
+                    className="floating-button"
+                    icon="bx bx-edit"
+                    text={t("presentation_view.edit-slide")}
+                    noIconActionClass
+                    onClick={e => {
+                        const currentSlide = api?.getCurrentSlide();
+                        const noteId = getNoteIdFromSlide(currentSlide);
 
-                    if (noteId) {
-                        openInCurrentNoteContext(e, noteId);
-                    }
-                }}
-            />
+                        if (noteId) {
+                            openInCurrentNoteContext(e, noteId);
+                        }
+                    }}
+                />
 
-            <ActionButton
-                icon="bx bx-grid-horizontal"
-                text={t("presentation_view.slide-overview")}
-                active={isOverviewActive}
-                onClick={() => {
-                    api?.toggleOverview();
-                }}
-            />
+                <ActionButton
+                    className="floating-button"
+                    icon="bx bx-grid-horizontal"
+                    text={t("presentation_view.slide-overview")}
+                    active={isOverviewActive}
+                    noIconActionClass
+                    onClick={() => api?.toggleOverview()}
+                />
 
-            <ActionButton
-                icon="bx bx-fullscreen"
-                text={t("presentation_view.start-presentation")}
-                onClick={() => containerRef.current?.requestFullscreen()}
-            />
+                <ActionButton
+                    className="floating-button"
+                    icon="bx bx-fullscreen"
+                    text={t("presentation_view.start-presentation")}
+                    noIconActionClass
+                    onClick={() => containerRef.current?.requestFullscreen()}
+                />
+            </div>
         </div>
     )
 }