openclaw
Version:
Multi-channel AI gateway with extensible messaging integrations
2 lines (1 loc) • 11.8 kB
CSS
openclaw-board-view{width:100%;min-width:0;display:block}.board-view{--board-line:color-mix(in srgb, var(--border) 84%, transparent);--board-surface:color-mix(in srgb, var(--panel) 94%, transparent);gap:12px;min-width:0;display:grid;position:relative}.board-view__error{background:color-mix(in srgb, var(--danger) 8%, var(--panel));border:1px solid color-mix(in srgb, var(--danger) 42%, transparent);color:var(--danger);border-radius:9px;padding:9px 12px;font-size:12px}.board-tabs{border-bottom:1px solid var(--board-line);align-items:center;min-width:0;display:flex}.board-tabs__track{--track-width:0;scrollbar-width:none;flex:auto;min-width:0;display:block;overflow-x:auto}.board-tabs__track::part(nav){display:flex}.board-tabs__track::part(body){display:none}.board-tabs__track::-webkit-scrollbar{display:none}.board-tabs__tab{color:var(--muted);flex:none}.board-tabs__tab::part(base){border-bottom:2px solid #0000;min-height:38px;padding:0 13px;font-size:12.5px;transition:background .12s,border-color .12s,color .12s}.board-tabs__tab:focus-visible::part(base){background:color-mix(in srgb, var(--text) 6%, transparent);color:var(--text)}@media (hover:hover){.board-tabs__tab:hover::part(base){background:color-mix(in srgb, var(--text) 6%, transparent);color:var(--text)}}.board-tabs__tab--active::part(base){border-bottom-color:var(--accent);color:var(--text)}.board-tabs__tab--drop::part(base){background:color-mix(in srgb, var(--accent) 14%, transparent);box-shadow:inset 0 0 0 1px color-mix(in srgb, var(--accent) 70%, transparent)}.board-tabs__overflow,.board-widget__menu{margin-left:auto;position:relative}.board-tabs__overflow-trigger,.board-widget__menu-trigger{color:var(--muted);cursor:var(--cursor-action);-webkit-user-select:none;user-select:none;background:0 0;border:0;border-radius:7px;justify-content:center;align-items:center;display:inline-flex}.board-tabs__overflow-trigger{width:34px;height:30px}@media (hover:hover){.board-tabs__overflow-trigger:hover,.board-widget__menu-trigger:hover{background:color-mix(in srgb, var(--text) 10%, transparent);color:var(--text)}}.board-tabs__overflow::part(menu),.board-widget__menu::part(menu){min-width:190px;padding:var(--menu-padding);border:1px solid var(--overlay-border);border-radius:var(--menu-radius);background:var(--bg-elevated);box-shadow:var(--overlay-shadow)}.board-tabs__overflow-item{min-width:180px}.board-grid{grid-template-columns:repeat(12,minmax(0,1fr));grid-auto-rows:56px;gap:12px;min-width:0;display:grid;position:relative;container-type:inline-size}@container (width<=560px){.board-widget{order:var(--board-widget-order);grid-area:auto / 1 / span var(--board-widget-rows) / -1}}.board-grid__append-zone{border-top:1px dashed color-mix(in srgb, var(--accent) 48%, transparent);z-index:7;height:38px;position:absolute;bottom:-42px;left:0;right:0}openclaw-board-widget-cell{display:contents}.board-widget{background:var(--board-surface);border:1px solid var(--board-line);border-radius:12px;grid-template-rows:38px minmax(0,1fr);min-width:0;min-height:0;transition:border-color .12s,box-shadow .12s,transform .12s;display:grid;position:relative;overflow:visible;box-shadow:0 1px 1px #0000001f}.board-widget:focus-visible{box-shadow:0 0 0 2px color-mix(in srgb, var(--accent) 70%, transparent);outline:none}.board-widget--dragging{border-color:color-mix(in srgb, var(--accent) 72%, transparent);opacity:.88;z-index:8;transform:scale(.995);box-shadow:0 16px 36px #00000047}.board-widget__bar{background:color-mix(in srgb, var(--text) 3%, transparent);border-bottom:1px solid var(--board-line);border-radius:11px 11px 0 0;align-items:center;gap:7px;min-width:0;padding:0 6px;display:flex}.board-widget__drag-handle,.board-widget__resize-handle{color:var(--muted);background:0 0;border:0}.board-widget__drag-handle{cursor:grab;touch-action:none;border-radius:6px;justify-content:center;align-items:center;width:25px;height:27px;padding:0;font-size:17px;display:inline-flex}@media (hover:hover){.board-widget__drag-handle:hover{background:color-mix(in srgb, var(--text) 9%, transparent);color:var(--text)}}.board-widget__title{color:var(--text);text-overflow:ellipsis;white-space:nowrap;min-width:0;font-size:12.5px;font-weight:590;overflow:hidden}.board-widget__kind{border:1px solid var(--board-line);color:var(--muted);letter-spacing:.08em;border-radius:999px;margin-left:auto;padding:0 5px;font-size:8px;line-height:15px}.board-widget__menu{margin-left:0}.board-widget__menu-trigger{width:27px;height:27px;font-size:21px;line-height:1}.board-widget__menu-heading{color:var(--muted);letter-spacing:.08em;text-transform:uppercase;padding:7px 9px 3px;font-size:9px}.board-widget__menu-empty{color:var(--muted);padding:5px 9px;font-size:11px}.board-widget__menu wa-dropdown-item{font-size:11px}.board-widget__menu-separator{border-top:1px solid var(--board-line);margin:5px 3px}.board-widget__menu-danger{color:var(--danger)}.board-widget__menu-icon,.board-widget__menu-icon svg{width:14px;height:14px}.board-widget__body{min-height:0;position:relative;overflow:hidden}.board-widget__body--card{box-sizing:border-box;padding:var(--widget-frame-inset)}.board-widget__body--scrollable{overflow:auto}.board-widget__body--scrollable .board-widget__grant{box-sizing:border-box;height:auto;min-height:100%}.board-widget__error-overlay{position:absolute;inset:0}.board-widget__grant-dot{display:none}.board-widget__frame{background:var(--board-surface);border:0;width:100%;height:100%;display:block}.board-widget__plugin-loading,.board-widget__disabled-plugin{color:var(--muted);text-align:center;align-content:center;justify-items:center;gap:10px;min-height:100%;margin:0;padding:14px;font-size:11px;display:grid}.board-widget__disabled-plugin strong{color:var(--text)}.board-widget__mcp-app{min-height:100%;display:grid}.board-widget__mcp-app>.board-widget__grant{border-bottom:1px solid var(--board-line);height:auto;min-height:0;max-height:112px;padding:12px;overflow:auto}.board-widget__mcp-app-view{width:100%;min-height:160px;display:block}.board-widget__app-loading,.board-widget__stale{color:var(--muted);text-align:center;align-content:center;justify-items:center;gap:8px;min-height:160px;padding:16px;font-size:11px;display:grid}.board-widget__stale strong{color:var(--text);font-size:13px}.board-widget__stale>span{max-width:34ch;line-height:1.45}.board-widget__resize-handle{cursor:nwse-resize;touch-action:none;width:20px;height:20px;position:absolute;bottom:1px;right:1px}.board-widget__resize-handle:after{content:"";border-bottom:2px solid;border-right:2px solid;width:6px;height:6px;position:absolute;bottom:5px;right:5px}@media (hover:hover) and (pointer:fine){.board-widget{grid-template-rows:minmax(0,1fr);container-type:inline-size}.board-widget__bar{-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);background:color-mix(in srgb, var(--board-surface) 92%, transparent);border:1px solid var(--board-line);opacity:0;visibility:hidden;z-index:5;border-radius:999px;max-width:calc(100% - 176px);height:30px;padding:0 5px;transition:opacity .1s,visibility 0s linear .1s;position:absolute;top:7px;left:50%;transform:translate(-50%);box-shadow:0 4px 14px #0000002e}.board-widget__bar>.board-widget__title{max-width:200px}.board-widget__bar>.board-widget__drag-handle,.board-widget__bar>.board-widget__menu{flex-shrink:0}.board-widget__bar>.board-widget__kind,.board-widget__bar>.board-widget__capabilities{min-width:0;overflow:hidden}@container (width<=264px){.board-widget__bar{max-width:max(88px,100% - 96px);left:7px;transform:none}}@container (width<=376px){.board-widget__bar>.board-widget__title,.board-widget__bar>.board-widget__kind,.board-widget__bar>.board-widget__capabilities{display:none}}.board-widget__resize-handle{opacity:0;visibility:hidden;transition:opacity .1s,visibility 0s linear .1s}.board-widget:hover .board-widget__bar,.board-widget:hover .board-widget__resize-handle{opacity:1;visibility:visible;transition-delay:.35s}.board-widget:focus-within .board-widget__bar,.board-widget:focus-within .board-widget__resize-handle,.board-widget--dragging .board-widget__bar,.board-widget--dragging .board-widget__resize-handle{opacity:1;visibility:visible;transition-delay:0s}.board-widget:has(.board-widget__menu[open]) .board-widget__bar{opacity:1;visibility:visible;transition-delay:0s}.board-widget:has(.board-widget__menu[open]) .board-widget__resize-handle{opacity:1;visibility:visible;transition-delay:0s}.board-widget__grant-dot{background:var(--ok);pointer-events:none;z-index:4;border-radius:50%;width:6px;height:6px;transition:opacity .12s;display:block;position:absolute;top:10px;right:10px}.board-widget:hover .board-widget__grant-dot,.board-widget:focus-within .board-widget__grant-dot,.board-widget--dragging .board-widget__grant-dot{opacity:0}.board-widget:has(.board-widget__menu[open]) .board-widget__grant-dot{opacity:0}.board-widget--frameless:not(.board-widget--dragging){box-shadow:none;background:0 0;border-color:#0000}.board-widget--frameless:hover,.board-widget--frameless:focus-within{border-color:var(--board-line)}.board-widget--frameless:has(.board-widget__menu[open]){border-color:var(--board-line)}.board-widget__body{border-radius:11px}}.board-widget__grant,.board-widget__error{text-align:center;align-content:center;justify-items:center;gap:7px;height:100%;padding:16px;display:grid}.board-widget__grant strong,.board-widget__error strong{color:var(--text);font-size:13px}.board-widget__grant>span,.board-widget__error>span{color:var(--muted);max-width:32ch;font-size:11px;line-height:1.45}.board-widget__grant-summary{color:var(--muted);text-align:left;gap:4px;max-width:36ch;margin:0;padding-left:18px;font-size:11px;line-height:1.45;display:grid}.board-widget__grant-groups{text-align:left;gap:8px;max-width:100%;display:grid}.board-widget__grant-groups section{gap:3px;display:grid}.board-widget__grant-groups section>strong{color:var(--text);text-transform:uppercase;font-size:10px}.board-widget__capabilities{background:color-mix(in srgb, var(--ok) 13%, transparent);border:1px solid color-mix(in srgb, var(--ok) 45%, transparent);color:var(--ok);text-transform:uppercase;border-radius:999px;padding:3px 6px;font-size:9px;font-weight:650;line-height:1;display:inline-flex}.board-widget__grant-mark{background:color-mix(in srgb, var(--warn) 15%, transparent);border:1px solid color-mix(in srgb, var(--warn) 55%, transparent);color:var(--warn);border-radius:50%;justify-content:center;align-items:center;width:25px;height:25px;font-size:13px;font-weight:700;display:flex}.board-widget__grant-actions{gap:7px;display:flex}.board-widget__grant-actions button:disabled{cursor:progress;opacity:.55}.board-widget__grant--rejected{filter:saturate(.35);opacity:.74}.board-widget__error{background:color-mix(in srgb, var(--danger) 7%, transparent)}.board-widget__error--inline{width:min(100%,320px);height:auto;margin-top:4px;padding:8px}.board-widget__error details{color:var(--muted);max-width:100%;font-size:10px}.board-widget__error code{overflow-wrap:anywhere;max-width:100%;margin-top:5px;display:block}.board-empty{border:1px dashed color-mix(in srgb, var(--muted) 38%, transparent);color:var(--muted);text-align:center;border-radius:14px;flex-direction:column;justify-content:center;align-items:center;gap:7px;min-height:260px;padding:32px;display:flex}.board-empty strong{color:var(--text);font-size:14px}.board-empty span:last-child{font-size:12px}.board-empty__mark{color:var(--accent);font-size:24px}.board-announcer{clip:rect(0 0 0 0);clip-path:inset(50%);white-space:nowrap;width:1px;height:1px;position:absolute;overflow:hidden}@media (prefers-reduced-motion:reduce){.board-widget,.board-widget__bar,.board-widget__resize-handle,.board-tabs__tab{transition:none;animation:none}}