Commit graph

121 commits

Author SHA1 Message Date
M Fahru
86215df923 Merge pull request #20944 from overleaf/jel-blog-spacing
[web] Update blog vertical spacings to match Figma

GitOrigin-RevId: ef3ad8ba3228134343fcf58ae0ce1b91d6d94860
2024-10-14 11:09:17 +00:00
Antoine Clausse
d6de6da781 [web] Migrate the file view to Bootstrap 5 (#20765)
* [web] Remove unnecessary divs around `fileInfo`

* [web] Add file-view SCSS style

* [web] Simplify `TPRFileViewInfo`

* [web] Add div for action buttons

* [web] Misc. simplifications

* [web] Add Overleaf logo in bg when selecting multiple files

* [web] Add message when multiple files are selected

* [web] Add .full-size class

* [web] Import styles from LESS file

* [web] Update icons, use MaterialIcon

* [web] Use OLButton

* [web] Add missing space between icons and text

* [web] Adjust margins

* [web] Fix alert button

* [web] Update Alerts

* [web] Update `FileViewLoadingIndicator`

* [web] Fix test "shows a loading indicator..."

This was failing because `LoadingSpinner` is shown after a setTimeout.
Maybe we can skip this setTimeout when delay==0 ?

* [web] Remove Row/Col around error notifications

* [web] Replace `!!` by `Boolean`

Co-authored-by: ilkin-overleaf <100852799+ilkin-overleaf@users.noreply.github.com>

* [web] Use `alert` class in BS3 only

Co-authored-by: Ilkin Ismailov <ilkin.ismailov@overleaf.com>

* [web] Update "Go to settings" to OLButton

Co-authored-by: Ilkin Ismailov <ilkin.ismailov@overleaf.com>

* [web] Use `BootstrapVersionSwitcher` instead of `isBootstrap5`

Co-authored-by: Ilkin Ismailov <ilkin.ismailov@overleaf.com>

* [web] Align Alert content to the left in BS5

* [web] Remove `leadingIcon` on Refresh buttons

* [web] Make the download link be an OLButton

* [web] Set `tpr-refresh-error` in BS3 only

Co-authored-by: Rebeka Dekany <50901361+rebekadekany@users.noreply.github.com>

* [web] Use `var(--white);` instead of `white`

Co-authored-by: Rebeka <rebeka.dekany@overleaf.com>

* [web] Update OLButton size (small -> sm)

---------

Co-authored-by: ilkin-overleaf <100852799+ilkin-overleaf@users.noreply.github.com>
Co-authored-by: Ilkin Ismailov <ilkin.ismailov@overleaf.com>
Co-authored-by: Rebeka Dekany <50901361+rebekadekany@users.noreply.github.com>
Co-authored-by: Rebeka <rebeka.dekany@overleaf.com>
GitOrigin-RevId: 04f369c0f1a53d47619a1570648ee58de5050751
2024-10-14 11:07:55 +00:00
Antoine Clausse
2e080a3a34 [web] Migrate IDE page loading screen to BS5 (#20896)
* [web] Add `.loading-screen` style

* [web] Add `.loading-screen-error` style

* [web] Nest styles in `.loading-screen`

* [web] Simplify code, make a more valuable Storybook

* [web] Add a reusable bootstrap-switcher argument to loading.stories.tsx

* [web] Make `isBootstrap5()` work in storybook

* [web] Revert unrelated changes around `ConnectionError` type

* [web] Remove comment about unhandled error codes

https://github.com/overleaf/internal/pull/20896/files#r1790572314

* [web] Don't repeat the `errorCode` prop type

* [web] Remove unused CSS and magic padding

* [web] Fixup SCSS division

* [storybook] Revert Storybook changes (moved to another branch)

* [web] Fixup SCSS division again (lint)

* [web] Render with `Boolean(errorCode) && ...` instead of `errorCode && ...`

* [web] Remove importants; use spacing var

Addresses Tim's comments

GitOrigin-RevId: e8b5623f4bb9aa72a255851f46b45b652a0dbb16
2024-10-14 11:07:50 +00:00
ilkin-overleaf
4f838ccacf Merge pull request #20824 from overleaf/ii-bs5-share-modal
[web] BS5 share modal

GitOrigin-RevId: 40a33e06eab720b568d31aefa021682535b6934e
2024-10-14 11:07:31 +00:00
ilkin-overleaf
6c7ee8f778 Merge pull request #20715 from overleaf/ii-bs5-chat-pane
[web] BS5 chat pane

GitOrigin-RevId: 8587aca1372b4d2087863d492e702f04a31c23e2
2024-10-14 11:07:26 +00:00
ilkin-overleaf
92eade7502 Merge pull request #20708 from overleaf/ii-bs5-pdf-toolbar
[web] BS5 pdf toolbar

GitOrigin-RevId: a04091c9e936e52f47c3977b3149ffe613d43bb9
2024-10-14 11:06:17 +00:00
M Fahru
209a3670ce Merge pull request #20827 from overleaf/mf-bs5-previous-page-link-hover
[web] Add hover effect to `.previous-page-link` class

GitOrigin-RevId: ccba4cb22274695a2a3b63abcf86d7bc0c6dec61
2024-10-14 11:04:18 +00:00
M Fahru
2a99415c69 Merge pull request #20829 from overleaf/mf-blog-list-title-link-size
[web] Reduce blog title link size on bootstrap 5 blog list page

GitOrigin-RevId: cd22fef67488c5b8d291c358e812e0d94cb303ef
2024-10-14 11:04:13 +00:00
M Fahru
5d2eac5694 Merge pull request #20851 from overleaf/mf-bs5-pagination
[web] Bootstrap 5 pagination

GitOrigin-RevId: b3709a3f016423e7df12d6dfdf2cb4e47efbffe2
2024-10-14 11:04:09 +00:00
Davinder Singh
f2c167a026 CMS BS5 migration - Adding the left spacing to the labels next to checkbox (#20780)
* adding left-margin for the checkbox-label

* moving the styling to appropriate file and making it more generic

GitOrigin-RevId: 66484344891c77f6d31147ef7d0e0d55987a8445
2024-10-14 11:03:50 +00:00
Davinder Singh
d61997373f BS5 Migrations CMS - Adding the pattern card at the end of the blog page (#20739)
* adding existing pattern card content and styling with commented code to avoid breaking the compiler

* removing extra styling that is not needed

* using variables

* removing event segmentation and adding URLs

* adding a translation for tthe ext

* adding a translation for explore_all_plans

* adding translation sign_up_for_free

* adding the card on blog post page

* adding card-body to match BS5 and removing extra padding from .cta-card

* adding p and removing margin from .font-size-display-xs

* removing cta-card-text class

* removing margin-top from responsive-button-container and adding the usage of .p-no-text-nodes with p

* removing gap and margin responsive-button-container

* removing extra padding

* adding font-size and line-height to match figma design

* changing the breakpoint to lg

* removing important keyword

* making explore plans button as primary and hiding signup button when user is logged in

* removing responsive-button-container

* adding count variable in the translation

* moving font-size-display-xs one level lower

* adding span under p

GitOrigin-RevId: a1a16d46a725b547bda6e452ff1c7bef05964690
2024-10-14 11:03:45 +00:00
M Fahru
f3cb79c12f Merge pull request #20777 from overleaf/as-cms-mobile-grid
Add support for specifying a mobile grid

GitOrigin-RevId: 1e9c30873d51a6cdd0b802bf6a9caf6207f07d72
2024-10-14 11:02:07 +00:00
M Fahru
20846a89a1 Merge pull request #20793 from overleaf/jel-cms-card-top-margin
[web] Apply vertical spacing between cards on CMS pages

GitOrigin-RevId: c03ae91d1de081013e8318dd80b90ef508cb5b4f
2024-10-14 11:01:59 +00:00
M Fahru
2d070ec901 Merge pull request #20796 from overleaf/jel-cms-container-width
[web] Switch to class instead of inline style for `max-width` on CMS rows

GitOrigin-RevId: 26517f7c3e6b09078d133920c380da1283e38736
2024-10-14 11:01:51 +00:00
M Fahru
04de9f28a2 Merge pull request #20754 from overleaf/mf-bs5-blog-list-style
[web] Implement Bootstrap 5 blog list style

GitOrigin-RevId: 1a343fa844cd8b22483097a470f5108ec9bcd914
2024-10-14 11:01:46 +00:00
M Fahru
163966bbb6 Merge pull request #20722 from overleaf/mf-bs5-blog-post-style
[web] Implement boostrap-5 blog post style

GitOrigin-RevId: b9dbe4952726e4260a0fcb95c8e54d7bd2db0415
2024-10-14 11:01:42 +00:00
Tim Down
90904e876c Merge pull request #20718 from overleaf/td-bs5-update-foundations
Update BS5 Foundations Sass to match Figma

GitOrigin-RevId: 23712486ea497f4bfac643e47171baf076ca77af
2024-10-14 11:00:24 +00:00
Jessica Lawshe
76b9058acb Merge pull request #20535 from overleaf/as-cms-large-black-link
[web] CMS - Add styles for large black link with angled arrow

GitOrigin-RevId: d33f6b121d51619cd373c4ede2266f7ef4da2754
2024-10-14 11:00:20 +00:00
Jessica Lawshe
fd5e1df2e1 Merge pull request #20759 from overleaf/jel-cms-col-gap
[web] Replace margin on `Style | Group` with gap on `Layout | Grid`

GitOrigin-RevId: 297a5c9f6953a22818de31062f8ad5258db4691b
2024-10-14 11:00:15 +00:00
Davinder Singh
2d737810d4 Merge pull request #20720 from overleaf/ds-cms-bs5-blog-sidebar
CMS BS5 Migration - Update the blog sidebar to match the figma design.

GitOrigin-RevId: d5ea3917d88d78972e610b1b7c6766e441af6f37
2024-10-14 10:58:32 +00:00
Jessica Lawshe
7cef8b5bdc Merge pull request #20723 from overleaf/jel-cms-lists-headers
[web] Reduce bottom margin on headers in styled lists

GitOrigin-RevId: 0cbf93d4ef4e251afe71b4b726346b4d9e382f4f
2024-10-14 10:57:48 +00:00
Jessica Lawshe
af811ec1ed Merge pull request #20612 from overleaf/as-cms-card-styles
[web] CMS - Add grey and green border cards

GitOrigin-RevId: dc421ec9032e9d695cba1af4a9536d63cb476400
2024-10-01 08:06:03 +00:00
Jessica Lawshe
514bf1f7f8 Merge pull request #20680 from overleaf/ds-cms-bs5-font-size-override
BS5 Migration CMS - Adding UL and OL to the override list in CSS styling

GitOrigin-RevId: 0919f6b1c5ebb2c6d5764a425189e3395bce903a
2024-10-01 08:05:59 +00:00
M Fahru
5b0bf3f915 Merge pull request #20662 from overleaf/mf-fix-bs5-nav-tab-li-hover
[web] BS5 CMS - Fix tab nav hover effect (remove underline)

GitOrigin-RevId: fdcb566b63afd567c1cf0ef95e72c66491137f30
2024-10-01 08:05:54 +00:00
M Fahru
9ee6954bc1 Merge pull request #20543 from overleaf/gtm-cms-icons
[web] Implement "Element | Icon" content type in CMS

GitOrigin-RevId: 369eed94d9306ef6fe5c974bb72231c8fb0b5560
2024-10-01 08:05:46 +00:00
M Fahru
0428a017a8 Merge pull request #20512 from overleaf/mf-bs5-language-picker
[web] Fix language picker color for website redesign footer

GitOrigin-RevId: 4ba974af79de5eed0d40e3ff7da3daf616525133
2024-10-01 08:05:42 +00:00
Jessica Lawshe
138f99fe49 Merge pull request #20701 from overleaf/jel-styled-latex-cms
[web] Render new styled text option

GitOrigin-RevId: 5e9ae7825fdd0daa5a1ea81345a0bc5d3a86ce5c
2024-10-01 08:05:38 +00:00
Antoine Clausse
9997c4874f [web] Migrate /user/subscription to BS5 (#20513)
* [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
2024-10-01 08:05:14 +00:00
Antoine Clausse
d4bf47932e [web] Migrate /subscription/invites/:token to BS5 (#20640)
* [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
2024-10-01 08:05:09 +00:00
ilkin-overleaf
35728d7681 Merge pull request #20436 from overleaf/ii-bs5-editor-toolbar
[web] BS5 editor toolbar

GitOrigin-RevId: a517fd52d648d165e89231d6f5551c026a951c43
2024-10-01 08:04:42 +00:00
Davinder Singh
ecbafcfbe8 BS5 CMS migration - Add border radius on images option to CMS (#20659)
* introducing new classes for border radius

* adding if else for conditionals

GitOrigin-RevId: dae2a11e3ba98801d9559127f93af2dbe06a1d89
2024-09-30 08:05:08 +00:00
Davinder Singh
610e3839ae BS5 Migration to CMS - Adding the new styling for form labels (#20582)
* 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
2024-09-30 08:05:00 +00:00
Jessica Lawshe
3561e6315f Merge pull request #20602 from overleaf/jel-cms-bottom-align-card
[web] Fix bottom alignment in cards on CMS BS5

GitOrigin-RevId: a09e7f21b0eab3642b7c22cec39a08842f8614a5
2024-09-26 08:06:06 +00:00
Jessica Lawshe
518647c13d Merge pull request #20601 from overleaf/jel-cms-max-width
[web] Use `.container` `max-width` from Bootstrap 5 for CMS sections

GitOrigin-RevId: 1642de2024723584be7c7ad84d7cda0ee4af05a6
2024-09-26 08:06:02 +00:00
Jessica Lawshe
771397beac Merge pull request #20594 from overleaf/jel-premium-card-p
[web] Do not change `p` color in premium cards

GitOrigin-RevId: 4115416459b75db31b30cf31787cf027c1179e41
2024-09-26 08:05:55 +00:00
Rebeka Dekany
ca49eada95 Merge pull request #20589 from overleaf/rd-bs5-dropdown-fix
[web] Fix the dropdown toggle arrow positioning on the tag menu

GitOrigin-RevId: 41935fd059c3a2a197f5f445d8c72c82415de6d7
2024-09-26 08:05:51 +00:00
Rebeka Dekany
ac74ba9e8c Merge pull request #20501 from overleaf/rd-filetree-toolbar
Migrate the file tree toolbar to Bootstrap 5

GitOrigin-RevId: 00ebe585206bf163bf9a00aa56b52d43effd5605
2024-09-26 08:05:47 +00:00
Rebeka Dekany
abb59e4603 Merge pull request #20298 from overleaf/rd-ide-filetree
[web] Migrate the file tree on the editor page to Bootstrap 5

GitOrigin-RevId: e2efec26242c8cdab37a54bc182b83bfb0f1eb3c
2024-09-26 08:05:43 +00:00
Antoine Clausse
d480faf60b [web] Make the welcome page cards all have the same widths (implementation 2) (#20570)
* 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
2024-09-26 08:04:55 +00:00
Jessica Lawshe
e4b3ee8988 Merge pull request #20508 from overleaf/as-cms-bs5-link-colours
[web] Adjust link behaviour for Website Redesign in BS5

GitOrigin-RevId: d09831de1f51c4e2a9bc06b0c9fd9f4a1909d7f0
2024-09-25 08:06:19 +00:00
Jessica Lawshe
e8f602db9b Merge pull request #20545 from overleaf/jel-remove-comment
[web] Remove commented out CSS code

GitOrigin-RevId: 8d6c392735eb2637a3c7bbc4cd4d17d5dc92d1e4
2024-09-25 08:06:11 +00:00
Jessica Lawshe
ecb0655241 Merge pull request #20572 from overleaf/jel-cms-styled-list
[web] Render styled lists on `Element | Content`

GitOrigin-RevId: 9d951e2339a85cc89b14991bbde2bc4d4316852a
2024-09-25 08:06:06 +00:00
Jessica Lawshe
d43efc2d7c Merge pull request #20523 from overleaf/jel-cms-padding-fix
[web] CMS BS5 - Fix mobile top padding when columns reversed, apply `max-width` to rows as cards

GitOrigin-RevId: 0c8745c171dc8e24389b2e54e4d6fd605c30e145
2024-09-25 08:06:01 +00:00
Jessica Lawshe
705035a972 Merge pull request #20544 from overleaf/jel-cms-bs5-fonts
[web] Font size overrides for CMS BS5 pages

GitOrigin-RevId: 0803b3b76b3a1c60a26bf56d94a27d67270b7313
2024-09-25 08:05:55 +00:00
Davinder Singh
ba0f95aaf0 BS5 Migration - Blog post cards migration to BS5 (#20539)
* 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
2024-09-25 08:05:38 +00:00
Davinder Singh
4c2425fe25 Premium Badge - BS5 migration (#20496)
* 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
2024-09-25 08:05:33 +00:00
Davinder Singh
248fc3699a CMS Bootstrap 5 migration - Tabs using bootstrap 5 classes (#20478)
* 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
2024-09-25 08:05:21 +00:00
MoxAmber
2c53687ea1 Merge pull request #20477 from overleaf/as-jel-cms-bs5-quotes
[web] Use Bootstrap 5 for CMS Quotes

GitOrigin-RevId: 9f3699cd4588412176466ebfea1ddfa160da1535
2024-09-20 08:05:55 +00:00
MoxAmber
4b281becdd Merge pull request #20468 from overleaf/jel-cms-bs5-top-padding
[web] Update top padding on CMS BS5 pages

GitOrigin-RevId: c663886a9f28992a7056ac3f568980d1a5603699
2024-09-20 08:05:50 +00:00
MoxAmber
68eaec6d8e Merge pull request #20485 from overleaf/jel-cms-bs5-mobile-breakpoint
[web] Update mobile breakpoint for CMS pages using BS5

GitOrigin-RevId: b855faf378b03788caff8574747d88b96706de2a
2024-09-20 08:05:46 +00:00