bzuccaro/LLM-Labs
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Fix lab confidence tooltip styling

Browse Source
This commit is contained in:
c4ch3c4d3
2026-04-27 10:42:21 -06:00
parent 1e9f6fc0cf
commit 269a4e4985
4 changed files with 214 additions and 42 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/styles/globals.css
+39 -18
View File
@@ -914,17 +914,22 @@ ol {
}
.lab-content ul.concept-pill-list > li {
display: flex;
flex-wrap: wrap;
align-items: center;
gap: 0.55rem;
display: grid;
grid-template-columns: max-content minmax(0, 1fr);
align-items: baseline;
column-gap: 0.7rem;
row-gap: 0.28rem;
margin: 0;
padding: 0.48rem 0.78rem;
padding: 0.72rem 1rem;
border: 1px solid #d5e2ee;
border-radius: 999px;
background: linear-gradient(180deg, #f9fcff, #f4f9fe);
}
.lab-content ul.concept-pill-list > li > span:not(.concept-pill-label) {
line-height: 1.45;
}
.lab-content .concept-pill-label {
display: inline;
color: #0f4f76;
@@ -1899,7 +1904,10 @@ ol {
}
.lab-content ul.concept-pill-list > li {
grid-template-columns: 1fr;
row-gap: 0.3rem;
border-radius: 16px;
padding: 0.72rem 0.9rem;
}
.quantization-explorer__controls,
@@ -2052,7 +2060,8 @@ ol {
}
.lab-content a.lab-service-pill,
.lab-content a.lab-open-pill {
.lab-content a.lab-open-pill,
.lab-content a.lab-download-pill {
display: inline-flex;
align-items: center;
gap: 0.45rem;
@@ -2074,7 +2083,8 @@ ol {
}
.lab-content a.lab-service-pill::before,
.lab-content a.lab-open-pill::before {
.lab-content a.lab-open-pill::before,
.lab-content a.lab-download-pill::before {
content: "Open";
display: inline-flex;
align-items: center;
@@ -2088,8 +2098,13 @@ ol {
text-transform: uppercase;
}
.lab-content a.lab-download-pill::before {
content: "Download";
}
.lab-content a.lab-service-pill:hover,
.lab-content a.lab-open-pill:hover {
.lab-content a.lab-open-pill:hover,
.lab-content a.lab-download-pill:hover {
transform: translateY(-1px);
box-shadow: 0 12px 28px -22px rgba(15, 92, 139, 0.85);
}
@@ -2185,14 +2200,21 @@ ol {
.lab1-confidence__token {
position: relative;
border-radius: 0.42rem;
cursor: help;
padding: 0.12rem 0.08rem;
transition: filter 120ms ease;
}
.lab1-confidence__token:hover {
.lab1-confidence__token:hover,
.lab1-confidence__token[aria-describedby="lab1-confidence-tooltip"] {
filter: saturate(1.05);
}
.lab1-confidence__token:focus-visible {
outline: 2px solid rgba(15, 92, 139, 0.35);
outline-offset: 2px;
}
.lab1-confidence__token--very-high {
background: rgba(88, 185, 102, 0.3);
}
@@ -2214,25 +2236,24 @@ ol {
}
.lab1-confidence__tooltip {
position: absolute;
left: 0;
top: calc(100% + 0.45rem);
z-index: 5;
display: none;
position: fixed;
z-index: 50;
display: block;
min-width: 180px;
max-width: 260px;
max-width: min(260px, calc(100vw - 2rem));
border: 1px solid #d7e2ee;
border-radius: 0.85rem;
background: rgba(255, 255, 255, 0.98);
box-shadow: 0 18px 38px -26px rgba(17, 44, 73, 0.7);
color: #24384c;
padding: 0.7rem 0.8rem;
pointer-events: none;
transform: translateX(-50%);
white-space: normal;
}
.lab1-confidence__token:hover .lab1-confidence__tooltip,
.lab1-confidence__token:focus-visible .lab1-confidence__tooltip {
display: block;
.lab1-confidence__tooltip--above {
transform: translate(-50%, -100%);
}
.lab1-confidence__tooltip strong {