revite/src/components/common/IconBase.tsx

import { Attachment } from "revolt.js/dist/api/objects";
import styled, { css } from "styled-components";

export interface IconBaseProps<T> {
	target?: T;
	attachment?: Attachment;

	size: number;
	animate?: boolean;
}

interface IconModifiers {
	square?: boolean;
}

export default styled.svg<IconModifiers>`
	flex-shrink: 0;

	img {
		width: 100%;
		height: 100%;
		object-fit: cover;

		${(props) =>
			!props.square &&
			css`
				border-radius: 50%;
			`}
	}
`;

export const ImageIconBase = styled.img<IconModifiers>`
	flex-shrink: 0;
	object-fit: cover;

	${(props) =>
		!props.square &&
		css`
			border-radius: 50%;
		`}
`;