feat: status buttons as one-row group, wider side panel

- Status buttons now form a seamless button group (no gaps, shared borders,
  rounded ends) with flex-wrap: nowrap to keep them in one row
- Side panel width increased from 350px to 400px for more content space
This commit is contained in:
Yuyao Huang 2026-05-09 16:21:36 +08:00
parent 9c1d45506a
commit ea21b0c78c

View File

@ -99,20 +99,29 @@
.status-toggle { .status-toggle {
display: flex; display: flex;
gap: 0.5rem; gap: 0;
flex-wrap: wrap; flex-wrap: nowrap;
} }
.status-btn { .status-btn {
padding: 0.5rem 1rem; padding: 0.5rem 1rem;
border: 2px solid #ddd; border: 2px solid #ddd;
border-radius: 6px;
cursor: pointer; cursor: pointer;
font-size: 0.875rem; font-size: 0.875rem;
font-weight: 500; font-weight: 500;
transition: all 0.15s ease; transition: all 0.15s ease;
background: #f8f9fa; background: #f8f9fa;
color: #666; color: #666;
margin-left: -1px;
}
.status-btn:first-child {
border-radius: 6px 0 0 6px;
margin-left: 0;
}
.status-btn:last-child {
border-radius: 0 6px 6px 0;
} }
.status-btn.todo:hover { .status-btn.todo:hover {
@ -351,7 +360,7 @@
.side-panel { .side-panel {
position: relative; position: relative;
right: 0; right: 0;
width: 350px; width: 400px;
box-shadow: 0 2px 4px rgba(0,0,0,0.1); box-shadow: 0 2px 4px rgba(0,0,0,0.1);
border-radius: 8px; border-radius: 8px;
z-index: 1; z-index: 1;