Invalid CSS after "--select-arrow: ": expected "}", was "url("data:image..."

jgneff commented 4 years ago

I'm using the popular Water.css styles with Jekyll on GitHub Pages. I instruct Jekyll to use the SASS converter to import the Water.css styles, my own custom styles, and the syntax highlighting styles, and compress all three into one style sheet.

---
---
@import "light";
@import "custom";
@import "rouge-github";

On Ubuntu 16.04 with Jekyll 3.0.1 and jekyll-sass-converter 1.3.0, it works fine.

On Ubuntu 20.04 with Jekyll 3.8.6 and jekyll-sass-converter 1.5.2, it fails with the message:

/usr/lib/ruby/vendor_ruby/jekyll/converters/scss.rb:123:in `rescue in convert': Invalid CSS after " --select-arrow: ": expected "}", was "url("data:image..." on line 38 (Jekyll::Converters::Scss::SyntaxError)

I get the same error with GitHub Pages on GitHub itself, and I get the same error locally when using the github-pages Gem provided on the Jekyll website.

The error occurs at Line 38 of the style sheet, which contains:

--select-arrow: url("data:image/svg+xml;charset=utf-8,%3C?xml version='1.0' encoding='utf-8'?%3E %3Csvg version='1.1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' height='62.5' width='116.9' fill='%23161f27'%3E %3Cpath d='M115.3,1.6 C113.7,0 111.1,0 109.5,1.6 L58.5,52.7 L7.4,1.6 C5.8,0 3.2,0 1.6,1.6 C0,3.2 0,5.8 1.6,7.4 L55.5,61.3 C56.3,62.1 57.3,62.5 58.4,62.5 C59.4,62.5 60.5,62.1 61.3,61.3 L115.2,7.4 C116.9,5.8 116.9,3.2 115.3,1.6Z'/%3E %3C/svg%3E");

The entire light.css file validates with no errors or warnings at the Nu Html Checker (which also validates CSS if you select "Check by text input" and check the "css" box).

I have been unable to install the very latest version 2.1.0 of jekyll-sass-converter and get it to work on my system with Jekyll. In any case, Ubuntu 20.04 and GitHub Pages both use version 1.5.2.

The entire traceback shows:

    26: from /usr/bin/jekyll:13:in `<main>'
    25: from /usr/share/rubygems-integration/all/gems/mercenary-0.3.6/lib/mercenary.rb:19:in `program'
    24: from /usr/share/rubygems-integration/all/gems/mercenary-0.3.6/lib/mercenary/program.rb:42:in `go'
    23: from /usr/share/rubygems-integration/all/gems/mercenary-0.3.6/lib/mercenary/command.rb:220:in `execute'
    22: from /usr/share/rubygems-integration/all/gems/mercenary-0.3.6/lib/mercenary/command.rb:220:in `each'
    21: from /usr/share/rubygems-integration/all/gems/mercenary-0.3.6/lib/mercenary/command.rb:220:in `block in execute'
    20: from /usr/lib/ruby/vendor_ruby/jekyll/commands/serve.rb:75:in `block (2 levels) in init_with_program'
    19: from /usr/lib/ruby/vendor_ruby/jekyll/commands/serve.rb:93:in `start'
    18: from /usr/lib/ruby/vendor_ruby/jekyll/commands/serve.rb:93:in `each'
    17: from /usr/lib/ruby/vendor_ruby/jekyll/commands/serve.rb:93:in `block in start'
    16: from /usr/lib/ruby/vendor_ruby/jekyll/commands/build.rb:36:in `process'
    15: from /usr/lib/ruby/vendor_ruby/jekyll/commands/build.rb:65:in `build'
    14: from /usr/lib/ruby/vendor_ruby/jekyll/command.rb:28:in `process_site'
    13: from /usr/lib/ruby/vendor_ruby/jekyll/site.rb:71:in `process'
    12: from /usr/lib/ruby/vendor_ruby/jekyll/site.rb:192:in `render'
    11: from /usr/lib/ruby/vendor_ruby/jekyll/site.rb:471:in `render_pages'
    10: from /usr/lib/ruby/vendor_ruby/jekyll/site.rb:471:in `each'
     9: from /usr/lib/ruby/vendor_ruby/jekyll/site.rb:472:in `block in render_pages'
     8: from /usr/lib/ruby/vendor_ruby/jekyll/site.rb:479:in `render_regenerated'
     7: from /usr/lib/ruby/vendor_ruby/jekyll/renderer.rb:62:in `run'
     6: from /usr/lib/ruby/vendor_ruby/jekyll/renderer.rb:83:in `render_document'
     5: from /usr/lib/ruby/vendor_ruby/jekyll/renderer.rb:99:in `convert'
     4: from /usr/lib/ruby/vendor_ruby/jekyll/renderer.rb:99:in `reduce'
     3: from /usr/lib/ruby/vendor_ruby/jekyll/renderer.rb:99:in `each'
     2: from /usr/lib/ruby/vendor_ruby/jekyll/renderer.rb:101:in `block in convert'
     1: from /usr/lib/ruby/vendor_ruby/jekyll/converters/scss.rb:118:in `convert'
/usr/lib/ruby/vendor_ruby/jekyll/converters/scss.rb:123:in `rescue in convert': Invalid CSS after "  --select-arrow: ": expected "}", was "url("data:image..." on line 38 (Jekyll::Converters::Scss::SyntaxError)

jekyllbot commented 4 years ago

This issue has been automatically marked as stale because it has not been commented on for at least two months.

The resources of the Jekyll team are limited, and so we are asking for your help.

If this is a bug and you can still reproduce this error on the master branch, please reply with all of the information you have about it in order to keep the issue open.

If this is a feature request, please consider whether it can be accomplished in another way. If it cannot, please elaborate on why it is core to this project and why you feel more than 80% of users would find this beneficial.

This issue will automatically be closed in two months if no further activity occurs. Thank you for all your contributions.

jgneff commented 4 years ago

I am unable to reproduce the problem using Jekyll 4.1.1 and the latest jekyll-sass-converter 2.1.0.

jekyll / jekyll-sass-converter

Invalid CSS after "--select-arrow: ": expected "}", was "url("data:image..." #109