mirror of
https://github.com/lensapp/lens.git
synced 2025-05-20 05:10:56 +00:00
Deployed d7febf5e to latest with MkDocs 1.1.2 and mike 0.5.5
This commit is contained in:
1 parent
8aaa43983f
commit
8ceeda66f0
190 files changed
+3380
-3380
No files matched your search
@@ -997,145 +997,145 @@
|
||||
|
||||
|
||||
<h1 id="theme-color-reference">Theme color reference<a class="headerlink" href="#theme-color-reference" title="Permanent link">#</a></h1>
|
||||
<p>You can use CSS variables generated from theme <code>.json</code> files to style an extension with respect of active theme.</p>
|
||||
<p>You can use theme-based CSS Variables to style an extension according to the active theme.</p>
|
||||
<h2 id="base-colors">Base colors<a class="headerlink" href="#base-colors" title="Permanent link">#</a></h2>
|
||||
<ul>
|
||||
<li><code>blue</code>: blue color.</li>
|
||||
<li><code>magenta</code>: magenta color.</li>
|
||||
<li><code>golden</code>: gold/yellow color.</li>
|
||||
<li><code>halfGray</code>: gray with some apacity applied.</li>
|
||||
<li><code>primary</code>: Lens brand (blue) color.</li>
|
||||
<li><code>colorSuccess</code>: successfull operations color.</li>
|
||||
<li><code>colorOk</code>: successfull operations (bright version) color.</li>
|
||||
<li><code>colorInfo</code>: informational, in-progress color.</li>
|
||||
<li><code>colorError</code>: critical error color.</li>
|
||||
<li><code>colorSoftError</code>: error color.</li>
|
||||
<li><code>colorWarning</code>: warning color.</li>
|
||||
<li><code>colorVague</code>: soft gray color for notices, hints etc.</li>
|
||||
<li><code>colorTerminated</code>: terminated, closed, stale color.</li>
|
||||
<li><code>boxShadow</code>: semi-transparent box-shadow color.</li>
|
||||
<li><code>--blue</code>: blue color.</li>
|
||||
<li><code>--magenta</code>: magenta color.</li>
|
||||
<li><code>--golden</code>: gold/yellow color.</li>
|
||||
<li><code>--halfGray</code>: gray with some apacity applied.</li>
|
||||
<li><code>--primary</code>: Lens brand (blue) color.</li>
|
||||
<li><code>--colorSuccess</code>: successfull operations color.</li>
|
||||
<li><code>--colorOk</code>: successfull operations (bright version) color.</li>
|
||||
<li><code>--colorInfo</code>: informational, in-progress color.</li>
|
||||
<li><code>--colorError</code>: critical error color.</li>
|
||||
<li><code>--colorSoftError</code>: error color.</li>
|
||||
<li><code>--colorWarning</code>: warning color.</li>
|
||||
<li><code>--colorVague</code>: soft gray color for notices, hints etc.</li>
|
||||
<li><code>--colorTerminated</code>: terminated, closed, stale color.</li>
|
||||
<li><code>--boxShadow</code>: semi-transparent box-shadow color.</li>
|
||||
</ul>
|
||||
<h2 id="text-colors">Text colors<a class="headerlink" href="#text-colors" title="Permanent link">#</a></h2>
|
||||
<ul>
|
||||
<li><code>textColorPrimary</code>: foreground text color.</li>
|
||||
<li><code>textColorSecondary</code>: foreground text color for different paragraps, parts of text.</li>
|
||||
<li><code>textColorAccent</code>: foreground text color to highlight its parts.</li>
|
||||
<li><code>--textColorPrimary</code>: foreground text color.</li>
|
||||
<li><code>--textColorSecondary</code>: foreground text color for different paragraps, parts of text.</li>
|
||||
<li><code>--textColorAccent</code>: foreground text color to highlight its parts.</li>
|
||||
</ul>
|
||||
<h2 id="border-colors">Border colors<a class="headerlink" href="#border-colors" title="Permanent link">#</a></h2>
|
||||
<ul>
|
||||
<li><code>borderColor</code>: border color.</li>
|
||||
<li><code>borderFaintColor</code>: fainted (lighter or darker, which depends on the theme) border color.</li>
|
||||
<li><code>--borderColor</code>: border color.</li>
|
||||
<li><code>--borderFaintColor</code>: fainted (lighter or darker, which depends on the theme) border color.</li>
|
||||
</ul>
|
||||
<h2 id="layout-colors">Layout colors<a class="headerlink" href="#layout-colors" title="Permanent link">#</a></h2>
|
||||
<ul>
|
||||
<li><code>mainBackground</code>: main background color for the app.</li>
|
||||
<li><code>contentColor</code>: background color for panels contains some data.</li>
|
||||
<li><code>layoutBackground</code>: background color for layout parts.</li>
|
||||
<li><code>layoutTabsBackground</code>: background color for general tabs.</li>
|
||||
<li><code>layoutTabsActiveColor</code>: foreground color for general tabs.</li>
|
||||
<li><code>layoutTabsLineColor</code>: background color for lines under general tabs.</li>
|
||||
<li><code>--mainBackground</code>: main background color for the app.</li>
|
||||
<li><code>--contentColor</code>: background color for panels contains some data.</li>
|
||||
<li><code>--layoutBackground</code>: background color for layout parts.</li>
|
||||
<li><code>--layoutTabsBackground</code>: background color for general tabs.</li>
|
||||
<li><code>--layoutTabsActiveColor</code>: foreground color for general tabs.</li>
|
||||
<li><code>--layoutTabsLineColor</code>: background color for lines under general tabs.</li>
|
||||
</ul>
|
||||
<h2 id="sidebar-colors">Sidebar colors<a class="headerlink" href="#sidebar-colors" title="Permanent link">#</a></h2>
|
||||
<ul>
|
||||
<li><code>sidebarLogoBackground</code>: background color behind logo in sidebar.</li>
|
||||
<li><code>sidebarActiveColor</code>: foreground color for active menu items in sidebar.</li>
|
||||
<li><code>sidebarSubmenuActiveColor</code>: foreground color for active submenu items in sidebar.</li>
|
||||
<li><code>sidebarBackground</code>: background color for sidebar.</li>
|
||||
<li><code>--sidebarLogoBackground</code>: background color behind logo in sidebar.</li>
|
||||
<li><code>--sidebarActiveColor</code>: foreground color for active menu items in sidebar.</li>
|
||||
<li><code>--sidebarSubmenuActiveColor</code>: foreground color for active submenu items in sidebar.</li>
|
||||
<li><code>--sidebarBackground</code>: background color for sidebar.</li>
|
||||
</ul>
|
||||
<h2 id="button-colors">Button colors<a class="headerlink" href="#button-colors" title="Permanent link">#</a></h2>
|
||||
<ul>
|
||||
<li><code>buttonPrimaryBackground</code>: button background color for primary actions.</li>
|
||||
<li><code>buttonDefaultBackground</code>: default button background color.</li>
|
||||
<li><code>buttonAccentBackground</code>: accent button background color.</li>
|
||||
<li><code>buttonDisabledBackground</code>: disabled button background color.</li>
|
||||
<li><code>--buttonPrimaryBackground</code>: button background color for primary actions.</li>
|
||||
<li><code>--buttonDefaultBackground</code>: default button background color.</li>
|
||||
<li><code>--buttonAccentBackground</code>: accent button background color.</li>
|
||||
<li><code>--buttonDisabledBackground</code>: disabled button background color.</li>
|
||||
</ul>
|
||||
<h2 id="table-colors">Table colors<a class="headerlink" href="#table-colors" title="Permanent link">#</a></h2>
|
||||
<ul>
|
||||
<li><code>tableBgcStripe</code>: background color for odd rows in table.</li>
|
||||
<li><code>tableBgcSelected</code>: background color for selected row in table.</li>
|
||||
<li><code>tableHeaderBackground</code>: background color for table header.</li>
|
||||
<li><code>tableHeaderBorderWidth</code>: border width under table header.</li>
|
||||
<li><code>tableHeaderBorderColor</code>: border color for line under table header.</li>
|
||||
<li><code>tableHeaderColor</code>: foreground color for table header.</li>
|
||||
<li><code>tableSelectedRowColor</code>: foreground color for selected row in table.</li>
|
||||
<li><code>--tableBgcStripe</code>: background color for odd rows in table.</li>
|
||||
<li><code>--tableBgcSelected</code>: background color for selected row in table.</li>
|
||||
<li><code>--tableHeaderBackground</code>: background color for table header.</li>
|
||||
<li><code>--tableHeaderBorderWidth</code>: border width under table header.</li>
|
||||
<li><code>--tableHeaderBorderColor</code>: border color for line under table header.</li>
|
||||
<li><code>--tableHeaderColor</code>: foreground color for table header.</li>
|
||||
<li><code>--tableSelectedRowColor</code>: foreground color for selected row in table.</li>
|
||||
</ul>
|
||||
<h2 id="dock-colors">Dock colors<a class="headerlink" href="#dock-colors" title="Permanent link">#</a></h2>
|
||||
<ul>
|
||||
<li><code>dockHeadBackground</code>: background color for dock's header.</li>
|
||||
<li><code>dockInfoBackground</code>: background color for dock's info panel.</li>
|
||||
<li><code>dockInfoBorderColor</code>: border color for dock's info panel.</li>
|
||||
<li><code>--dockHeadBackground</code>: background color for dock's header.</li>
|
||||
<li><code>--dockInfoBackground</code>: background color for dock's info panel.</li>
|
||||
<li><code>--dockInfoBorderColor</code>: border color for dock's info panel.</li>
|
||||
</ul>
|
||||
<h2 id="helm-chart-colors">Helm chart colors<a class="headerlink" href="#helm-chart-colors" title="Permanent link">#</a></h2>
|
||||
<ul>
|
||||
<li><code>helmLogoBackground</code>: background color for chart logo.</li>
|
||||
<li><code>helmImgBackground</code>: background color for chart image.</li>
|
||||
<li><code>helmStableRepo</code>: background color for stable repo.</li>
|
||||
<li><code>helmIncubatorRepo</code>: background color for incubator repo.</li>
|
||||
<li><code>helmDescriptionHr</code>: Helm chart description separator line color.</li>
|
||||
<li><code>helmDescriptionBlockqouteColor</code>: Helm chart description blockquote color.</li>
|
||||
<li><code>helmDescriptionBlockqouteBorder</code>: Helm chart description blockquote border color.</li>
|
||||
<li><code>helmDescriptionBlockquoteBackground</code>: Helm chart description blockquote background color.</li>
|
||||
<li><code>helmDescriptionHeaders</code>: Helm chart description headers color.</li>
|
||||
<li><code>helmDescriptionH6</code>: Helm chart description header foreground color.</li>
|
||||
<li><code>helmDescriptionTdBorder</code>: Helm chart description table cell border color.</li>
|
||||
<li><code>helmDescriptionTrBackground</code>: Helm chart description table row background color.</li>
|
||||
<li><code>helmDescriptionCodeBackground</code>: Helm chart description code background color.</li>
|
||||
<li><code>helmDescriptionPreBackground</code>: Helm chart description pre background color.</li>
|
||||
<li><code>helmDescriptionPreColor</code>: Helm chart description pre foreground color.</li>
|
||||
<li><code>--helmLogoBackground</code>: background color for chart logo.</li>
|
||||
<li><code>--helmImgBackground</code>: background color for chart image.</li>
|
||||
<li><code>--helmStableRepo</code>: background color for stable repo.</li>
|
||||
<li><code>--helmIncubatorRepo</code>: background color for incubator repo.</li>
|
||||
<li><code>--helmDescriptionHr</code>: Helm chart description separator line color.</li>
|
||||
<li><code>--helmDescriptionBlockqouteColor</code>: Helm chart description blockquote color.</li>
|
||||
<li><code>--helmDescriptionBlockqouteBorder</code>: Helm chart description blockquote border color.</li>
|
||||
<li><code>--helmDescriptionBlockquoteBackground</code>: Helm chart description blockquote background color.</li>
|
||||
<li><code>--helmDescriptionHeaders</code>: Helm chart description headers color.</li>
|
||||
<li><code>--helmDescriptionH6</code>: Helm chart description header foreground color.</li>
|
||||
<li><code>--helmDescriptionTdBorder</code>: Helm chart description table cell border color.</li>
|
||||
<li><code>--helmDescriptionTrBackground</code>: Helm chart description table row background color.</li>
|
||||
<li><code>--helmDescriptionCodeBackground</code>: Helm chart description code background color.</li>
|
||||
<li><code>--helmDescriptionPreBackground</code>: Helm chart description pre background color.</li>
|
||||
<li><code>--helmDescriptionPreColor</code>: Helm chart description pre foreground color.</li>
|
||||
</ul>
|
||||
<h2 id="terminal-colors">Terminal colors<a class="headerlink" href="#terminal-colors" title="Permanent link">#</a></h2>
|
||||
<ul>
|
||||
<li><code>terminalBackground</code>: Terminal background color.</li>
|
||||
<li><code>terminalForeground</code>: Terminal foreground color.</li>
|
||||
<li><code>terminalCursor</code>: Terminal cursor color.</li>
|
||||
<li><code>terminalCursorAccent</code>: Terminal cursor accent color.</li>
|
||||
<li><code>terminalSelection</code>: Terminal selection background color.</li>
|
||||
<li><code>terminalBlack</code>: Terminal black color.</li>
|
||||
<li><code>terminalRed</code>: Terminal red color.</li>
|
||||
<li><code>terminalGreen</code>: Terminal green color.</li>
|
||||
<li><code>terminalYellow</code>: Terminal yellow color.</li>
|
||||
<li><code>terminalBlue</code>: Terminal blue color.</li>
|
||||
<li><code>terminalMagenta</code>: Terminal magenta color.</li>
|
||||
<li><code>terminalCyan</code>: Terminal cyan color.</li>
|
||||
<li><code>terminalWhite</code>: Terminal white color.</li>
|
||||
<li><code>terminalBrightBlack</code>: Terminal bright black color.</li>
|
||||
<li><code>terminalBrightRed</code>: Terminal bright red color.</li>
|
||||
<li><code>terminalBrightGreen</code>: Terminal bright green color.</li>
|
||||
<li><code>terminalBrightYellow</code>: Terminal bright yellow color.</li>
|
||||
<li><code>terminalBrightBlue</code>: Terminal bright blue color.</li>
|
||||
<li><code>terminalBrightMagenta</code>: Terminal bright magenta color.</li>
|
||||
<li><code>terminalBrightCyan</code>: Terminal bright cyan color.</li>
|
||||
<li><code>terminalBrightWhite</code>: Terminal bright white color.</li>
|
||||
<li><code>--terminalBackground</code>: Terminal background color.</li>
|
||||
<li><code>--terminalForeground</code>: Terminal foreground color.</li>
|
||||
<li><code>--terminalCursor</code>: Terminal cursor color.</li>
|
||||
<li><code>--terminalCursorAccent</code>: Terminal cursor accent color.</li>
|
||||
<li><code>--terminalSelection</code>: Terminal selection background color.</li>
|
||||
<li><code>--terminalBlack</code>: Terminal black color.</li>
|
||||
<li><code>--terminalRed</code>: Terminal red color.</li>
|
||||
<li><code>--terminalGreen</code>: Terminal green color.</li>
|
||||
<li><code>--terminalYellow</code>: Terminal yellow color.</li>
|
||||
<li><code>--terminalBlue</code>: Terminal blue color.</li>
|
||||
<li><code>--terminalMagenta</code>: Terminal magenta color.</li>
|
||||
<li><code>--terminalCyan</code>: Terminal cyan color.</li>
|
||||
<li><code>--terminalWhite</code>: Terminal white color.</li>
|
||||
<li><code>--terminalBrightBlack</code>: Terminal bright black color.</li>
|
||||
<li><code>--terminalBrightRed</code>: Terminal bright red color.</li>
|
||||
<li><code>--terminalBrightGreen</code>: Terminal bright green color.</li>
|
||||
<li><code>--terminalBrightYellow</code>: Terminal bright yellow color.</li>
|
||||
<li><code>--terminalBrightBlue</code>: Terminal bright blue color.</li>
|
||||
<li><code>--terminalBrightMagenta</code>: Terminal bright magenta color.</li>
|
||||
<li><code>--terminalBrightCyan</code>: Terminal bright cyan color.</li>
|
||||
<li><code>--terminalBrightWhite</code>: Terminal bright white color.</li>
|
||||
</ul>
|
||||
<h2 id="dialog-colors">Dialog colors<a class="headerlink" href="#dialog-colors" title="Permanent link">#</a></h2>
|
||||
<ul>
|
||||
<li><code>dialogHeaderBackground</code>: background color for dialog header.</li>
|
||||
<li><code>dialogFooterBackground</code>: background color for dialog footer.</li>
|
||||
<li><code>--dialogHeaderBackground</code>: background color for dialog header.</li>
|
||||
<li><code>--dialogFooterBackground</code>: background color for dialog footer.</li>
|
||||
</ul>
|
||||
<h2 id="detail-panel-drawer-colors">Detail panel (Drawer) colors<a class="headerlink" href="#detail-panel-drawer-colors" title="Permanent link">#</a></h2>
|
||||
<ul>
|
||||
<li><code>drawerTitleText</code>: drawer title foreground color.</li>
|
||||
<li><code>drawerSubtitleBackground</code>: drawer subtitle foreground color.</li>
|
||||
<li><code>drawerItemNameColor</code>: foreground color for item name in drawer.</li>
|
||||
<li><code>drawerItemValueColor</code>: foreground color for item value in drawer.</li>
|
||||
<li><code>--drawerTitleText</code>: drawer title foreground color.</li>
|
||||
<li><code>--drawerSubtitleBackground</code>: drawer subtitle foreground color.</li>
|
||||
<li><code>--drawerItemNameColor</code>: foreground color for item name in drawer.</li>
|
||||
<li><code>--drawerItemValueColor</code>: foreground color for item value in drawer.</li>
|
||||
</ul>
|
||||
<h2 id="misc-colors">Misc colors<a class="headerlink" href="#misc-colors" title="Permanent link">#</a></h2>
|
||||
<ul>
|
||||
<li><code>logsBackground</code>: background color for pod logs.</li>
|
||||
<li><code>clusterMenuBackground</code>: background color for cluster menu.</li>
|
||||
<li><code>clusterMenuBorderColor</code>: border color for cluster menu.</li>
|
||||
<li><code>clusterSettingsBackground</code>: background color for cluster settings.</li>
|
||||
<li><code>addClusterIconColor</code>: add cluster button background color.</li>
|
||||
<li><code>iconActiveColor</code>: active cluster icon foreground color.</li>
|
||||
<li><code>iconActiveBackground</code>: active cluster icon background color.</li>
|
||||
<li><code>filterAreaBackground</code>: page filter area (where selected namespaces are lister) background color.</li>
|
||||
<li><code>chartStripesColor</code>: bar chart zebra stripes background color.</li>
|
||||
<li><code>chartCapacityColor</code>: background color for capacity values in bar charts.</li>
|
||||
<li><code>pieChartDefaultColor</code>: default background color for pie chart values.</li>
|
||||
<li><code>selectOptionHoveredColor</code>: foregrond color for selected element in dropdown list.</li>
|
||||
<li><code>lineProgressBackground</code>: background color for progress line.</li>
|
||||
<li><code>radioActiveBackground</code>: background color for active radio buttons.</li>
|
||||
<li><code>menuActiveBackground</code>: background color for active menu items.</li>
|
||||
<li><code>--logsBackground</code>: background color for pod logs.</li>
|
||||
<li><code>--clusterMenuBackground</code>: background color for cluster menu.</li>
|
||||
<li><code>--clusterMenuBorderColor</code>: border color for cluster menu.</li>
|
||||
<li><code>--clusterSettingsBackground</code>: background color for cluster settings.</li>
|
||||
<li><code>--addClusterIconColor</code>: add cluster button background color.</li>
|
||||
<li><code>--iconActiveColor</code>: active cluster icon foreground color.</li>
|
||||
<li><code>--iconActiveBackground</code>: active cluster icon background color.</li>
|
||||
<li><code>--filterAreaBackground</code>: page filter area (where selected namespaces are lister) background color.</li>
|
||||
<li><code>--chartStripesColor</code>: bar chart zebra stripes background color.</li>
|
||||
<li><code>--chartCapacityColor</code>: background color for capacity values in bar charts.</li>
|
||||
<li><code>--pieChartDefaultColor</code>: default background color for pie chart values.</li>
|
||||
<li><code>--selectOptionHoveredColor</code>: foregrond color for selected element in dropdown list.</li>
|
||||
<li><code>--lineProgressBackground</code>: background color for progress line.</li>
|
||||
<li><code>--radioActiveBackground</code>: background color for active radio buttons.</li>
|
||||
<li><code>--menuActiveBackground</code>: background color for active menu items.</li>
|
||||
</ul>
|
||||
<p>In most cases you would only need base, text and some of the layout colors.</p>
|
||||
|
||||
|
||||
Reference in new issue
Block a user