Commit graph

23 commits

Author SHA1 Message Date
Tim Down
0778bab910 Merge pull request #27254 from overleaf/td-project-dashboard-cookie-banner
Implement React cookie banner on project dashboard

GitOrigin-RevId: 95d2778d7ce7cb3054a06b06486b815a3453a623
2025-07-22 08:06:05 +00:00
Andrew Rumble
1b03bb6e5d Fix prettier
GitOrigin-RevId: a3bdc1bc6a8bfa05ed9f8d7bfcd91cbd4cd48375
2025-07-09 08:05:43 +00:00
Tim Down
2d1fb9c1a5 Merge pull request #22639 from overleaf/td-ds-nav-tag-men-toggle-bg
Preserve background on expanded tag menu toggle button in DS nav project dashboard

GitOrigin-RevId: cc5f6092236150e123202af17e1c2eaecca29654
2025-03-05 09:05:06 +00:00
Alf Eaton
e8a6cb340e Remove link from DS in side nav (#23759)
GitOrigin-RevId: 0724fecd45ce3686be25d394aaea9c2c2b97f669
2025-02-24 09:05:18 +00:00
Antoine Clausse
f9cc0c3bf4 [web] Scope ds-nav split test to project list (#22689)
* Add `dsNavStyle` prop, so `sidebar-navigation-ui-update` doesn't change all pages

* Use `useIsDsNav` instead of `useSplitTestContext`

* Create a `useDsNavStyle` hook

* Use `useDsNavStyle`

* Add comment on `useIsDsNav` and `NavStyleContext`

* Revert "Hide nav dropdown chevron icon in welcome page"

This reverts commit 78b5ba85

* Move `DsNavStyleProvider` usage to project-list-ds-nav.tsx

* Fix typo

* Simplify `useDsNavStyle` conditions

GitOrigin-RevId: df3fe66d772919c40df69d357bee6949ab413928
2025-01-17 09:05:41 +00:00
Lucie Germain
ee4c8b5fe2 Merge pull request #22630 from overleaf/td-ds-nav-system-messages
Add system messages to DS nav version of project dashboard

GitOrigin-RevId: 85830d58242300a40148190f8a18204666a3065c
2024-12-20 09:05:25 +00:00
Tim Down
859527b890 Merge pull request #22599 from overleaf/td-ds-nav-chevron
Hide nav dropdown chevron icon in welcome page

GitOrigin-RevId: df631c2ea13da79be8496b8cfa425e9340894af3
2024-12-19 09:05:05 +00:00
Antoine Clausse
bce3d4df78 Update SurveyNotification style for DS Nav (#22585)
* Hide the "DS nav" survey for users on the default variant

* Create and use `SurveyWidgetDsNav`

* Add link to SurveyWidgetDsNav button

* Revert SurveyNotification changes in the DS Nav mobile view

* Hide DS nav survey via JS rather than CSS

* Remove survey card in DS nav project dashboard mobile view in the short term

* Change sr-only to visually-hidden

* Fix typo

---------

Co-authored-by: Tim Down <158919+timdown@users.noreply.github.com>
GitOrigin-RevId: 6ff91637bcc8ad29c383627c7218f644a7b19d75
2024-12-19 09:04:47 +00:00
Antoine Clausse
fce3adc810 [web] Update Navbar icons (Carets and Close) (#22570)
* Use Phosphor icon for navigation close

* Add carets from Phosphor

* Remove CaretUp when expanded (not in design)

* Revert "Remove CaretUp when expanded (not in design)"

This reverts commit 242f295ea18a73aae0e2cf5d2cf0dc1e610dbef9.

* Fixup: Hide the default caret in the desktop view too

* Fixup format after merge

GitOrigin-RevId: 6781028dd50922a017ef2b76fe91c4ff611dd77c
2024-12-18 09:06:34 +00:00
Antoine Clausse
0193d00735 [web] Make the new project dropdown menu scrollable (#22559)
* Make the new project dropdown menu scrollable

* Use CSS variables

GitOrigin-RevId: 9a918f2349cfc74038bde36e48b1060a4de09822
2024-12-18 09:06:30 +00:00
Antoine Clausse
14ba6013ac Replace tags-list dropdown icon to Phosphor ThreeDotsVertical (#22562)
GitOrigin-RevId: 50c70aca162e787eb6ab051ac56c6b226a6c6aa6
2024-12-18 09:06:26 +00:00
Antoine Clausse
19e962876d [web] Replace "scroll-shadow" by "scroll-borders" in the sidebar (#22563)
* Replace "scroll-shadow" by "scroll-borders" in the sidebar

* Set invisible borders to prevent "jumps"

GitOrigin-RevId: b73ec532f28627d1c55dd64cbfabec8a2efb08b2
2024-12-18 09:06:22 +00:00
Antoine Clausse
df727d64c3 Merge pull request #22548 from overleaf/ac-ds-phosphor-icons-and-splittests-bugfix
[web] Reapply  Use icons from @phosphor-icons/react for the project-list (DS nav)

GitOrigin-RevId: b87767b7c875ff4c081590e7bc0111892c0a1435
2024-12-17 09:05:32 +00:00
Antoine Clausse
0c40841d9f Merge pull request #22547 from overleaf/revert-22517-ac-ds-nav-phosphor-icons
Revert "[web] Use icons from `@phosphor-icons/react` for the project-list (DS-Nav)"

GitOrigin-RevId: 350f5d69a8f575d8ee4e3bd6af46e4e5f7137c7d
2024-12-17 09:05:19 +00:00
Antoine Clausse
bb8bdd04af [web] Use icons from @phosphor-icons/react for the project-list (DS-Nav) (#22517)
* Use icons from `@phosphor-icons/react`

https://phosphoricons.com/

* Add the phosphor Plus icon to the tag list

* Add SignOut icon

* Use Phosphor icon for tags

* Fix icon color when active

* Add offset to dropdown menus so they're positioned like in Figma

---------

Co-authored-by: Tim Down <158919+timdown@users.noreply.github.com>
GitOrigin-RevId: 039e98063d775d0348d227202d5ecd6a0bfb7b65
2024-12-17 09:04:57 +00:00
Antoine Clausse
555af767bd Add hover bg on navbar items (#22525)
GitOrigin-RevId: e220da99962abcaaac568f501875970747cd3d4b
2024-12-16 09:05:42 +00:00
Antoine Clausse
90b16e4c8e [web] DS-Nav footer tweaks (#22482)
* Footer tweaks (add border, main-content 100vh)

* Update color to be the same as the sidebar `<hr>`

* Move the border to the larger div so it also separates with the navbar

* Update border color to be the same as the background

* Fixup lint

* Fixup main content padding on mobile view

See https://github.com/overleaf/internal/pull/22186#discussion_r1876087478

* Change the border color to neutral-20

* Use `--border-divider` which is the same color as --neutral-20 (`#e7e9ee`)

* Replace `@media (width >= 768px)` by `@include media-breakpoint-up(md)`

* Replace `min-height: 100dvh` by `min-height: 100%`

GitOrigin-RevId: 426869e9b96a1ee8245c487bb80ff01856521a34
2024-12-16 09:05:14 +00:00
Antoine Clausse
f2d6c73f75 [web] Update project-list Navbar for mobile (#22478)
* Control if nav items are shown with CSS instead of JS

* Fix navbar style for mobile view

* Update navbar toggle icon to close

* Hide "Projects" nav item from the navbar

* Add separator above the Help menuitem in the mobile navbar

* Adjust sidebar padding: 24px from the logo

GitOrigin-RevId: ba587645f56febc0da798269bd6aa8c2e1639c27
2024-12-16 09:05:02 +00:00
Antoine Clausse
e5c97f1963 [web] Add box shadows to scrollable part of sidebar (#22400)
* Add box shadows to scrollable part of sidebar

* Fix lint

* Fix `isAtBottom` boolean on Firefox

* Throttle the `scroll` event

* Remove wrong and unnecessary comment

GitOrigin-RevId: 7bcbb7fc860ab32f44203b3ae9ff37a3fed069a8
2024-12-16 09:04:49 +00:00
Antoine Clausse
b165e71ba9 [web] Update footer responsiveness with container queries (#22346)
* Remove padding around the footer

* Use CSS container queries instead of media queries on the full window

Container queries are supported by 92.76%	of web users, which can be an issue.
https://caniuse.com/css-container-queries

Though we do use them in other places

* Use `@supports` to check if `@container` can be used and use mixins

* Add the max sidebar width the fallback media query

* Update the footer responsiveness so we don't affect the default variant

GitOrigin-RevId: bed3e4244f1a97fd84740dcf87fb27c760be91ad
2024-12-12 09:06:09 +00:00
Antoine Clausse
62cfb68c1b [web] Add icon menus in the Sidebar (#22318)
* Add sidebar icons and menus (Help, Account)

* Place the account dropdown menu above the tooltip

* Hide tooltip when dropdown menu is shown

* Fixup tooltip position

* Add Digital Science link

* Add aria-labels on the dropdown toggles

* Update sidebar items spacings

- Add space between notification and DS icons
- Balance margin/padding in the scrollable part

* Revert changing the side of .dev-tool-bar-open-button

* Remove `!important` in link color

* Add Help tooltip

* Revert dropdown-menu z-index change

* Move `AccountMenuItems` to its own file

* Revert "Remove `!important` in link color"

This reverts commit b2de83f815d05cd1e224604d4ca355986ba76b99.

GitOrigin-RevId: 286266ea5348384f2592f748d3ae32c452558988
2024-12-12 09:06:05 +00:00
Antoine Clausse
27792199f6 [web] Update project list page main content to DS-nav-bar design (#22307)
* Move some SCSS to project-list-default.scss

* Update project-list-ds-nav.tsx to match design and simplify the SCSS

* Fix survey-notification style: light on the sidebar, dark on the main content

* Replace `withHr` by `useSplitTestContext` hook

* Override the `navbar-btn-padding-h` override.

* Fixup main content padding

Co-authored-by: Tim Down <tim.down@overleaf.com>

* Add padding-top to the logo

* Fixup merges

Add changes from https://github.com/overleaf/internal/pull/22272

---------

Co-authored-by: Tim Down <tim.down@overleaf.com>
GitOrigin-RevId: 8dbc449afbf70388bcf3185413b35234acaad349
2024-12-12 09:05:23 +00:00
Antoine Clausse
629579b840 [web] Update project list page layout and sidebar to new design (#22186)
* PoC DS nav project page shell

* Rename files: use `ds-nav` as a suffix

(really just moving code without changes)

* Update NavBar to the new design

* Small updates to project-list-ds-nav.tsx so it gets its basic shape

* Nest `.survey-notification` and `.project-list-sidebar-survey-wrapper` in the default classes to avoid interferences

* Create `SidebarDsNav`

* Add props to sidebar components so they work in both versions

* Update the SCSS code for the sidebar redesign

* Update subheader to "Organize Tags"

* Mute add affiliation font

* Remove `<aside className="project-list-sidebar-react">` and add sidebar max/min widths

* Fixup buttons padding

* Fix tests: add SplitTestProvider

* Fixup sidebar scroll div: add `flex: 1 1 auto`

* Make "Uncategorized" italic

* Update logo to SVG

* Optimize the svg
https://jakearchibald.github.io/svgomg/
9.12k → 4.92k 53.91%

---------

Co-authored-by: Tim Down <158919+timdown@users.noreply.github.com>
GitOrigin-RevId: 3d08b4b80291d9465fae87ffdf0c6a9f6deda554
2024-12-12 09:05:18 +00:00