Fix link hover colors and change color theme CSS files order

[RickR2H]

Pull Request for Issue #42679

Summary of Changes

In the current Cassiopeiatemplate the link hover colors don't work anymore. Also in the Bootstrap overrides of the custom properties in the theme color CSS of Cassiopeia files are ignored due to the loading order of the CSS files. See screenshot below: Also added the --link-hover-color property in line with the --link-color

Testing Instructions

Checkout this PR and run in console: npm run build:css to build the CSS

Actual result BEFORE applying this Pull Request

Links hover colors don't work and Bootstrap custom properties overrides in the colors_standard.css and colors_alternative.css are rejected

Expected result AFTER applying this Pull Request

Links hover colors work and Bootstrap custom properties overrides in the colors_standard.css and colors_alternative.css are accepted.

Link to documentations

Please select:

• [ ] Documentation link for docs.joomla.org:

• [x] No documentation changes for docs.joomla.org needed

• [ ] Pull Request link for manual.joomla.org:

• [x] No documentation changes for manual.joomla.org needed

[sergejsteinz]

I have tested this item ✅ successfully

---

_{This comment was created with the J!Tracker Application at issues.joomla.org/tracker/joomla-cms/42794.}

[hans2103]

Question... at global.scss you can clearly see that a prefix can be set

When a prefix is set both link-color and link-hover-color will not work

The prefix is missing in de declaration of both link-color and link-hover-color. They should be written as:

  --#{prefix}link-color: #{$alternative-color-link};
  --#{prefix}link-color-rgb: #{to-rgb($alternative-color-link)};
  --cassiopeia-color-hover: #{$alternative-color-hover};
  --#{prefix}link-hover-color: #{$alternative-color-hover};
  --#{prefix}link-hover-color-rgb: #{to-rgb($alternative-color-hover)};

[RickR2H]

@hans2103 I do get it that to be fully Bootstrap compliant its better to use the prefixes. At the moment most of the custom properties in the Cassiopeia don't have prefixes. Adding prefixes to only the theme CSS files will break the template. Better address this in a separate PR.

[hans2103]

I have tested this item :white_check_mark: successfully on e0344a0e9f6ae6dfe6cab21e3a924b208ff23a86

---

_{This comment was created with the J!Tracker Application at issues.joomla.org/tracker/joomla-cms/42794.}

[Quy]

RTC

---

_{This comment was created with the J!Tracker Application at issues.joomla.org/tracker/joomla-cms/42794.}

[MacJoom]

Thank you!