Follow-up to #1342054: [META] Clean up templates and CSS

Problem/Motivation

Bartik's code needs to follow Drupal's CSS Coding Standards.

Proposed resolution

Follow the guidance in the META to cleanup the code for the "help" component.
Help's CSS can be found in css/component/help.css in Bartik.

Remaining tasks

Write a patch
Visual review of the patch - check nothing is broken or the design has been changed.
Code review of the patch - check the work being carried meets standards and the changes make sense.

User interface changes

None, we are not changing the design/UI of Bartik, this is a code cleanup task.

API changes

n/a

Beta phase evaluation

Reference: https://www.drupal.org/core/beta-changes
Issue category Task because it does fix any bugs or adds any new features.
Issue priority Normal because it does not affect current functionality.
Unfrozen changes Unfrozen because it only changes css
Prioritized changes The main goal of this issue is updating code to current CSS coding standards
Disruption Not disruptive

Comments

lewisnyman’s picture

StatusFileSize
new141 bytes

Uploaded the css file so it can reviewed with Dreditor

emma.maria’s picture

Issue tags: +Novice
markot91’s picture

Assigned: Unassigned » markot91
markot91’s picture

StatusFileSize
new480 bytes

Added the file-comment. Properties grouped alphabetically.

markot91’s picture

Status: Active » Needs review
idebr’s picture

Status: Needs review » Needs work

@MarkoT91 Nice work! Don't forget to unassign yourself when you set an issue to 'Needs review', since people might mistake the assignee for a reviewer :)

I have just one minor suggestion:

+++ b/core/themes/bartik/css/components/help.css
@@ -1,7 +1,10 @@
+ * Bartik specific styling for help region.

Nitpick: this needs 'the' before 'help region' so it reads: 'Bartik specific styling for the help region.'

markot91’s picture

Assigned: markot91 » Unassigned
Status: Needs work » Needs review
StatusFileSize
new484 bytes

Done :)

idebr’s picture

Status: Needs review » Reviewed & tested by the community
StatusFileSize
new189.07 KB

Alright! I added a screenshot after patch to prove nothing broke:

zach.bimson’s picture

Assigned: Unassigned » zach.bimson

Noticed an issue with the commenting standards (new line following the comment), will create a new patch and submit.

zach.bimson’s picture

Status: Reviewed & tested by the community » Needs work
zach.bimson’s picture

Assigned: zach.bimson » Unassigned
Status: Needs work » Needs review
StatusFileSize
new483 bytes
idebr’s picture

Status: Needs review » Needs work

@zach.bimson Per our CSS formatting standards:

Note that a blank line should follow a @file documentation block.

It appears you removed the blank line after the @file documentation block. Can you cite your source for removing this line?

When working with a previous patch, could you include an interdiff for reviewers?

zach.bimson’s picture

https://www.drupal.org/node/1887862#multi-line-comments

Same source as you, no new line appears after the comment

zach.bimson’s picture

Status: Needs work » Needs review
emma.maria’s picture

@idebr

Note that a blank line should follow a @file documentation block.

This means the @file declaration within the comment, not the comment formatting itself.

Here are the blank line standards, there should be no blank line after comments .... https://www.drupal.org/node/1887862#blank-lines

idebr’s picture

@emma.maria Actually that is exactly what it means :). Open a random css file in /core/modules/system/css to check, for example /core/modules/system/css/system.admin.css:

/**
 * @file
 * Styles for administration pages.
 */

/**
 * Reusable layout styles.
 */
.layout-container {
  margin: 0 1.5em;
}

[edit] Line breaks in <code> are broken, nice...

zach.bimson’s picture

StatusFileSize
new434 bytes

Assuming Emma and i misunderstood the documentation, I've provided a new patch in compliance to your suggestions

zach.bimson’s picture

Created this... can someone check itIssue

sarav.din33’s picture

StatusFileSize
new215.78 KB

Patch applied successfully. While we open the /core/themes/bartik/css/components/help.css file comments are applied properly.

as mentioned in #12 css standards applied.

