mirror of
https://github.com/dergigi/boris.git
synced 2025-12-17 06:34:24 +01:00
- Change default size from 44px to 33px (25% reduction) - Update min-width and min-height in CSS to match - Apply size reduction to toggle-sidebar-btn as well for consistency
38 lines
793 B
TypeScript
38 lines
793 B
TypeScript
import React from 'react'
|
|
import { FontAwesomeIcon } from '@fortawesome/react-fontawesome'
|
|
import type { IconDefinition } from '@fortawesome/fontawesome-svg-core'
|
|
|
|
interface IconButtonProps {
|
|
icon: IconDefinition
|
|
onClick?: (e: React.MouseEvent<HTMLButtonElement>) => void
|
|
title?: string
|
|
ariaLabel?: string
|
|
variant?: 'primary' | 'success' | 'ghost'
|
|
size?: number
|
|
}
|
|
|
|
const IconButton: React.FC<IconButtonProps> = ({
|
|
icon,
|
|
onClick,
|
|
title,
|
|
ariaLabel,
|
|
variant = 'ghost',
|
|
size = 33
|
|
}) => {
|
|
return (
|
|
<button
|
|
className={`icon-button ${variant}`}
|
|
onClick={onClick}
|
|
title={title}
|
|
aria-label={ariaLabel || title}
|
|
style={{ width: size, height: size }}
|
|
>
|
|
<FontAwesomeIcon icon={icon} />
|
|
</button>
|
|
)
|
|
}
|
|
|
|
export default IconButton
|
|
|
|
|