mirror of
https://github.com/awatertrevi/infisical.git
synced 2026-10-20 20:07:53 +00:00
feat: upgraded to tw v4
This commit is contained in:
@@ -14,8 +14,8 @@ export const PersonalSettingsPage = () => {
|
||||
</Helmet>
|
||||
<div className="flex w-full justify-center bg-bunker-800 px-6 text-white">
|
||||
<div className="w-full max-w-6xl">
|
||||
<div className="mb-6 mt-6">
|
||||
<p className="text-3xl font-semibold text-gray-200">{t("settings.personal.title")}</p>
|
||||
<div className="mt-6 mb-6">
|
||||
<p className="text-3xl font-medium text-gray-200">{t("settings.personal.title")}</p>
|
||||
</div>
|
||||
<PersonalTabGroup />
|
||||
</div>
|
||||
|
||||
+1
-1
@@ -15,7 +15,7 @@ export const APIKeySection = () => {
|
||||
return (
|
||||
<div className="mb-6 rounded-lg border border-mineshaft-600 bg-mineshaft-900 p-4">
|
||||
<div className="mb-8 flex justify-between">
|
||||
<p className="text-xl font-semibold text-mineshaft-100">
|
||||
<p className="text-xl font-medium text-mineshaft-100">
|
||||
{t("settings.personal.api-keys.title")}
|
||||
</p>
|
||||
<Tooltip content="API Keys are deprecated and will be removed in the future.">
|
||||
|
||||
+2
-2
@@ -164,7 +164,7 @@ export const AddAPIKeyModal = ({ popUp, handlePopUpToggle }: Props) => {
|
||||
</div>
|
||||
</form>
|
||||
) : (
|
||||
<div className="mb-3 mr-2 mt-2 flex items-center justify-end rounded-md bg-white/[0.07] p-2 text-base text-gray-400">
|
||||
<div className="mt-2 mr-2 mb-3 flex items-center justify-end rounded-md bg-white/[0.07] p-2 text-base text-gray-400">
|
||||
<p className="mr-4 break-all">{newAPIKey}</p>
|
||||
<IconButton
|
||||
ariaLabel="copy icon"
|
||||
@@ -173,7 +173,7 @@ export const AddAPIKeyModal = ({ popUp, handlePopUpToggle }: Props) => {
|
||||
onClick={copyTokenToClipboard}
|
||||
>
|
||||
<FontAwesomeIcon icon={isAPIKeyCopied ? faCheck : faCopy} />
|
||||
<span className="absolute -left-8 -top-20 hidden w-28 translate-y-full rounded-md bg-bunker-800 py-2 pl-3 text-center text-sm text-gray-400 group-hover:flex group-hover:animate-fadeIn">
|
||||
<span className="group-hover:animate-fade-in absolute -top-20 -left-8 hidden w-28 translate-y-full rounded-md bg-bunker-800 py-2 pl-3 text-center text-sm text-gray-400 group-hover:flex">
|
||||
Click to copy
|
||||
</span>
|
||||
</IconButton>
|
||||
|
||||
+1
-3
@@ -93,9 +93,7 @@ export const AuthMethodSection = () => {
|
||||
|
||||
return (
|
||||
<div className="mb-6 rounded-lg border border-mineshaft-600 bg-mineshaft-900 p-4">
|
||||
<h2 className="mb-8 flex-1 text-xl font-semibold text-mineshaft-100">
|
||||
Authentication methods
|
||||
</h2>
|
||||
<h2 className="mb-8 flex-1 text-xl font-medium text-mineshaft-100">Authentication methods</h2>
|
||||
<p className="mb-4 text-gray-400">
|
||||
By enabling a SSO provider, you are allowing an account with that provider which uses the
|
||||
same email address as your existing Infisical account to be able to log in to Infisical.
|
||||
|
||||
+1
-1
@@ -167,7 +167,7 @@ export const ChangeEmailSection = () => {
|
||||
return (
|
||||
<>
|
||||
<div className="mb-6 rounded-lg border border-mineshaft-600 bg-mineshaft-900 p-4">
|
||||
<h2 className="mb-8 flex-1 text-xl font-semibold text-mineshaft-100">Change email</h2>
|
||||
<h2 className="mb-8 flex-1 text-xl font-medium text-mineshaft-100">Change email</h2>
|
||||
|
||||
<form onSubmit={emailForm.handleSubmit(handleEmailSubmit)}>
|
||||
<div className="max-w-md">
|
||||
|
||||
+2
-2
@@ -119,7 +119,7 @@ export const ChangePasswordSection = () => {
|
||||
onSubmit={handleSubmit(onFormSubmit)}
|
||||
className="mb-6 rounded-lg border border-mineshaft-600 bg-mineshaft-900 p-4"
|
||||
>
|
||||
<h2 className="mb-8 flex-1 text-xl font-semibold text-mineshaft-100">Change password</h2>
|
||||
<h2 className="mb-8 flex-1 text-xl font-medium text-mineshaft-100">Change password</h2>
|
||||
<div className="max-w-md">
|
||||
<Controller
|
||||
defaultValue=""
|
||||
@@ -162,7 +162,7 @@ export const ChangePasswordSection = () => {
|
||||
return (
|
||||
<div className="items-top ml-1 flex flex-row justify-start" key={key}>
|
||||
<div>
|
||||
<FontAwesomeIcon icon={faXmark} className="text-md ml-0.5 mr-2.5 text-red" />
|
||||
<FontAwesomeIcon icon={faXmark} className="text-md mr-2.5 ml-0.5 text-red" />
|
||||
</div>
|
||||
<p className="text-sm text-gray-400">{errors[key as keyof Errors]}</p>
|
||||
</div>
|
||||
|
||||
+1
-1
@@ -36,7 +36,7 @@ export const DeleteAccountSection = () => {
|
||||
|
||||
return (
|
||||
<div className="mb-6 rounded-lg border border-mineshaft-600 bg-mineshaft-900 p-4">
|
||||
<p className="mb-4 text-xl font-semibold text-mineshaft-100">Danger Zone</p>
|
||||
<p className="mb-4 text-xl font-medium text-mineshaft-100">Danger Zone</p>
|
||||
<Button
|
||||
isLoading={isPending}
|
||||
colorSchema="danger"
|
||||
|
||||
+3
-3
@@ -32,7 +32,7 @@ export const PersonalTabGroup = () => {
|
||||
<div className="mt-4 flex w-full flex-row items-center rounded-md border border-primary-600/70 bg-primary/[.07] p-4 text-base text-white">
|
||||
<FontAwesomeIcon icon={faWarning} className="pr-6 text-4xl text-white/80" />
|
||||
<div className="flex w-full flex-col text-sm">
|
||||
<span className="mb-4 text-lg font-semibold">Deprecation Notice</span>
|
||||
<span className="mb-4 text-lg font-medium">Deprecation Notice</span>
|
||||
<p>
|
||||
API Keys are being deprecated in favor of Machine Identities.
|
||||
<br />
|
||||
@@ -41,7 +41,7 @@ export const PersonalTabGroup = () => {
|
||||
<a
|
||||
href="https://infisical.com/blog/deprecating-api-keys"
|
||||
target="_blank"
|
||||
className="font-semibold text-primary-400"
|
||||
className="font-medium text-primary-400"
|
||||
rel="noreferrer"
|
||||
>
|
||||
here
|
||||
@@ -51,7 +51,7 @@ export const PersonalTabGroup = () => {
|
||||
<a
|
||||
href="https://infisical.com/docs/documentation/platform/identities/overview"
|
||||
target="_blank"
|
||||
className="font-semibold text-primary-400"
|
||||
className="font-medium text-primary-400"
|
||||
rel="noreferrer"
|
||||
>
|
||||
Learn more about Machine Identities
|
||||
|
||||
+4
-4
@@ -284,7 +284,7 @@ export const MFASection = () => {
|
||||
}}
|
||||
className="mb-6 rounded-lg border border-mineshaft-600 bg-mineshaft-900 p-4"
|
||||
>
|
||||
<h2 className="mb-6 text-xl font-semibold text-mineshaft-100">Two-factor Authentication</h2>
|
||||
<h2 className="mb-6 text-xl font-medium text-mineshaft-100">Two-factor Authentication</h2>
|
||||
|
||||
{user && (
|
||||
<div className="space-y-4">
|
||||
@@ -332,7 +332,7 @@ export const MFASection = () => {
|
||||
|
||||
{showMobileAuthSetup && !totpConfiguration?.isVerified && (
|
||||
<div className="space-y-6">
|
||||
<h3 className="mb-6 text-lg font-semibold text-mineshaft-100">
|
||||
<h3 className="mb-6 text-lg font-medium text-mineshaft-100">
|
||||
Setup Mobile Authenticator
|
||||
</h3>
|
||||
|
||||
@@ -366,7 +366,7 @@ export const MFASection = () => {
|
||||
<div>
|
||||
<p className="mb-2 text-xs text-mineshaft-400">
|
||||
Can't scan? Enter this code manually:{" "}
|
||||
<code className="rounded bg-mineshaft-700 px-3 py-1 font-mono text-sm text-mineshaft-100">
|
||||
<code className="rounded-sm bg-mineshaft-700 px-3 py-1 font-mono text-sm text-mineshaft-100">
|
||||
{totpRegistration.otpUrl.split("secret=")[1]?.split("&")[0] ||
|
||||
"Loading..."}
|
||||
</code>
|
||||
@@ -446,7 +446,7 @@ export const MFASection = () => {
|
||||
|
||||
{user?.isMfaEnabled && totpConfiguration?.isVerified && (
|
||||
<div className="mt-8 border-t border-mineshaft-600 pt-6">
|
||||
<h3 className="mb-4 text-lg font-semibold text-mineshaft-100">
|
||||
<h3 className="mb-4 text-lg font-medium text-mineshaft-100">
|
||||
Mobile Authenticator Management
|
||||
</h3>
|
||||
|
||||
|
||||
+1
-1
@@ -21,7 +21,7 @@ export const SessionsSection = () => {
|
||||
return (
|
||||
<div className="mb-6 rounded-lg border border-mineshaft-600 bg-mineshaft-900 p-4">
|
||||
<div className="mb-8 flex justify-between">
|
||||
<h2 className="flex-1 text-xl font-semibold text-mineshaft-100">Sessions</h2>
|
||||
<h2 className="flex-1 text-xl font-medium text-mineshaft-100">Sessions</h2>
|
||||
<Button
|
||||
colorSchema="secondary"
|
||||
type="submit"
|
||||
|
||||
+1
-1
@@ -50,7 +50,7 @@ export const UserNameSection = (): JSX.Element => {
|
||||
onSubmit={handleSubmit(onFormSubmit)}
|
||||
className="mb-6 rounded-lg border border-mineshaft-600 bg-mineshaft-900 p-4"
|
||||
>
|
||||
<p className="mb-4 text-xl font-semibold text-mineshaft-100">Name</p>
|
||||
<p className="mb-4 text-xl font-medium text-mineshaft-100">Name</p>
|
||||
<div className="mb-2 max-w-md">
|
||||
<Controller
|
||||
defaultValue=""
|
||||
|
||||
Reference in New Issue
Block a user