File size: 2,579 Bytes
76fc93a 8fc8501 76fc93a 8fc8501 76fc93a 8fc8501 76fc93a | 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 100 101 102 103 104 105 106 107 108 109 110 111 112 113 114 115 116 117 118 119 120 121 | /* ============================================================================ */
/* Block handles + slash menu */
/* */
/* Inline tooling shown next to blocks and via the slash shortcut. */
/* ============================================================================ */
/* ---- Block handle (drag + add) ---- */
.block-handle {
display: flex;
align-items: center;
gap: 2px;
height: 32px;
}
.block-handle-btn {
width: 28px;
height: 28px;
display: flex;
align-items: center;
justify-content: center;
border: none;
background: none;
color: var(--text-faint);
border-radius: 6px;
cursor: pointer;
transition: color 0.12s, background 0.12s;
padding: 0;
line-height: 1;
}
.block-handle-btn:hover {
color: var(--muted-color);
background: var(--code-bg);
}
.block-handle-grip { cursor: grab; }
.block-handle-grip:active { cursor: grabbing; }
/* ---- Slash menu ---- */
.slash-menu {
background: var(--bg-surface);
border: 1px solid var(--border-color);
border-radius: 10px;
padding: 0.35rem;
min-width: 280px;
max-width: 340px;
max-height: 360px;
overflow-y: auto;
box-shadow: var(--shadow-lg);
}
.slash-menu-group + .slash-menu-group {
margin-top: 0.25rem;
padding-top: 0.35rem;
border-top: 1px solid var(--border-color);
}
.slash-menu-section {
font-size: 0.65rem;
font-weight: 600;
letter-spacing: 0.06em;
text-transform: uppercase;
color: var(--muted-color);
padding: 0.35rem 0.65rem 0.25rem;
user-select: none;
pointer-events: none;
}
.slash-menu-item {
display: flex;
align-items: center;
gap: 0.75rem;
padding: 0.45rem 0.6rem;
border-radius: 6px;
cursor: pointer;
transition: background 0.1s;
border: none;
background: none;
width: 100%;
text-align: left;
color: var(--text-color);
font-size: 0.875rem;
font-family: inherit;
}
.slash-menu-item:hover,
.slash-menu-item.is-selected {
background: var(--code-bg);
}
.slash-menu-item-icon {
width: 28px;
height: 28px;
display: flex;
align-items: center;
justify-content: center;
border-radius: 6px;
background: var(--code-bg);
color: var(--muted-color);
font-size: 0.9rem;
flex-shrink: 0;
}
.slash-menu-item-content {
display: flex;
flex-direction: column;
}
.slash-menu-item-title {
font-weight: 500;
color: var(--text-color);
font-size: 0.875rem;
}
.slash-menu-item-desc {
font-size: 0.75rem;
color: var(--muted-color);
}
|