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

fix the react-select styling

Browse Source 
Signed-off-by: Akos Kitta <kittaakos@typefox.io>
This commit is contained in:
Akos Kitta 2019-12-04 21:50:44 +01:00
parent 85bf50213d
commit f635751a8c
2 changed files with 11 additions and 8 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

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

@ -208,6 +208,7 @@ export class MonitorWidget extends ReactWidget {
classNamePrefix='sms' classNamePrefix='sms'
className='serial-monitor-select' className='serial-monitor-select'
id={id} id={id}
isSearchable={false}
/> />
} }
} }

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

@ -85,37 +85,39 @@
background: var(--theia-layout-color2); background: var(--theia-layout-color2);
} }
.sms__control:hover {
border-color: var(--theia-accent-color3) !important;
}
.serial-monitor-select .sms__control--is-focused { .serial-monitor-select .sms__control--is-focused {
border-color: var(--theia-accent-color3) !important; border-color: var(--theia-accent-color3) !important;
box-shadow: none !important; box-shadow: none !important;
} }
.sms__control--is-focused:hover {
border-color: var(--theia-accent-color3) !important;
}
.serial-monitor-select .sms__option--is-selected { .serial-monitor-select .sms__option--is-selected {
background-color: var(--theia-ui-button-color-secondary-hover); background-color: var(--theia-accent-color3);
color: var(--theia-content-font-color0); color: var(--theia-content-font-color0);
border-color: var(--theia-accent-color3); border-color: var(--theia-accent-color3);
} }
.serial-monitor-select .sms__option--is-focused { .serial-monitor-select .sms__option--is-focused {
background-color: var(--theia-ui-button-color-secondary-hover); background-color: var(--theia-accent-color4);
border-color: var(--theia-accent-color3); border-color: var(--theia-accent-color3);
} }
.serial-monitor-select .sms__menu { .serial-monitor-select .sms__menu {
background-color: var(--theia-layout-color1); background-color: var(--theia-layout-color1);
border: 1px solid var(--theia-border-color2); border: 1px solid var(--theia-border-color2);
border-color: var(--theia-accent-color3);
top: auto !important; /* to align the top of the menu with the bottom of the control */
border-top: none; border-top: none;
box-shadow: none; box-shadow: none;
} }
.serial-monitor-select .sms__control.sms__control--menu-is-open { .serial-monitor-select .sms__control.sms__control--menu-is-open {
border: 1px solid; border: 1px solid;
border-color: var(--theia-border-color2) !important; border-color: var(--theia-accent-color3) !important;
border-bottom: none; border-bottom-color: var(--theia-layout-color2) !important; /* if the bottom border color has the same color as the background of the control, we make the border "invisible" */
} }
.serial-monitor-select .sms__value-container .sms__single-value { .serial-monitor-select .sms__value-container .sms__single-value {