a774ac673a
Some checks failed
Deploy analytics worker / Deploy analytics worker to ${{ (github.ref == 'refs/heads/production' && 'production') || (github.ref == 'refs/heads/main' && 'staging') || 'preview' }} (push) Failing after 1s
i18n upload strings / Upload latest strings (push) Failing after 1s
Deploy bemo / Deploy bemo to ${{ (github.ref == 'refs/heads/bemo-production' && 'production') || (github.ref == 'refs/heads/main' && 'staging') || 'preview' }} (push) Failing after 1s
Deploy grafana resources / ${{ github.event_name == 'push' && 'Deploy grafana resources' || 'Validate grafana resources (dry run)' }} (push) Failing after 0s
End to end tests (dotcom) / Check for relevant changes (push) Failing after 0s
End to end tests (examples) / Check for relevant changes (push) Failing after 0s
End to end tests (mermaid readability) / Check for relevant changes (push) Failing after 1s
End to end tests (perf) / Check for relevant changes (push) Failing after 0s
Publish editor extensions / Publish editor extensions (push) Failing after 1s
Publish SDK packages / Remove the publish-packages label (push) Has been skipped
Checks / Tests & checks (push) Has been cancelled
Checks / Build all projects (push) Has been cancelled
Deploy templates / Deploy templates (push) Has been cancelled
End to end tests (dotcom) / End to end tests (dotcom) (push) Has been cancelled
End to end tests (mermaid readability) / End to end tests (mermaid readability) (push) Has been cancelled
End to end tests (perf) / End to end tests (perf) (push) Has been cancelled
Deploy .com / Deploy dotcom to ${{ (github.ref == 'refs/heads/production' && 'production') || (github.ref == 'refs/heads/main' && 'staging') || 'preview' }} (push) Has been cancelled
End to end tests (examples) / End to end tests (examples) (push) Has been cancelled
Publish SDK packages / Publish SDK packages (push) Has been cancelled
Publish SDK packages / Tell user released version (push) Has been cancelled
Publish SDK packages / Publishes code templates to separate repositories (push) Has been cancelled
Publish SDK packages / Deploys the template demos with the new SDK version (push) Has been cancelled
110 lines
2.3 KiB
CSS
110 lines
2.3 KiB
CSS
/* avatar — a person's image, or a single-initial coloured circle. Shared by the mention picker and,
|
|
via @tldraw/commenting, the comment UI. */
|
|
.tlui-cmt-avatar {
|
|
width: 28px;
|
|
height: 28px;
|
|
border-radius: 50%;
|
|
background: var(--tl-color-selected);
|
|
color: #fff;
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: center;
|
|
font-size: 11px;
|
|
font-weight: 600;
|
|
flex-shrink: 0;
|
|
}
|
|
|
|
.tlui-cmt-avatar--image {
|
|
object-fit: cover;
|
|
background: none;
|
|
}
|
|
|
|
/* mention pill */
|
|
.tlui-cmt-mention {
|
|
color: var(--tl-color-selected);
|
|
font-weight: 600;
|
|
background: color-mix(in srgb, var(--tl-color-selected) 12%, transparent);
|
|
padding: 0 4px;
|
|
border-radius: 4px;
|
|
}
|
|
|
|
/* mention picker */
|
|
.tlui-cmt-mention-list {
|
|
display: flex;
|
|
flex-direction: column;
|
|
gap: 4px;
|
|
padding: 4px;
|
|
width: 100%;
|
|
box-sizing: border-box;
|
|
max-height: 260px;
|
|
overflow-y: auto;
|
|
color: var(--tl-color-text-1, #1d1d1d);
|
|
background: var(--tl-color-panel, #fff);
|
|
border-radius: 10px;
|
|
/* shadow-3 (like the context menu) already carries a 1px inset edge — a separate `border`
|
|
on top of it double-outlines the popup. */
|
|
box-shadow: var(--tl-shadow-3, 0 2px 12px rgba(0, 0, 0, 0.14));
|
|
}
|
|
|
|
.tlui-cmt-mention-list__item {
|
|
display: flex;
|
|
align-items: center;
|
|
gap: 8px;
|
|
padding: 6px 8px;
|
|
border: none;
|
|
background: transparent;
|
|
border-radius: 6px;
|
|
cursor: pointer;
|
|
text-align: left;
|
|
color: var(--tl-color-text-1);
|
|
font: inherit;
|
|
}
|
|
|
|
.tlui-cmt-mention-list__item--active,
|
|
.tlui-cmt-mention-list__item:hover {
|
|
background: var(--tl-color-muted-2, rgba(0, 0, 0, 0.06));
|
|
}
|
|
|
|
.tlui-cmt-mention-list__text {
|
|
display: flex;
|
|
flex-direction: column;
|
|
min-width: 0;
|
|
line-height: 1.3;
|
|
}
|
|
|
|
.tlui-cmt-mention-list__name {
|
|
font-size: 12px;
|
|
font-weight: 500;
|
|
white-space: nowrap;
|
|
overflow: hidden;
|
|
text-overflow: ellipsis;
|
|
}
|
|
|
|
.tlui-cmt-mention-list__you {
|
|
margin-left: 4px;
|
|
font-weight: 400;
|
|
color: var(--tl-color-text-3);
|
|
}
|
|
|
|
.tlui-cmt-mention-list__secondary {
|
|
font-size: 12px;
|
|
color: var(--tl-color-text-3);
|
|
white-space: nowrap;
|
|
overflow: hidden;
|
|
text-overflow: ellipsis;
|
|
}
|
|
|
|
.tlui-cmt-mention-list--empty {
|
|
padding: 8px 10px;
|
|
width: 100%;
|
|
box-sizing: border-box;
|
|
color: var(--tl-color-text-3);
|
|
font-size: 13px;
|
|
}
|
|
|
|
/* the @-picker popup — anchored under the editor field, positioned by the suggestion plugin */
|
|
.tlui-cmt-mention-popup {
|
|
position: fixed;
|
|
z-index: var(--tl-layer-menus);
|
|
}
|