Skip to content

Commit 836e903

Browse files
shivani170shivani170
committed
chore: button variant added for white and n0
1 parent d3969c9 commit 836e903

File tree

7 files changed

+59
-18
lines changed

7 files changed

+59
-18
lines changed

‎src/Assets/IconV2/ic-disconnect.svg

Lines changed: 3 additions & 3 deletions
Loading

‎src/Shared/Components/Button/button.scss

Lines changed: 21 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -79,7 +79,7 @@
7979

8080
@if ($color) {
8181
color: $color;
82-
82+
8383
@include svg-styles($color);
8484
}
8585
}
@@ -216,6 +216,14 @@
216216
&--neutral {
217217
@include button-variant-styles($background, var(--N700), $border-color);
218218
}
219+
220+
&--neutral-n0 {
221+
@include button-variant-styles($background, var(--N0), $border-color);
222+
}
223+
224+
&--neutral-white {
225+
@include button-variant-styles($background, var(--white), $border-color);
226+
}
219227
}
220228

221229
// Pseudo states for border-less button
@@ -243,6 +251,14 @@
243251
&--neutral {
244252
@include pseudo-states(var(--N100), var(--N200));
245253
}
254+
255+
&--neutral-n0 {
256+
@include pseudo-states(var(--N000), var(--N100));
257+
}
258+
259+
&--neutral-white {
260+
@include pseudo-states(var(--white), var(--N100));
261+
}
246262
}
247263

248264
// Overrides for text button
@@ -253,7 +269,9 @@
253269
&--negative-grey,
254270
&--positive,
255271
&--warning,
256-
&--neutral {
272+
&--neutral,
273+
&--neutral-n0,
274+
&--neutral-white {
257275
padding: 0 !important;
258276
min-width: 0 !important;
259277
border: none;
@@ -279,4 +297,4 @@
279297
text-decoration: none;
280298
}
281299
}
282-
}
300+
}

‎src/Shared/Components/Button/types.ts

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -35,6 +35,8 @@ export enum ButtonStyleType {
3535
positive = 'positive',
3636
warning = 'warning',
3737
neutral = 'neutral',
38+
neutralN0 = 'neutral-n0',
39+
neutralWhite = 'neutral-white',
3840
}
3941

4042
export enum ButtonComponentType {

‎src/Shared/Components/InfoBlock/InfoBlock.component.tsx

Lines changed: 2 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -14,15 +14,14 @@
1414
* limitations under the License.
1515
*/
1616

17-
import { ComponentSizeType } from '@Shared/constants'
17+
import { ComponentSizeType, VARIANT_TO_BG_MAP, VARIANT_TO_BORDER_MAP } from '@Shared/constants'
1818
import { deriveBorderRadiusAndBorderClassFromConfig } from '@Shared/Helpers'
1919

2020
import { Button } from '../Button'
2121
import {
2222
CONTAINER_SIZE_TO_BUTTON_SIZE,
2323
CONTAINER_SIZE_TO_CLASS_MAP,
2424
SIZE_TO_ICON_CLASS_MAP,
25-
VARIANT_TO_BG_MAP,
2625
VARIANT_TO_ICON_MAP,
2726
} from './constants'
2827
import { InfoBlockProps } from './types'
@@ -38,7 +37,7 @@ const InfoBlock = ({
3837
borderRadiusConfig,
3938
borderConfig,
4039
}: InfoBlockProps) => {
41-
const baseContainerClass = `${CONTAINER_SIZE_TO_CLASS_MAP[size]} ${VARIANT_TO_BG_MAP[variant]} ${deriveBorderRadiusAndBorderClassFromConfig({ borderConfig, borderRadiusConfig })} w-100 py-8 br-4 bw-1`
40+
const baseContainerClass = `${CONTAINER_SIZE_TO_CLASS_MAP[size]} ${VARIANT_TO_BG_MAP[variant]} ${VARIANT_TO_BORDER_MAP[variant]} ${deriveBorderRadiusAndBorderClassFromConfig({ borderConfig, borderRadiusConfig })} w-100 py-8 br-4 bw-1`
4241
const iconClass = `dc__no-shrink flex dc__fill-available-space ${SIZE_TO_ICON_CLASS_MAP[size]}`
4342
const icon = customIcon ?? VARIANT_TO_ICON_MAP[variant]
4443

‎src/Shared/Components/InfoBlock/constants.tsx

Lines changed: 0 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -20,15 +20,6 @@ import { ButtonProps } from '../Button'
2020
import { Icon } from '../Icon'
2121
import { InfoBlockProps } from './types'
2222

23-
export const VARIANT_TO_BG_MAP: Record<InfoBlockProps['variant'], string> = {
24-
error: 'bcr-1 er-2',
25-
help: 'bcv-1 ev-2',
26-
information: 'bcb-1 eb-2',
27-
success: 'bcg-1 eg-2',
28-
warning: 'bcy-1 ey-2',
29-
neutral: 'bcn-1 en-2',
30-
}
31-
3223
export const VARIANT_TO_ICON_MAP: Record<InfoBlockProps['variant'], InfoBlockProps['customIcon']> = {
3324
error: <Icon name="ic-error" color="R500" />,
3425
help: <Icon name="ic-help-outline" color="V500" />,

‎src/Shared/constants.tsx

Lines changed: 28 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -16,6 +16,7 @@
1616

1717
import { OptionType } from '@Common/Types'
1818

19+
import { InfoBlockProps } from './Components'
1920
import { CDMaterialSidebarType, ConfigKeysWithLockType, ConfigurationType } from './types'
2021

2122
export const ARTIFACT_STATUS = {
@@ -553,3 +554,30 @@ export const Routes = {
553554
export const ENTERPRISE_SUPPORT_LINK = 'enterprise@devtron.ai'
554555

555556
export const INVALID_LICENSE_KEY = 'inValid'
557+
558+
export const VARIANT_TO_BG_MAP: Record<InfoBlockProps['variant'], string> = {
559+
error: 'bcr-1',
560+
help: 'bcv-1',
561+
information: 'bcb-1',
562+
success: 'bcg-1',
563+
warning: 'bcy-1',
564+
neutral: 'bcn-1',
565+
}
566+
567+
export const VARIANT_TO_ICON_COLOR_MAP: Record<InfoBlockProps['variant'], string> = {
568+
error: 'R500',
569+
help: 'V500',
570+
information: 'B500',
571+
success: 'G500',
572+
warning: 'Y700',
573+
neutral: 'N500',
574+
}
575+
576+
export const VARIANT_TO_BORDER_MAP: Record<InfoBlockProps['variant'], string> = {
577+
error: 'er-2',
578+
help: 'ev-2',
579+
information: 'eb-2',
580+
success: 'eg-2',
581+
warning: 'ey-2',
582+
neutral: 'en-2',
583+
}

‎src/index.ts

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -57,6 +57,9 @@ export interface customEnv {
5757
ENABLE_SCOPED_VARIABLES?: boolean
5858
DEFAULT_CI_TRIGGER_TYPE_MANUAL: boolean
5959
ANNOUNCEMENT_BANNER_MSG?: string
60+
ANNOUNCEMENT_BANNER_TYPE?: string
61+
ANNOUNCEMENT_BANNER_BUTTON_TEXT?: string
62+
ANNOUNCEMENT_BANNER_BUTTON_LINK?: string
6063
HIDE_DEFAULT_CLUSTER?: boolean
6164
GLOBAL_API_TIMEOUT?: number
6265
TRIGGER_API_TIMEOUT?: number

0 commit comments

Comments
 (0)