Skip to content
This repository has been archived by the owner on Dec 11, 2019. It is now read-only.

Commit

Permalink
Always show the overflow indicator
Browse files Browse the repository at this point in the history
On the bookmarks toolbar.

Fix #6869.

However, there is now too much space before the overflow indicator.

I'm not well-versed with CSS so I'd appreciate some pointers.
Auditors:

Test Plan:
  • Loading branch information
GreenRecycleBin committed Jun 25, 2017
1 parent d99c5c6 commit 398a3cc
Showing 1 changed file with 31 additions and 4 deletions.
35 changes: 31 additions & 4 deletions app/common/lib/bookmarkUtil.js
Original file line number Diff line number Diff line change
Expand Up @@ -75,7 +75,7 @@ const getToolbarBookmarks = (state) => {
.sort(siteUtil.siteSort)
.filter((bookmark) => !bookmark.get('parentFolderId'))
let widthAccountedFor = 0
const overflowButtonWidth = 25

const onlyFavicon = showOnlyFavicon()
const favicon = showFavicon()

Expand All @@ -92,7 +92,11 @@ const getToolbarBookmarks = (state) => {
const fontFamily = domUtil.getStyleConstants('default-font-family')
const chevronWidth = chevronMargin + fontSize
const margin = favicon && onlyFavicon ? 0 : bookmarkItemMargin

const windowWidth = window.innerWidth
const overflowButtonWidth = 25
const maximumBookmarksToolbarWidth = windowWidth - overflowButtonWidth

widthAccountedFor += toolbarPadding

// Loop through until we fill up the entire bookmark toolbar width
Expand All @@ -106,15 +110,38 @@ const getToolbarBookmarks = (state) => {
}
const currentChevronWidth = favicon && current.get('folderId') ? chevronWidth : 0
if (favicon && onlyFavicon) {
widthAccountedFor += padding + iconWidth + currentChevronWidth
const extraWidth = padding + iconWidth + currentChevronWidth

widthAccountedFor += extraWidth

if (widthAccountedFor >= maximumBookmarksToolbarWidth) {
widthAccountedFor -= extraWidth
i--

break
}
} else {
const text = current.get('customTitle') || current.get('title') || current.get('location')
widthAccountedFor += Math.min(calculateTextWidth(text, `${fontSize} ${fontFamily}`) + padding + iconWidth + currentChevronWidth, maxWidth)
const extraWidth = Math.min(calculateTextWidth(text, `${fontSize} ${fontFamily}`) + padding + iconWidth + currentChevronWidth, maxWidth)

widthAccountedFor += extraWidth

if (widthAccountedFor >= maximumBookmarksToolbarWidth) {
widthAccountedFor -= extraWidth
i--

break
}
}
widthAccountedFor += margin
if (widthAccountedFor >= windowWidth - overflowButtonWidth) {

if (widthAccountedFor >= maximumBookmarksToolbarWidth) {
widthAccountedFor -= margin
i--

break
}

i++
}

Expand Down

0 comments on commit 398a3cc

Please sign in to comment.