SVI/ProxmoxVE
1
0
Fork 0
mirror of https://github.com/community-scripts/ProxmoxVE.git synced 2026-03-31 06:34:17 -04:00
Code Issues 2.6k Packages Projects Releases 10 Wiki Activity

[PR #5195] Refactor layout and component styles for improved responsiveness #5604

New Issue
Closed
opened 2025-11-20 07:06:44 -05:00 by saavagebueno · 0 comments
saavagebueno commented 2025-11-20 07:06:44 -05:00
Owner
Copy Link

Original Pull Request: https://github.com/community-scripts/ProxmoxVE/pull/5195

State: closed
Merged: Yes

✍️ Description

This pull request focuses on improving the layout and styling consistency across various components in the frontend application. The changes primarily involve updates to container widths, spacing, and borders to enhance responsiveness and visual alignment.

Layout and Width Adjustments:

Spacing and Margin Refinements:

Border and Styling Updates:

🔗 Related PR / Issue

Link: #

✅ Prerequisites (X in brackets)

  • Self-review completed – Code follows project standards.
  • Tested thoroughly – Changes work as expected.
  • No security risks – No hardcoded secrets, unnecessary privilege escalations, or permission issues.

🛠️ Type of Change (X in brackets)

  • 🐞 Bug fix – Resolves an issue without breaking functionality.
  • ✨ New feature – Adds new, non-breaking functionality.
  • 💥 Breaking change – Alters existing functionality in a way that may require updates.
  • 🆕 New script – A fully functional and tested script or script set.
  • 🌍 Website update – Changes to website-related JSON files or metadata.
  • 🔧 Refactoring / Code Cleanup – Improves readability or maintainability without changing functionality.
  • 📝 Documentation update – Changes to README, AppName.md, CONTRIBUTING.md, or other docs.

before:
image

after:
image

**Original Pull Request:** https://github.com/community-scripts/ProxmoxVE/pull/5195 **State:** closed **Merged:** Yes --- <!--🛑 New scripts must be submitted to [ProxmoxVED](https://github.com/community-scripts/ProxmoxVED) for testing. PRs without prior testing will be closed. --> ## ✍️ Description This pull request focuses on improving the layout and styling consistency across various components in the frontend application. The changes primarily involve updates to container widths, spacing, and borders to enhance responsiveness and visual alignment. ### Layout and Width Adjustments: * Updated the maximum width of the main layout container to `1440px` for better alignment with modern screen sizes (`frontend/src/app/layout.tsx`, [frontend/src/app/layout.tsxL107-R107](diffhunk://#diff-f3bfc5eb8ab49540cf25bb4422d423fac9a4e15f744eb2e2d3b2e1a1b03e441fL107-R107)). * Adjusted the maximum width of the `Navbar` container to `1440px` for consistency with the main layout (`frontend/src/components/Navbar.tsx`, [frontend/src/components/Navbar.tsxL37-R37](diffhunk://#diff-417a97ce505dbbb983da7835091f1beaf28c843d74c83ef9fddcba8f8e2332f1L37-R37)). * Modified the minimum and maximum widths of the `Sidebar` to `350px` for improved usability on larger screens (`frontend/src/app/scripts/_components/Sidebar.tsx`, [frontend/src/app/scripts/_components/Sidebar.tsxL25-R25](diffhunk://#diff-f907406a605cef175a92b4353b3138bba39cc4c6507c0791eb1a25ec8fbcdb28L25-R25)). ### Spacing and Margin Refinements: * Reduced the horizontal margin in the `ScriptContent` component from `7` to `4` for better spacing on smaller devices (`frontend/src/app/scripts/page.tsx`, [frontend/src/app/scripts/page.tsxL50-R50](diffhunk://#diff-5a9c3dc7a12c4b4ad906f37a76aea08c1425cdd16fbd7c240615865ffd4d453fL50-R50)). * Removed the top margin from the `ScriptAccordion` component to streamline its appearance (`frontend/src/app/scripts/_components/ScriptAccordion.tsx`, [frontend/src/app/scripts/_components/ScriptAccordion.tsxL59-R59](diffhunk://#diff-8737df428a29f2d126056300690f99402e331e7f03d3143bd6afdda418cf95b5L59-R59)). ### Border and Styling Updates: * Removed the transparency from the border in the `ScriptItem` component to ensure consistent visibility across themes (`frontend/src/app/scripts/_components/ScriptItem.tsx`, [frontend/src/app/scripts/_components/ScriptItem.tsxL135-R135](diffhunk://#diff-8211dae113b207283321d206905609d73b1aa3e743d4f716e01d02b9db590438L135-R135)). * Simplified the `max-w` constraint in the `ScriptItem` container for a more flexible layout (`frontend/src/app/scripts/_components/ScriptItem.tsx`, [frontend/src/app/scripts/_components/ScriptItem.tsxL123-R123](diffhunk://#diff-8211dae113b207283321d206905609d73b1aa3e743d4f716e01d02b9db590438L123-R123)). ## 🔗 Related PR / Issue Link: # ## ✅ Prerequisites (**X** in brackets) - [x] **Self-review completed** – Code follows project standards. - [x] **Tested thoroughly** – Changes work as expected. - [x] **No security risks** – No hardcoded secrets, unnecessary privilege escalations, or permission issues. --- ## 🛠️ Type of Change (**X** in brackets) - [ ] 🐞 **Bug fix** – Resolves an issue without breaking functionality. - [ ] ✨ **New feature** – Adds new, non-breaking functionality. - [ ] 💥 **Breaking change** – Alters existing functionality in a way that may require updates. - [ ] 🆕 **New script** – A fully functional and tested script or script set. - [ ] 🌍 **Website update** – Changes to website-related JSON files or metadata. - [ ] 🔧 **Refactoring / Code Cleanup** – Improves readability or maintainability without changing functionality. - [ ] 📝 **Documentation update** – Changes to `README`, `AppName.md`, `CONTRIBUTING.md`, or other docs. before: ![image](https://github.com/user-attachments/assets/95f17713-44ff-45a0-a2a2-d8c86807ca0d) after: ![image](https://github.com/user-attachments/assets/6c61f941-96d4-4e6c-8f52-48a219bf4e07)
saavagebueno added the pull-request label 2025-11-20 07:06:44 -05:00
Sign in to join this conversation.
No Branch/Tag Specified
Branches Tags
Labels
Clear labels
🛑 Failure to comply with the guidelines
breaking change
bug
bug
bugfix
deferred
delete script
dependencies
enhancement
external
feature
github
help wanted
Implemented in VED waiting push to Main
in project pipeline
invalid
investigation
json
maintenance
new script
new script
nice to have
not a script issue
not planned
organization
pull-request
Mirrored from GitHub Pull Request
 question
refactor
rename script
security
update script
website
wontdo
No Label pull-request
Milestone
No items
No Milestone
Projects
Clear projects
No project
Assignees
Clear assignees
saavagebueno
No Assignees
1 Participants
Notifications
Due Date
No due date set.
Dependencies

No dependencies set.

Reference: SVI/ProxmoxVE#5604
Delete Branch "%!s()"

Deleting a branch is permanent. Although the deleted branch may continue to exist for a short time before it actually gets removed, it CANNOT be undone in most cases. Continue?