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

UX: Maximize the preview space in composer #15188

Merged
merged 14 commits into from Dec 24, 2021
Merged

UX: Maximize the preview space in composer #15188

merged 14 commits into from Dec 24, 2021

Conversation

CvX
Copy link
Contributor

@CvX CvX commented Dec 3, 2021

A follow-up to #15117 and #15141. Applies the previous changes to PM-specific fields, makes the preview area take the all the available height of the composer, and unifies more spacing between composer elements.

Since this PR changes composer, composer-editor and d-editor templates, some theme components need to be updated:

  • Nothing in all-the* overrides d-editor
  • Two plugins override composer-editor: discourse-googlebooks (not maintained anymore?) and discourse-basic-editor
  • Two plugins override composer: discourse-basic-editor and one internal

I also have to do a spot check of random (popular) themes to see nothing regressed there.

Screen Shot 2021-12-01 at 22 57 21

Screen Shot 2021-12-01 at 22 58 35

@CvX CvX requested a review from awesomerobot December 3, 2021 22:19
@discoursebot
Copy link

This pull request has been mentioned on Discourse Meta. There might be relevant details there:

https://meta.discourse.org/t/new-composer-styling-makes-it-hard-to-differentiate-from-background/210959/5

# Conflicts:
#	app/assets/stylesheets/mobile/compose.scss
Copy link
Contributor

@pmusaraj pmusaraj left a comment

Choose a reason for hiding this comment

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

I pulled the branch locally and we now have some inconsistencies (not necessarily all due to this PR, specifically).

Composer input and dropdown border colors don't match border colors elsewhere:

image

image

Focused border size is 1px for input/dropdown, 2px for textarea:

image

image

image

I think we should stay consistent here, I am struggling to see the justification for why we want to introduce a different aesthetic to only the inputs/dropdowns in the composer.

@CvX
Copy link
Contributor Author

CvX commented Dec 6, 2021

I restored original input border colors and fixed focus border on the title input.


I tried it out with the following:

  • themes - avid-reader, discourse-classic, discourse-geometric-theme, discourse-isabelle-theme, discourse-radiant-theme, discourse-solarized-theme, dracula, Fakebook, ghost, graceful, material-design-stock-theme, minima, discourse-mint-theme, discourse-simple-theme, sunflower-theme, zeronoise
  • components/plugins - discourse-bcc, discourse-ratings, sidebar

# Conflicts:
#	app/assets/javascripts/discourse/app/templates/composer.hbs
Copy link
Contributor

@pmusaraj pmusaraj left a comment

Choose a reason for hiding this comment

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

Not sure whether the test failures are pertinent, but otherwise, the last few changes look good.

@CvX CvX merged commit 0b34d5a into main Dec 24, 2021
@CvX CvX deleted the composer-redux branch December 24, 2021 11:38
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
5 participants