kyuuseiryuu/my-kaiqiuwang
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

style(AppBar): adjust container positioning and width

Browse Source 
The AppBar container was previously positioned exactly at the bottom of the viewport, causing a potential 1px gap or overflow issue on certain screens.

- Changed `bottom` from `0` to `-1px` to pull the bar slightly up.
- Adjusted `left` to `-2px` and `width` to `calc(100vw + 4px)` to compensate for the negative left offset and ensure the bar spans the full visible area without horizontal scroll.

This ensures the fixed bar aligns perfectly with the viewport edges in all scenarios.
This commit is contained in:
kyuuseiryuu 2026-03-16 23:57:34 +09:00
parent f29974c111
commit 05200c8d48
1 changed files with 3 additions and 2 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

5
src/components/AppBar.tsx
View File

@ -6,8 +6,9 @@ import { isRunningStandalone } from "../utils/front";
const StyledContainer = styled.div` const StyledContainer = styled.div`
position: fixed; position: fixed;
bottom: 0; bottom: -1px;
width: 100vw; left: -2px;
width: calc(100vw + 4px);
box-shadow: 0 -2px 8px rgba(0, 0, 0, 0.3); box-shadow: 0 -2px 8px rgba(0, 0, 0, 0.3);
z-index: 1; z-index: 1;
background: #181818; background: #181818;