rmorawski/standardnotes-app-web
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix: tags being dimmed on safari (#1389)

Browse Source
This commit is contained in:
Aman Harwara
2022-08-10 18:34:05 +05:30
committed by GitHub
parent 82a8bcc440
commit 77cbb6b06e
2 changed files with 44 additions and 26 deletions
Download Patch File Download Diff File Expand all files Collapse all files

30
packages/web/src/javascripts/Components/Tags/SmartViewsListItem.tsx
View File

@@ -135,17 +135,25 @@ const SmartViewsListItem: FunctionComponent<Props> = ({ view, tagsState, isColla
> >
<Icon type={iconType} className={isSelected ? 'text-info' : 'text-neutral'} /> <Icon type={iconType} className={isSelected ? 'text-info' : 'text-neutral'} />
</div> </div>
<input {isEditing ? (
className={classNames('title', isEditing ? 'editing' : '', isCollapsed ? 'hidden' : 'block')} <input
disabled={!isEditing} className={classNames('title editing', isCollapsed ? 'hidden' : 'block')}
id={`react-tag-${view.uuid}`} id={`react-tag-${view.uuid}`}
onBlur={onBlur} onBlur={onBlur}
onInput={onInput} onInput={onInput}
value={title} value={title}
onKeyUp={onKeyUp} onKeyUp={onKeyUp}
spellCheck={false} spellCheck={false}
ref={inputRef} ref={inputRef}
/> />
) : (
<div
className={classNames('title overflow-hidden text-left', isCollapsed ? 'hidden' : 'block')}
id={`react-tag-${view.uuid}`}
>
{title}
</div>
)}
<div className={classNames('count', isCollapsed ? 'absolute top-0 right-0' : '')}> <div className={classNames('count', isCollapsed ? 'absolute top-0 right-0' : '')}>
{view.uuid === SystemViewId.AllNotes && tagsState.allNotesCount} {view.uuid === SystemViewId.AllNotes && tagsState.allNotesCount}
</div> </div>

40
packages/web/src/javascripts/Components/Tags/TagsListItem.tsx
View File

@@ -242,21 +242,31 @@ export const TagsListItem: FunctionComponent<Props> = observer(
> >
<Icon type="hashtag" className={`${isSelected ? 'text-info' : 'text-neutral'}`} /> <Icon type="hashtag" className={`${isSelected ? 'text-info' : 'text-neutral'}`} />
</div> </div>
<input {isEditing ? (
className={classNames( <input
'title focus:shadow-none focus:outline-none', className={classNames(
isEditing ? 'editing' : '', 'title editing focus:shadow-none focus:outline-none',
isCollapsed ? 'md-only:!w-min lg-only:!w-min' : '', isCollapsed ? 'md-only:!w-min lg-only:!w-min' : '',
)} )}
id={`react-tag-${tag.uuid}`} id={`react-tag-${tag.uuid}`}
disabled={!isEditing} onBlur={onBlur}
onBlur={onBlur} onInput={onInput}
onInput={onInput} value={title}
value={title} onKeyDown={onKeyDown}
onKeyDown={onKeyDown} spellCheck={false}
spellCheck={false} ref={inputRef}
ref={inputRef} />
/> ) : (
<div
className={classNames(
'title overflow-hidden text-left focus:shadow-none focus:outline-none',
isCollapsed ? 'md-only:!w-min lg-only:!w-min' : '',
)}
id={`react-tag-${tag.uuid}`}
>
{title}
</div>
)}
<div className="flex items-center"> <div className="flex items-center">
<a <a
role="button" role="button"