Skip to content

Scale ocdialog based on screen size to contain more information on big screens #37773

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

Closed
SuperSandro2000 wants to merge 1 commit into from
Closed

Scale ocdialog based on screen size to contain more information on big screens #37773

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
1 commit
Select commit
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
5 changes: 2 additions & 3 deletions core/src/OC/dialogs.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -534,9 +534,8 @@ const Dialogs = {

self.$filePicker.ocdialog({
closeOnEscape: true,
// max-width of 600
width: 600,
height: 500,
width: '70vw',
height: '60vh',
Comment on lines +537 to +538
Copy link
Member

@Pytal Pytal Apr 18, 2023

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Should have a max-width and max-height as well but not sure what values would be best, @jancborchardt @skjnldsv?

Copy link
Member

@skjnldsv skjnldsv Apr 18, 2023

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

and min too 👍

Copy link
Author

@SuperSandro2000 SuperSandro2000 Apr 20, 2023

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I am not super good in css, should I set the following:

Suggested change
width: '70vw',
height: '60vh',
mix-width: '70vw',
max-width: '70vw',
min-height: '60vh',
max-height: '60vh',

or

Suggested change
width: '70vw',
height: '60vh',
mix-width: '600',
width: '70vw',
min-height: '500',
height: '60vh',

?

modal: modal,
buttons: buttonlist,
style: {
Expand Down
1 change: 0 additions & 1 deletion core/src/jquery/css/jquery.ocdialog.scss
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -83,7 +83,6 @@ body.theme--dark .oc-dialog-dim {

.oc-dialog-content {
width: 100%;
max-width: 550px;
}

.oc-dialog.password-confirmation {
Expand Down
4 changes: 2 additions & 2 deletions dist/core-login.js
View file
Open in desktop

Large diffs are not rendered by default.

2 changes: 1 addition & 1 deletion dist/core-login.js.map
View file
Open in desktop

Large diffs are not rendered by default.

4 changes: 2 additions & 2 deletions dist/core-main.js
View file
Open in desktop

Large diffs are not rendered by default.

2 changes: 1 addition & 1 deletion dist/core-main.js.map
View file
Open in desktop

Large diffs are not rendered by default.