Calendar mobile fix + Android APK 41MB built
- Calendar: compact mobile header, nowrap date, pill view switcher - Android APK: info.hasdo.taskteam v1.0.0, 41MB, SDK 24-36 - APK at mobile/dist/android/task-team-v1.0.0-release.apk Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
This commit is contained in:
@@ -252,3 +252,107 @@ main {
|
|||||||
::selection {
|
::selection {
|
||||||
background: rgba(59, 130, 246, 0.3);
|
background: rgba(59, 130, 246, 0.3);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
/* ============================
|
||||||
|
FullCalendar Mobile Layout Fix
|
||||||
|
============================ */
|
||||||
|
|
||||||
|
/* Base toolbar styles - compact */
|
||||||
|
.fc .fc-toolbar {
|
||||||
|
flex-wrap: wrap;
|
||||||
|
gap: 4px 8px;
|
||||||
|
row-gap: 6px;
|
||||||
|
font-size: 14px;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Title: prevent vertical text wrapping */
|
||||||
|
.fc .fc-toolbar-title {
|
||||||
|
font-size: 18px !important;
|
||||||
|
white-space: nowrap;
|
||||||
|
overflow: hidden;
|
||||||
|
text-overflow: ellipsis;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Compact buttons */
|
||||||
|
.fc .fc-button {
|
||||||
|
padding: 4px 10px !important;
|
||||||
|
font-size: 13px !important;
|
||||||
|
line-height: 1.4 !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Button group: no extra gaps */
|
||||||
|
.fc .fc-button-group {
|
||||||
|
gap: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Mobile breakpoint: stack toolbar rows */
|
||||||
|
@media (max-width: 640px) {
|
||||||
|
.fc .fc-toolbar {
|
||||||
|
flex-direction: column;
|
||||||
|
align-items: center;
|
||||||
|
gap: 6px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.fc .fc-toolbar-chunk {
|
||||||
|
display: flex;
|
||||||
|
justify-content: center;
|
||||||
|
align-items: center;
|
||||||
|
gap: 4px;
|
||||||
|
width: 100%;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Title on its own row, centered, smaller */
|
||||||
|
.fc .fc-toolbar-title {
|
||||||
|
font-size: 15px !important;
|
||||||
|
text-align: center;
|
||||||
|
width: 100%;
|
||||||
|
order: -1;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Smaller buttons on mobile */
|
||||||
|
.fc .fc-button {
|
||||||
|
padding: 3px 8px !important;
|
||||||
|
font-size: 12px !important;
|
||||||
|
min-height: 32px !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* View switcher as pill buttons */
|
||||||
|
.fc .fc-button-group .fc-button {
|
||||||
|
border-radius: 0 !important;
|
||||||
|
}
|
||||||
|
.fc .fc-button-group .fc-button:first-child {
|
||||||
|
border-radius: 9999px 0 0 9999px !important;
|
||||||
|
}
|
||||||
|
.fc .fc-button-group .fc-button:last-child {
|
||||||
|
border-radius: 0 9999px 9999px 0 !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Reduce page padding */
|
||||||
|
.fc {
|
||||||
|
font-size: 12px;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Time grid slot labels smaller */
|
||||||
|
.fc .fc-timegrid-slot-label {
|
||||||
|
font-size: 10px;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Day header smaller */
|
||||||
|
.fc .fc-col-header-cell-cushion {
|
||||||
|
font-size: 12px;
|
||||||
|
padding: 4px 2px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Small mobile (< 400px) - even tighter */
|
||||||
|
@media (max-width: 400px) {
|
||||||
|
.fc .fc-toolbar-title {
|
||||||
|
font-size: 13px !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
.fc .fc-button {
|
||||||
|
padding: 2px 6px !important;
|
||||||
|
font-size: 11px !important;
|
||||||
|
min-height: 28px !important;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|||||||
Reference in New Issue
Block a user