refactor: align item with icon

This commit is contained in:
EnixCoda 2019-12-01 21:39:09 +08:00
parent 4ac447be2e
commit 255aa7eb1d
No known key found for this signature in database
GPG key ID: 0C1A07377913A1DD
3 changed files with 7 additions and 4 deletions

View file

@ -120,10 +120,12 @@ function getSVGIconComponent(
type Props = {
type: string
className?: string
placeholder?: boolean
onClick?: (event: React.MouseEvent<HTMLElement>) => void
}
export function Icon({ type, className = undefined, ...otherProps }: Props) {
export function Icon({ type, className = undefined, placeholder, ...otherProps }: Props) {
if (placeholder) return <div className={cx('octicon-wrapper')} />
const { name, IconComponent } = getSVGIconComponent(type)
const mergedClassName = cx('octicon', name)
return (
@ -131,6 +133,7 @@ export function Icon({ type, className = undefined, ...otherProps }: Props) {
{React.createElement(Octicon, {
icon: IconComponent,
className: mergedClassName,
verticalAlign: 'middle',
})}
</div>
)

View file

@ -78,8 +78,8 @@ const NodeItemIcon = React.memo(function NodeItemIcon({
)
return (
<>
{node.type !== 'blob' && <Icon type={getIconType(node)} />}
<img alt={node.name} className={'node-item-icon'} src={src} />
<Icon placeholder={node.type === 'blob'} type={getIconType(node)} />
{node.type !== 'commit' && <img alt={node.name} className={'node-item-icon'} src={src} />}
</>
)
})

View file

@ -363,7 +363,7 @@
height: 16px;
object-fit: contain;
vertical-align: middle;
padding-left: 6px;
padding-left: 4px;
box-sizing: content-box;
&.dim {