!WIP: Theming

[JohnC-80]

resolve workspace deps:

"@folio/stripes-webpack": "folio-org/stripes-webpack#theming"
"@folio/stripes-components": "folio-org/stripes-components#theming"
"@folio/stripes-core": "folio-org/stripes-core#theming"
"@folio/stripes-cli": "folio-org/stripes-cli#theming"

Make a custom CSS file using some variables...

/* 
* Theme.css 
*/

:root {
  --main-nav-background-color: #900f0f;
  --main-nav-border-bottom-color: #3d0707;
  --primary: rgb(0, 1, 65);
}

Reference it in the stripes config.

module.exports = {
  okapi: { ... },
  modules: {
    '@folio/checkin' : {},
     ...
  },
  branding: {
    ...
  },
  theme: './theme.css' // reference the CSS file...
};

Do things like:

Applies to

https://issues.folio.org/browse/UXPROD-3151

[github-actions]

Jest Unit Test Statistics

0 files  ±0  0 suites  ±0   0s ⏱️ ±0s
0 tests ±0  0 ✔️ ±0  0 💤 ±0  0 ❌ ±0 

Results for commit 749a703. ± Comparison against base commit 6130491.

♻️ This comment has been updated with latest results.

[github-actions]

BigTest Unit Test Statistics

0 files   -   1  0 suites   - 39   0s ⏱️ ±0s
0 tests  - 74  0 ✔️  - 74  0 💤 ±0  0 ❌ ±0 

Results for commit 749a703. ± Comparison against base commit 6130491.

This pull request removes 74 tests.

accepts tenant branding ‑ The stripes-branding-plugin constructor accepts tenant branding
actsAs settings and plugin produces the expected settings and plugin configs and no app config ‑ parseAllModules function module acts as "settings" and "plugin" actsAs settings and plugin produces the expected settings and plugin configs and no app config
applies "ui-" prefix to module keys ‑ The stripes-translations-plugin getModuleName method applies "ui-" prefix to module keys
applies "ui-" prefix to module keys ‑ The stripes-translations-plugin prefixModuleKeys method applies "ui-" prefix to module keys
applies ContextReplacementPlugins when language filters are set ‑ The stripes-translations-plugin apply method applies ContextReplacementPlugins when language filters are set
applies StripesBrandingPlugin ‑ The stripes-webpack-plugin apply method applies StripesBrandingPlugin
applies StripesConfigPlugin ‑ The stripes-webpack-plugin apply method applies StripesConfigPlugin
applies StripesDuplicatesPlugin ‑ The stripes-webpack-plugin apply method applies StripesDuplicatesPlugin
applies StripesErrorLoggingPlugin ‑ The stripes-webpack-plugin apply method applies StripesErrorLoggingPlugin
applies StripesTranslationsPlugin ‑ The stripes-webpack-plugin apply method applies StripesTranslationsPlugin
…

♻️ This comment has been updated with latest results.

[sonarqubecloud]

Quality Gate failed

Failed conditions
C Reliability Rating on New Code (required ≥ A)

See analysis details on SonarCloud

Catch issues before they fail your Quality Gate with our IDE extension SonarLint