feat： 为 sidebar-footer 添加折叠功能，fix： 修复搜索图标偏下问题, feat(map): 新增两个电话亭坐标点位

[Misaka273]

• 🔎 修复搜索图标偏下问题
• ⚙️ 为 sidebar-footer 添加折叠功能
• 🆕 新增 sidebarFooterOpen 状态并持久化到 localStorage
• 🔘 添加折叠按钮，点击可收起/展开设置选项区域
• ⬇️ 收起后折叠按钮自动移至 sidebar-content 底部
• 📐 收起时释放的空间自动分配给 category-list
• 🔄 将 sidebar-content 布局从 grid 改为 flex 以支持动态空间分配
• 📍 新增电话亭 # 014 (4346.30, 275610.02)
• 📍 新增电话亭 # 015 (-265642.68, 357669.25)

Summary by Sourcery

Add a collapsible settings section to the sidebar footer, persist its open state, tweak sidebar layout for dynamic space allocation, and align the search icon visually.

New Features:

• Introduce a toggleable settings section in the sidebar footer with a button to expand or collapse its contents.
• Persist the sidebar footer open/closed state across sessions via stored marker filters.
• Add new telephone booth marker locations to the map data.

Bug Fixes:

• Adjust search icon spacing so the icon is vertically aligned with the input field.

Enhancements:

• Refine sidebar layout by switching the main sidebar content to a flex-based column layout so category lists gain space when the footer is collapsed and making the footer scrollable with a dedicated body container.

[sourcery-ai]

Reviewer's Guide

Implements a collapsible settings section in the sidebar footer with persisted open/closed state, adjusts the sidebar layout to flex to reallocate space when collapsed, fixes the vertical alignment of the search icon, and adds two new phone booth markers to the map data.

Sequence diagram for toggling and persisting sidebar footer open state

sequenceDiagram
  actor User
  participant SidebarFooterToggleButton as SidebarFooterToggleButton
  participant MapApp as useMapApp
  participant LocalStorage

  User ->> SidebarFooterToggleButton: click
  SidebarFooterToggleButton ->> MapApp: sidebarFooterOpen = !sidebarFooterOpen
  MapApp ->> MapApp: watch(sidebarFooterOpen, persistMarkerFilters)
  MapApp ->> MapApp: persistMarkerFilters()
  MapApp ->> LocalStorage: setItem(markerFilters, updatedFilters)

Loading

File-Level Changes

Change	Details	Files
Fix vertical misalignment of the search icon in the UI.	Adjust the search icon’s top margin so it visually centers relative to surrounding elements.	src/styles.css
Refactor sidebar layout to support a collapsible footer whose space is reallocated to the category list.	Change .sidebar-content from a two-row CSS grid to a vertical flex layout to allow dynamic height distribution. Make .sidebar-categories a flex column and allow it to grow to fill remaining space when the footer is collapsed. Convert .sidebar-footer into a flex column container with scrollable content. Add styles for the new sidebar-footer toggle button and body container to control layout, typography, and icon appearance.	src/styles.css
Add a collapsible settings section in the sidebar footer with persisted open/closed state.	Introduce a sidebarFooterOpen reactive state, defaulting to open unless explicitly stored as closed in persisted marker filters. Expose sidebarFooterOpen from useMapApp and include it in the returned API used by App.vue. Persist sidebarFooterOpen to localStorage alongside existing marker filter preferences using persistMarkerFilters and a new watcher. Add a toggle button in the sidebar footer that flips sidebarFooterOpen and updates the label and caret icon based on state. Wrap the existing settings/filter controls in a container that is conditionally shown via v-show bound to sidebarFooterOpen so they collapse/expand.	src/composables/useMapApp.js src/App.vue
Add two new phone booth markers to the map data.	Append phone booth feat： 为 sidebar-footer 添加折叠功能，fix： 修复搜索图标偏下问题, feat(map): 新增两个电话亭坐标点位 #14 at coordinates (4346.30, 275610.02) to the map data JSON. Append phone booth #015 at coordinates (-265642.68, 357669.25) to the map data JSON.	src/data/map-data.json

---

Tips and commands

Interacting with Sourcery

• Trigger a new review: Comment @sourcery-ai review on the pull request.
• Continue discussions: Reply directly to Sourcery's review comments.
• Generate a GitHub issue from a review comment: Ask Sourcery to create an
  issue from a review comment by replying to it. You can also reply to a
  review comment with @sourcery-ai issue to create an issue from it.
• Generate a pull request title: Write @sourcery-ai anywhere in the pull
  request title to generate a title at any time. You can also comment
  @sourcery-ai title on the pull request to (re-)generate the title at any time.
• Generate a pull request summary: Write @sourcery-ai summary anywhere in
  the pull request body to generate a PR summary at any time exactly where you
  want it. You can also comment @sourcery-ai summary on the pull request to
  (re-)generate the summary at any time.
• Generate reviewer's guide: Comment @sourcery-ai guide on the pull
  request to (re-)generate the reviewer's guide at any time.
• Resolve all Sourcery comments: Comment @sourcery-ai resolve on the
  pull request to resolve all Sourcery comments. Useful if you've already
  addressed all the comments and don't want to see them anymore.
• Dismiss all Sourcery reviews: Comment @sourcery-ai dismiss on the pull
  request to dismiss all existing Sourcery reviews. Especially useful if you
  want to start fresh with a new review - don't forget to comment
  @sourcery-ai review to trigger a new review!

Customizing Your Experience

Access your dashboard to:

• Enable or disable review features such as the Sourcery-generated pull request
  summary, the reviewer's guide, and others.
• Change the review language.
• Add, remove or edit custom review instructions.
• Adjust other review settings.

Getting Help

• Contact our support team for questions or feedback.
• Visit our documentation for detailed guides and information.
• Keep in touch with the Sourcery team by following us on X/Twitter, LinkedIn or GitHub.

[sourcery-ai]

Hey - I've left some high level feedback:

• The new .sidebar-footer__toggle is rendered before the footer body while using flex-direction: column, so margin-top: auto won’t actually push it to the bottom of the footer; consider either rendering the toggle after .sidebar-footer__body or using a different flex layout strategy to reliably anchor the toggle at the bottom as described.
• The margin-top: -8px tweak on .search-icon feels like a magic number tied to the current font/line-height; you may want to align it using flexbox or vertical-align on the parent container instead so it’s more robust to future UI/style changes.

Prompt for AI Agents

Please address the comments from this code review:

## Overall Comments
- The new `.sidebar-footer__toggle` is rendered before the footer body while using `flex-direction: column`, so `margin-top: auto` won’t actually push it to the bottom of the footer; consider either rendering the toggle after `.sidebar-footer__body` or using a different flex layout strategy to reliably anchor the toggle at the bottom as described.
- The `margin-top: -8px` tweak on `.search-icon` feels like a magic number tied to the current font/line-height; you may want to align it using flexbox or vertical-align on the parent container instead so it’s more robust to future UI/style changes.

---

Sourcery is free for open source - if you like our reviews please consider sharing them ✨

• X
• Mastodon
• LinkedIn
• Facebook

_{Help me be more useful! Please click 👍 or 👎 on each comment and I'll use the feedback to improve your reviews.}