Support for Drupal 7 is ending on 5 January 2025—it’s time to migrate to Drupal 10! Learn about the many benefits of Drupal 10 and find migration tools in our resource center.
Problem/Motivation
The right sidebar on the node creation page looks bad, due to the border and the default browser outline effect. I suggest we improve the theming to make the sidebar look better. Currently the 'sidebar' looks like this:
node/add/article
:
-
Proposed resolution
I suggest we fix the border issues and the outline. Currently I've created a patch that makes the sidebar looks like this:
node/add/article
:
-
Remaining tasks
- Finalize and agree on the visual design
- Write the patch
User interface changes
Updated look for the right sidebar for content
API changes
None.
Comment | File | Size | Author |
---|---|---|---|
#42 | expanded-details-styling.png | 245.78 KB | yoroy |
#42 | expanded-details-styling.png | 254.28 KB | yoroy |
#38 | Block_Node_Entity_Meta-2375663-37.patch | 1.96 KB | Manjit.Singh |
#36 | after-img-patch.png | 8.92 KB | Sakthivel M |
#36 | after-patch.png | 10.59 KB | Sakthivel M |
Comments
Comment #1
sqndr CreditAttribution: sqndr commentedHere we go with the patch. Let's get some reviews!
Comment #3
sqndr CreditAttribution: sqndr commentedI think the test broke because I added a new css file. Here's a new patch that should fix the test. Also a small change in the order of the new stylesheet inside the info file.
Comment #4
sqndr CreditAttribution: sqndr commentedDamn it. Here's the patch. The interdiff is in the comment above, sorry ;)
Comment #5
sqndr CreditAttribution: sqndr commentedLook's like I forget a new line in the new
block.css
file. Also forgot the change the key in the test. Patching too early in the morning can be bad … :DComment #6
sqndr CreditAttribution: sqndr commentedComment #8
sqndr CreditAttribution: sqndr commentedComment #9
LewisNymanDoh! Does not apply. This is looking better though. I think the filename 'block.css' is too generic. Can we name it to match the 'block-list-secondary' class?
Comment #10
LewisNymanAlso, can we remove the inner shadow? It doesn't really fit with the Seven visuals
Comment #11
sqndr CreditAttribution: sqndr commentedSure. ;)
Comment #12
MiSc CreditAttribution: MiSc commentedComment #13
MiSc CreditAttribution: MiSc commentedTook a quick look at this, but the testing part seems to have moved the css files, or the way it is done, so I got stuck.
Comment #15
sqndr CreditAttribution: sqndr commentedI'll give the latest patch another test run.
Comment #17
sqndr CreditAttribution: sqndr commentedMiSc, there is still some work to-do for this issue. Here's some great documentation on how to re-roll a patch. Afterwards, there are two more tasks that should happen. They are described in the issue summary (and comment #11). Cheers ;)
Comment #18
thisisit CreditAttribution: thisisit commentedComment #19
piyuesh23 CreditAttribution: piyuesh23 commentedComment #20
thisisit CreditAttribution: thisisit commentedRe rolling #5.
Comment #22
sqndr CreditAttribution: sqndr commentedComment #23
sqndr CreditAttribution: sqndr commentedThe work from #9, #10, #11 still needs to be done.
Comment #24
piyuesh23 CreditAttribution: piyuesh23 commentedRe-rolled & updated patch with 9, #10 & #11
Comment #26
Bojhan CreditAttribution: Bojhan as a volunteer commentedA small idea in #2487067: Reduce ugliness of sidebar.
Comment #27
LewisNymanComment #28
LewisNymanThis patch contains changes to tests that are from another patch, that's why the tests are failing
Comment #29
piyuesh23 CreditAttribution: piyuesh23 commentedUploading a patch with cleaned tests.
Comment #31
yoroy CreditAttribution: yoroy at Wunder commentedThis sidebar seems too boxed in at the moment. In exploring options I took cues from the modules page. Instead of one solid boxed-in column with sections separated by grey lines we can give it some more air by removing the thin grey borders by white space. We don't necessarily need visual difference between a closed and an open section, so I simplified that as well.
Not sure yet about the best background color yet, but looks like a promising direction. Thoughts?
Comment #32
LewisNyman@yoroy Thanks for working on this, the "Place blocks" title and search input feel very separate from the blocks now. I think that it needs some kind of container to associate them. Maybe we can take inspiration from the config page panels, that contains a and groups?
Comment #33
thisisit CreditAttribution: thisisit at Sanganak Technologies LLP commentedMy apologies this is still assigned to me and didn't even realise this as this was my first attempt to re-roll. This will probably need some usability expert.
Comment #34
Sakthivel M CreditAttribution: Sakthivel M at UniMity Solutions Pvt Limited commentedHi,
I have created a patch to solve the issue mentioned
Comment #36
Sakthivel M CreditAttribution: Sakthivel M at UniMity Solutions Pvt Limited commentedHi,
I have re created a patch to solve the issue mentioned
Comment #38
Manjit.SinghI guess this patch should be move into 8.2.x that is why automated testing fail in #36.
Comment #40
emma.mariaI'm going to take the attention back to comment #31 where the UI design was under discussion again.
No more patches for the meantime please :-)
@yoroy did you have any feedback for #32?
Comment #41
Bojhan CreditAttribution: Bojhan as a volunteer commented@yoroy What do you think? It looks a bit barebones to me
Comment #42
yoroy CreditAttribution: yoroy commentedUpdated the issue summary a bit: the right sidebar for Blocks ui was rolled back (is not in core). Most of the feedback in #32 doesn't apply anymore.
@Bojhan I agree it looks sparse, that's what you get when I design it :)
We have something similar at /admin/structure/types/manage/article/form-display, where if you expand the config options for a single field (click the far right cog icon) we show that expanded row with a blue background. I don't think it's a great look, but we could apply a similar approach here:
related: the whole thing starts to look a lot friendlier with some rounded corners:
Comment #43
yoroy CreditAttribution: yoroy commentedComment #44
yoroy CreditAttribution: yoroy commentedComment #58
markconroy CreditAttribution: markconroy at Annertech commentedLet's move this to the Seven contrib module issue queue. Core is now using Claro by default, which has a really nice looking sidebar.
Comment #59
mherchel+1 Moving it to Seven.