awatertrevi/infisical
1
0
Fork 0
mirror of https://github.com/awatertrevi/infisical.git synced 2026-10-09 20:28:31 +00:00
Code Issues Packages Projects Releases Wiki Activity

feat(ui): changed to interfonts

Browse Source
This commit is contained in:
akhilmhdh
2023-01-23 22:10:51 +05:30
parent e67d68a7b9
commit 062c287e75
17 changed files with 39 additions and 23 deletions
Download Patch File Download Diff File Expand all files Collapse all files
frontend/src/components/v2/Button/Button.tsx
+1 -1
View File
@@ -15,7 +15,7 @@ const buttonVariants = cva(
[
'button',
'transition-all',
'font-medium',
'font-inter font-medium',
'cursor-pointer',
'inline-flex items-center justify-center',
'relative'
frontend/src/components/v2/Card/Card.tsx
+1 -1
View File
@@ -47,7 +47,7 @@ export const Card = forwardRef<HTMLDivElement, CardProps>(
<div
ref={ref}
className={twMerge(
'flex flex-col w-full text-gray-200 bg-mineshaft-700 shadow-md',
'flex flex-col w-full font-inter text-gray-200 bg-mineshaft-700 shadow-md',
isFullHeight && 'h-full',
isRounded && 'rounded-md',
isPlain && 'shadow-none',
frontend/src/components/v2/Checkbox/Checkbox.tsx
+1 -1
View File
@@ -25,7 +25,7 @@ export const Checkbox = ({
...props
}: CheckboxProps): JSX.Element => {
return (
<div className="flex items-center text-bunker-300">
<div className="flex items-center font-inter text-bunker-300">
<CheckboxPrimitive.Root
className={twMerge(
'flex items-center justify-center w-5 h-5 mr-3 transition-all rounded shadow hover:bg-bunker-200 bg-bunker-300',
frontend/src/components/v2/Dropdown/Dropdown.tsx
+1 -1
View File
@@ -62,7 +62,7 @@ export const DropdownMenuItem = <T extends ElementType = 'button'>({
<DropdownMenuPrimitive.Item
{...props}
className={twMerge(
'text-sm block px-4 py-2 data-[highlighted]:bg-gray-700 00 outline-none cursor-pointer',
'text-sm block font-inter px-4 py-2 data-[highlighted]:bg-gray-700 outline-none cursor-pointer',
className
)}
>
frontend/src/components/v2/FormControl/FormControl.tsx
+2 -2
View File
@@ -13,7 +13,7 @@ export type FormLabelProps = {
export const FormLabel = ({ id, label, isRequired }: FormLabelProps) => (
<Label.Root className="text-mineshaft-300 text-sm font-medium block mb-1 ml-0.5" htmlFor={id}>
{label}
{isRequired && <span className="text-red ml-1">*</span>}
{isRequired && <span className="ml-1 text-red">*</span>}
</Label.Root>
);
@@ -25,7 +25,7 @@ export type FormHelperTextProps = {
export const FormHelperText = ({ isError, text }: FormHelperTextProps) => (
<div
className={twMerge(
'text-xs flex items-center opacity-90 text-mineshaft-300 mt-2',
'text-xs font-inter flex items-center opacity-90 text-mineshaft-300 mt-2',
isError && 'text-red-600'
)}
>
frontend/src/components/v2/IconButton/IconButton.tsx
+1 -1
View File
@@ -14,7 +14,7 @@ const iconButtonVariants = cva(
[
'button',
'transition-all',
'font-medium',
'font-inter font-medium',
'cursor-pointer',
'inline-flex items-center justify-center',
'relative'
frontend/src/components/v2/Input/Input.tsx
+1 -1
View File
@@ -38,7 +38,7 @@ const inputVariants = cva(
}
);
const inputParentContainerVariants = cva('inline-flex items-center border relative', {
const inputParentContainerVariants = cva('inline-flex font-inter items-center border relative', {
variants: {
isRounded: {
true: ['rounded-md'],
frontend/src/components/v2/Menu/Menu.tsx
+1 -1
View File
@@ -35,7 +35,7 @@ export const MenuItem = <T extends ElementType = 'button'>({
}: MenuItemProps<T> & ComponentPropsWithRef<T>): JSX.Element => (
<li
className={twMerge(
'px-2 py-3 flex flex-col text-sm text-white transition-all rounded cursor-pointer hover:bg-gray-700',
'px-2 py-3 font-inter flex flex-col text-sm text-white transition-all rounded cursor-pointer hover:bg-gray-700',
isSelected && 'text-primary',
isDisabled && 'text-gray-500 hover:bg-transparent cursor-not-allowed',
className
frontend/src/components/v2/Modal/Modal.tsx
+5 -3
View File
@@ -7,7 +7,7 @@ import { twMerge } from 'tailwind-merge';
import { Card, CardBody, CardFooter, CardTitle } from '../Card';
import { IconButton } from '../IconButton';
export type ModalContentProps = Omit<DialogPrimitive.DialogContentProps, 'open'> & {
export type ModalContentProps = DialogPrimitive.DialogContentProps & {
title?: ReactNode;
subTitle?: string;
footerContent?: ReactNode;
@@ -48,8 +48,10 @@ export const ModalContent = forwardRef<HTMLDivElement, ModalContentProps>(
ModalContent.displayName = 'ModalContent';
export const Modal = DialogPrimitive.Root;
export type ModalProps = DialogPrimitive.DialogProps;
export type ModalProps = Omit<DialogPrimitive.DialogProps, 'open'> & { isOpen?: boolean };
export const Modal = ({ isOpen, ...props }: ModalProps) => (
<DialogPrimitive.Root open={isOpen} {...props} />
);
export const ModalTrigger = DialogPrimitive.Trigger;
export type ModalTriggerProps = DialogPrimitive.DialogTriggerProps;
frontend/src/components/v2/Select/Select.tsx
+3 -3
View File
@@ -22,8 +22,8 @@ export const Select = forwardRef<HTMLButtonElement, SelectProps>(
<SelectPrimitive.Trigger
ref={ref}
className={twMerge(
`select inline-flex items-center justify-between
px-4 py-2.5 text-sm text-white rounded-md bg-mineshaft-800`,
`inline-flex items-center justify-between data-[placeholder]:text-gray-500
px-4 py-2.5 font-inter text-sm text-white rounded-md bg-mineshaft-800`,
className
)}
>
@@ -36,7 +36,7 @@ export const Select = forwardRef<HTMLButtonElement, SelectProps>(
<SelectPrimitive.Content
position="popper"
sideOffset={5}
className="overflow-hidden text-white rounded-md shadow-md bg-mineshaft-800"
className="overflow-hidden text-white rounded-md shadow-md font-inter bg-mineshaft-800"
style={{ width: 'var(--radix-select-trigger-width)' }}
>
<SelectPrimitive.ScrollUpButton>
frontend/src/components/v2/Switch/Switch.tsx
+1 -1
View File
@@ -19,7 +19,7 @@ export const Switch = ({
isRequired,
...props
}: SwitchProps): JSX.Element => (
<div className="flex items-center text-bunker-300">
<div className="flex items-center text-bunker-300 font-inter">
<label className="text-sm" htmlFor={id}>
{children}
{isRequired && <span className="pl-1 text-red">*</span>}
frontend/src/components/v2/Table/Table.tsx
+1 -1
View File
@@ -14,7 +14,7 @@ export const TableContainer = ({
}: TableContainerProps): JSX.Element => (
<div
className={twMerge(
'overflow-x-auto shadow-md relative border border-solid border-mineshaft-700',
'overflow-x-auto font-inter shadow-md relative border border-solid border-mineshaft-700',
isRounded && 'rounded-md',
className
)}
frontend/src/components/v2/TextArea/TextArea.tsx
+1 -1
View File
@@ -10,7 +10,7 @@ type Props = {
};
const textAreaVariants = cva(
'textarea w-full p-2 border border-solid text-gray-400 placeholder-gray-500 placeholder-opacity-50',
'textarea w-full p-2 border border-solid text-gray-400 font-inter placeholder-gray-500 placeholder-opacity-50',
{
variants: {
size: {
frontend/src/styles/globals.css
+3 -5
View File
@@ -2,8 +2,6 @@
@tailwind components;
@tailwind utilities;
@layer components {
.select[data-placeholder] {
color: theme("colors.gray.500")
}
}
@import '@fontsource/inter/400.css';
@import '@fontsource/inter/500.css';
@import '@fontsource/inter/700.css';