ui: added heading color with text lighter shade

This commit is contained in:
Nishchit14
2023-08-25 18:08:24 +05:30
parent 30979cb843
commit a4a83a8edd
4 changed files with 21 additions and 5 deletions

View File

@@ -75,7 +75,7 @@ const BulkEditTable: FC<IBulkEditTable> = ({
<TabHeader className="-mb-2"> <TabHeader className="-mb-2">
{title && ( {title && (
<TabHeader.Left> <TabHeader.Left>
<span className="" data-testid="table-title">{title}</span> <span className="text-heading-color" data-testid="table-title">{title}</span>
</TabHeader.Left> </TabHeader.Left>
)} )}

View File

@@ -71,6 +71,8 @@
--input-background-focus: var(--mantine-color-dark-7); /* .1 */ --input-background-focus: var(--mantine-color-dark-7); /* .1 */
--input-background: var(--app-background); --input-background: var(--app-background);
--heading-color: var(--mantine-color-gray-5);
--popover-background: var(--mantine-color-dark-5); /* .2 */ --popover-background: var(--mantine-color-dark-5); /* .2 */
--popover-foreground: var(--app-foreground); --popover-foreground: var(--app-foreground);
--popover-border: transparent; --popover-border: transparent;
@@ -148,6 +150,8 @@
--statusBar-border: var(--app-border); --statusBar-border: var(--app-border);
--statusBar-background-active: var(--mantine-color-gray-2); --statusBar-background-active: var(--mantine-color-gray-2);
--heading-color: var(--mantine-color-dark-4);
--input-border: var(--app-border); --input-border: var(--app-border);
--input-placeholder: var(--mantine-color-gray-6); --input-placeholder: var(--mantine-color-gray-6);
--input-text: var(--mantine-color-gray-9); --input-text: var(--mantine-color-gray-9);
@@ -849,10 +853,12 @@ tr:focus-visible {
/*--------table temporary css starts ------------*/ /*--------table temporary css starts ------------*/
/*--------table 2 css starts------------*/ /*--------table 2 css starts------------*/
.primary-table .mtk1, .primary-table .mtk1 {
.primary-table th {
color: var(--tab-foreground-inactive) !important; color: var(--tab-foreground-inactive) !important;
} }
.primary-table th {
color: var(--heading-color) !important;
}
.table-cell .table-action { .table-cell .table-action {
visibility: hidden; visibility: hidden;

View File

@@ -59,6 +59,8 @@
--input-background-focus: var(--mantine-color-dark-7); /* .1 */ --input-background-focus: var(--mantine-color-dark-7); /* .1 */
--input-background: var(--app-background); --input-background: var(--app-background);
--heading-color: var(--mantine-color-gray-5);
--popover-background: var(--mantine-color-dark-5); /* .2 */ --popover-background: var(--mantine-color-dark-5); /* .2 */
--popover-foreground: var(--app-foreground); --popover-foreground: var(--app-foreground);
--popover-border: transparent; --popover-border: transparent;
@@ -136,6 +138,8 @@
--statusBar-border: var(--app-border); --statusBar-border: var(--app-border);
--statusBar-background-active: var(--mantine-color-gray-2); --statusBar-background-active: var(--mantine-color-gray-2);
--heading-color: var(--mantine-color-dark-4);
--input-border: var(--app-border); --input-border: var(--app-border);
--input-placeholder: var(--mantine-color-gray-6); --input-placeholder: var(--mantine-color-gray-6);
--input-text: var(--mantine-color-gray-9); --input-text: var(--mantine-color-gray-9);
@@ -1734,6 +1738,9 @@
.text-graphql { .text-graphql {
color: var(--req-graphql); color: var(--req-graphql);
} }
.text-heading-color {
color: var(--heading-color);
}
.text-info { .text-info {
color: var(--info); color: var(--info);
} }
@@ -2827,10 +2834,12 @@ tr:focus-visible {
/*--------table temporary css starts ------------*/ /*--------table temporary css starts ------------*/
/*--------table 2 css starts------------*/ /*--------table 2 css starts------------*/
.primary-table .mtk1, .primary-table .mtk1 {
.primary-table th {
color: var(--tab-foreground-inactive) !important; color: var(--tab-foreground-inactive) !important;
} }
.primary-table th {
color: var(--heading-color) !important;
}
.table-cell .table-action { .table-cell .table-action {
visibility: hidden; visibility: hidden;

View File

@@ -75,6 +75,7 @@ module.exports = {
focusBorder: 'var(--focus-border)', focusBorder: 'var(--focus-border)',
focusColor: '#ffffff1a', focusColor: '#ffffff1a',
'heading-color': 'var(--heading-color)',
primaryColor: 'var(--app-primary)', primaryColor: 'var(--app-primary)',
'primaryColor-text': '#ffffff', 'primaryColor-text': '#ffffff',
secondaryColor: 'var(--app-secondary)', secondaryColor: 'var(--app-secondary)',