feat(advice): LLM brewing advice on every observation (#14)
Build and Push Image / Build and push image (push) Successful in 9m8s
Build and Push Image / Build and push image (push) Successful in 9m8s
feat(advice): LLM brewing advice on every observation (#14)
This commit was merged in pull request #14.
This commit is contained in:
@@ -689,3 +689,71 @@ table.data .comment { color: var(--text-muted); font-size: .84rem; }
|
||||
.reading-list__sg { font-family: var(--mono); font-weight: 650; flex: 0 0 4rem; }
|
||||
.reading-list__body { flex: 1; min-width: 0; }
|
||||
.reading-list__comment { color: var(--text-muted); font-size: .84rem; }
|
||||
|
||||
/* ------------------------------------------------------------- advice */
|
||||
|
||||
/* The LLM's advice. It sits next to the brewer's own comment, never
|
||||
replaces it, and is visually distinct so the two are never confused. */
|
||||
.advice {
|
||||
display: block;
|
||||
margin-top: .35rem;
|
||||
padding: .5rem .65rem;
|
||||
border-left: 2px solid var(--amber);
|
||||
border-radius: 0 4px 4px 0;
|
||||
background: var(--amber-dim);
|
||||
color: var(--text);
|
||||
font-size: .8125rem;
|
||||
line-height: 1.5;
|
||||
}
|
||||
|
||||
.advice__label {
|
||||
display: block;
|
||||
margin-bottom: .15rem;
|
||||
font-size: .625rem;
|
||||
font-weight: 600;
|
||||
letter-spacing: .08em;
|
||||
text-transform: uppercase;
|
||||
color: var(--amber-text);
|
||||
}
|
||||
|
||||
/* The advice on the active-beers card and the run detail page - the
|
||||
full text, not the clamped table cell. */
|
||||
.advice--reading {
|
||||
margin-top: .5rem;
|
||||
}
|
||||
|
||||
/* Advice that could not be generated - it says why. */
|
||||
.advice--failed {
|
||||
border-left-color: var(--danger);
|
||||
background: var(--danger-dim);
|
||||
color: var(--text-muted);
|
||||
}
|
||||
|
||||
.advice--failed .advice__label {
|
||||
color: var(--danger);
|
||||
}
|
||||
|
||||
.advice-cell {
|
||||
max-width: 32rem;
|
||||
}
|
||||
|
||||
/* In the table the advice is clamped to a few lines - the full text is
|
||||
on the run detail page, where there is room to read it. */
|
||||
.advice-cell .advice {
|
||||
margin-top: 0;
|
||||
font-size: .75rem;
|
||||
display: -webkit-box;
|
||||
-webkit-line-clamp: 4;
|
||||
line-clamp: 4;
|
||||
-webkit-box-orient: vertical;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
/* The clamped text opens up on hover, so the whole thing is readable
|
||||
without leaving the page. */
|
||||
.advice-cell:hover .advice,
|
||||
.advice-cell:focus-within .advice {
|
||||
-webkit-line-clamp: unset;
|
||||
line-clamp: unset;
|
||||
overflow: visible;
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user