feat: loading placeholder tile while new session is being created
- Inject .tile--loading skeleton tile into #session-grid immediately after POST /api/sessions succeeds, giving instant visual feedback while the backend creates the tmux session (which may take several seconds) - Remove the placeholder when the poll finds the session or on timeout - Add shimmer animation via @keyframes shimmer to style.css - Tile placed after original .tile-body pre rule to avoid selector-substring match in _extract_rule_block CSS tests
This commit is contained in:
@@ -239,6 +239,30 @@ body {
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
/* Loading placeholder tile — shown while a new session is being created */
|
||||
.tile--loading {
|
||||
opacity: 0.6;
|
||||
pointer-events: none;
|
||||
}
|
||||
|
||||
.tile--loading .tile-body pre {
|
||||
background: repeating-linear-gradient(
|
||||
90deg,
|
||||
var(--border) 0px,
|
||||
var(--bg-surface) 30px,
|
||||
var(--border) 60px
|
||||
);
|
||||
background-size: 200% 100%;
|
||||
animation: shimmer 1.5s ease-in-out infinite;
|
||||
min-height: 60px;
|
||||
border-radius: 2px;
|
||||
}
|
||||
|
||||
@keyframes shimmer {
|
||||
0% { background-position: 200% 0; }
|
||||
100% { background-position: -200% 0; }
|
||||
}
|
||||
|
||||
.tile-pre {
|
||||
position: absolute;
|
||||
inset: 0;
|
||||
|
||||
Reference in New Issue
Block a user