There is no need to check the user interface, eventhough i checked it also attached the screenshot of it.
help page

sarav.din33’s picture

Status: Needs review » Reviewed & tested by the community

Reviewed & tested, please see comment above.

lewisnyman’s picture

@emma.maria Actually that is exactly what it means :). Open a random css file in /core/modules/system/css to check, for example /core/modules/system/css/system.admin.css:

@idebr Thats a bad example, because the comment below the @file comment requires a comment above it. It seems like this is implemented really inconsistently in the CSS files. Looking through the PHP files, it seems like there is always a space below these comments. I guess we should just copy that?

The CSS standards are kind of vague, the @file PHP standards don't seem to mention blank lines... shall we update both of them to be more clear?

lewisnyman’s picture

Status: Reviewed & tested by the community » Needs work
  1. +++ b/core/themes/bartik/css/components/help.css
    @@ -1,5 +1,11 @@
    + * @file
    + * Styles for help pages.
    

    The styling here is actually for the help region, not for the help page. Actually I think we should update the name of this file as well so it matches the name of the class.

  2. +++ b/core/themes/bartik/css/components/help.css
    @@ -1,5 +1,11 @@
    +/**
    + * Help.
    + */
    

    Having two comments here seems a bit redundant, would you mind removing this one?

Ieva Uzule’s picture

Assigned: Unassigned » Ieva Uzule
Issue tags: +SprintWeekend2015, +#drupalcampbrighton

I will be working on this today

Ieva Uzule’s picture

Assigned: Ieva Uzule » Unassigned
Status: Needs work » Needs review
StatusFileSize
new542 bytes
new516 bytes

I have changed the file name and removed the comment as described in #22.
Here are the two patches.

Status: Needs review » Needs work

The last submitted patch, 24: interdiff-17-24.patch, failed testing.

rachel_norfolk’s picture

Status: Needs work » Needs review
StatusFileSize
new516 bytes

Uploading renamed interdiff. I forgot to mention to Ieva they need to be named .txt not .patch.

Bad mentor!

rachel_norfolk’s picture

StatusFileSize
new370 bytes
new770 bytes

I think in #22Lewis was suggesting the comment should read "Styles for the help region." rather than help pages.

Apart from that, the filename was correctly changed etc.

emma.maria’s picture

Regarding #12, #15, #16, #21. I studied the API documenation and updated the CSS documentation to be more clear.

Note that a blank line should follow a file comment.

I will now review this patch while I am here :)

emma.maria’s picture

Status: Needs review » Needs work

Thanks for the patch @Ieva Uzule!

The patch applies and has the correct contents, but you forgot one small thing.
If we rename a CSS file we need to also add the new name within a file that declares which CSS files will be loaded in the front end by Bartik. So the new "region-help.css" is currently being ignored and the file is not being loaded on the site.

You need to create a new patch which includes going to the bartik.libraries.yml file and inside it change help.css to region-help.css

Looking forward to seeing a new patch :)

Ieva Uzule’s picture

Assigned: Unassigned » Ieva Uzule

Thank you @emma.maria. How exciting! I will try and do this today.

rachel_norfolk’s picture

Assigned: Ieva Uzule » Unassigned
Status: Needs work » Needs review
StatusFileSize
new1.3 KB
new558 bytes

Just the tidyup to keep this moving - so close!!

idebr’s picture

Issue summary: View changes
Status: Needs review » Reviewed & tested by the community

Thanks, rachel_norfolk! Patch applies cleanly and updates the CSS file to all Drupal css standards.

I have added a beta evaluation to reflect this issue only changes CSS files.

alexpott’s picture

Status: Reviewed & tested by the community » Fixed

Committed b705771 and pushed to 8.0.x. Thanks!

Thanks for adding the beta evaluation to the issue summary.

  • alexpott committed b705771 on 8.0.x
    Issue #2408581 by rachel_norfolk, zach.bimson, MarkoT91, Ieva Uzule,...

Status: Fixed » Closed (fixed)

Automatically closed - issue fixed for 2 weeks with no activity.