diff --git a/src/renderer/components/+preferences/preferences.scss b/src/renderer/components/+preferences/preferences.scss index 5c02312432..ad611004a5 100644 --- a/src/renderer/components/+preferences/preferences.scss +++ b/src/renderer/components/+preferences/preferences.scss @@ -1,2 +1,9 @@ .Preferences { + > .contentRegion { + > .content { + max-width: 740px; + min-width: 460px; + width: 100%; + } + } } \ No newline at end of file diff --git a/src/renderer/components/+preferences/preferences.tsx b/src/renderer/components/+preferences/preferences.tsx index 3eb98cc4d7..f55cda2afe 100644 --- a/src/renderer/components/+preferences/preferences.tsx +++ b/src/renderer/components/+preferences/preferences.tsx @@ -17,6 +17,7 @@ import { KubectlBinaries } from "./kubectl-binaries"; import { navigation } from "../../navigation"; import { Tab, Tabs } from "../tabs"; import { FormSwitch, Switcher } from "../switch"; +import { Box } from "@material-ui/core"; enum Pages { Application = "application", @@ -186,11 +187,11 @@ export class Preferences extends React.Component { } label="Allow untrusted Certificate Authorities" /> - + This will make Lens to trust ANY certificate authority without any validations.{" "} Needed with some corporate proxies that do certificate re-writing.{" "} Does not affect cluster communications! - + )} diff --git a/src/renderer/components/button/button.scss b/src/renderer/components/button/button.scss index a874970d0b..7f60dfbcd9 100644 --- a/src/renderer/components/button/button.scss +++ b/src/renderer/components/button/button.scss @@ -4,7 +4,6 @@ overflow: hidden; // required for transition effect on hover color: white; font-family: var(--font-main); - font-weight: var(--font-weight-bold); text-align: center; text-decoration: none; cursor: pointer; diff --git a/src/renderer/components/input/input.scss b/src/renderer/components/input/input.scss index 90577922eb..ef9b8ee4e8 100644 --- a/src/renderer/components/input/input.scss +++ b/src/renderer/components/input/input.scss @@ -100,6 +100,7 @@ border: 1px solid var(--inputControlBorder); border-radius: 4px; padding: $padding; + color: var(--textColorTertiary); &:hover { border-color: var(--inputControlHoverBorder); diff --git a/src/renderer/components/layout/page-layout.scss b/src/renderer/components/layout/page-layout.scss index a2a2ea1080..2c79c48f95 100644 --- a/src/renderer/components/layout/page-layout.scss +++ b/src/renderer/components/layout/page-layout.scss @@ -7,6 +7,7 @@ width: 100%; height: 100%; display: grid !important; + color: var(--settingsColor); @include media("<1000px") { --width: 85%; @@ -40,7 +41,7 @@ .sidebar { width: 218px; - padding: 60px 10px 60px 20px; + padding: 60px 0 60px 20px; .Tabs { .header { @@ -62,18 +63,18 @@ white-space: nowrap; text-overflow: ellipsis; overflow: hidden; - font-weight: 500; font-size: 15px; line-height: 20px; cursor: pointer; - color: var(--textColorSecondary); + border-top-right-radius: 0; + border-bottom-right-radius: 0; &::after { content: none; } &:hover { - background-color: var(--navHoverBackground); + background-color: var(--navSelectedBackground); color: var(--navHoverColor); } @@ -194,5 +195,9 @@ display: none; } } + + .Checkbox .label { + color: var(--textColorTertiary); + } } } diff --git a/src/renderer/components/select/select.scss b/src/renderer/components/select/select.scss index d0e13c1dc5..8a782078fe 100644 --- a/src/renderer/components/select/select.scss +++ b/src/renderer/components/select/select.scss @@ -208,6 +208,10 @@ html { background: var(--inputControlBackground); } + &__single-value { + color: var(--textColorTertiary); + } + &__menu { &-list { padding: 6px; diff --git a/src/renderer/themes/lens-dark.json b/src/renderer/themes/lens-dark.json index 14de361c95..0082f9ce63 100644 --- a/src/renderer/themes/lens-dark.json +++ b/src/renderer/themes/lens-dark.json @@ -11,12 +11,13 @@ "primary": "#3d90ce", "textColorPrimary": "#8e9297", "textColorSecondary": "#a0a0a0", + "textColorTertiary": "#909ba6", "textColorAccent": "#ffffff", "textColorDimmed": "#8e92978c", "borderColor": "#4c5053", "borderFaintColor": "#373a3e", "mainBackground": "#1e2124", - "secondaryBackground": "#212427", + "secondaryBackground": "#1e2125", "contentColor": "#262b2f", "layoutBackground": "#2e3136", "layoutTabsBackground": "#252729", @@ -115,17 +116,17 @@ "chartCapacityColor": "#4c545f", "pieChartDefaultColor": "#30353a", "inputOptionHoverColor": "#87909c", - "inputControlBackground": "#00000021", - "inputControlBorder": "#202225bf", - "inputControlHoverBorder": "#07080880", + "inputControlBackground": "#1e2125", + "inputControlBorder": "#414448", + "inputControlHoverBorder": "#474a4f", "lineProgressBackground": "#414448", "radioActiveBackground": "#36393e", "menuActiveBackground": "#36393e", "menuSelectedOptionBgc": "#36393e", "scrollBarColor": "#5f6064", - "settingsBackground": "#2b3035", - "navSelectedBackground": "#4f545c52", - "navHoverBackground": "#4f545c29", + "settingsBackground": "#262b2e", + "settingsColor": "#909ba6", + "navSelectedBackground": "#262b2e", "navHoverColor": "#dcddde", "hrColor": "#ffffff0f" } diff --git a/src/renderer/themes/lens-light.json b/src/renderer/themes/lens-light.json index 52b9cd32e2..5a4365b500 100644 --- a/src/renderer/themes/lens-light.json +++ b/src/renderer/themes/lens-light.json @@ -11,6 +11,7 @@ "primary": "#3d90ce", "textColorPrimary": "#555555", "textColorSecondary": "#51575d", + "textColorTertiary": "#555555", "textColorAccent": "#333333", "textColorDimmed": "#5557598c", "borderColor": "#c9cfd3", @@ -126,8 +127,8 @@ "scrollBarColor": "#bbbbbb", "canvasBackground": "#24292e", "settingsBackground": "#ffffff", - "navSelectedBackground": "#747f8d3d", - "navHoverBackground": "#747f8d14", + "settingsColor": "#555555", + "navSelectedBackground": "#ffffff", "navHoverColor": "#2e3135", "hrColor": "#06060714" }