Merge pull request #477 from alphagov/fix-comment-contrast-issue

Ensure comments in code examples are readable

Author: JC-DSIT

CHANGELOG.md

@@ -1,3 +1,7 @@
+## 6.2.1
+
+- [Fix comments in code blocks being hard to read](https://github.com/alphagov/tech-docs-gem/pull/477) 
+
 ## 6.2.0
 
 - Remove support for Ruby 3.2, by updating `required_ruby_version` to  `>= 3.3.0`

example/.ruby-version

@@ -1 +1 @@
-3.2.6
+3.3.11

example/source/code.html.md

@@ -17,6 +17,7 @@ An example of a table with a `code` element within it.
 An example of a code block with a long line length
 
 ```ruby
+# Example comment to check syntax highlighting for comments
 RSpec.describe ContentItem do
   subject { described_class.new(base_path) }
   let(:base_path) { "/search/news-and-communications" }

lib/assets/stylesheets/palette/_syntax-highlighting.scss

@@ -4,9 +4,7 @@
 $code-00: scale-color(govuk-colour("black", $variant: "tint-95"), $lightness:50%); /* Default Background */
 $code-01: #f5f5f5; /* Lighter Background (Unused) */
 $code-02: #bfc1c3; /* Selection Background */
-// we should be using govuk-functional-colour but it outputs a variable, but darken only takes numbers
-// instead, we use the colour returned by govuk-functional-colour(secondary-text)
-$code-03: darken( govuk-colour("black", $variant: "tint-95"), 2%);; /* Comments, Invisibles, Line Highlighting */
+$code-03: govuk-functional-colour(secondary-text); /* Comments, Invisibles, Line Highlighting */
 $code-04: #e8e8e8; /* Dark Foreground (Unused) */
 $code-05: govuk-functional-colour(text); /* Default Foreground, Caret, Delimiters, Operators */
 $code-06: govuk-functional-colour(body-background); /* Light Foreground (Unused) */

lib/govuk_tech_docs/version.rb

@@ -1,3 +1,3 @@
 module GovukTechDocs
-  VERSION = "6.2.0".freeze
+  VERSION = "6.2.1".freeze
 end