Commit Graph

10 Commits

Author SHA1 Message Date
4aabe9e224 Fix pricing modal being cut off and unscrollabel on low resolution screens or when zoomed in (#8848)
Fixes: #7999

1. Summary
I am not 100% sure why it's happening, but it seems `justify-content:
center` conflicts with `overflow-y: auto` and that's why the modal
content becomes unscrollable and cut off.

2. Solution
To preserve the styling that centers the content inside the modal even
when the content height is less than the modal, I moved
`justify-content: center` from the content to the modal container. When
the content overflows the modal, it seems `justify-content: center` does
nothing, though.

3. Screen Recording


https://github.com/user-attachments/assets/17d8ddbd-7fe8-46ce-b8d0-82d817ee7025

---------

Co-authored-by: Félix Malfait <felix@twenty.com>
2024-12-17 14:51:27 +01:00
a9cb20f317 Refactor and fixes dropdown bugs (#8807)
Fixes https://github.com/twentyhq/twenty/issues/8788
Fixes https://github.com/twentyhq/twenty/issues/8793
Fixes https://github.com/twentyhq/twenty/issues/8791
Fixes https://github.com/twentyhq/twenty/issues/8890
Fixes https://github.com/twentyhq/twenty/issues/8893

- [x] Also : 

Icon buttons under dropdown are visible without blur : 

![Capture d’écran du 2024-11-29
15-09-53](https://github.com/user-attachments/assets/f563333d-4e43-4ded-acc7-62e116004ed9)

- [x] Also : 

<img width="237" alt="image"
src="https://github.com/user-attachments/assets/e4c70936-beff-4481-89cb-0a32a36e0ee2">

- [x] Also : 

<img width="335" alt="image"
src="https://github.com/user-attachments/assets/5be60395-6baf-49eb-8d40-197add049e20">

- [x] Also : 

<img width="287" alt="image"
src="https://github.com/user-attachments/assets/a317561f-7986-4d70-a1c0-deee4f4e268a">

- Button create new without padding
- Container is expanding

- [x] Also : 

<img width="303" alt="image"
src="https://github.com/user-attachments/assets/09f8a27f-91db-4191-acdc-aaaeedaf6da5">

- [x] Also : 

<img width="133" alt="image"
src="https://github.com/user-attachments/assets/fe17b32e-f7a4-46c4-8040-239eaf8198e8">

Font is cut at bottom ?

- [x] Also : 

<img width="385" alt="image"
src="https://github.com/user-attachments/assets/7bab2092-2936-4112-a2ee-d32d6737e304">

The component should flip and not resize in this situation

- [x] Also : 

<img width="244" alt="image"
src="https://github.com/user-attachments/assets/5384f49a-71f9-4638-a60c-158cc8c83f81">

- [x] Also : 


![image](https://github.com/user-attachments/assets/9cd1f43a-df59-401e-9a41-bdb8e93ebe58)
2024-12-06 14:27:48 +00:00
30bcdda323 Modal Background & box shadow fixes (#8506)
# Before

![CleanShot 2024-11-14 at 19 20
59](https://github.com/user-attachments/assets/9a561416-a08c-4cc4-ac71-b3f4410950d8)

# After

![CleanShot 2024-11-14 at 19 21
34](https://github.com/user-attachments/assets/eaa78d94-a337-4d91-9c36-8ac0dd27d952)
2024-11-15 12:44:58 +01:00
fe2c8bb43b 7339 implement contextual actions inside the commandmenu (#8000)
Closes #7339


https://github.com/user-attachments/assets/b623caa4-c1b3-448e-8880-4a8301802ba8
2024-10-29 15:10:45 +01:00
6843a642b5 7499 refactor right drawer to have contextual actions (#7954)
Closes #7499
- Modifies context store states to be component states
- Introduces the concept of `mainContextStore` which will dictate the
available actions inside the command K
- Adds contextual actions inside the right drawer
- Creates a new type of modal variant
2024-10-22 18:35:45 +02:00
121794e3c0 Fixed modal clickoutside (#6624)
Modal clickoutside was modified recently.

It was considering portaled component like dropdown outside, so
comparePixel mode for click outside is needed here.
2024-08-14 17:50:18 +02:00
c836bbbfc2 Fixed SignInUp Modal misalignment for devices smaller than 400px width (#6386)
Hi @Bonapara,
Issue #6385 

I encountered an issue with the Modal component where its width was
fixed at 400px. While the container housing the Modal adjusted its size
based on the screen width, the Modal itself remained at 400px regardless
of the screen size.

I have implemented a change to address this problem. Could you please
review the changes and let me know your thoughts?

Thank you!




https://github.com/user-attachments/assets/8358aacb-d6c3-440e-895e-7abc4f8a3534

---------

Co-authored-by: Félix Malfait <felix.malfait@gmail.com>
2024-08-07 15:37:32 +02:00
dc6e27e388 Improve test coverage (#6244) 2024-07-13 17:57:13 +02:00
17422b7690 fix: I should be able to use "enter" key to create profile (#4978)
## Context
Fixes #4808 

TL;DR
Introducing pure stateless modal component ("UI modal") for our auth
modal not to have default hotkeyScope overriding our create-profile
hotkeyScope
+ we dont want the shortcut to be available for all the modal content, only for the input that should not be using a hotkeyscope, so we are using onKeyDown for the specific issue on create profile.

Explanation
create-profile hotkey scope is set by PageChangeEffect; CreateProfile
component adds enter key shortcut; but this scope is overwritten by the
default scope by the Modal component that expects a hotkeyScope to reset
to (and defaults to the default hotkeyScope if none indicated).
In the auth flow we were using that Modal component to give a modal look
to the flow but it is not a modal per say, it's a set of pages contained
within a modal look.
By creating this UI component we are escaping that hotkeyScope
overriding that does not make sense in our context.

## How was it tested
Locally
Storybook
2024-04-17 10:45:02 +02:00
5bdca9de6c Migrate to a monorepo structure (#2909) 2023-12-10 18:10:54 +01:00