Fix mobile bottom nav consistency and ticket view width
Mobile bottom nav: - Added nav-label class to all text labels in JS - Fixed icon sizing (20px fixed height) - Fixed label sizing (10px for all) - Equal width columns (25% each) - Changed gear emoji from ⚙️ to ⚙ for consistency Ticket view mobile: - Removed all borders from ticket container - Removed decorative corners on mobile - Reduced nested padding significantly - ascii-frame-inner now 0.75rem padding (was 1rem) - Nested ascii-frame-inner only 0.5rem - detail-group full-width has no padding - Content goes edge-to-edge Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
This commit is contained in:
@@ -5700,7 +5700,7 @@ table td:nth-child(4) {
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
right: 0;
|
||||
height: 64px;
|
||||
height: 60px;
|
||||
background: var(--bg-primary);
|
||||
border-top: 2px solid var(--terminal-green);
|
||||
z-index: var(--z-dropdown);
|
||||
@@ -5709,29 +5709,34 @@ table td:nth-child(4) {
|
||||
|
||||
.mobile-bottom-nav a,
|
||||
.mobile-bottom-nav button {
|
||||
flex: 1;
|
||||
flex: 1 1 25%;
|
||||
max-width: 25%;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
gap: 0.15rem;
|
||||
gap: 4px;
|
||||
background: transparent;
|
||||
border: none;
|
||||
color: var(--terminal-green);
|
||||
text-decoration: none;
|
||||
font-size: 0.7rem;
|
||||
font-family: var(--font-mono);
|
||||
padding: 0.5rem 0.25rem;
|
||||
min-height: 64px;
|
||||
padding: 8px 4px;
|
||||
min-height: 60px;
|
||||
}
|
||||
|
||||
.mobile-bottom-nav .nav-icon {
|
||||
font-size: 1.1rem;
|
||||
font-size: 20px;
|
||||
line-height: 1;
|
||||
height: 24px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
.mobile-bottom-nav .nav-label {
|
||||
font-size: 0.7rem;
|
||||
.mobile-bottom-nav .nav-label,
|
||||
.mobile-bottom-nav span:not(.nav-icon) {
|
||||
font-size: 10px;
|
||||
line-height: 1;
|
||||
text-transform: uppercase;
|
||||
letter-spacing: 0.5px;
|
||||
|
||||
@@ -2258,27 +2258,55 @@ body.dark-mode .editable {
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
/* Ticket container - full width on mobile */
|
||||
/* Ticket container - full width on mobile, minimal borders */
|
||||
.ticket-container {
|
||||
width: 100%;
|
||||
margin: 0;
|
||||
border-width: 2px;
|
||||
border-left: none;
|
||||
border-right: none;
|
||||
border: none;
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
.ticket-container.ascii-frame-outer {
|
||||
border: none;
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
/* Remove all decorative corners on mobile */
|
||||
.ticket-container::before,
|
||||
.ticket-container::after,
|
||||
.ticket-container .bottom-left-corner,
|
||||
.ticket-container .bottom-right-corner {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.ascii-section-header {
|
||||
font-size: 1rem;
|
||||
padding: 0.75rem 1rem;
|
||||
padding: 0.75rem 0.75rem;
|
||||
margin: 0;
|
||||
border-bottom: 2px solid var(--terminal-green);
|
||||
}
|
||||
|
||||
/* Remove all nested padding - go edge to edge */
|
||||
.ascii-content {
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
.ascii-frame-inner {
|
||||
padding: 1rem;
|
||||
padding: 0.75rem;
|
||||
border: none;
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
/* Nested ascii-frame-inner should have no extra padding */
|
||||
.ascii-frame-inner .ascii-frame-inner {
|
||||
padding: 0.5rem;
|
||||
}
|
||||
|
||||
/* Detail group full width */
|
||||
.detail-group.full-width {
|
||||
padding: 0;
|
||||
margin: 0;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
/* Better ticket header layout */
|
||||
|
||||
Reference in New Issue
Block a user