Bug 31529

Summary: Fix errors in SCSS files raised by stylelint
Product: Koha Reporter: Owen Leonard <oleonard>
Component: TemplatesAssignee: Owen Leonard <oleonard>
Status: CLOSED FIXED QA Contact: Testopia <testopia>
Severity: enhancement    
Priority: P5 - low CC: david, lucas, testopia
Version: Main   
Hardware: All   
OS: All   
Change sponsored?: --- Patch complexity: Small patch
Documentation contact: Documentation submission:
Text to go in the release notes:
Version(s) released in:
22.11.00
Circulation function:
Bug Depends on: 31528    
Bug Blocks:    
Attachments: Bug 31529: [OPAC] Fix errors in SCSS files raised by stylelint
Bug 31529: [OPAC] Fix errors in SCSS files raised by stylelint
Bug 31529: [OPAC] Fix errors in SCSS files raised by stylelint

Description Owen Leonard 2022-09-07 14:43:26 UTC
With a new SCSS linting configuration in place there are some issues being raised which should be corrected.
Comment 1 Owen Leonard 2022-09-08 13:09:38 UTC
Created attachment 140341 [details] [review]
Bug 31529: [OPAC] Fix errors in SCSS files raised by stylelint

This patch corrects errors raised by the new stylelint configuration in
OPAC SCSS files. Many of the fixes were made automatically by using the
"--fix" option:

npx stylelint koha-tmpl/opac-tmpl/bootstrap/css/src/*.scss --fix

Some examples of errors found:

    - Unexpected empty line before $-variable
    - Expected single space after ":"
    - Expected "#fff" to be "#FFF"
    - Expected modern color-function notation
    - Expected single space after "("
    - Expected single space before ")"
    - Expected empty line before comment
    - Expected no more than 1 empty line
    - Expected a trailing semicolon
    - Expected color.adjust($color, $lightness: -$amount) instead of darken($color, $amount)
    - Unexpected leading zero
    - Expected single space after "," in a single-line function
    - Expected double colon pseudo-element notation

Manual fixes include replacing named colors with hex codes, combining
duplicate selectors, removing empty blocks, etc.

Some warnings remain: "Unexpected !important" and "Expected a
placeholder selector (e.g. %placeholder) to be used in @extend" which
both require more than a quick fix, if we should choose to address them.

To test, apply the patch and rebuild the OPAC SCSS:
https://wiki.koha-community.org/wiki/Working_with_SCSS_in_the_OPAC_and_staff_client

Browse around the OPAC to confirm that there are no visible changes to
style.
Comment 2 David Nind 2022-09-12 19:29:50 UTC
Created attachment 140504 [details] [review]
Bug 31529: [OPAC] Fix errors in SCSS files raised by stylelint

This patch corrects errors raised by the new stylelint configuration in
OPAC SCSS files. Many of the fixes were made automatically by using the
"--fix" option:

npx stylelint koha-tmpl/opac-tmpl/bootstrap/css/src/*.scss --fix

Some examples of errors found:

    - Unexpected empty line before $-variable
    - Expected single space after ":"
    - Expected "#fff" to be "#FFF"
    - Expected modern color-function notation
    - Expected single space after "("
    - Expected single space before ")"
    - Expected empty line before comment
    - Expected no more than 1 empty line
    - Expected a trailing semicolon
    - Expected color.adjust($color, $lightness: -$amount) instead of darken($color, $amount)
    - Unexpected leading zero
    - Expected single space after "," in a single-line function
    - Expected double colon pseudo-element notation

Manual fixes include replacing named colors with hex codes, combining
duplicate selectors, removing empty blocks, etc.

Some warnings remain: "Unexpected !important" and "Expected a
placeholder selector (e.g. %placeholder) to be used in @extend" which
both require more than a quick fix, if we should choose to address them.

To test, apply the patch and rebuild the OPAC SCSS:
https://wiki.koha-community.org/wiki/Working_with_SCSS_in_the_OPAC_and_staff_client

Browse around the OPAC to confirm that there are no visible changes to
style.

Signed-off-by: David Nind <david@davidnind.com>
Comment 3 David Nind 2022-09-12 19:32:43 UTC
Did not notice any specific issues in the OPAC when testing (using Firefox on Ubuntu). Tests included: searching (including advanced), placing a hold, making a suggestion, browsing as an anonymous and logged-in user, adding and removing items from a list and the cart.
Comment 4 Katrin Fischer 2022-10-01 19:49:51 UTC
Created attachment 141184 [details] [review]
Bug 31529: [OPAC] Fix errors in SCSS files raised by stylelint

This patch corrects errors raised by the new stylelint configuration in
OPAC SCSS files. Many of the fixes were made automatically by using the
"--fix" option:

npx stylelint koha-tmpl/opac-tmpl/bootstrap/css/src/*.scss --fix

Some examples of errors found:

    - Unexpected empty line before $-variable
    - Expected single space after ":"
    - Expected "#fff" to be "#FFF"
    - Expected modern color-function notation
    - Expected single space after "("
    - Expected single space before ")"
    - Expected empty line before comment
    - Expected no more than 1 empty line
    - Expected a trailing semicolon
    - Expected color.adjust($color, $lightness: -$amount) instead of darken($color, $amount)
    - Unexpected leading zero
    - Expected single space after "," in a single-line function
    - Expected double colon pseudo-element notation

Manual fixes include replacing named colors with hex codes, combining
duplicate selectors, removing empty blocks, etc.

Some warnings remain: "Unexpected !important" and "Expected a
placeholder selector (e.g. %placeholder) to be used in @extend" which
both require more than a quick fix, if we should choose to address them.

To test, apply the patch and rebuild the OPAC SCSS:
https://wiki.koha-community.org/wiki/Working_with_SCSS_in_the_OPAC_and_staff_client

Browse around the OPAC to confirm that there are no visible changes to
style.

Signed-off-by: David Nind <david@davidnind.com>

Signed-off-by: Katrin Fischer <katrin.fischer.83@web.de>
Comment 5 Tomás Cohen Arazi (tcohen) 2022-10-03 11:32:57 UTC
Pushed to master for 22.11.

Nice work everyone, thanks!