visual adjustments

messages/en-US.json

@@ -688,7 +688,7 @@
     "resourceRoleDescription": "Admins can always access this resource.",
     "resourceUsersRoles": "Access Controls",
     "resourceUsersRolesDescription": "Configure which users and roles can visit this resource",
-    "resourceUsersRolesSubmit": "Save Users & Roles",
+    "resourceUsersRolesSubmit": "Save Access Controls",
     "resourceWhitelistSave": "Saved successfully",
     "resourceWhitelistSaveDescription": "Whitelist settings have been saved",
     "ssoUse": "Use Platform SSO",
@@ -1311,7 +1311,7 @@
     "documentation": "Documentation",
     "saveAllSettings": "Save All Settings",
     "saveResourceTargets": "Save Targets",
-    "saveResourceHttp": "Save Additional fields",
+    "saveResourceHttp": "Save Proxy Settings",
     "saveProxyProtocol": "Save Proxy protocol settings",
     "settingsUpdated": "Settings updated",
     "settingsUpdatedDescription": "Settings updated successfully",
@@ -1662,7 +1662,7 @@
     "siteAddressDescription": "The internal address of the site. Must fall within the organization's subnet.",
     "siteNameDescription": "The display name of the site that can be changed later.",
     "autoLoginExternalIdp": "Auto Login with External IDP",
-    "autoLoginExternalIdpDescription": "Immediately redirect the user to the external IDP for authentication.",
+    "autoLoginExternalIdpDescription": "Immediately redirect the user to the external identity provider for authentication.",
     "selectIdp": "Select IDP",
     "selectIdpPlaceholder": "Choose an IDP...",
     "selectIdpRequired": "Please select an IDP when auto login is enabled.",
@@ -1877,8 +1877,8 @@
     "enableTwoFactorAuthentication": "Enable two-factor authentication",
     "completeSecuritySteps": "Complete Security Steps",
     "securitySettings": "Security Settings",
-    "dangerSection": "Danger section",
+    "dangerSection": "Danger Zone",
-    "dangerSectionDescription": "Delete organization alongside all its sites, clients, resources, etc...",
+    "dangerSectionDescription": "Permanently delete all data associated with this organization",
     "securitySettingsDescription": "Configure security policies for the organization",
     "requireTwoFactorForAllUsers": "Require Two-Factor Authentication for All Users",
     "requireTwoFactorDescription": "When enabled, all internal users in this organization must have two-factor authentication enabled to access the organization.",
@@ -2317,5 +2317,6 @@
     "resourceLoginPageTitle": "Resource Login Page",
     "resourceLoginPageDescription": "Customize the login page for individual resources",
     "enterConfirmation": "Enter confirmation",
-    "blueprintViewDetails": "Details"
+    "blueprintViewDetails": "Details",
+    "defaultIdentityProvider": "Default Identity Provider"
 }

src/app/[orgId]/settings/general/page.tsx

@@ -49,7 +49,8 @@ import {
     SettingsSectionTitle,
     SettingsSectionDescription,
     SettingsSectionBody,
-    SettingsSectionForm
+    SettingsSectionForm,
+    SettingsSectionFooter
 } from "@app/components/Settings";
 import { useUserContext } from "@app/hooks/useUserContext";
 import { useTranslations } from "next-intl";
@@ -122,16 +123,12 @@ export default function GeneralPage() {
     const { org } = useOrgContext();
     return (
         <SettingsContainer>
-            <div className="grid gap-y-8">
+            <GeneralSectionForm org={org.org} />
-                <GeneralSectionForm org={org.org} />
 
-                <LogRetentionSectionForm org={org.org} />
+            <LogRetentionSectionForm org={org.org} />
 
-                {build !== "oss" && (
+            {build !== "oss" && <SecuritySettingsSectionForm org={org.org} />}
-                    <SecuritySettingsSectionForm org={org.org} />
+            {build !== "saas" && <DeleteForm org={org.org} />}
-                )}
-                {build !== "saas" && <DeleteForm org={org.org} />}
-            </div>
         </SettingsContainer>
     );
 }
