* [web] Initialize BS5 in subscription page
* [web] Update subscription-dashboard.tsx for BS5
* [web] Update row-link.tsx for BS5
* [web] Update modals
* [web] Add `btn` to `btn-inline-link` classes
* [web] Update circle change-to-group circle price element
* [web] Replace `list-item-with-margin-bottom` with `mb-3`
* [web] Update form elements to BS5
* [web] Use `useContactUsModal`
* [web] Adjust tables margin/padding, and more
* [web] Update change-to-group-modal.tsx
* [web] Add gap to subscription buttons
* [web] Remove subscription page colspan for md and above
* [web] Use Notification component
* [web] Update "leave group" buttons
* [web] Fix tests: add `ol-user` meta tag
* [web] Nest .hover-highlight in #subscription-dashboard-root
* [web] Update to OLRow/OLCol
* [web] Update to OLButtons
* [web] Update to OLFormGroup
* [web] Naming: use BSversion prefix
* [web] Set CancelSubscriptionButton as ghost directly in component
* [web] Set "Plan" font size
* [web] Simplify cancel-subscription buttons
* [web] Remove `--neutral-10` ModalFooter background
* [web] Simplify circle styles
* [web] Center discount badge
* [web] Update fieldset label
* [web] Add `<ul>` around RowLink
* [web] Define SCSS for row-link component
* [web] Remove some use of utility classes
* [web] Revert and update `fieldset` changes (fixes tests)
* [web] Fixup some more OLButtons
* [web] Fixup use of OLRow/OLCol
* [web] Reduce spacing below "legend-as-label"
* [web] Use h5 instead of small in OLModalTitle
* [web] Revert OLCol removal on lg screens
I had removed them by mistake because I wasn't using the proper breakpoints
* [web] Add backdrop to nested modal ContactUsModal
* [web] Don't prefill project URL in ContactUsModal
* [web] Fix lint
* [web] Share `className` prop in BS5 and BS3 modals
* [web] Set sub-title font sans serif (BS3)
* [web] Update remaining Alerts to OLNotification
GitOrigin-RevId: 7fd975ae3e992cebfaf71d4e182f8e13ec886d09
* [web] Wiring work for `/subscription/invites/:token` BS5 migration
* [web] Add SCSS for .enrollment-invite
* [web] Update invite_logged_out PUG file for BS5
* [web] Update `GroupInviteViews` (and children) to BS5
* [web] Update `InviteManaged` to BS5
* [web] Update Logout button
* [web] Update subtitles
This removes the `text-overflow:ellipsis`. I think it's better without it, because it can be an accessibility issue.
* [web] Add margin on inner-card
* [web] Style action buttons in InviteManaged
* [web] Add missing container around Row
This was causing the row to overflow the body.
Increased the col width to compensate.
* [web] Fixup lint
* [web] Fix `ManagedUserCannotJoin` title in BS3 (!)
I checked all the other `OLNotification`: we don't use `title` anywhere else
* [web] Put title in OLNotification content
See https://github.com/overleaf/internal/pull/20640#discussion_r1777551257
* [web] Use translations for "aria-label="Email address""
* [web] Handle OLButton `isLoading` in `bs3Props`
* [web] Remove duplicated `btn` class
* [web] Add margin-bottom to InviteManaged title and fix logout button CSS in BS3
* [web] Adjust col class in Pug file for BS3 and BS5
* [web] Revert migration to OLNotification
Revert back to `@/shared/components/notification`
* [web] Add note to remove .team-invite-name after BS5 migration
* [web] Set `btn-link-logout` in BS3 only
* [web] Update OLButton so other classNames automatically get passed to the BS3 implementation
* [web] Revert OLButton changes for BS3 classnames
Co-authored-by: Rebeka <rebeka.dekany@overleaf.com>
* [web] Update services/web/modules/group-settings/frontend/js/components/invite-managed.tsx
Co-authored-by: ilkin-overleaf <100852799+ilkin-overleaf@users.noreply.github.com>
* [web] Use OLFormGroup `controlId`
---------
Co-authored-by: Rebeka <rebeka.dekany@overleaf.com>
Co-authored-by: ilkin-overleaf <100852799+ilkin-overleaf@users.noreply.github.com>
GitOrigin-RevId: 64b3f79c83002a9c9585bfb8e344e80b2e8eac5c
* adding styling for form label under bs5 styling
* moving label color to website-redesign
* adding spacing-02
* fixing a linting error
* adding label styling within website-redesign
GitOrigin-RevId: bc99c13e5d60dc68c3557db752292faf5eb5a34e
* welcome page adjusted columns in BS5
* [web] Fix card color
* [web] Fixup card width in BS3
* [web] Fix lint
* [web] Fix cards text color in BS3
* [web] Fix cards positioning in BS3
* [web] Prevent cards from becoming too large on big screens
---------
Co-authored-by: Ilkin Ismailov <ilkin.ismailov@overleaf.com>
GitOrigin-RevId: 9b91c073a62dae7cad4402908a34f9880ecdb0ac
[web] CMS BS5 - Fix mobile top padding when columns reversed, apply `max-width` to rows as cards
GitOrigin-RevId: 0c8745c171dc8e24389b2e54e4d6fd605c30e145
* copying blog-posts.less into blog-posts.scss, will not compile yet
* making variable changes in the file
* adding card-body under blog-post
* adding spacing-09 to the list
* format:fix
* rendering bs5 for blog/blog_post
* adding card-body for blog post page card
* fixing some linting errors
* adding neutral-40 as a replacement of ol-blue-gray-2
* selecting the closest spacing
* removing margin
GitOrigin-RevId: e0cad15cec2adccb41d773e38feb99d9fd9f5e07
* migrating premium badge to BS5 and changing the unit test
* fixing unit test
* using badge badge-prepend classes for the premium badge
* fixing unit test
* adding font-weight variable
* removing unused CSS
* adding aria-hidden
GitOrigin-RevId: a1ab2eeedd95ee500c21607abd09a0a8a07289f0
* adding classes according to bootstrap 5 tabs
* adding JS for tabs handeling in BS5
* adding styling for tabs to match the redesign styling
* making sure tabs are being highlighted when active
* adding a scroll-margin-top to have some extra space
* removing extra import, it is not needed here because we already import it in bootstrap-x.js files
* using the media-breakpoint-down for a media query styling
* introducing .nav-tabs-container to make the tab triggers horizontally scrollable
* creating a mixin box-shadow-button-input under scss for bootstrap-5
* moving border-width-base to tabs.scss
* aligning tabs to the left under screen size of 768px
* removing focus-style mixin from scss files becuase it was a duplicate
GitOrigin-RevId: 45780c62681fc9b61961f5436d2d55de66a976b6
* Implement floating Add comment button
* Fix comment typo
* Remove unused imports
* Make tooltip always appear above cursor
Co-authored-by: Domagoj Kriskovic <dom.kriskovic@overleaf.com>
* Refactor how new comment form is positioned
* Add missing file
* Create new map when rendering positions
* Use codemirror state to manage ranges and allow for mutliple in-progress comments
* Memoise sorting
* Create new ranges map each time it is changed
* Add back mutation observer
* Only allow single tooltip
* Fix typo
* Convert state field to store a single tooltip
* Make add comment tooltip content a react component
* Refactor to remove usages of !important
* Use RangeSet to keep track of new comment ranges
* Fix logic broken in rebase
* Map ranges through document changes
* Add decorations for in-progress comments
* Use set-review-panel-open rather than an editor event to open review panel
* Implement new designs for add comment form
* Add padding to textarea
* Fix bug where comment was being submitted for incorrect range
* Add missing key to ReviewPanelAddComment
* Store new comment ranges as a DecorationSet
* Small refactor to how ReviewPanelAddCommens are rendered
* Make op prop to ReviewPanelEntry required
* Add handling for disabling of add comemnt form buttons
* Move viewer check inside AddCommentTooltip
* Ensure that add comment button doesn't reshow when collaborators edit the document
* Remove unneeded op check in ReviewPanelEntry
* Update services/web/frontend/js/features/review-panel-new/components/review-panel-add-comment.tsx
Co-authored-by: Domagoj Kriskovic <dom.kriskovic@overleaf.com>
---------
Co-authored-by: Domagoj Kriskovic <dom.kriskovic@overleaf.com>
GitOrigin-RevId: 3110845f6a557310f3bf72014689e2f2ab53e966
* adding the li within ul to fix the accessibility issue from axe dev tools
* adding aria-label on the button
* adding a translation
GitOrigin-RevId: de46c7f1a71d7921b7ab88299441c50ef666cae2
* making the university info section in students tab to follow the new design.
* adding the left alignment of the button
* adding light keyword for the classes that are being used in the light design version for this university info card
* removing text-capitalize class
* deleting the comment
GitOrigin-RevId: 641613cf6ab73edef57b917b58ebf10b698572d3
[web] Change "Collaborator" text to "Standard" in individual tab plans (plans page and interstitial page new design)
GitOrigin-RevId: 064bb59b3fb84f1fb413035acc40e7f6b368b1f8
* add hasBeenDowngraded prop for EditMember
* reduce padding on share modal collab row, add prompt to hasBeenDowngraded Select
* share modal select styling tweaks to allow for inline warning icon
* always show editor limit subtitle when in downgraded state
* add AccessLevelsChanged warning, tweak owner row styling
* conditionally set hasBeenDowngraded prop. make invited member row styling more consistent between warning/enforcement
* add an info state for access level changed notification
* add notification for lost edit access on collaborator share modal, TSify SendInvitesNotice
* fix member privilege alignment in collaborator share modal
* show blue upgrade CTA when some pending editors have been resolved
* automatically show share modal to owners when has pending editors or is over collab limit
* only show lost edit access warning in read-only share modal to pending editors
---------
Co-authored-by: Thomas <thomas-@users.noreply.github.com>
GitOrigin-RevId: e3b88052a48b8f598299ffc55b7c24cb793da151
* adding geo banners on interstitial page
* adding a new class .interstitial-new-design-content-spacing to match the spacing of 13
GitOrigin-RevId: 0b72f321356a899f02efcf4bd2719d7762e7b524
* tearing down the test for registration page
* deleting files that were used in delete register.pug file
* removing usage of websiteRedesignAssignmentVariant from remaining files
* deleting files for login page except ligh version
* removing the usage of websiteRedesignAssignmentVariant in remaining files
* moving light design to views folder because app was breaking, also renaming the file to login.pug and moving the two related files to views folder
* running make cleanup_unused_locales
* updating the acceptance test to reflect the change
* tested the deleted register files and rmeoved the classes that were only being used in the deleted register files
* adding delete comments on classes for these files _registration_user_password _registration_sso
* combining the two .login-register-form-focus into one within website-redesign
* fixing the positioning of the validation message
* moving register files out of website-redesign
* adding back AnalyticsManager for view events
GitOrigin-RevId: 028bd65824c4d09cc6ad9950159a404af55ff97e
* Remove extra padding for off-screen review panel entries
* use document.activeElement
* cleanup editor padding cases
* using isSelectionWithinOp
* fix formatting
* focusHandler function
* 1px border for focused entry
* use constants
* using isFirstEntry
GitOrigin-RevId: 4509f803b6cb907b40f1745a6fc7f3b1edfe145c
This is removed because monthly-annual-switch is already hidden on all screen size for group tab.
(in the current plans page, monthly-annual-switch will be disabled on desktop and will be hidden on mobile)
GitOrigin-RevId: bdb682b97844b6e3fb50be3c65eb6bd945d73648
[web] Set new container width (1280px) and new main grid horizontal padding (16px) for all plans page redesign pages
GitOrigin-RevId: d266a8318dd4c2c90d9051bb58cca459799fca44
* simplifying the logic of button rendering that matches the desktop version
* removing the plans_page_new_btn_buy_now_free mixin and adding the class .plans-cta-buttons-gap
* adding .plans-cta-buttons-gap to the desktop version
* changing table-header to mobile-card while calling the function
* adding styling into .plans-new-table-cta and removing plans-cta-buttons-gap usage from desktop version
* moving .plans-cta-buttons-gap into .plans-card-cta-container-monthly-annual
* renaming the gap class to .plans-card-cta-buttons-container and using nth-child approach
* using the nth-child approach in .plans-new-table-cta
GitOrigin-RevId: 692814af8d8cf4dda0ea53dea9a3fe4adcf1dcd3
* Tidy up review panel components
* Add ReviewPanel providers
* [web] new design for review panel track change (#19544)
* [web] new design for review panel track change
* fixed mini view
* mini icon style change
* fix icon size
* format date
* useRangesUserContext hook
* remove useRangesUserContext hook
* using full class names
* fix action icons hover
* change wording for tooltips
* added ReviewPanelChangeUser component
* Update header in new review panel
* Extract ReviewPanelTrackChangesMenuButton as a separate component
* Remove wrapper div
* Replace h2 with div for review panel label
* Rename ReviewPanelTools to ReviewPanelHeader
* Rename trackChangesExpanded -> trackChangesMenuExpanded
* Dont break memoisation of ReviewPanelTrackChangesMenuButton
* Fix the width of the track changes arrow icon
* Update how prop types are declared
* Remove new empty state from old review panel
* Add empty state to new review panel
* Add project members and owner to ChangesUsers context (#19624)
---------
Co-authored-by: Alf Eaton <alf.eaton@overleaf.com>
* Redesign comment entry in review panel (#19678)
* Redesign comment entry in review panel
* ReviewPanelCommentOptions component
* remove unused prop
* Tidying
* Add conditional import
* Optional changeManager
* Add more split test compatibility
* More split test compatibility
* Fixes
* Improve overview scrolling
* Fix overview scrolling
* Fix & simplify track changes toggle
* Fix overview scrolling
* Fix current file container
* ExpandableContent component for messages in review panel (#19738)
* ExpandableContent component for messages in review panel
* remove isExpanded dependancy
* Delete comment option for new review panel (#19772)
* Delete comment option for new review panel
* dont show thread warning if there are no replies
* fix hasReplies issue
* Implement initial collapsing overview files
* Fix positioning of overview panel
* Small styling changes
* Add count of unresolved comments and tracked chanegs
* More style adjustments
* Move review-panel-overview styles into css file
* Remove unused var
---------
Co-authored-by: Domagoj Kriskovic <dom.kriskovic@overleaf.com>
Co-authored-by: David Powell <david.powell@overleaf.com>
Co-authored-by: David <33458145+davidmcpowell@users.noreply.github.com>
GitOrigin-RevId: e67463443d541f88445a86eed5e2b6ec6040f9c7
[web] Create group member picker footer with a link that opens contact sales modal on new plans page
GitOrigin-RevId: 1dc1dce726cc0222bbbef911a016f1eb6a881aeb
* adding group_member_picker mixin on mobile screen
* renaming screenSize to device
* adding a Separator before device name
* removing period argument passing from plans-cat mixin
* creating a z-index z-index-group-member-picker-list to avoid the overlap of the dropdown menu on the list above it
GitOrigin-RevId: 538f08064f72cbc85343ee3b44645231b894b9d4
* open visual code if user havent used latex before
* test tooltip on code editor switch
* firstTimeLoadedEditor
* track editor.codeEditorOpened value
* lastEditorLoadedDate
* odc data loaded from mongo
* fix a typo
* use tutorial to check if it was dissmised
* use getInactiveTutorials fn
* fix test
* check if code editor was opened
* added translations
* pass classname to tooltip
* use signUpDate instead of lastEditorLoadedDate
* refactor visual fallback value
* use tutorial completed data only for tooltip
* set lastUsedMode in odc form
* safer usedLatex check
* getOnboardingDataValue helper function
* move tooltip to a separate component
* move classname to tooltipProps
* usedLatex in meta tag
* codeEdtiorOpened fallback value
* fix release date year
* fix 24 hours criteria for showing the tooltip
* fix tests
* hide tooltip when code editor is opened
* remove setting lastUsedMode in ODC form
* remove empty comment
* change date for checking signUpDate
* fix linting error
GitOrigin-RevId: 0a57ba3f4717492d4546633571117f667d3a05f8
[web][website-redesign] Reverse the position for button pair inside of `.responsive-button-container` element
GitOrigin-RevId: 72e229b37adb390c904abbabaec04e9ee964aba4
* adding features table header
* adding the table body mixin
* adding margin bottom
* adding alternative colors to rows
* adding section heading in the table
* adding spacing in the rows by adding an extra div
* adding correct styling to section heading
* removing extra styling
* renaming class
* adding an extra row for row heading because it was interferring with the natural flow of row and cells when added to the same row as other cells
* adding code into mixins
* renaming the mixin
* fixing the margin bottom of table header
* adding 4n factor alternative styling for rows
* removing unused width
* Implement alternate color for all tbody on the mobile feature table
* adding padding top to plans-features-table-row-section-heading-content-mobile to match the figma design
* adding a translation and a comment
* renaming a few classnames and removing some comments
* removing extra comments
* replacing hex code with variable
* cleaning some CSS
* using a shade of neutral variables
* replacing colors with variables in less file
* adding font size for plans-features-table-header-item-price-mobile
* adding class .icon-md
* removing TODO comment
* adding css var on remaining variables
---------
Co-authored-by: M Fahru <m.fahru@overleaf.com>
GitOrigin-RevId: 89cf0fa35722b887c9d787a9a3442fbe758caafb
* Add helpers for checking and removing user readwrite token membership
* Add sharing-updates page and handlers
* Redirect read write token members to sharing-updates on project load
GitOrigin-RevId: d552a2cd74a9843c6103923b03f137131a48877a