fix buttons (#1308)

This commit is contained in:
Red J Adaya 2024-11-16 13:26:48 +08:00 committed by GitHub
parent f64863c52a
commit 55558d441e
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
3 changed files with 7 additions and 19 deletions

View File

@ -12,8 +12,6 @@ interface LinkButtonProps {
target?: string; target?: string;
children: React.ReactNode; children: React.ReactNode;
disabled?: boolean; disabled?: boolean;
leftIcon?: React.ReactNode;
rightIcon?: React.ReactNode;
style?: React.CSSProperties; style?: React.CSSProperties;
autoFocus?: boolean; autoFocus?: boolean;
className?: string; className?: string;
@ -22,14 +20,10 @@ interface LinkButtonProps {
onClick?: (e: React.MouseEvent<HTMLAnchorElement>) => void; onClick?: (e: React.MouseEvent<HTMLAnchorElement>) => void;
} }
const LinkButton = ({ leftIcon, rightIcon, children, className, ...rest }: LinkButtonProps) => { const LinkButton = ({ children, className, ...rest }: LinkButtonProps) => {
return ( return (
<a {...rest} className={clsx("button grey solid link-button", className)}> <a {...rest} className={clsx("button grey solid link-button", className)}>
<span className="button-inner"> <span className="button-inner">{children}</span>
{leftIcon && <span className="icon-left">{leftIcon}</span>}
{children}
{rightIcon && <span className="icon-right">{rightIcon}</span>}
</span>
</a> </a>
); );
}; };

View File

@ -58,6 +58,7 @@
i { i {
font-size: 16px; font-size: 16px;
margin-right: 5px;
} }
} }
} }

View File

@ -41,26 +41,19 @@ const AboutModal = ({}: AboutModalProps) => {
className="secondary solid" className="secondary solid"
href="https://github.com/wavetermdev/waveterm" href="https://github.com/wavetermdev/waveterm"
target="_blank" target="_blank"
leftIcon={<i className="fa-brands fa-github"></i>}
> >
Github <i className="fa-brands fa-github"></i>Github
</LinkButton> </LinkButton>
<LinkButton <LinkButton className="secondary solid" href="https://www.waveterm.dev/" target="_blank">
className="secondary solid" <i className="fa-sharp fa-light fa-globe"></i>Website
href="https://www.waveterm.dev/"
target="_blank"
leftIcon={<i className="fa-sharp fa-light fa-globe"></i>}
>
Website
</LinkButton> </LinkButton>
<LinkButton <LinkButton
className="secondary solid" className="secondary solid"
href="https://github.com/wavetermdev/waveterm/blob/main/ACKNOWLEDGEMENTS.md" href="https://github.com/wavetermdev/waveterm/blob/main/ACKNOWLEDGEMENTS.md"
target="_blank" target="_blank"
rel={"noopener"} rel={"noopener"}
leftIcon={<i className="fa-sharp fa-light fa-heart"></i>}
> >
Acknowledgements <i className="fa-sharp fa-light fa-heart"></i>Acknowledgements
</LinkButton> </LinkButton>
</div> </div>
<div className="section text-standard">&copy; {currentDate.getFullYear()} Command Line Inc.</div> <div className="section text-standard">&copy; {currentDate.getFullYear()} Command Line Inc.</div>