diff --git a/packages/common/test/unit.js b/packages/common/test/unit.js index a0a2b501520ccb16e3db7bb2454fdbb9f9d0f8b0..2630c941c90a1d58c621d44d032b099c9b908633 100644 --- a/packages/common/test/unit.js +++ b/packages/common/test/unit.js @@ -38,4 +38,8 @@ describe('utils', () => { assert(utils.getAssetURL("foo/bar") == "foo/bar"); assert(utils.getAssetURL("foo/bar") == "foo/bar"); }) + + it('getThemeCSS', () => { + utils.getThemeCSS(); + }) }); diff --git a/packages/common/utils.js b/packages/common/utils.js index e4bae26b0ed2da185be88fbe795b13de56be76d6..649c2092e1a0174bfe033aea30c3b83e94b6d98c 100644 --- a/packages/common/utils.js +++ b/packages/common/utils.js @@ -1,5 +1,30 @@ +import {css} from 'lit-element'; import env from './env.js'; +export function getThemeCSS() { + return css` + :host { + --vpu-primary-bg-color: var(--vpu-override-primary-bg-color, #007bff); + --vpu-primary-text-color: var(--vpu-override-primary-text-color, #fff); + --vpu-secondary-bg-color: var(--vpu-override-secondary-bg-color, #6c757d); + --vpu-secondary-text-color: var(--vpu-override-secondary-text-color, #fff); + --vpu-info-bg-color: var(--vpu-override-info-bg-color, #17a2b8); + --vpu-info-text-color: var(--vpu-override-info-text-color, #fff); + --vpu-success-bg-color: var(--vpu-override-success-bg-color, #28a745); + --vpu-success-text-color: var(--vpu-override-success-text-color, #fff); + --vpu-warning-bg-color: var(--vpu-override-warning-bg-color, #ffc107); + --vpu-warning-text-color: var(--vpu-override-warning-text-color, #343a40); + --vpu-danger-bg-color: var(--vpu-override-danger-bg-color, #dc3545); + --vpu-danger-text-color: var(--vpu-override-danger-text-color, #fff); + --vpu-light: var(--vpu-override-light, #f8f9fa); + --vpu-dark: var(--vpu-override-dark, #343a40); + --vpu-muted-text: var(--vpu-override-muted-text, #6c757d); + --vpu-border-radius: var(--vpu-override-border-radius, 0px); + --vpu-border-width: var(--vpu-override-border-width, 1px); + } + `; +} + /** * Parses a link header *