860dec3428
Fixed dropdown blur and unified components ( #9062 )
...
- Removed disableBlur property from dropdown because it is no longer
needed since there's only one OverlayContainer component so there can be
only one blur at a time.
- Removed blur CSS properties from every component that used it because
one standalone OverlayContainer is able to handle all cases if placed
properly.
- Also removed disableBackgroundBlur property from SingleRecordSelect
- Removed FieldInputOverlay and FieldTextAreaOverlay components that
were a first attempt to create something like an OverlayContainer
- Used new unified OverlayContainer in RecordInlineCell and
RecordTableCell
- Fixed ScrollWrapper so that it works well both for dropdown with non
overflowing content and dropdown with overflowing content.
- Removed export default value on SearchVariablesDropdown as it is not
used in this codebase
- Refactored SearchVariablesDropdown function as component anti-pattern
- Refactored SearchVariablesDropdownFieldItems UI problems with
separator and missing ScrollWrapper behavior
- Refactored SearchVariablesDropdownObjectItems with UI problems with
separator and missing ScrollWrapper behavior
- Fixed blur bug on Firefox due to wrong placement of the element that
had the CSS property. Blur works on Firefox it it's on the container
that has the highest level in the tree.
- Fixed bug in ActivityTargetInlineCell by removing an unnecessary
container component StyledSelectContainer
- Unified problems of field height with a new common component
FieldInputContainer, instead of putting width and height at the wrong
abstraction level, width and height are a field's concern not a
dropdown, overlay or low-level input concern.
- Fixed block editor dropdown with new OverlayContainer
- Aligning field dropdown with their anchor on inline and table cells,
there are still many small pixel misalignments that give a low quality
impression.
- Fixed FormDateFieldInput that was missing OverlayContainer
2024-12-17 14:28:26 +00:00
c23896c5dc
Fix dropdown overflow ( #8907 )
...
Fixes:
<img width="267" alt="Capture d’écran 2024-12-03 à 14 59 24"
src="https://github.com/user-attachments/assets/73278208-25d2-4225-a632-eb37cc69fcd6 ">
2024-12-05 18:12:59 +01:00
3ad1113173
fix: scroll dropdown listing in hidden fields ( #8738 )
...
Fixes : #8716
[Screencast from 2024-11-25
22-06-24.webm](https://github.com/user-attachments/assets/35bd66cc-942f-4903-abda-0d67a75b6582 )
---------
Co-authored-by: Lucas Bordeau <bordeau.lucas@gmail.com >
2024-11-27 18:06:11 +01:00
9073bdf21a
Background Blur added across multiple Input Fields in Edit Popups ( #8277 )
...
Fix #5644
**Apply background blur to input fields across UI for improved
consistency and appearance with Theme compatibility :**
1. Updated **TextAreaInput.tsx** to apply background blur to text input
fields (e.g., City name).
2. Enhanced **PhonesFieldInput.tsx** to apply background blur for
seamless styling in phone number input sections.
3. Modified **TextInputV2.tsx** to add background blur in address
inputs, workspace fields (e.g., Blocklist, Name fields), invitation
inputs, profile name/email fields, and other input areas.
4. Updated **DateTimeInput.tsx** and **DateInput.tsx** to improve the
appearance of date, time, and calendar popup fields with background
blur.
5. Refined **DropdownMenuInput.tsx** and **DropdownMenuSearchInput.tsx**
to add background blur to inputs for Emails, Domain name, and search
fields across the web (e.g., Time Zone dropdowns, phone number country
search).
Some images are attached for reference.
<img width="235" alt="1_b"
src="https://github.com/user-attachments/assets/bd72e69a-712e-4226-8fda-0cb737d4cbd1 ">
<img width="229" alt="1_w"
src="https://github.com/user-attachments/assets/bb8eb60b-31fb-44c6-ac2a-ca28638b5e07 ">
<img width="234" alt="2_b"
src="https://github.com/user-attachments/assets/a4f0a9de-dea1-4ef8-926b-99de984c081b ">
<img width="239" alt="2_w"
src="https://github.com/user-attachments/assets/4d2c7331-4bbf-4ea2-adad-76c7cde4072c ">
<img width="225" alt="3_b"
src="https://github.com/user-attachments/assets/458f4759-8428-43ae-a6b6-aa38ab6fb0f8 ">
<img width="219" alt="3_w"
src="https://github.com/user-attachments/assets/5ddb67c5-e59d-47cc-b2e7-44b3a7b794e6 ">
<img width="646" alt="4_b"
src="https://github.com/user-attachments/assets/01252bce-a34a-4dda-a801-654ccc5e7841 ">
<img width="637" alt="4_w"
src="https://github.com/user-attachments/assets/ea60deab-7594-4aef-ac63-0cedc9168951 ">
<img width="648" alt="5_b"
src="https://github.com/user-attachments/assets/465789ec-55b3-4750-a2bc-a9e156b1101e ">
<img width="642" alt="5_w"
src="https://github.com/user-attachments/assets/8b58977a-f543-4018-a4ee-b1ff5b9180a3 ">
<img width="647" alt="6_b"
src="https://github.com/user-attachments/assets/88030efe-bd16-43e4-9744-ee223aa04298 ">
<img width="642" alt="6_w"
src="https://github.com/user-attachments/assets/4ca2c365-ab1e-47e9-ba4a-bdb738500f56 ">
<img width="647" alt="7_b"
src="https://github.com/user-attachments/assets/224c3da5-cf57-4652-bd29-681c2098917e ">
<img width="655" alt="7_w"
src="https://github.com/user-attachments/assets/eecc2d51-ce1f-47c9-845c-c6fe15a40fa5 ">
<img width="317" alt="8_b"
src="https://github.com/user-attachments/assets/e899b4a2-4849-4d1c-805b-5a950a53d6cc ">
<img width="335" alt="8_w"
src="https://github.com/user-attachments/assets/73fef887-0a46-4557-aca4-d07c9dc298d1 ">
<img width="246" alt="9_b"
src="https://github.com/user-attachments/assets/99c5627a-e7ba-4453-9666-8d73b0d676ee ">
<img width="238" alt="9_w"
src="https://github.com/user-attachments/assets/bb36e4ea-3b78-48f5-822f-cc5012e5d434 ">
<img width="218" alt="10_b"
src="https://github.com/user-attachments/assets/450fa833-12ad-40b7-80f5-17de6af582bd ">
<img width="225" alt="10_w"
src="https://github.com/user-attachments/assets/3fe6d128-4146-4316-821e-2ebd65fd12d5 ">
<img width="647" alt="11_b"
src="https://github.com/user-attachments/assets/ec39f88f-0beb-4cf0-b35f-b4f78b4e75ff ">
<img width="663" alt="11_w"
src="https://github.com/user-attachments/assets/6eb19fe7-604c-4cb9-9623-208e541df751 ">
<img width="235" alt="12_b"
src="https://github.com/user-attachments/assets/98e68530-f5c5-43d1-839e-a8c14582b72a ">
<img width="245" alt="12_w"
src="https://github.com/user-attachments/assets/e3f0aec9-6a32-4784-a36c-d187303d3310 ">
---------
Co-authored-by: Lucas Bordeau <bordeau.lucas@gmail.com >
2024-11-19 12:21:01 +01:00
6ec8a5b76e
[FIX] slash-menu-height-fix ( #8327 )
...
FIX #8326
I've used the `height: fit-content` property just for customSlashMenu
but I think it will work for all dropdown menu's.
I tested it for a few and works fine, but not sure for edge cases.
Let me know if the height should be changed to `fir-content`
---------
Co-authored-by: Lucas Bordeau <bordeau.lucas@gmail.com >
2024-11-08 16:22:18 +00:00
b627c55b9a
Add blue focus on text inputs ( #8343 )
...
We removed the blue focus on phone/domain/array/email floating inputs
but we want to keep it in the app settings.
<img width="644" alt="Screenshot 2024-11-05 at 15 55 04"
src="https://github.com/user-attachments/assets/afcbe6b2-2d6b-4e0d-8397-4268d529127c ">
<img width="606" alt="Screenshot 2024-11-05 at 15 55 23"
src="https://github.com/user-attachments/assets/004becf8-41e7-45d6-9ad9-9e487b8db8f3 ">
<img width="351" alt="Screenshot 2024-11-05 at 15 55 33"
src="https://github.com/user-attachments/assets/6a4c06e6-04d3-46bf-940b-9fd61ee91995 ">
<img width="330" alt="Screenshot 2024-11-05 at 15 55 41"
src="https://github.com/user-attachments/assets/e6fc8bbd-eca3-47bc-93f1-d6ff8d3d8a13 ">
<img width="588" alt="Screenshot 2024-11-05 at 15 56 07"
src="https://github.com/user-attachments/assets/0d0f5e80-3501-4346-94a1-6ea4b77ee7ba ">
<img width="211" alt="Screenshot 2024-11-05 at 15 56 31"
src="https://github.com/user-attachments/assets/9cd85f4d-8052-4c6b-a694-84c691c6217d ">
2024-11-06 14:23:34 +01:00
0893774cc1
Fixed expandable list and navigation menu ( #8336 )
...
For release 0.32
- Fixed expandable list dropdown UI bugs
- Added ScrollWrapper on navigation menus
2024-11-05 11:34:00 +00:00
c93d2bcd5e
Fixed many dropdown bugs ( #8256 )
...
Many dropdown bugs have been fixed, more refactoring is needed.
Dropdown fixed :
- Filter select
- Sort select
- Visible field select
- Hidden field select
- Multi item picker (phones, links, emails, etc.)
- Phone country select
2024-11-01 09:23:01 +01:00
c0484aa9a2
fix: dropdown max-height and padding bottom ( #8167 )
...
Fixes : #6105
Also fixed side effect due to previous PR:
[Screencast from 2024-10-29
13-54-44.webm](https://github.com/user-attachments/assets/f15db853-ca1c-4be8-9362-610122c4d988 )
2024-10-29 11:00:35 +01:00
94f2e1067b
Revert "fix: dropdowns should have a max-height & padding from screen" ( #8165 )
...
Reverts twentyhq/twenty#8055
2024-10-29 08:54:16 +00:00
e648d942a2
fix: dropdowns should have a max-height & padding from screen ( #8055 )
...
Fixes : #6105
### Problem
- The dropdown gets clipped when the number of filters increases.
### Solution
- Added scroll property to the ```DropdownMenu```
- Added size middleware to the floating UI hook.
- Provided padding of 20px to the size middleware, so that it maintains
distance from the bottom of the screen.
[Screencast from 2024-10-25
13-47-04.webm](https://github.com/user-attachments/assets/c2315ee2-6092-4c4a-8126-dba7ac3bf49b )
---------
Co-authored-by: martmull <martmull@hotmail.fr >
2024-10-28 16:59:57 +00:00
54794b5197
Fix z-index issue on dropdown ( #6160 )
...
Recently, we've forced all dropdown menu to be displayed in portal. This
loses the z-index hieararchy structure and forces us to specify a higher
z-index in order for dropdown menus to be displayed on top
2024-07-08 16:22:46 +02:00
d770e56e31
fix: Poor contrast on SlashMenu ( #5342 )
...
fixes
[#5304 ](https://github.com/twentyhq/twenty/issues/5304#issue-2280984063 )
dark mode
<img width="1425" alt="Screenshot 2024-05-09 at 1 59 56 AM"
src="https://github.com/twentyhq/twenty/assets/60315832/70230f9e-607a-462a-8823-db8350d86bc4 ">
<br>
<br>
Light mode
<img width="1448" alt="Screenshot 2024-05-09 at 2 01 06 AM"
src="https://github.com/twentyhq/twenty/assets/60315832/523488a5-21de-4911-b11b-e28fba9adae6 ">
Co-authored-by: Lucas Bordeau <bordeau.lucas@gmail.com >
2024-05-30 11:00:23 +02:00
2a1ea326d2
Fix SnackBar visual ( #5569 )
...
cf https://discord.com/channels/1130383047699738754/1243478998810497054
2024-05-27 12:15:57 +02:00
48003887ce
feat: remove a link from a Links field ( #5313 )
...
Closes #5117
TO FIX in another PR: right now, the "Vertical Dots" LightIconButton
inside the Dropdown menu sometimes needs to be clicked twice to open the
nested dropdown, not sure why 🤔 Maybe an `event.preventDefault()` is
needed somewhere?
<img width="369" alt="image"
src="https://github.com/twentyhq/twenty/assets/3098428/dd0c771a-c18d-4eb2-8ed6-b107f56711e9 ">
---------
Co-authored-by: Jérémy Magrin <jeremy.magrin@gmail.com >
Co-authored-by: Charles Bochet <charles@twenty.com >
2024-05-22 09:39:21 +02:00
c0b3a8715f
4810 display participants in the right drawer of the calendar event ( #4896 )
...
Closes #4810
- Introduces a new component `ExpandableList` which uses intersection
observers to display the maximum number of elements possible
2024-04-12 10:33:46 +02:00
4a493b6ecf
New view picker ( #4610 )
...
* Implement new view picker
* Complete feature
* Fixes according to review
2024-03-22 15:04:17 +01:00
235e71ca02
Update backdrop-filter in OverlayBackground.ts ( #4436 )
...
* Update backdrop-filter in OverlayBackground.ts
* Fix backdrop-filter in OverlayBackground.ts
* Update opacity of menu item, to be constantly 0
* Fixes
---------
Co-authored-by: Lucas Bordeau <bordeau.lucas@gmail.com >
2024-03-15 17:19:27 +01:00
7231ea1e72
Fix: Inline Phone Field Menu ( #4383 )
...
* #4343 fix: phone menu display on page
* Add the possibility to send width as %
---------
Co-authored-by: Thomas Trompette <thomast@twenty.com >
2024-03-11 16:38:37 +01:00
edf62f3a3b
Resolved dropdown style issue ( #3620 )
...
* #3617 #3615 resolved dropdown style issue
* resolved lint error
* resolved gap issue
* resolved lint error
2024-01-31 11:41:27 +01:00
60e9864e52
Fix: z index for the menu ( #3497 )
...
fix: z index for the menu
2024-01-17 10:13:51 +01:00
5bdca9de6c
Migrate to a monorepo structure ( #2909 )
2023-12-10 18:10:54 +01:00
Lucas Bordeau