mirror of
https://github.com/wavetermdev/waveterm.git
synced 2025-11-28 05:00:26 +08:00
d272a4ec03Massive PR, over 13k LOC updated, 128 commits to implement the first pass at the new Wave AI panel. Two backend adapters (OpenAI and Anthropic), layout changes to support the panel, keyboard shortcuts, and a huge focus/layout change to integrate the panel seamlessly into the UI. Also fixes some small issues found during the Wave AI journey (zoom fixes, documentation, more scss removal, circular dependency issues, settings, etc)
152 lines
3.2 KiB
SCSS
152 lines
3.2 KiB
SCSS
// Copyright 2024, Command Line Inc.
|
|
// SPDX-License-Identifier: Apache-2.0
|
|
|
|
.workspace-switcher-button {
|
|
display: flex;
|
|
height: 26px;
|
|
padding: 0px 12px;
|
|
justify-content: flex-end;
|
|
align-items: center;
|
|
gap: 12px;
|
|
border-radius: 6px;
|
|
margin-right: 6px;
|
|
box-sizing: border-box;
|
|
background-color: rgb(from var(--main-text-color) r g b / 0.1) !important;
|
|
|
|
&:hover {
|
|
background-color: rgb(from var(--main-text-color) r g b / 0.14) !important;
|
|
}
|
|
|
|
.workspace-icon {
|
|
width: 15px;
|
|
height: 15px;
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: center;
|
|
}
|
|
}
|
|
|
|
.workspace-switcher-content {
|
|
min-height: auto;
|
|
display: flex;
|
|
width: 256px;
|
|
padding: 0;
|
|
flex-direction: column;
|
|
align-items: center;
|
|
border-radius: 8px;
|
|
box-shadow: 0px 8px 24px 0px var(--modal-shadow-color);
|
|
|
|
.icon-left,
|
|
.icon-right {
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: center;
|
|
font-size: 20px;
|
|
}
|
|
|
|
.divider {
|
|
width: 1px;
|
|
height: 20px;
|
|
background: rgba(255, 255, 255, 0.08);
|
|
}
|
|
|
|
.scrollable {
|
|
max-height: 400px;
|
|
width: 100%;
|
|
}
|
|
|
|
.title {
|
|
font-size: 12px;
|
|
line-height: 19px;
|
|
font-weight: 600;
|
|
margin-bottom: 5px;
|
|
width: 100%;
|
|
padding: 6px 8px 0px;
|
|
}
|
|
|
|
.expandable-menu {
|
|
gap: 5px;
|
|
}
|
|
|
|
.expandable-menu-item {
|
|
margin: 3px 8px;
|
|
}
|
|
|
|
.expandable-menu-item-group {
|
|
margin: 0 8px;
|
|
border: 1px solid transparent;
|
|
border-radius: 4px;
|
|
|
|
--workspace-color: var(--main-bg-color);
|
|
|
|
&:last-child {
|
|
margin-bottom: 4px;
|
|
border-bottom-left-radius: 8px;
|
|
border-bottom-right-radius: 8px;
|
|
}
|
|
|
|
.expandable-menu-item {
|
|
margin: 0;
|
|
}
|
|
|
|
.menu-group-title-wrapper {
|
|
display: flex;
|
|
width: 100%;
|
|
padding: 5px 8px;
|
|
border-radius: 4px;
|
|
.icons {
|
|
display: flex;
|
|
flex-direction: row;
|
|
gap: 5px;
|
|
}
|
|
|
|
.wave-iconbutton.edit {
|
|
visibility: hidden;
|
|
}
|
|
|
|
.wave-iconbutton.window {
|
|
cursor: default;
|
|
opacity: 1 !important;
|
|
}
|
|
}
|
|
|
|
&:hover .wave-iconbutton.edit {
|
|
visibility: visible;
|
|
}
|
|
|
|
&.open {
|
|
background-color: var(--modal-bg-color);
|
|
border: 1px solid var(--modal-border-color);
|
|
}
|
|
|
|
&.is-current .menu-group-title-wrapper {
|
|
background-color: rgb(from var(--workspace-color) r g b / 0.1);
|
|
}
|
|
}
|
|
|
|
.expandable-menu-item,
|
|
.expandable-menu-item-group-title {
|
|
font-size: 12px;
|
|
line-height: 19px;
|
|
padding: 5px 8px;
|
|
|
|
.content {
|
|
width: 100%;
|
|
}
|
|
|
|
&:hover {
|
|
background-color: transparent;
|
|
}
|
|
}
|
|
|
|
.expandable-menu-item-group-title {
|
|
height: 29px;
|
|
padding: 0;
|
|
}
|
|
|
|
.actions {
|
|
width: 100%;
|
|
padding: 3px 0;
|
|
border-top: 1px solid var(--modal-border-color);
|
|
}
|
|
}
|