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

Prevent board selector item labels to overflow (#1216)

Browse Source 
* prevent board selector item labels to overflow

* make board selector show ellipsis when the board name is too long
This commit is contained in:
Alberto Iannaccone 2022-08-02 11:11:38 +02:00 committed by GitHub
parent d7f7010bb5
commit 564862e173
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
2 changed files with 9 additions and 7 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

12
arduino-ide-extension/src/browser/boards/boards-toolbar-item.tsx
View File

@ -130,11 +130,14 @@ export class BoardsDropDown extends React.Component<BoardsDropDown.Props> {
protocolIcon protocolIcon
)} )}
/> />
<div className="arduino-boards-dropdown-item--label"> <div
<div className="arduino-boards-dropdown-item--board-label"> className="arduino-boards-dropdown-item--label"
title={`${boardLabel}\n${port.address}`}
>
<div className="arduino-boards-dropdown-item--board-label noWrapInfo noselect">
{boardLabel} {boardLabel}
</div> </div>
<div className="arduino-boards-dropdown-item--port-label"> <div className="arduino-boards-dropdown-item--port-label noWrapInfo noselect">
{port.address} {port.address}
</div> </div>
</div> </div>
@ -229,7 +232,8 @@ export class BoardsToolBarItem extends React.Component<
<div <div
className={classNames( className={classNames(
'arduino-boards-toolbar-item--label', 'arduino-boards-toolbar-item--label',
'noWrapInfo noselect', 'noWrapInfo',
'noselect',
{ 'arduino-boards-toolbar-item--label-connected': isConnected } { 'arduino-boards-toolbar-item--label-connected': isConnected }
)} )}
> >

4
arduino-ide-extension/src/browser/style/boards-config-dialog.css
View File

@ -181,9 +181,6 @@ div#select-board-dialog .selectBoardContainer .body .list .item.selected i {
} }
.arduino-boards-toolbar-item--label { .arduino-boards-toolbar-item--label {
height: 100%;
display: flex;
align-items: center;
width: 100%; width: 100%;
} }
@ -227,6 +224,7 @@ div#select-board-dialog .selectBoardContainer .body .list .item.selected i {
} }
.arduino-boards-dropdown-item--label { .arduino-boards-dropdown-item--label {
overflow: hidden;
flex: 1; flex: 1;
} }