mainsail-crew / mainsail

Mainsail is the popular web interface for managing and controlling 3D printers with Klipper.
https://docs.mainsail.xyz
GNU General Public License v3.0
1.74k stars 376 forks source link

fix(Editor): fix editor width when sidebar is hidden #2014

Closed meteyou closed 2 months ago

meteyou commented 2 months ago

Description

This PR fix the width of the editor area, when the filestructur sidebar is closed.

Related Tickets & Documents

none

Mobile & Desktop Screenshots/Recordings

before: image

after: image

[optional] Are there any post-deployment tasks we need to perform?

none

Summary by Sourcery

Fix the editor width issue by updating the CSS to handle the presence or absence of the file structure sidebar.

Bug Fixes:

meteyou commented 2 months ago

@sourcery-ai review

sourcery-ai[bot] commented 2 months ago

Reviewer's Guide by Sourcery

This pull request fixes the editor width issue when the file structure sidebar is hidden. The implementation involves updating the CSS classes in the TheEditor.vue component to ensure the editor takes up the full width when the sidebar is closed.

File-Level Changes

Change Details Files
Adjust CSS classes to control editor width based on sidebar visibility
  • Add a new CSS class 'withSidebar' to the codemirror component
  • Update media query to set width:100% when sidebar is hidden
  • Modify existing CSS rule to apply only when 'withSidebar' class is present
src/components/TheEditor.vue

Tips - Trigger a new Sourcery review by commenting `@sourcery-ai review` on the pull request. - Continue your discussion with Sourcery by replying directly to review comments. - You can change your review settings at any time by accessing your [dashboard](https://app.sourcery.ai): - Enable or disable the Sourcery-generated pull request summary or reviewer's guide; - Change the review language; - You can always [contact us](mailto:support@sourcery.ai) if you have any questions or feedback.
meteyou commented 2 months ago

@sourcery-ai review