quick v0.7.0 fixes (#428)

* update mask color for tabswitcher to work on lightmode

* fix background color on code blocks in markdown in light mode

* update wording on disconnected modal (restart wave backend instead of restart server)

* fix tooltip (should be Ctrl-Space)

* cleanup line-height/padding for code blocks
This commit is contained in:
Mike Sawka 2024-03-11 12:03:30 -07:00 committed by GitHub
parent eab2cb616d
commit 77ea45392a
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
7 changed files with 24 additions and 18 deletions

View File

@ -60,6 +60,7 @@
--app-panel-bg-color-dev: rgb(21, 23, 48); --app-panel-bg-color-dev: rgb(21, 23, 48);
--app-icon-color: rgb(139, 145, 138); --app-icon-color: rgb(139, 145, 138);
--app-icon-hover-color: #fff; --app-icon-hover-color: #fff;
--app-selected-mask-color: rgba(255, 255, 255, 0.06);
/* icon colors */ /* icon colors */

View File

@ -17,6 +17,7 @@
--app-panel-bg-color-dev: #e0e0e0; --app-panel-bg-color-dev: #e0e0e0;
--app-icon-color: rgb(80, 80, 80); --app-icon-color: rgb(80, 80, 80);
--app-icon-hover-color: rgb(100, 100, 100); --app-icon-hover-color: rgb(100, 100, 100);
--app-selected-mask-color: rgba(0, 0, 0, 0.06);
--input-bg-color: #eeeeee; --input-bg-color: #eeeeee;
@ -50,6 +51,8 @@
--form-element-disabled-text-color: #b7b7b7; --form-element-disabled-text-color: #b7b7b7;
--form-element-placeholder-color: #b7b7b7; --form-element-placeholder-color: #b7b7b7;
--markdown-bg-color: rgb(0, 0, 0, 0.1);
/* modal colors */ /* modal colors */
--modal-header-bottom-border-color: rgba(0, 0, 0, 0.3); --modal-header-bottom-border-color: rgba(0, 0, 0, 0.3);

View File

@ -8,19 +8,6 @@
margin-bottom: 10px; margin-bottom: 10px;
} }
code {
background-color: var(--markdown-bg-color);
color: var(--app-text-color);
font-family: var(--termfontfamily);
border-radius: 4px;
}
code.inline {
padding-top: 0;
padding-bottom: 0;
font-family: var(--termfontfamily);
}
.title { .title {
color: var(--app-text-color); color: var(--app-text-color);
margin-top: 16px; margin-top: 16px;
@ -62,14 +49,29 @@
pre { pre {
background-color: var(--markdown-bg-color); background-color: var(--markdown-bg-color);
margin: 4px 10px 4px 10px; margin: 4px 10px 4px 10px;
padding: 6px 6px 6px 10px; padding: 0.7em;
border-radius: 4px; border-radius: 4px;
code {
background-color: transparent;
padding: 0;
line-height: normal;
}
} }
pre.selected { pre.selected {
outline: 2px solid var(--markdown-outline-color); outline: 2px solid var(--markdown-outline-color);
} }
code {
color: var(--app-text-color);
font-family: var(--termfontfamily);
border-radius: 4px;
background-color: var(--markdown-bg-color);
padding: 0.15em 0.5em;
line-height: 1.5;
}
.title { .title {
font-weight: semibold; font-weight: semibold;
padding-top: 6px; padding-top: 6px;

View File

@ -24,7 +24,7 @@ function HeaderRenderer(props: any, hnum: number): any {
} }
function CodeRenderer(props: any): any { function CodeRenderer(props: any): any {
return <code className={cn({ inline: props.inline })}>{props.children}</code>; return <code>{props.children}</code>;
} }
@mobxReact.observer @mobxReact.observer

View File

@ -90,7 +90,7 @@ class DisconnectedModal extends React.Component<{}, {}> {
onClick={this.restartServer} onClick={this.restartServer}
leftIcon={<i className="fa-sharp fa-solid fa-triangle-exclamation"></i>} leftIcon={<i className="fa-sharp fa-solid fa-triangle-exclamation"></i>}
> >
Restart Server Restart Wave Backend
</Button> </Button>
</div> </div>
</Modal> </Modal>

View File

@ -74,7 +74,7 @@
.focused-option { .focused-option {
border: 1px solid rgba(241, 246, 243, 0.15); border: 1px solid rgba(241, 246, 243, 0.15);
border-radius: 4px; border-radius: 4px;
background: rgba(255, 255, 255, 0.06); background: var(--app-selected-mask-color);
} }
} }
} }

View File

@ -161,7 +161,7 @@ class CmdInput extends React.Component<{}, {}> {
</CenteredIcon> </CenteredIcon>
</div> </div>
</If> </If>
<div key="ai" title="Wave AI (Cmd-Space)" className="cmdinput-icon" onClick={this.clickAIAction}> <div key="ai" title="Wave AI (Ctrl-Space)" className="cmdinput-icon" onClick={this.clickAIAction}>
<i className="fa-sharp fa-regular fa-sparkles fa-fw" /> <i className="fa-sharp fa-regular fa-sparkles fa-fw" />
</div> </div>
<div <div