Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

Improve dialog component design #10444

Open
blesildaramirez opened this issue Sep 18, 2024 · 0 comments
Open

Improve dialog component design #10444

blesildaramirez opened this issue Sep 18, 2024 · 0 comments
Assignees
@blesildaramirez
Labels
Enhancement:1:Minor A new feature or improvement that can be implemented in less than 3 days. UI/UX Issues affecting the user interface/user experience
Milestone
3.5.0 LTS

Comments

@blesildaramirez
Copy link
Contributor

blesildaramirez commented Sep 18, 2024 •
edited
Loading

Goal:

Improve the existing dialog component to align with the new design coming from Figma.
Introduce a new prop called "modalStyle" which will indicate the styling to be used.

Mockups:
For negative state:
image

For success state:
image

Primary Style:
image

Default:
image

Pull requests:
ui-library: pkp/ui-library#415
pkp-lib: #10510
ojs: pkp/ojs#4465
omp: pkp/omp#1726
ops: pkp/ops#790
customBlockManager: pkp/customBlockManager#89 (plugin)
staticPages: pkp/staticPages#87 (plugin)
@blesildaramirez blesildaramirez added Enhancement:1:Minor A new feature or improvement that can be implemented in less than 3 days. UI/UX Issues affecting the user interface/user experience labels Sep 18, 2024
@blesildaramirez blesildaramirez self-assigned this Sep 19, 2024
@blesildaramirez blesildaramirez changed the title Improve dialog component design based on Figma mockups Improve dialog component design Sep 23, 2024
@blesildaramirez blesildaramirez added this to the 3.5.0 LTS milestone Sep 23, 2024
blesildaramirez added a commit to blesildaramirez/ui-library that referenced this issue Sep 25, 2024
@blesildaramirez
pkp/pkp-lib#10444 Change Dialog component styling
ebb1132
blesildaramirez added a commit to blesildaramirez/ui-library that referenced this issue Sep 25, 2024
@blesildaramirez
pkp/pkp-lib#10444 Rename prop type with modalStyle
87312df
blesildaramirez added a commit to blesildaramirez/ui-library that referenced this issue Sep 30, 2024
@blesildaramirez
pkp/pkp-lib#10444 Change Dialog component styling
f9b8710
blesildaramirez added a commit to blesildaramirez/ui-library that referenced this issue Sep 30, 2024
@blesildaramirez
pkp/pkp-lib#10444 Rename prop type with modalStyle
c868e30
blesildaramirez added a commit to blesildaramirez/ui-library that referenced this issue Sep 30, 2024
@blesildaramirez
pkp/pkp-lib#10444 Update default Dialog modal styling
88ccf87
blesildaramirez added a commit to blesildaramirez/ui-library that referenced this issue Oct 1, 2024
@blesildaramirez
pkp/pkp-lib#10444 Add modalStyle param to existing openDialog calls
5f25cff
blesildaramirez added a commit to blesildaramirez/ui-library that referenced this issue Oct 7, 2024
@blesildaramirez
pkp/pkp-lib#10444 Change Dialog component styling
9f088c8
blesildaramirez added a commit to blesildaramirez/ui-library that referenced this issue Oct 7, 2024
@blesildaramirez
pkp/pkp-lib#10444 Rename prop type with modalStyle
136b3e3
blesildaramirez added a commit to blesildaramirez/ui-library that referenced this issue Oct 7, 2024
@blesildaramirez
pkp/pkp-lib#10444 Update default Dialog modal styling
51dda57
blesildaramirez added a commit to blesildaramirez/ui-library that referenced this issue Oct 7, 2024
@blesildaramirez
pkp/pkp-lib#10444 Add modalStyle param to existing openDialog calls
82c1c1e
blesildaramirez added a commit to blesildaramirez/ui-library that referenced this issue Oct 7, 2024
@blesildaramirez
pkp/pkp-lib#10444 Add isDismissible prop to the Dialog component, and…
500adf1 
… add the X button when there are no actions in the props
blesildaramirez added a commit to blesildaramirez/pkp-lib that referenced this issue Oct 7, 2024
@blesildaramirez
pkp#10444 Remove titleIcon and instead add modalStyle param the to Mo…
10c7579 
…dal classes
blesildaramirez added a commit to blesildaramirez/pkp-lib that referenced this issue Oct 7, 2024
@blesildaramirez
pkp#10444 Add modalStyle to template files that use dialog component
02eda4c
blesildaramirez added a commit to blesildaramirez/pkp-lib that referenced this issue Oct 7, 2024
@blesildaramirez
pkp#10444 Use isWarnable button when using 'negative' modalStyle
7fcf7ca
blesildaramirez added a commit to blesildaramirez/pkp-lib that referenced this issue Oct 7, 2024
@blesildaramirez
pkp#10444 Define modalStyle when using dialog component
d81d33d
blesildaramirez added a commit to blesildaramirez/ojs that referenced this issue Oct 7, 2024
@blesildaramirez
pkp/pkp-lib#10444 Define modalStyle when using dialog component
e6b552d
blesildaramirez added a commit to blesildaramirez/customBlockManager that referenced this issue Oct 8, 2024
@blesildaramirez
pkp/pkp-lib#10444 Add modalStyle when using dialog component
78f2acc
blesildaramirez added a commit to blesildaramirez/staticPages that referenced this issue Oct 8, 2024
@blesildaramirez
pkp/pkp-lib#10444 Fix URL for managing static page in plugins listing
23bad13
blesildaramirez added a commit to blesildaramirez/staticPages that referenced this issue Oct 8, 2024
@blesildaramirez
pkp/pkp-lib#10444 Add modalStyle when using dialog component
37f6375
blesildaramirez added a commit to blesildaramirez/customBlockManager that referenced this issue Oct 8, 2024
@blesildaramirez
pkp/pkp-lib#10444 Adjust cypress test to click the Appearance tab fir…
49511b1 
…st before clicking its content
blesildaramirez added a commit to blesildaramirez/customBlockManager that referenced this issue Oct 8, 2024
@blesildaramirez
pkp/pkp-lib#10444 [cypress] Reload website page after adding new cust…
08c3bfe 
…omBlock
blesildaramirez added a commit to blesildaramirez/ui-library that referenced this issue Oct 8, 2024
@blesildaramirez
pkp/pkp-lib#10444 Change Dialog component styling
6eb60ee
blesildaramirez added a commit to blesildaramirez/ui-library that referenced this issue Oct 8, 2024
@blesildaramirez
pkp/pkp-lib#10444 Rename prop type with modalStyle
6649b30
blesildaramirez added a commit to blesildaramirez/ui-library that referenced this issue Oct 8, 2024
@blesildaramirez
pkp/pkp-lib#10444 Update default Dialog modal styling
59e465d
blesildaramirez added a commit to blesildaramirez/ui-library that referenced this issue Oct 8, 2024
@blesildaramirez
pkp/pkp-lib#10444 Add modalStyle param to existing openDialog calls
3224f24
blesildaramirez added a commit to blesildaramirez/ops that referenced this issue Oct 11, 2024
@blesildaramirez
pkp/pkp-lib#10444 Add modalStyle when using AjaxModal modal
200cd44
blesildaramirez added a commit to blesildaramirez/ops that referenced this issue Oct 11, 2024
@blesildaramirez
pkp/pkp-lib#10444 Add modalStyle when using RemoteActionConfirmationM…
b7fe4f0 
…odal modal
blesildaramirez added a commit to blesildaramirez/ops that referenced this issue Oct 11, 2024
@blesildaramirez
pkp/pkp-lib#10444 Submodule update ##blesildaramirez/i10444##
3afc340
blesildaramirez added a commit to blesildaramirez/ui-library that referenced this issue Oct 11, 2024
@blesildaramirez
pkp/pkp-lib#10444 Change Dialog component styling
3f589ac
blesildaramirez added a commit to blesildaramirez/ui-library that referenced this issue Oct 11, 2024
@blesildaramirez
pkp/pkp-lib#10444 Rename prop type with modalStyle
4dd3c65
blesildaramirez added a commit to blesildaramirez/ui-library that referenced this issue Oct 11, 2024
@blesildaramirez
pkp/pkp-lib#10444 Update default Dialog modal styling
b1705bf
blesildaramirez added a commit to blesildaramirez/ui-library that referenced this issue Oct 11, 2024
@blesildaramirez
pkp/pkp-lib#10444 Add modalStyle param to existing openDialog calls
2cbf49e
blesildaramirez added a commit to blesildaramirez/ui-library that referenced this issue Oct 11, 2024
@blesildaramirez
pkp/pkp-lib#10444 Add isDismissible prop to the Dialog component, and…
915909e 
… add the X button when there are no actions in the props
blesildaramirez added a commit to blesildaramirez/ui-library that referenced this issue Oct 11, 2024
@blesildaramirez
pkp/pkp-lib#10444 Add modalStyle to components that use the openDialo…
c9c44c7 
…g api
blesildaramirez added a commit to blesildaramirez/ojs that referenced this issue Oct 11, 2024
@blesildaramirez
pkp/pkp-lib#10444 Submodule update ##blesildaramirez/i10444##
e152cea
blesildaramirez added a commit to blesildaramirez/pkp-lib that referenced this issue Oct 11, 2024
@blesildaramirez
pkp#10444 Update button click when showing an error on DOI modal
ff6494c
blesildaramirez added a commit to blesildaramirez/omp that referenced this issue Oct 11, 2024
@blesildaramirez
pkp/pkp-lib#10444 Submodule update ##blesildaramirez/i10444##
b00c57e
blesildaramirez added a commit to blesildaramirez/ojs that referenced this issue Oct 11, 2024
@blesildaramirez
pkp/pkp-lib#10444 Submodule update ##blesildaramirez/i10444##
ac483f9
blesildaramirez added a commit to blesildaramirez/ops that referenced this issue Oct 11, 2024
@blesildaramirez
pkp/pkp-lib#10444 Submodule update ##blesildaramirez/i10444##
9521aad
blesildaramirez added a commit to blesildaramirez/pkp-lib that referenced this issue Oct 14, 2024
@blesildaramirez
pkp#10444 Remove titleIcon and instead add modalStyle param the to Mo…
e6c73ad 
…dal classes
blesildaramirez added a commit to blesildaramirez/pkp-lib that referenced this issue Oct 14, 2024
@blesildaramirez
pkp#10444 Add modalStyle to template files that use dialog component
e767bde
blesildaramirez added a commit to blesildaramirez/pkp-lib that referenced this issue Oct 14, 2024
@blesildaramirez
pkp#10444 Use isWarnable button when using 'negative' modalStyle
a734597
blesildaramirez added a commit to blesildaramirez/pkp-lib that referenced this issue Oct 14, 2024
@blesildaramirez
pkp#10444 Define modalStyle when using dialog component
60f66e3
blesildaramirez added a commit to blesildaramirez/pkp-lib that referenced this issue Oct 14, 2024
@blesildaramirez
pkp#10444 Add modalStyle when using AjaxModal
664fdff
blesildaramirez added a commit to blesildaramirez/pkp-lib that referenced this issue Oct 14, 2024
@blesildaramirez
pkp#10444 Add modalStyle when using ConfirmationModal modal
45348a9
blesildaramirez added a commit to blesildaramirez/pkp-lib that referenced this issue Oct 14, 2024
@blesildaramirez
pkp#10444 Add modalStyle when using RedirectConfirmationModal modal
1ff7ed1
blesildaramirez added a commit to blesildaramirez/pkp-lib that referenced this issue Oct 14, 2024
@blesildaramirez
pkp#10444 Add notes for modalStyle parameter to FormBuilderVocabulary…
3d57d39 
….php and formButtons template
blesildaramirez added a commit to blesildaramirez/pkp-lib that referenced this issue Oct 14, 2024
@blesildaramirez
pkp#10444 Add modalStyle when using RemoteActionConfirmationModal modal
c9ebb76
blesildaramirez added a commit to blesildaramirez/pkp-lib that referenced this issue Oct 14, 2024
@blesildaramirez
pkp#10444 Add modalStyle when using AjaxModal modal
2770b3b
blesildaramirez added a commit to blesildaramirez/pkp-lib that referenced this issue Oct 14, 2024
@blesildaramirez
pkp#10444 Remove unexpected comma on ConfirmationModalHandler.js file
d9d2b65
blesildaramirez added a commit to blesildaramirez/pkp-lib that referenced this issue Oct 14, 2024
@blesildaramirez
pkp#10444 Update button click when showing an error on DOI modal
080ef32
blesildaramirez added a commit to blesildaramirez/pkp-lib that referenced this issue Oct 14, 2024
@blesildaramirez
pkp#10444 DOI cypress - use correct text when clicking the button
dc2fd57
blesildaramirez added a commit to blesildaramirez/ojs that referenced this issue Oct 14, 2024
@blesildaramirez
pkp/pkp-lib#10444 Submodule update ##blesildaramirez/i10444##
193b219
blesildaramirez added a commit to blesildaramirez/omp that referenced this issue Oct 14, 2024
@blesildaramirez
pkp/pkp-lib#10444 Submodule update ##blesildaramirez/i10444##
09e633e
blesildaramirez added a commit to blesildaramirez/ops that referenced this issue Oct 14, 2024
@blesildaramirez
pkp/pkp-lib#10444 Submodule update ##blesildaramirez/i10444##
1af53ac
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Assignees

@blesildaramirez blesildaramirez

Labels
Enhancement:1:Minor A new feature or improvement that can be implemented in less than 3 days. UI/UX Issues affecting the user interface/user experience
Projects
None yet
Milestone
3.5.0 LTS
Development

No branches or pull requests
1 participant
@blesildaramirez