From 4b4808e0ef496b9e885ba7ba239b23c0042d1a4c Mon Sep 17 00:00:00 2001 From: Alex Andreev Date: Mon, 9 Nov 2020 13:45:54 +0300 Subject: [PATCH] Fixing urls Signed-off-by: Alex Andreev --- docs/extensions/capabilities/styling.md | 6 +++--- mkdocs.yml | 1 + 2 files changed, 4 insertions(+), 3 deletions(-) diff --git a/docs/extensions/capabilities/styling.md b/docs/extensions/capabilities/styling.md index 123f487de4..c95673540c 100644 --- a/docs/extensions/capabilities/styling.md +++ b/docs/extensions/capabilities/styling.md @@ -1,4 +1,4 @@ -# Styling +# Styling an extension Lens provides a set of global styles and UI components that can be used by any extension to preserve look and feel of the application. ## Styling approach @@ -24,7 +24,7 @@ Lens using 2 built-in themes located in `src/renderer/themes` folder each for li ![Color Theme](images/theme-selector.png) When Lens gets loaded it transforms selected theme `json` file into list of [CSS Custom Properties (CSS Variables)](https://developer.mozilla.org/en-US/docs/Web/CSS/Using_CSS_custom_properties) which then gets injected into `:root` element so any of the down-level components can use them. -![CSS vars listed in devtools](images/theme-selector.png) +![CSS vars listed in devtools](images/css-vars-in-devtools.png) When user changes a theme, the process is repeated, new css variables appear instead of previous ones. @@ -86,7 +86,7 @@ After theme file gets parsed it provides list of theme-defined colors. Most of t They can be used in form of `var(--magenta)`. -A complete list of all themable colors can be found in the [color reference](color-reference). +A complete list of all themable colors can be found in the [color reference](../color-reference). Colors values are located inside `src/renderer/themes/lens-dark.json` and `src/renderer/themes/lens-light.json` files. diff --git a/mkdocs.yml b/mkdocs.yml index 86bb5f80a4..c6c4f50206 100644 --- a/mkdocs.yml +++ b/mkdocs.yml @@ -27,6 +27,7 @@ nav: - Overview: extensions/capabilities/README.md - Common Capabilities: extensions/capabilities/common-capabilities.md - Styling: extensions/capabilities/styling.md + - Color reference: extensions/capabilities/color-reference.md - Extension Guides: - Overview: extensions/guides/README.md - Renderer Extension: extensions/guides/renderer-extension.md