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.

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

fix(NcSettingSection): update design and remove limitWidth option #5514

Merged
merged 1 commit into from
May 16, 2024

Conversation

marcoambrosini
Copy link
Contributor

@marcoambrosini marcoambrosini commented Apr 22, 2024

Remove custom heading, remove full width option and other minor fixes

@marcoambrosini marcoambrosini self-assigned this Apr 22, 2024
@marcoambrosini marcoambrosini force-pushed the bugfix/remove-custom-heading-styles branch from cd37441 to c33516f Compare April 22, 2024 11:04
@marcoambrosini marcoambrosini changed the title Remove custom heading styles Update NcSettingSection design Apr 22, 2024
@marcoambrosini marcoambrosini force-pushed the bugfix/remove-custom-heading-styles branch from c33516f to c39bde5 Compare April 29, 2024 15:21
@marcoambrosini marcoambrosini marked this pull request as ready for review May 13, 2024 09:52
@marcoambrosini marcoambrosini added enhancement New feature or request 3. to review Waiting for reviews breaking PR that requires a new major version labels May 13, 2024
Copy link
Contributor

@ShGKme ShGKme left a comment

Choose a reason for hiding this comment

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

Before After
image image

There is a border for padding now

Comment on lines -91 to -100
/**
* Limit the width of the setting's content
*
* By default only the name and description have a limit, use this
* property to also apply this to the rest of the content.
*/
limitWidth: {
type: Boolean,
default: true,
},
Copy link
Contributor

Choose a reason for hiding this comment

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

Technically this is a "small" breaking change, because it changes the component's API. It doesn't really break the page, but it results in invalid HTML attribute limit-width in DOM.

We can mark this prop as @deprecated here and remove in backport to next

Copy link
Contributor Author

Choose a reason for hiding this comment

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

doesn't it break the page for people who used full width sections?

Copy link
Contributor

Choose a reason for hiding this comment

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

Appearance and Accessibility is a bit broken

image

Copy link
Contributor Author

Choose a reason for hiding this comment

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

there's another pr here where we're tackling all those regressions
nextcloud/server#44960

Copy link
Contributor

Choose a reason for hiding this comment

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

@marcoambrosini @ShGKme I assume for appearance and accessibility we can just make it single-column instead of putting 2 themes next to each other?

Copy link
Contributor

Choose a reason for hiding this comment

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

We can, but I personally like 2 column design instead of long page.

The same problem with user migration app and privacy.

Copy link
Contributor Author

Choose a reason for hiding this comment

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

It can be 2 columns and text below the image. But these will be addressed in a separate pr in server. Let's get this in :)

Copy link
Contributor

Choose a reason for hiding this comment

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

Copy link
Contributor

Choose a reason for hiding this comment

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

as far as I can see, the prop was not actively used: https://github.com/search?q=org%3Anextcloud-libraries%20limit-width&type=code

You need to look in the nextcloud org, as it is for apps:
https://github.com/search?q=org%3Anextcloud%20limit-width&type=code

Copy link
Contributor

Choose a reason for hiding this comment

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

ah right, my issue

src/components/NcSettingsSection/NcSettingsSection.vue Outdated Show resolved Hide resolved
src/components/NcSettingsSection/NcSettingsSection.vue Outdated Show resolved Hide resolved
Signed-off-by: Marco Ambrosini <marcoambrosini@proton.me>
Copy link
Contributor

@jancborchardt jancborchardt left a comment

Choose a reason for hiding this comment

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

Seems very nice, only one thing: There is now a lot of whitespace above the headings towards the divider line. Whitespace above and below the divider should be visually roughly equal.

@marcoambrosini marcoambrosini dismissed jancborchardt’s stale review May 14, 2024 09:07

This will be tackled separately in server pr

@marcoambrosini
Copy link
Contributor Author

Can we please get this in?

@marcoambrosini marcoambrosini merged commit b7fe0a7 into master May 16, 2024
18 checks passed
@marcoambrosini marcoambrosini deleted the bugfix/remove-custom-heading-styles branch May 16, 2024 14:43
@ShGKme ShGKme added bug Something isn't working and removed enhancement New feature or request labels May 16, 2024
@ShGKme ShGKme changed the title Update NcSettingSection design fix(NcSettingSection): update design and remove limitWidth option May 16, 2024
@ShGKme
Copy link
Contributor

ShGKme commented May 16, 2024

Notes: this is not a new feature (no new components/props/events/slots), but a change behavior of the component so it should have bug label.

Both labels and PR title are used for automatic CHANGELOG generation.

@susnux
Copy link
Contributor

susnux commented May 17, 2024

So we spin up a new major now? Because this is breaking apps and server -> We can not update @nextcloud/vue Nextcloud 28 and 29 anymore because e.g. the theming settings are broken then.

@susnux
Copy link
Contributor

susnux commented May 17, 2024

We can do for next version, so backport

@susnux
Copy link
Contributor

susnux commented May 17, 2024

/backport to next

susnux added a commit that referenced this pull request May 17, 2024
fix: Revert #5514 and only force width limit on Nextcloud 30+
@susnux susnux mentioned this pull request May 17, 2024
@marcoambrosini marcoambrosini restored the bugfix/remove-custom-heading-styles branch May 27, 2024 10:24
@susnux susnux deleted the bugfix/remove-custom-heading-styles branch May 28, 2024 12:19
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
3. to review Waiting for reviews breaking PR that requires a new major version bug Something isn't working
Projects
None yet
Development

Successfully merging this pull request may close these issues.

5 participants