@@ -222,7 +219,7 @@ function DeleteForm({ org }: SectionFormProps) {
                         {t("dangerSectionDescription")}
                     </SettingsSectionDescription>
                 </SettingsSectionHeader>
-                <div className="flex justify-start gap-2">
+                <SettingsSectionFooter>
                     <Button
                         variant="destructive"
                         onClick={() => setIsDeleteModalOpen(true)}
@@ -232,7 +229,7 @@ function DeleteForm({ org }: SectionFormProps) {
                     >
                         {t("orgDelete")}
                     </Button>
-                </div>
+                </SettingsSectionFooter>
             </SettingsSection>
         </>
     );
@@ -758,6 +755,7 @@ function SecuritySettingsSectionForm({ org }: SectionFormProps) {
                                 action={formAction}
                                 ref={formRef}
                                 id="security-settings-section-form"
+                                className="space-y-4"
                             >
                                 <PaidFeaturesAlert />
                                 <FormField

src/app/[orgId]/settings/resources/proxy/[niceId]/authentication/page.tsx

@@ -617,7 +617,7 @@ export default function ResourceAuthenticationPage() {
                                     )}
 
                                     {ssoEnabled && allIdps.length > 0 && (
-                                        <div className="mt-8">
+                                        <>
                                             <div className="space-y-2 mb-3">
                                                 <CheckboxWithLabel
                                                     label={t(
@@ -654,7 +654,7 @@ export default function ResourceAuthenticationPage() {
                                             {autoLoginEnabled && (
                                                 <div className="space-y-2">
                                                     <label className="text-sm font-medium">
-                                                        {t("selectIdp")}
+                                                        {t("defaultIdentityProvider")}
                                                     </label>
                                                     <Select
                                                         onValueChange={(
@@ -670,7 +670,7 @@ export default function ResourceAuthenticationPage() {
                                                                 : undefined
                                                         }
                                                     >
-                                                        <SelectTrigger className="w-full">
+                                                        <SelectTrigger className="w-full mt-1">
                                                             <SelectValue
                                                                 placeholder={t(
                                                                     "selectIdpPlaceholder"
@@ -696,7 +696,7 @@ export default function ResourceAuthenticationPage() {
                                                     </Select>
                                                 </div>
                                             )}
-                                        </div>
+                                        </>
                                     )}
                                 </form>
                             </Form>
@@ -728,7 +728,7 @@ export default function ResourceAuthenticationPage() {
                             {/* Password Protection */}
                             <div className="flex items-center justify-between border rounded-md p-2 mb-4">
                                 <div
-                                    className={`flex items-center ${!authInfo.password ? "text-muted-foreground" : "text-green-500"} text-sm space-x-2`}
+                                    className={`flex items-center ${!authInfo.password ? "" : "text-green-500"} text-sm space-x-2`}
                                 >
                                     <Key size="14" />
                                     <span>
@@ -758,7 +758,7 @@ export default function ResourceAuthenticationPage() {
                             {/* PIN Code Protection */}
                             <div className="flex items-center justify-between border rounded-md p-2">
                                 <div
-                                    className={`flex items-center ${!authInfo.pincode ? "text-muted-foreground" : "text-green-500"} space-x-2 text-sm`}
+                                    className={`flex items-center ${!authInfo.pincode ? "" : "text-green-500"} space-x-2 text-sm`}
                                 >
                                     <Binary size="14" />
                                     <span>
@@ -788,7 +788,7 @@ export default function ResourceAuthenticationPage() {
                             {/* Header Authentication Protection */}
                             <div className="flex items-center justify-between border rounded-md p-2">
                                 <div
-                                    className={`flex items-center ${!authInfo.headerAuth ? "text-muted-foreground" : "text-green-500"} space-x-2 text-sm`}
+                                    className={`flex items-center ${!authInfo.headerAuth ? "" : "text-green-500"} space-x-2 text-sm`}
                                 >
                                     <Bot size="14" />
                                     <span>

src/app/[orgId]/settings/resources/proxy/[niceId]/general/page.tsx

@@ -322,7 +322,7 @@ export default function GeneralForm() {
                                         <div className="space-y-2">
                                             <Label>{t("resourceDomain")}</Label>
                                             <div className="border p-2 rounded-md flex items-center justify-between">
-                                                <span className="text-sm text-muted-foreground flex items-center gap-2">
+                                                <span className="text-sm flex items-center gap-2">
                                                     <Globe size="14" />
                                                     {resourceFullDomain}
                                                 </span>

src/app/[orgId]/settings/resources/proxy/[niceId]/proxy/page.tsx

@@ -336,9 +336,9 @@ function ProxyResourceTargetsForm({
                                 }
                             >
                                 <div
-                                    className={`flex items-center gap-1 ${status === "healthy" ? "text-green-500" : status === "unhealthy" ? "text-destructive" : ""}`}
+                                    className={`flex items-center gap-2 ${status === "healthy" ? "text-green-500" : status === "unhealthy" ? "text-destructive" : ""}`}
                                 >
-                                    <Settings className="h-4 w-4" />
+                                    <Settings className="h-3 w-3" />
                                     {getStatusText(status)}
                                 </div>
                             </Button>

src/app/[orgId]/settings/resources/proxy/[niceId]/rules/page.tsx

@@ -53,7 +53,8 @@ import {
     SettingsSectionTitle,
     SettingsSectionDescription,
     SettingsSectionBody,
-    SettingsSectionFooter
+    SettingsSectionFooter,
+    SettingsSectionForm
 } from "@app/components/Settings";
 import { ListResourceRulesResponse } from "@server/routers/resource/listResourceRules";
 import { SwitchInput } from "@app/components/SwitchInput";
@@ -1018,17 +1019,16 @@ export default function ResourceRules(props: {
                         </Table>
                     </div>
                 </SettingsSectionBody>
+                <SettingsSectionFooter>
+                    <Button
+                        onClick={saveAllSettings}
+                        loading={loading}
+                        disabled={loading}
+                    >
+                        {t("saveAllSettings")}
+                    </Button>
+                </SettingsSectionFooter>
             </SettingsSection>
-
-            <div className="flex justify-end">
-                <Button
-                    onClick={saveAllSettings}
-                    loading={loading}
-                    disabled={loading}
-                >
-                    {t("saveAllSettings")}
-                </Button>
-            </div>
         </SettingsContainer>
     );
 }

src/app/[orgId]/settings/sites/[niceId]/general/page.tsx

@@ -24,7 +24,8 @@ import {
     SettingsSectionTitle,
     SettingsSectionDescription,
     SettingsSectionBody,
-    SettingsSectionForm
+    SettingsSectionForm,
+    SettingsSectionFooter
 } from "@app/components/Settings";
 import { formatAxiosError } from "@app/lib/api";
 import { createApiClient } from "@app/lib/api";
@@ -210,18 +211,17 @@ export default function GeneralPage() {
                         </Form>
                     </SettingsSectionForm>
                 </SettingsSectionBody>
+                <SettingsSectionFooter>
+                    <Button
+                        type="submit"
+                        form="general-settings-form"
+                        loading={loading}
+                        disabled={loading}
+                    >
+                        Save All Settings
+                    </Button>
+                </SettingsSectionFooter>
             </SettingsSection>
-
-            <div className="flex justify-end mt-6">
-                <Button
-                    type="submit"
-                    form="general-settings-form"
-                    loading={loading}
-                    disabled={loading}
-                >
-                    Save All Settings
-                </Button>
-            </div>
         </SettingsContainer>
     );
 }

src/components/ui/checkbox.tsx

@@ -14,13 +14,13 @@ const checkboxVariants = cva(
         variants: {
             variant: {
                 outlinePrimary:
-                    "border rounded-sm border-primary data-[state=checked]:bg-primary data-[state=checked]:text-primary-foreground",
+                    "border rounded-[5px] border-primary data-[state=checked]:bg-primary data-[state=checked]:text-primary-foreground",
                 outline:
-                    "border rounded-sm border-input data-[state=checked]:bg-muted data-[state=checked]:text-accent-foreground",
+                    "border rounded-[5px] border-input data-[state=checked]:bg-muted data-[state=checked]:text-accent-foreground",
                 outlinePrimarySquare:
-                    "border rounded-[20%] border-primary data-[state=checked]:bg-primary data-[state=checked]:text-primary-foreground",
+                    "border rounded-[5px] border-primary data-[state=checked]:bg-primary data-[state=checked]:text-primary-foreground",
                 outlineSquare:
-                    "border rounded-[20%] border-input data-[state=checked]:bg-muted data-[state=checked]:text-accent-foreground"
+                    "border rounded-[5px] border-input data-[state=checked]:bg-muted data-[state=checked]:text-accent-foreground"
             }
         },
         defaultVariants: {