jeans/arduino-ide
jeans/arduino-ide
1
0
Fork 0
mirror of https://github.com/arduino/arduino-ide.git synced 2025-06-08 05:06:33 +00:00
Code Issues Packages Projects Releases Wiki Activity

Styled the input.

Browse Source 
Do not render the widget after a close request.

Signed-off-by: Akos Kitta <kittaakos@typefox.io>
This commit is contained in:
Akos Kitta 2019-12-06 12:50:44 +01:00
parent 2f33038695
commit 80673ad18f
4 changed files with 51 additions and 6 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

14
arduino-ide-extension/src/browser/monitor/monitor-widget.tsx
View File

@ -34,6 +34,11 @@ export class MonitorWidget extends ReactWidget {
* Do not touch or use it. It is for setting the focus on the `input` after the widget activation. * Do not touch or use it. It is for setting the focus on the `input` after the widget activation.
*/ */
protected focusNode: HTMLElement | undefined; protected focusNode: HTMLElement | undefined;
/**
* Guard against re-rendering the view after the close was requested.
* See: https://github.com/eclipse-theia/theia/issues/6704
*/
protected closing = false;
protected readonly clearOutputEmitter = new Emitter<void>(); protected readonly clearOutputEmitter = new Emitter<void>();
constructor() { constructor() {
@ -67,6 +72,7 @@ export class MonitorWidget extends ReactWidget {
} }
onCloseRequest(msg: Message): void { onCloseRequest(msg: Message): void {
this.closing = true;
this.monitorConnection.autoConnect = false; this.monitorConnection.autoConnect = false;
if (this.monitorConnection.connected) { if (this.monitorConnection.connected) {
this.monitorConnection.disconnect(); this.monitorConnection.disconnect();
@ -74,6 +80,12 @@ export class MonitorWidget extends ReactWidget {
super.onCloseRequest(msg); super.onCloseRequest(msg);
} }
protected onUpdateRequest(msg: Message): void {
if (!this.closing) {
super.onUpdateRequest(msg);
}
}
protected onResize(msg: Widget.ResizeMessage): void { protected onResize(msg: Widget.ResizeMessage): void {
super.onResize(msg); super.onResize(msg);
this.widgetHeight = msg.height; this.widgetHeight = msg.height;
@ -195,7 +207,7 @@ export class SerialMonitorSendInput extends React.Component<SerialMonitorSendInp
return <input return <input
ref={this.setRef} ref={this.setRef}
type='text' type='text'
className={this.props.monitorConfig ? '' : 'not-connected'} className={this.props.monitorConfig ? '' : 'warning'}
placeholder={this.placeholder} placeholder={this.placeholder}
value={this.state.text} value={this.state.text}
onChange={this.onChange} onChange={this.onChange}

37
arduino-ide-extension/src/browser/style/index.css
View File

@ -4,3 +4,40 @@
@import './editor.css'; @import './editor.css';
@import './monitor.css'; @import './monitor.css';
@import './arduino-select.css'; @import './arduino-select.css';
input:focus {
outline-width: 1px;
outline-style: solid;
outline-offset: -1px;
opacity: 1 !important;
outline-color: var(--theia-accent-color3);
}
input.warning:focus {
outline-width: 1px;
outline-style: solid;
outline-offset: -1px;
opacity: 1 !important;
color: var(--theia-warn-font-color0);
background-color: var(--theia-warn-color0);
}
input.warning {
background-color: var(--theia-warn-color0);
}
input.warning::placeholder { /* Chrome, Firefox, Opera, Safari 10.1+ */
color: var(--theia-warn-font-color0);
background-color: var(--theia-warn-color0);
opacity: 1; /* Firefox */
}
input.warning:-ms-input-placeholder { /* Internet Explorer 10-11 */
color: var(--theia-warn-font-color0);
background-color: var(--theia-warn-color0);
}
input.warning::-ms-input-placeholder { /* Microsoft Edge */
color: var(--theia-warn-font-color0);
background-color: var(--theia-warn-color0);
}

4
arduino-ide-extension/src/browser/style/monitor.css
View File

@ -33,10 +33,6 @@
border-color: var(--theia-accent-color3); border-color: var(--theia-accent-color3);
} }
.serial-monitor .head .send > input.not-connected {
background-color: var(--theia-warn-color0);
}
.serial-monitor .head .config { .serial-monitor .head .config {
display: flex; display: flex;
} }