peter/daybook
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Harmonize AgentFeed pane headers

Browse source
This commit is contained in:
peter 2026-06-11 15:18:49 +01:00
parent ba9f5eb168
commit 74654f71dd
2 changed files with 145 additions and 42 deletions
Download patch file Download diff file Expand all files Collapse all files

104
static/daybook.css
View file

@ -1,4 +1,7 @@
:root {
--pane-bar-height: 2.75rem;
--pane-bar-bg: #e8dcc8;
--grid-line: rgba(104, 84, 59, 0.16);
color-scheme: light;
font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
background: #f4f1ea;
@ -131,7 +134,7 @@ h1 {
.artifact-sidebar,
.preview-pane {
min-width: 0;
padding: 0.55rem;
padding: 0;
}
.day-sidebar,
@ -143,7 +146,9 @@ h1 {
}
.day-sidebar {
overflow-y: auto;
display: flex;
flex-direction: column;
overflow-y: hidden;
}
.artifact-sidebar {
@ -153,6 +158,7 @@ h1 {
padding: 0;
}
.day-list,
.artifact-list {
min-height: 0;
overflow-x: hidden;
@ -161,29 +167,29 @@ h1 {
scrollbar-width: none;
}
.day-sidebar:hover,
.day-sidebar:hover .day-list,
.artifact-sidebar:hover .artifact-list {
scrollbar-color: rgba(23, 49, 59, 0.35) transparent;
scrollbar-width: thin;
}
.day-sidebar::-webkit-scrollbar,
.day-list::-webkit-scrollbar,
.artifact-list::-webkit-scrollbar {
width: 0;
}
.day-sidebar:hover::-webkit-scrollbar,
.day-sidebar:hover .day-list::-webkit-scrollbar,
.artifact-sidebar:hover .artifact-list::-webkit-scrollbar {
width: 6px;
}
.day-sidebar::-webkit-scrollbar-thumb,
.day-list::-webkit-scrollbar-thumb,
.artifact-list::-webkit-scrollbar-thumb {
background: rgba(23, 49, 59, 0.35);
border-radius: 999px;
}
.day-sidebar::-webkit-scrollbar-track,
.day-list::-webkit-scrollbar-track,
.artifact-list::-webkit-scrollbar-track {
background: transparent;
}
@ -200,7 +206,7 @@ h1 {
align-items: stretch;
display: flex;
flex-direction: column;
justify-content: center;
justify-content: flex-start;
min-height: 0;
padding: 0;
}
@ -237,7 +243,7 @@ h1 {
color: #68543b;
font-size: 0.68rem;
letter-spacing: 0.1em;
margin: 0 0 0.45rem;
margin: 0;
text-transform: uppercase;
}
@ -247,7 +253,10 @@ h1 {
}
.day-list {
align-content: start;
flex: 1 1 auto;
gap: 0.35rem;
padding: 0.55rem;
}
.day-link,
@ -313,12 +322,35 @@ h1 {
font-size: 0.82rem;
}
.pane-heading {
.pane-bar {
align-items: baseline;
background: var(--pane-bar-bg);
box-sizing: border-box;
display: flex;
flex: 0 0 var(--pane-bar-height);
gap: 0.55rem;
height: var(--pane-bar-height);
justify-content: space-between;
margin: 0;
padding: 0.55rem;
min-height: var(--pane-bar-height);
padding: 0 0.65rem;
}
.pane-heading,
.preview-actions {
border-bottom: 1px solid #c7b48f;
}
.day-sidebar .pane-bar,
.artifact-sidebar .pane-bar {
align-items: center;
justify-content: center;
text-align: center;
}
.artifact-sidebar .pane-heading {
flex-direction: column;
gap: 0.04rem;
}
.new-artifacts-banner {
@ -334,7 +366,7 @@ h1 {
margin: 0 0.55rem 0.5rem;
padding: 0.48rem 0.7rem;
text-align: center;
width: 100%;
width: calc(100% - 1.1rem);
}
.new-artifacts-banner[hidden] {
@ -354,6 +386,7 @@ h1 {
align-items: stretch;
background: #fffaf0;
border: 0;
border-bottom: 1px solid var(--grid-line);
border-radius: 0;
display: grid;
gap: 0;
@ -394,7 +427,7 @@ h1 {
.kind-icon {
align-items: center;
background: rgba(23, 49, 59, 0.04);
background: rgba(23, 49, 59, 0.035);
color: #657173;
display: inline-flex;
font-size: 0.56rem;
@ -424,6 +457,7 @@ h1 {
.artifact-row-main {
align-items: center;
border-right: 1px solid var(--grid-line);
display: flex;
min-width: 0;
padding: 0.42rem 0.55rem;
@ -441,6 +475,7 @@ h1 {
.artifact-time {
align-items: center;
background: #efe5d3;
border-right: 1px solid var(--grid-line);
display: flex;
justify-content: flex-end;
justify-self: stretch;
@ -478,7 +513,15 @@ kbd {
padding: 0.08rem 0.28rem;
}
.preview-pane > .preview-empty {
.preview-body {
align-items: stretch;
display: flex;
flex: 1 1 auto;
flex-direction: column;
min-height: 0;
}
.preview-body > .preview-empty {
align-self: center;
margin: auto;
}
@ -491,16 +534,30 @@ kbd {
min-height: 0;
}
.artifact-actions {
.preview-actions {
align-items: center;
background: #d9c9ad;
border-top: 1px solid #c7b48f;
background: var(--pane-bar-bg);
display: flex;
flex: 0 0 auto;
gap: 0.75rem;
justify-content: space-between;
min-height: 2.25rem;
padding: 0.28rem 0.55rem;
justify-content: space-between;
}
.preview-title {
color: #17313b;
flex: 1 1 auto;
font-size: 0.78rem;
font-weight: 700;
min-width: 0;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.preview-actions .view-toggle,
.preview-actions .artifact-action-links {
flex: 0 0 auto;
}
.artifact-action-links {
@ -523,6 +580,13 @@ kbd {
text-decoration: none;
}
.view-toggle a.disabled,
.artifact-action-links a.disabled {
cursor: not-allowed;
opacity: 0.48;
pointer-events: none;
}
.artifact-action-links button:disabled {
cursor: not-allowed;
opacity: 0.48;
@ -556,7 +620,7 @@ kbd {
.toolbar,
.filter,
.artifact-actions {
.preview-actions {
align-items: stretch;
flex-wrap: wrap;
}