LBRYCommunity/lbry-desktop
1
0
Fork 0
Code Issues 596 Pull requests 6 Projects Releases 238 Packages Wiki Activity

Tag: Add "type=flow" that reflows to multiline with gaps.

Browse source 
This will be used in Publish Preview modal, and potentially be used in the "show all tags in Claim Preview" request.
This commit is contained in:
infiinte-persistence 2020-07-31 22:52:51 +08:00 committed by Sean Yesmunt
parent 6850a8f264
commit b666a34863
2 changed files with 12 additions and 1 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

8
ui/component/tag/view.jsx
View file

@ -25,6 +25,11 @@ export default function Tag(props: Props) {
title = type === 'add' ? __('Add tag') : __('Remove tag');
}
let iconRight = type !== 'link' && type !== 'large' && (type === 'remove' ? ICONS.REMOVE : ICONS.ADD);
if (type === 'flow') {
iconRight = null;
}
return (
<Button
{...clickProps}
@ -37,10 +42,11 @@ export default function Tag(props: Props) {
// tag--add only adjusts the color, which causes issues with mature tag color clashing
'tag--add': !isMature && type === 'add',
'tag--mature': isMature,
'tag--flow': type === 'flow',
})}
label={name}
iconSize={12}
iconRight={type !== 'link' && type !== 'large' && (type === 'remove' ? ICONS.REMOVE : ICONS.ADD)}
iconRight={iconRight}
/>
);
}

5
ui/scss/component/_tags.scss
View file

@ -68,3 +68,8 @@
.tag--mature {
@extend .badge--tag-mature;
}
.tag--flow {
margin: calc(2rem / 10) calc(2rem / 10);
max-width: 20rem;
}