* Excellent! All changes have been successfully implemented. Here's a summary of what was done:
## Changes Made
### 1. **Updated SettingsLayout.tsx** (`frontend/src/pages/settings/SettingsLayout.tsx:33-46`)
- Changed import from `ArrowLeft` to `X` icon from lucide-react
- Moved the close button from the left side to the right side within a flex container
- Replaced the "Back to app" button with an icon-only X button
- Applied consistent styling matching the dialog component pattern (opacity, hover effects, focus ring)
- Added screen reader text "Close" for accessibility
### 2. **Removed unused translation keys** from all locale files:
- `frontend/src/i18n/locales/en/settings.json`
- `frontend/src/i18n/locales/es/settings.json`
- `frontend/src/i18n/locales/ja/settings.json`
- `frontend/src/i18n/locales/ko/settings.json`
Removed the `"backToApp"` key since it's no longer needed.
The settings page now has an X button in the top right corner (next to the "Settings" title) instead of a "Back to app" button in the top left, matching the standard UX pattern used throughout the application.
* Perfect! I've successfully moved the X button to the absolute top right of the settings page. Here's what changed:
## Changes Made
**Updated SettingsLayout.tsx** (`frontend/src/pages/settings/SettingsLayout.tsx:28-44`)
1. Added `relative` positioning to the main container div
2. Moved the X button outside of the sidebar, placing it as an absolutely positioned element at `top-4 right-4`
3. Simplified the sidebar header - the "Settings" title now stands alone without the flex container
4. The X button now appears in the top right corner of the entire settings page, independent of the sidebar layout
The X button is now positioned at the absolute top right of the settings page container, exactly where you'd expect a close button to be in most applications!
* Perfect! I've made the adjustment to move the X button to the absolute top right of the settings page. Here's what I changed:
## Changes Made
**Updated SettingsLayout.tsx** (`frontend/src/pages/settings/SettingsLayout.tsx:29-37`)
1. Changed `top-4` to `top-0` - This positions the button at the very top edge of the container, right below the navbar
2. Added `z-10` - Ensures the button appears above other content and doesn't get hidden
The X button is now positioned at the absolute top right corner of the settings page container (just below the navbar), which should provide better visual separation from the hamburger menu and look cleaner overall. The button will be at the top edge of the settings content area without the extra spacing that was causing the cramped appearance.
* I've adjusted the X button positioning from `top-0` to `top-2`, which adds 0.5rem (8px) of spacing. This should create a bit more breathing room between the navbar hamburger menu and the X button.
However, looking at the screenshot you shared, it seems like we may need even more spacing. If this still looks too cramped, we could increase it to `top-4` (16px), `top-6` (24px), or even `top-8` (32px) to match the vertical padding of the container.
Could you check if this looks better? If it still needs more spacing, let me know and I can adjust it further.
* Revert "I've adjusted the X button positioning from `top-0` to `top-2`, which adds 0.5rem (8px) of spacing. This should create a bit more breathing room between the navbar hamburger menu and the X button."
This reverts commit e2d5617562e23edbfb25d7514f5a8758ba501eb1.
* Perfect! I've adjusted the X button positioning from `right-4` to `right-3` to match the navbar's `px-3` padding.
## Changes Made
**Updated SettingsLayout.tsx** (`frontend/src/pages/settings/SettingsLayout.tsx:33`)
Changed the X button's horizontal positioning from `right-4` (16px) to `right-3` (12px) to match the navbar's padding, ensuring the X button is now vertically aligned with the hamburger menu icon above it.
The X button should now be perfectly aligned with the hamburger menu in the navbar! Both icons are now 12px from the right edge of their respective containers.
* Perfect! I've successfully fixed the i18n regression. Here's a summary of what was done:
## Changes Made
### 1. Added "close" translation to all locale files
**en/common.json**: Added `"close": "Close"`
**es/common.json**: Added `"close": "Cerrar"`
**ja/common.json**: Added `"close": "閉じる"`
**ko/common.json**: Added `"close": "닫기"`
All added to the `buttons` section to maintain consistency with other button translations.
### 2. Updated SettingsLayout.tsx (`frontend/src/pages/settings/SettingsLayout.tsx:25,37`)
- Added a second translation hook: `const { t: tCommon } = useTranslation('common');`
- Changed the hardcoded text from `<span className="sr-only">Close</span>` to `<span className="sr-only">{tCommon('buttons.close')}</span>`
Now the close button's accessibility label will be properly translated based on the user's language preference, maintaining consistency with the rest of the application's i18n implementation!
* new settings close button (vibe-kanban) (#1018)
adds an esc button to settings in a new sticky header
* Lint
---------
Co-authored-by: Britannio Jarrett <britanniojarrett@gmail.com>
Co-authored-by: Britannio Jarrett <33752528+britannio@users.noreply.github.com>
201 lines
7.8 KiB
JSON
201 lines
7.8 KiB
JSON
{
|
|
"settings": {
|
|
"layout": {
|
|
"nav": {
|
|
"title": "Settings",
|
|
"general": "General",
|
|
"generalDesc": "Theme, notifications, and preferences",
|
|
"agents": "Agents",
|
|
"agentsDesc": "Coding agent configurations",
|
|
"mcp": "MCP Servers",
|
|
"mcpDesc": "Model Context Protocol servers"
|
|
}
|
|
},
|
|
"general": {
|
|
"loading": "Loading settings...",
|
|
"loadError": "Failed to load configuration.",
|
|
"save": {
|
|
"button": "Save Settings",
|
|
"success": "✓ Settings saved successfully!",
|
|
"error": "Failed to save configuration",
|
|
"unsavedChanges": "• You have unsaved changes",
|
|
"discard": "Discard"
|
|
},
|
|
"appearance": {
|
|
"title": "Appearance",
|
|
"description": "Customize how the application looks and feels.",
|
|
"theme": {
|
|
"label": "Theme",
|
|
"placeholder": "Select theme",
|
|
"helper": "Choose your preferred color scheme."
|
|
},
|
|
"language": {
|
|
"label": "Language",
|
|
"placeholder": "Select language",
|
|
"helper": "Choose your preferred language. Browser Default follows your system language."
|
|
}
|
|
},
|
|
"taskExecution": {
|
|
"title": "Task Execution",
|
|
"description": "Configure how tasks are executed and processed.",
|
|
"executor": {
|
|
"label": "Default Agent Configuration",
|
|
"placeholder": "Select profile",
|
|
"helper": "Choose the default agent configuration to use when creating a task attempt."
|
|
},
|
|
"variant": "DEFAULT",
|
|
"defaultLabel": "Default"
|
|
},
|
|
"editor": {
|
|
"title": "Editor",
|
|
"description": "Configure your code editing experience.",
|
|
"type": {
|
|
"label": "Editor Type",
|
|
"placeholder": "Select editor",
|
|
"helper": "Choose your preferred code editor interface."
|
|
}
|
|
},
|
|
"github": {
|
|
"title": "GitHub Integration",
|
|
"connected": "Connected as {{username}}",
|
|
"connectButton": "Connect GitHub Account",
|
|
"manage": "Manage",
|
|
"disconnect": "Disconnect",
|
|
"helper": "Connect your GitHub account to access private repositories and enable advanced Git operations.",
|
|
"or": "OR",
|
|
"pat": {
|
|
"label": "Personal Access Token",
|
|
"helper": "GitHub Personal Access Token with 'repo' permissions. Use this if OAuth permissions are insufficient for private repositories and organisation owned repositories.",
|
|
"createTokenLink": "Create token here"
|
|
}
|
|
},
|
|
"git": {
|
|
"title": "Git",
|
|
"description": "Configure git branch naming preferences",
|
|
"branchPrefix": {
|
|
"label": "Branch Prefix",
|
|
"placeholder": "vk",
|
|
"helper": "Prefix for auto-generated branch names. Leave empty for no prefix.",
|
|
"preview": "Preview:",
|
|
"previewWithPrefix": "{{prefix}}/1a2b-task-name",
|
|
"previewNoPrefix": "1a2b-task-name",
|
|
"errors": {
|
|
"slash": "Prefix cannot contain '/'.",
|
|
"startsWithDot": "Prefix cannot start with '.'.",
|
|
"endsWithDot": "Prefix cannot end with '.' or '.lock'.",
|
|
"invalidSequence": "Contains invalid sequence (.., @{).",
|
|
"invalidChars": "Contains invalid characters.",
|
|
"controlChars": "Contains control characters."
|
|
}
|
|
}
|
|
},
|
|
"notifications": {
|
|
"title": "Notifications",
|
|
"description": "Control when and how you receive notifications.",
|
|
"sound": {
|
|
"label": "Sound Notifications",
|
|
"helper": "Play a sound when task attempts finish running.",
|
|
"fileLabel": "Sound",
|
|
"filePlaceholder": "Select sound",
|
|
"fileHelper": "Choose the sound to play when tasks complete. Click the volume button to preview."
|
|
},
|
|
"push": {
|
|
"label": "Push Notifications",
|
|
"helper": "Show system notifications when task attempts finish running."
|
|
}
|
|
},
|
|
"privacy": {
|
|
"title": "Privacy",
|
|
"description": "Help improve Vibe-Kanban by sharing anonymous usage data.",
|
|
"telemetry": {
|
|
"label": "Enable Telemetry",
|
|
"helper": "Enables anonymous usage events tracking to help improve the application. No prompts or project information are collected."
|
|
}
|
|
},
|
|
"taskTemplates": {
|
|
"title": "Task Templates",
|
|
"description": "Manage global task templates that can be used across all projects."
|
|
},
|
|
"safety": {
|
|
"title": "Safety & Disclaimers",
|
|
"description": "Reset acknowledgments for safety warnings and onboarding.",
|
|
"disclaimer": {
|
|
"title": "Disclaimer Acknowledgment",
|
|
"description": "Reset the safety disclaimer.",
|
|
"button": "Reset"
|
|
},
|
|
"onboarding": {
|
|
"title": "Onboarding",
|
|
"description": "Reset the onboarding flow.",
|
|
"button": "Reset"
|
|
}
|
|
}
|
|
},
|
|
"agents": {
|
|
"title": "Coding Agent Configurations",
|
|
"description": "Customize the behavior of coding agents with different configurations.",
|
|
"loading": "Loading agent configurations...",
|
|
"save": {
|
|
"button": "Save Agent Configurations",
|
|
"success": "✓ Executor configurations saved successfully!"
|
|
},
|
|
"editor": {
|
|
"formLabel": "Edit JSON",
|
|
"agentLabel": "Agent",
|
|
"agentPlaceholder": "Select executor type",
|
|
"configLabel": "Configuration",
|
|
"configPlaceholder": "Select configuration",
|
|
"createNew": "Create new...",
|
|
"deleteTitle": "Cannot delete the last configuration",
|
|
"deleteButton": "Delete {{name}}",
|
|
"deleteText": "Delete",
|
|
"jsonLabel": "Agent Configuration (JSON)",
|
|
"jsonPlaceholder": "Loading profiles...",
|
|
"jsonLoading": "Loading...",
|
|
"pathLabel": "Configuration file location:"
|
|
},
|
|
"errors": {
|
|
"deleteFailed": "Failed to delete configuration. Please try again.",
|
|
"saveFailed": "Failed to save agent configurations. Please try again.",
|
|
"saveConfigFailed": "Failed to save configuration. Please try again."
|
|
}
|
|
},
|
|
"mcp": {
|
|
"title": "MCP Server Configuration",
|
|
"description": "Configure Model Context Protocol servers to extend coding agent capabilities with custom tools and resources.",
|
|
"loading": "Loading MCP configuration...",
|
|
"applying": "Applying configuration...",
|
|
"labels": {
|
|
"agent": "Agent",
|
|
"agentPlaceholder": "Select executor",
|
|
"agentHelper": "Choose which agent to configure MCP servers for.",
|
|
"serverConfig": "Server Configuration (JSON)",
|
|
"popularServers": "Popular servers",
|
|
"serverHelper": "Click a card to insert that MCP Server into the JSON above.",
|
|
"saveLocation": "Changes will be saved to:"
|
|
},
|
|
"loading": {
|
|
"jsonEditor": "Loading...",
|
|
"configuration": "Loading current MCP server configuration..."
|
|
},
|
|
"errors": {
|
|
"loadFailed": "Failed to load configuration.",
|
|
"invalidJson": "Invalid JSON format",
|
|
"validationError": "Validation error",
|
|
"saveFailed": "Failed to save MCP servers",
|
|
"applyFailed": "Failed to apply MCP server configuration",
|
|
"addServerFailed": "Failed to add preconfigured server",
|
|
"mcpError": "MCP Configuration Error: {{error}}",
|
|
"notSupported": "MCP Not Supported",
|
|
"supportMessage": "To use MCP servers, please select a different executor that supports MCP (Claude, Amp, Gemini, Codex, or Opencode) above."
|
|
},
|
|
"save": {
|
|
"button": "Save MCP Configuration",
|
|
"success": "Settings Saved!",
|
|
"successMessage": "✓ MCP configuration saved successfully!",
|
|
"loading": "Loading current MCP server configuration..."
|
|
}
|
|
}
|
|
}
|
|
}
|