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

Improve admin UI and add extensible stylesheet #3

Merged
merged 5 commits into from
May 24, 2018
Merged

Conversation

contolini
Copy link
Member

@contolini contolini commented May 22, 2018

Adds a custom index.css stylesheet that brings treemodeladmin in line with Wagtail's admin UI styles. Also lets the user add their own stylesheets when extending TreeModelAdmin.

@willbarton @higs4281 LMK how you feel about this approach. It's influenced by what modeladmin did before it was merged into wagtail core.

I only added a couple CSS rules to fix the buttons in the header. The arrows' spacing looks fine on my screen but I may be looking at the wrong thing. Let's chat what other fixes need to be made in post-scrum.

Additions

  • Stylesheet for treemodeladmin delivered via forms.Media.

Testing

  1. See Testing.
  2. The Edit button in the header should look like a normal edit button.

Screenshots

screen shot 2018-05-21 at 8 12 26 pm

Checklist

  • PR has an informative and human-readable title
  • Changes are limited to a single goal (no scope creep)
  • Code can be automatically merged (no conflicts)
  • Code follows the standards laid out in the development playbook
  • Passes all existing automated tests
  • Any change in functionality is tested
  • New functions are documented (with a description, list of inputs, and expected output)
  • Placeholder code is flagged / future todos are captured in comments
  • Visually tested in supported browsers and devices (see checklist below 👇)
  • Project documentation has been updated (including the "Unreleased" section of the CHANGELOG)
  • Reviewers requested with the Reviewers tool ➡️

Copy link
Member

@willbarton willbarton left a comment

Choose a reason for hiding this comment

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

The buttons look good, but I'm seeing some weird space between the header and the table:

image

I do really like the simplicity. I was getting completely hung up over frontend build tools and processes.

def get_index_view_extra_css(self):
css = ['treemodeladmin/css/index.css']
css.extend(self.index_view_extra_css)
return css
Copy link
Member

Choose a reason for hiding this comment

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

Very nice!

Copy link
Member

@higs4281 higs4281 left a comment

Choose a reason for hiding this comment

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

Just one oddity: when I checked source, index.css is getting imported twice.

contolini and others added 5 commits May 24, 2018 08:57
Adds a custom index.css stylesheet that brings treemodeladmin in line
with Wagtail's admin UI styles. Also lets the user add their own
stylesheets when extending TreeModelAdmin.
The index.html template already inherits the same basic block from modeladmin/index.html. https://github.com/wagtail/wagtail/blob/master/wagtail/contrib/modeladmin/templates/modeladmin/index.html#L6-L9

This will fix the index.css file being included twice.
@coveralls
Copy link

coveralls commented May 24, 2018

Pull Request Test Coverage Report for Build 14

  • 0 of 0 changed or added relevant lines in 0 files are covered.
  • No unchanged relevant lines lost coverage.
  • Overall coverage increased (+0.02%) to 99.507%

Totals Coverage Status
Change from base Build 15: 0.02%
Covered Lines: 202
Relevant Lines: 203

💛 - Coveralls

@willbarton willbarton merged commit 8760672 into master May 24, 2018
@willbarton willbarton deleted the add-stylesheet branch May 24, 2018 14:23
@contolini
Copy link
Member Author

Nice catch on the fix 🎉

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

4 participants