Bug 31529 - Fix errors in SCSS files raised by stylelint
Summary: Fix errors in SCSS files raised by stylelint
Status: CLOSED FIXED
Alias: None
Product: Koha
Classification: Unclassified
Component: Templates (show other bugs)
Version: Main
Hardware: All All
: P5 - low enhancement (vote)
Assignee: Owen Leonard
QA Contact: Testopia
URL:
Keywords:
Depends on: 31528
Blocks:
  Show dependency treegraph
 
Reported: 2022-09-07 14:43 UTC by Owen Leonard
Modified: 2023-12-28 20:43 UTC (History)
3 users (show)

See Also:
Change sponsored?: ---
Patch complexity: Small patch
Documentation contact:
Documentation submission:
Text to go in the release notes:
Version(s) released in:
22.11.00


Attachments
Bug 31529: [OPAC] Fix errors in SCSS files raised by stylelint (86.30 KB, patch)
2022-09-08 13:09 UTC, Owen Leonard
Details | Diff | Splinter Review
Bug 31529: [OPAC] Fix errors in SCSS files raised by stylelint (86.35 KB, patch)
2022-09-12 19:29 UTC, David Nind
Details | Diff | Splinter Review
Bug 31529: [OPAC] Fix errors in SCSS files raised by stylelint (86.41 KB, patch)
2022-10-01 19:49 UTC, Katrin Fischer
Details | Diff | Splinter Review

Note You need to log in before you can comment on or make changes to this bug.
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 2022-10-03 11:32:57 UTC
Pushed to master for 22.11.

Nice work everyone, thanks!