diff --git a/packages/app-desktop/gui/Sidebar/Sidebar.tsx b/packages/app-desktop/gui/Sidebar/Sidebar.tsx index 901d82bd3eb..fbaf2951d51 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,22 +40,19 @@ 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 StyledFolderTitle = styled.span` + line-height: 0; + // Linux Intel rendering bug: https://github.com/laurent22/joplin/issues/7506 + ${shim.isLinux() && css` + position: relative; + `} `; -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, - }} - } + +const StyledTagLabel = styled.span` + // Linux Intel rendering bug: https://github.com/laurent22/joplin/issues/8000 + ${shim.isLinux() && css` + position: relative; + `} `; interface Props { @@ -138,7 +135,8 @@ function FolderItem(props: any) { }} onDoubleClick={onFolderToggleClick_} > - {showFolderIcon ? renderFolderIcon(folderIcon) : null}{folderTitle} + { /* Perhaps a StyledFolderTitle to replace span */ } + {showFolderIcon ? renderFolderIcon(folderIcon) : null}{folderTitle} {shareIcon} {noteCountComp} @@ -573,7 +571,7 @@ const SidebarComponent = (props: Props) => { tagItem_click(tag); }} > - {Tag.displayTitle(tag)} + { renderFolderIcon(null) }{Tag.displayTitle(tag)} {noteCount} @@ -725,13 +723,13 @@ const SidebarComponent = (props: Props) => { const folderItems = [renderAllNotesItem(theme, allNotesSelected)].concat(result.items); folderItemsOrder_.current = result.order; items.push( - {folderItems} - + ); } @@ -747,9 +745,9 @@ const SidebarComponent = (props: Props) => { tagItemsOrder_.current = result.order; items.push( - +
{tagItems} - +
); }