Commit 564862e

author

Alberto Iannaccone

authored

Prevent board selector item labels to overflow (#1216)

* prevent board selector item labels to overflow * make board selector show ellipsis when the board name is too long

1 parent d7f7010 commit 564862eCopy full SHA for 564862e

File tree

-7

lines changed

arduino-ide-extension/src/browser
- boards
  - boards-toolbar-item.tsx
- style
  - boards-config-dialog.css

-7

lines changed

Lines changed: 8 additions & 4 deletions

Original file line number	Diff line number	Diff line change
`@@ -130,11 +130,14 @@ export class BoardsDropDown extends React.Component<BoardsDropDown.Props> {`
`130`	`130`	`protocolIcon`
`131`	`131`	`)}`
`132`	`132`	`/>`
`133`		`- <div className="arduino-boards-dropdown-item--label">`
`134`		`- <div className="arduino-boards-dropdown-item--board-label">`
	`133`	`+ <div`
	`134`	`+ className="arduino-boards-dropdown-item--label"`
	`135`	+ title={`${boardLabel}\n${port.address}`}
	`136`	`+ >`
	`137`	`+ <div className="arduino-boards-dropdown-item--board-label noWrapInfo noselect">`
`135`	`138`	`{boardLabel}`
`136`	`139`	`</div>`
`137`		`- <div className="arduino-boards-dropdown-item--port-label">`
	`140`	`+ <div className="arduino-boards-dropdown-item--port-label noWrapInfo noselect">`
`138`	`141`	`{port.address}`
`139`	`142`	`</div>`
`140`	`143`	`</div>`
`@@ -229,7 +232,8 @@ export class BoardsToolBarItem extends React.Component<`
`229`	`232`	`<div`
`230`	`233`	`className={classNames(`
`231`	`234`	`'arduino-boards-toolbar-item--label',`
`232`		`- 'noWrapInfo noselect',`
	`235`	`+ 'noWrapInfo',`
	`236`	`+ 'noselect',`
`233`	`237`	`{ 'arduino-boards-toolbar-item--label-connected': isConnected }`
`234`	`238`	`)}`
`235`	`239`	`>`

Lines changed: 1 addition & 3 deletions

Original file line number	Diff line number	Diff line change
`@@ -181,9 +181,6 @@ div#select-board-dialog .selectBoardContainer .body .list .item.selected i {`
`181`	`181`	`}`
`182`	`182`
`183`	`183`	`.arduino-boards-toolbar-item--label {`
`184`		`- height: 100%;`
`185`		`- display: flex;`
`186`		`- align-items: center;`
`187`	`184`	`width: 100%;`
`188`	`185`	`}`
`189`	`186`
`@@ -227,6 +224,7 @@ div#select-board-dialog .selectBoardContainer .body .list .item.selected i {`
`227`	`224`	`}`
`228`	`225`
`229`	`226`	`.arduino-boards-dropdown-item--label {`
	`227`	`+ overflow: hidden;`
`230`	`228`	`flex: 1;`
`231`	`229`	`}`
`232`	`230`

Comments

(0)