Edited button component
This commit is contained in:
parent
3905923985
commit
d0652e52a5
2 changed files with 20 additions and 17 deletions
|
|
@ -4,13 +4,13 @@
|
|||
.button
|
||||
background: vars.$primaryColor
|
||||
border: none
|
||||
border-radius: 16px
|
||||
border-radius: 32px
|
||||
color: white
|
||||
padding: 0.5rem 1.25rem
|
||||
text-align: center
|
||||
text-decoration: none
|
||||
display: inline-block
|
||||
font-size: 0.75rem
|
||||
font-size: 1rem
|
||||
font-weight: 700
|
||||
cursor: pointer
|
||||
transition: all 0.2s ease-out
|
||||
|
|
|
|||
|
|
@ -2,22 +2,25 @@ import './Button.sass'
|
|||
import { Show } from 'solid-js'
|
||||
|
||||
interface Props {
|
||||
label?: string;
|
||||
to?: string;
|
||||
onClick?: () => void;
|
||||
label?: string
|
||||
to?: string
|
||||
onClick?: () => void
|
||||
}
|
||||
|
||||
export default (props: Props) => {
|
||||
return
|
||||
<>
|
||||
<Show when={props.to}>
|
||||
<a href={props.to} aria-label={props.label}>
|
||||
<button class="button">{props.label || 'Click Me!'}</button>
|
||||
</a>
|
||||
</Show>
|
||||
return (
|
||||
<>
|
||||
<Show when={props.to}>
|
||||
<a href={props.to} aria-label={props.label}>
|
||||
<button class="button">{props.label || 'Click Me!'}</button>
|
||||
</a>
|
||||
</Show>
|
||||
|
||||
<Show when={!props.to}>
|
||||
<button class="button" onClick={props.onClick}>{props.label || 'Click Me!'}</button>
|
||||
</Show>
|
||||
</>
|
||||
}
|
||||
<Show when={!props.to}>
|
||||
<button class="button" onClick={props.onClick}>
|
||||
{props.label || 'Click Me!'}
|
||||
</button>
|
||||
</Show>
|
||||
</>
|
||||
)
|
||||
}
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue