improve ai alert copilot ux
This commit is contained in:
parent
ebdc4ab8e6
commit
32e965d782
15 changed files with 931 additions and 15 deletions
|
|
@ -1182,6 +1182,7 @@ h3 {
|
|||
.copilot-empty,
|
||||
.copilot-device-code,
|
||||
.copilot-task-text,
|
||||
.copilot-markdown,
|
||||
.copilot-json-block {
|
||||
margin: 0;
|
||||
}
|
||||
|
|
@ -1317,6 +1318,45 @@ h3 {
|
|||
background: oklch(0.12 0.01 250 / 0.72);
|
||||
}
|
||||
|
||||
.copilot-task-output-empty {
|
||||
color: var(--text-dim);
|
||||
}
|
||||
|
||||
.copilot-task-running-row {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 10px;
|
||||
padding: 10px 12px;
|
||||
border: 1px solid oklch(0.78 0.12 74 / 0.24);
|
||||
border-radius: 10px;
|
||||
background: oklch(0.78 0.12 74 / 0.06);
|
||||
}
|
||||
|
||||
.copilot-task-running-row .terminal-button {
|
||||
margin-left: auto;
|
||||
}
|
||||
|
||||
.copilot-spinner {
|
||||
width: 16px;
|
||||
height: 16px;
|
||||
flex: 0 0 auto;
|
||||
border-radius: 999px;
|
||||
border: 2px solid oklch(0.88 0.06 76 / 0.3);
|
||||
border-top-color: oklch(0.88 0.06 76);
|
||||
animation: copilot-spin 0.8s linear infinite;
|
||||
}
|
||||
|
||||
@keyframes copilot-spin {
|
||||
to {
|
||||
transform: rotate(360deg);
|
||||
}
|
||||
}
|
||||
|
||||
.terminal-button.is-active {
|
||||
border-color: var(--border-strong);
|
||||
box-shadow: 0 0 0 1px oklch(0.78 0.12 74 / 0.22);
|
||||
}
|
||||
|
||||
.copilot-task-text,
|
||||
.copilot-json-block,
|
||||
.copilot-device-code {
|
||||
|
|
@ -1329,6 +1369,78 @@ h3 {
|
|||
line-height: 1.55;
|
||||
}
|
||||
|
||||
.copilot-markdown {
|
||||
padding: 14px;
|
||||
border-radius: 10px;
|
||||
border: 1px solid var(--border);
|
||||
background: oklch(0.1 0.009 250 / 0.92);
|
||||
color: var(--text);
|
||||
font-family: var(--font-sans), sans-serif;
|
||||
line-height: 1.6;
|
||||
}
|
||||
|
||||
.copilot-markdown > :first-child {
|
||||
margin-top: 0;
|
||||
}
|
||||
|
||||
.copilot-markdown > :last-child {
|
||||
margin-bottom: 0;
|
||||
}
|
||||
|
||||
.copilot-markdown h1,
|
||||
.copilot-markdown h2,
|
||||
.copilot-markdown h3,
|
||||
.copilot-markdown h4 {
|
||||
margin: 1.1em 0 0.45em;
|
||||
color: var(--text);
|
||||
font-family: var(--font-display), sans-serif;
|
||||
line-height: 1.18;
|
||||
}
|
||||
|
||||
.copilot-markdown p,
|
||||
.copilot-markdown ul,
|
||||
.copilot-markdown ol,
|
||||
.copilot-markdown blockquote,
|
||||
.copilot-markdown pre {
|
||||
margin: 0.75em 0;
|
||||
}
|
||||
|
||||
.copilot-markdown ul,
|
||||
.copilot-markdown ol {
|
||||
padding-left: 1.25rem;
|
||||
}
|
||||
|
||||
.copilot-markdown li + li {
|
||||
margin-top: 0.35em;
|
||||
}
|
||||
|
||||
.copilot-markdown code {
|
||||
font-family: var(--font-mono), monospace;
|
||||
font-size: 0.92em;
|
||||
color: oklch(0.88 0.06 76);
|
||||
}
|
||||
|
||||
.copilot-markdown :not(pre) > code {
|
||||
padding: 0.1rem 0.32rem;
|
||||
border-radius: 6px;
|
||||
background: oklch(0.97 0.008 250 / 0.08);
|
||||
border: 1px solid oklch(0.72 0.012 250 / 0.14);
|
||||
}
|
||||
|
||||
.copilot-markdown pre {
|
||||
overflow-x: auto;
|
||||
padding: 12px;
|
||||
border-radius: 10px;
|
||||
border: 1px solid var(--border);
|
||||
background: oklch(0.07 0.008 250 / 0.9);
|
||||
}
|
||||
|
||||
.copilot-markdown blockquote {
|
||||
padding-left: 12px;
|
||||
border-left: 3px solid var(--accent);
|
||||
color: var(--text-dim);
|
||||
}
|
||||
|
||||
.copilot-device-code {
|
||||
font-size: clamp(1.3rem, 2vw, 1.7rem);
|
||||
letter-spacing: 0.18em;
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue