diff --git a/apps/cyberstorm-remix/app/settings/teams/team/tabs/Settings/Settings.css b/apps/cyberstorm-remix/app/settings/teams/team/tabs/Settings/Settings.css index a39d9c96e..1b6e4bd61 100644 --- a/apps/cyberstorm-remix/app/settings/teams/team/tabs/Settings/Settings.css +++ b/apps/cyberstorm-remix/app/settings/teams/team/tabs/Settings/Settings.css @@ -3,44 +3,13 @@ align-self: flex-start; } - /* Leave Team Form */ - .leave-team-form__body { - display: flex; - flex-direction: column; - gap: var(--gap-2xl); - align-items: flex-start; - align-self: stretch; - } - - .leave-team-form__text { - color: var(--modal-text-color--default); - font-weight: var(--font-weight-regular); - font-size: var(--font-size-body-lg); - font-style: normal; - line-height: var(--line-height-md); + .team-settings__text--bold { + font-weight: var(--font-weight-bold); } - /* Disband team Form */ - .disband-team-form__body { + .disband-team-form__form { display: flex; flex-direction: column; - gap: var(--gap-2xl); - align-items: flex-start; align-self: stretch; } - - .disband-team-form__text { - color: var(--modal-text-color--default); - font-weight: var(--font-weight-regular); - font-size: var(--font-size-Body-lg); - font-style: normal; - line-height: var(--line-height-md); - } - - .disband-team-form__text--bold { - color: var(--color-text-primary); - - font-weight: var(--font-weight-bold); - line-height: var(--line-height-bold); - } } diff --git a/apps/cyberstorm-remix/app/settings/teams/team/tabs/Settings/Settings.tsx b/apps/cyberstorm-remix/app/settings/teams/team/tabs/Settings/Settings.tsx index 950efb302..563625f48 100644 --- a/apps/cyberstorm-remix/app/settings/teams/team/tabs/Settings/Settings.tsx +++ b/apps/cyberstorm-remix/app/settings/teams/team/tabs/Settings/Settings.tsx @@ -14,7 +14,6 @@ import { Modal, NewButton, NewIcon, - NewLink, NewTextInput, useToast, } from "@thunderstore/cyberstorm"; @@ -179,14 +178,7 @@ function LeaveTeamForm(props: { You are about to leave the team{" "} - - {teamName}. - + {teamName}. @@ -237,6 +229,8 @@ function DisbandTeamForm(props: { team_name: "", }); + const formDisabled = formInputs.team_name !== teamName; + type SubmitorOutput = Awaited>; async function submitor(data: typeof formInputs): Promise { @@ -301,29 +295,37 @@ function DisbandTeamForm(props: {
You are about to disband the team{" "} - - {teamName}. - + {teamName}.
As a precaution, to disband your team, please input{" "} - {teamName} into - the field below. + {teamName} into the + field below.
- - updateFormFieldState({ field: "team_name", value: e.target.value }) - } - /> + +
{ + event.preventDefault(); + if (!formDisabled) { + strongForm.submit(); + } + }} + className="disband-team-form__form" + > + + updateFormFieldState({ + field: "team_name", + value: e.target.value, + }) + } + /> +
{ strongForm.submit(); }} @@ -338,4 +340,4 @@ function DisbandTeamForm(props: { ); } -LeaveTeamForm.displayName = "LeaveTeamForm"; +DisbandTeamForm.displayName = "DisbandTeamForm";