Merge pull request #10682 from overleaf/ds-btn-default-to-secondary-in-editor-part-2

Replacing btn-default with btn-secondary in the editor Part-2

GitOrigin-RevId: 708aa29070bb3049afbc8ee1a282eaa1018594a8

services/web/app/views/project/editor/history/toolbarV2.pug

@@ -123,7 +123,7 @@ script(type="text/ng-template", id="historyV2AddLabelModalTemplate")
 				| #{translate("history_new_label_added_at")} 
 				strong {{ update.meta.end_ts | formatDate:'ddd Do MMM YYYY, h:mm a' }}
 		.modal-footer
-			button.btn.btn-default(
+			button.btn.btn-secondary(
 				type="button"
 				ng-disabled="state.inflight"
 				ng-click="$dismiss()"

services/web/frontend/js/features/dictionary/components/dictionary-modal-content.tsx

@@ -90,7 +90,9 @@ export default function DictionaryModalContent({
       </Modal.Body>
 
       <Modal.Footer>
-        <Button onClick={handleHide}>{t('done')}</Button>
+        <Button bsStyle={null} className="btn-secondary" onClick={handleHide}>
+          {t('done')}
+        </Button>
       </Modal.Footer>
     </>
   )

services/web/frontend/js/features/file-tree/components/file-tree-create/modes/file-tree-upload-doc.js

@@ -248,7 +248,7 @@ function UploadConflicts({ cancel, conflicts, handleOverwrite }) {
           Overwrite
         </Button>
         &nbsp;
-        <Button bsStyle="primary" onClick={cancel}>
+        <Button bsStyle={null} className="btn-secondary" onClick={cancel}>
           Cancel
         </Button>
       </p>

services/web/frontend/js/features/file-tree/components/modals/file-tree-modal-create-folder.js

@@ -81,7 +81,13 @@ function FileTreeModalCreateFolder() {
           </Button>
         ) : (
           <>
-            <Button onClick={handleHide}>{t('cancel')}</Button>
+            <Button
+              bsStyle={null}
+              className="btn-secondary"
+              onClick={handleHide}
+            >
+              {t('cancel')}
+            </Button>
             <Button
               bsStyle="primary"
               onClick={handleCreateFolder}

services/web/frontend/js/features/file-tree/components/modals/file-tree-modal-delete.js

@@ -54,7 +54,13 @@ function FileTreeModalDelete() {
           </Button>
         ) : (
           <>
-            <Button onClick={handleHide}>{t('cancel')}</Button>
+            <Button
+              bsStyle={null}
+              className="btn-secondary"
+              onClick={handleHide}
+            >
+              {t('cancel')}
+            </Button>
             <Button bsStyle="danger" onClick={handleDelete}>
               {t('delete')}
             </Button>

services/web/frontend/js/features/hotkeys-modal/components/hotkeys-modal.js

@@ -197,7 +197,9 @@ export default function HotkeysModal({
       </Modal.Body>
 
       <Modal.Footer>
-        <Button onClick={handleHide}>{t('ok')}</Button>
+        <Button bsStyle={null} className="btn-secondary" onClick={handleHide}>
+          {t('ok')}
+        </Button>
       </Modal.Footer>
     </AccessibleModal>
   )

services/web/frontend/js/features/pdf-preview/components/pdf-log-entry-raw-content.js

@@ -40,8 +40,8 @@ export default function PdfLogEntryRawContent({
         >
           <Button
             bsSize="xs"
-            bsStyle="default"
+            bsStyle={null}
-            className="log-entry-btn-expand-collapse"
+            className="log-entry-btn-expand-collapse btn-secondary"
             onClick={() => setExpanded(value => !value)}
           >
             {expanded ? (

services/web/frontend/js/features/pdf-preview/components/pdf-synctex-controls.js

@@ -27,7 +27,7 @@ function GoToCodeButton({
 }) {
   const { t } = useTranslation()
   const tooltipPlacement = isDetachLayout ? 'bottom' : 'right'
-  const buttonClasses = classNames('synctex-control', {
+  const buttonClasses = classNames('synctex-control', 'btn-secondary', {
     'detach-synctex-control': !!isDetachLayout,
   })
 
@@ -45,7 +45,7 @@ function GoToCodeButton({
       overlayProps={{ placement: tooltipPlacement }}
     >
       <Button
-        bsStyle="default"
+        bsStyle={null}
         bsSize="xs"
         onClick={() => syncToCode(position, 72)}
         disabled={syncToCodeInFlight}
@@ -68,9 +68,14 @@ function GoToPdfButton({
 }) {
   const { t } = useTranslation()
   const tooltipPlacement = isDetachLayout ? 'bottom' : 'right'
-  const buttonClasses = classNames('synctex-control', 'toolbar-btn-secondary', {
+  const buttonClasses = classNames(
-    'detach-synctex-control': !!isDetachLayout,
+    'synctex-control',
-  })
+    'btn-secondary',
+    'toolbar-btn-secondary',
+    {
+      'detach-synctex-control': !!isDetachLayout,
+    }
+  )
 
   let buttonIcon = null
   if (syncToPdfInFlight) {
@@ -86,7 +91,7 @@ function GoToPdfButton({
       overlayProps={{ placement: tooltipPlacement }}
     >
       <Button
-        bsStyle="default"
+        bsStyle={null}
         bsSize="xs"
         onClick={() => syncToPdf(cursorPosition)}
         disabled={syncToPdfInFlight || !cursorPosition || !hasSingleSelectedDoc}

services/web/frontend/js/features/share-project-modal/components/share-project-modal-content.js

@@ -46,7 +46,8 @@ export default function ShareProjectModalContent({
           <Button
             type="button"
             onClick={cancel}
-            bsStyle="default"
+            bsStyle={null}
+            className="btn-secondary"
             disabled={inFlight}
           >
             <Trans i18nKey="close" />

services/web/frontend/js/features/share-project-modal/components/transfer-ownership-modal.js

@@ -61,7 +61,8 @@ export default function TransferOwnershipModal({ member, cancel }) {
         <div className="modal-footer-right">
           <Button
             type="button"
-            bsStyle="default"
+            bsStyle={null}
+            className="btn-secondary"
             onClick={cancel}
             disabled={inflight}
           >

services/web/frontend/js/features/word-count-modal/components/word-count-modal-content.js

@@ -76,7 +76,9 @@ export default function WordCountModalContent({ handleHide }) {
       </Modal.Body>
 
       <Modal.Footer>
-        <Button onClick={handleHide}>{t('done')}</Button>
+        <Button bsStyle={null} className="btn-secondary" onClick={handleHide}>
+          {t('done')}
+        </Button>
       </Modal.Footer>
     </>
   )

services/web/frontend/stylesheets/app/editor/pdf.less

@@ -425,6 +425,8 @@
   padding: 0 0 2px;
   background-color: fade(@btn-default-bg, 80%);
   transition: background 0.15s ease;
+  color: white;
+  border-color: transparent;
 
   &:focus:not(:focus-visible) {
     outline: none;