Merge pull request #18514 from overleaf/dp-pdf-toolbar-hover

Add hover state to pdf toolbar buttons

GitOrigin-RevId: d58ad739e6454b9e0cdbdbb93c55e58785a9d672

services/web/frontend/js/features/pdf-preview/components/pdf-hybrid-download-button.tsx

@@ -34,6 +34,7 @@ function PdfHybridDownloadButton() {
       <Button
         onClick={handleOnClick}
         bsStyle="link"
+        className="pdf-toolbar-btn"
         draggable="false"
         disabled={!pdfDownloadUrl}
         download

services/web/frontend/js/features/pdf-preview/components/pdf-hybrid-logs-button.tsx

@@ -34,7 +34,7 @@ function PdfHybridLogsButton() {
         bsStyle="link"
         disabled={Boolean(error || stoppedOnFirstError)}
         active={showLogs}
-        className="toolbar-item log-btn"
+        className="pdf-toolbar-btn toolbar-item log-btn"
         onClick={handleClick}
         style={{ position: 'relative' }}
         aria-label={showLogs ? t('view_pdf') : t('view_logs')}

services/web/frontend/js/features/pdf-preview/components/pdf-toolbar-button.tsx

@@ -34,7 +34,7 @@ export default function PDFToolbarButton({
         aria-label={label}
         bsSize="large"
         bsStyle={null}
-        className="pdfjs-toolbar-button"
+        className="pdf-toolbar-btn pdfjs-toolbar-button"
         disabled={disabled}
         onClick={onClick}
       >

services/web/frontend/js/features/pdf-preview/components/pdf-viewer-controls-menu-button.tsx

@@ -39,7 +39,7 @@ export default function PdfViewerControlsMenuButton({
         overlayProps={{ placement: 'bottom' }}
       >
         <Button
-          className="pdfjs-toolbar-popover-button"
+          className="pdf-toolbar-btn pdfjs-toolbar-popover-button"
           onClick={togglePopover}
           ref={targetRef}
         >

services/web/frontend/js/features/pdf-preview/components/pdf-zoom-dropdown.tsx

@@ -49,7 +49,7 @@ function PdfZoomDropdown({ setZoom, rawScale }: PdfZoomDropdownProps) {
       pullRight
     >
       <Dropdown.Toggle
-        className="btn pdfjs-zoom-dropdown-button small"
+        className="btn pdf-toolbar-btn pdfjs-zoom-dropdown-button small"
         value={rawScale}
         title={rawScaleToPercentage(rawScale)}
       />