diff --git a/packages/app-desktop/gui/Sidebar/Sidebar.tsx b/packages/app-desktop/gui/Sidebar/Sidebar.tsx index 901d82bd3eb..d0b19525bef 100644 --- a/packages/app-desktop/gui/Sidebar/Sidebar.tsx +++ b/packages/app-desktop/gui/Sidebar/Sidebar.tsx @@ -1,6 +1,6 @@ import * as React from 'react'; import { useEffect, useRef, useCallback, useMemo } from 'react'; -import styled from 'styled-components'; +import styled, { css } from 'styled-components'; import shim from '@joplin/lib/shim'; import { StyledRoot, StyledAddButton, StyledShareIcon, StyledHeader, StyledHeaderIcon, StyledAllNotesIcon, StyledHeaderLabel, StyledListItem, StyledListItemAnchor, StyledExpandLink, StyledNoteCount, StyledSyncReportText, StyledSyncReport, StyledSynchronizeButton } from './styles'; import { ButtonLevel } from '../Button/Button'; @@ -40,24 +40,15 @@ const { clipboard } = require('electron'); const logger = Logger.create('Sidebar'); -const StyledFoldersHolder = styled.div` - // linux bug: https://github.com/laurent22/joplin/issues/7506#issuecomment-1447101057 - & a.list-item { - ${shim.isLinux() && { - opacity: 1, - }} - } -`; -const TagsHolder = styled.div` - // linux bug: https://github.com/laurent22/joplin/issues/8000 - // solution ref: https://github.com/laurent22/joplin/issues/7506#issuecomment-1447101057 - & a.list-item { - ${shim.isLinux() && { - opacity: 1, - }} - } +// Workaround sidebar rendering bug on Linux Intel GPU. +// https://github.com/laurent22/joplin/issues/7506 +const StyledSpanFix = styled.span` + ${shim.isLinux() && css` + position: relative; + `} `; + interface Props { themeId: number; dispatch: Function; @@ -138,7 +129,7 @@ function FolderItem(props: any) { }} onDoubleClick={onFolderToggleClick_} > - {showFolderIcon ? renderFolderIcon(folderIcon) : null}{folderTitle} + {showFolderIcon ? renderFolderIcon(folderIcon) : null}{folderTitle} {shareIcon} {noteCountComp} @@ -573,7 +564,7 @@ const SidebarComponent = (props: Props) => { tagItem_click(tag); }} > - {Tag.displayTitle(tag)} + {Tag.displayTitle(tag)} {noteCount} @@ -725,13 +716,13 @@ const SidebarComponent = (props: Props) => { const folderItems = [renderAllNotesItem(theme, allNotesSelected)].concat(result.items); folderItemsOrder_.current = result.order; items.push( - {folderItems} - + ); } @@ -747,9 +738,9 @@ const SidebarComponent = (props: Props) => { tagItemsOrder_.current = result.order; items.push( - +
{tagItems} - +
); }