This commit is contained in:
Patrick Alvin Alcala 2026-01-30 14:45:20 +08:00
parent 8e724b166a
commit b5e92165c8
33 changed files with 82 additions and 223 deletions

View file

@ -9,7 +9,7 @@ interface Props {
}
export default (props: Props) => {
const boxClass = createMemo(() => (props.curved ? 'curvedbox' : 'box'))
const boxClass = createMemo(() => (props.curved ? 'dasig-curvedbox' : 'dasig-box'))
return (
<section class={boxClass()} style={{ border: `${props.thickness}px solid ${props.color || 'white'}` }}>

View file

@ -40,7 +40,7 @@ export default (props: Props) => {
</Match>
<Match when={!props.design}>
<a href={props.to} aria-label={props.label} rel="noopener" target={props.newtab ? '_blank' : '_self'} data-astro-prefetch>
<button class="button" style={borderRadius}>
<button class="dasig-button" style={borderRadius}>
{props.label || 'Click Me!'}
</button>
</a>
@ -65,13 +65,13 @@ export default (props: Props) => {
</Match>
<Match when={!props.design}>
<Show when={props.submit}>
<button class="button" type="submit" style={borderRadius}>
<button class="dasig-button" type="submit" style={borderRadius}>
{props.label || 'Click Me!'}
</button>
</Show>
<Show when={!props.submit}>
<button class="button" onClick={props.onClick} style={borderRadius}>
<button class="dasig-button" onClick={props.onClick} style={borderRadius}>
{props.label || 'Click Me!'}
</button>
</Show>

View file

@ -10,7 +10,7 @@ interface Props {
export default (props: Props) => {
return (
<>
<section class={`column-${props.content || 'center'}`} style={`gap: ${props.gap}rem`}>
<section class={`dasig-column-${props.content || 'center'}`} style={`gap: ${props.gap}rem`}>
{props.children}
</section>
</>

View file

@ -8,7 +8,7 @@ interface Props {
export default (props: Props) => {
return (
<>
<footer class="footer">
<footer class="dasig-footer">
<small>{props.children}</small>
</footer>
</>

View file

@ -8,12 +8,10 @@ interface Props {
export default (props: Props) => {
return (
<>
<picture>
<source srcset={props.avif} type="image/avif" />
<source srcset={props.webp} type="image/webp" />
<img style={`border-radius: ${props.radius}rem`} width={props.size} height="auto" decoding="async" loading="lazy" alt={props.alt} />
</picture>
</>
<picture>
<source srcset={props.avif} type="image/avif" />
<source srcset={props.webp} type="image/webp" />
<img style={`border-radius: ${props.radius}rem`} width={props.size} height="auto" decoding="async" loading="lazy" alt={props.alt} />
</picture>
)
}

View file

@ -21,7 +21,7 @@ export default (props: Props) => {
return (
<>
<input class="input" type="text" placeholder={props.placeholder} value={inputValue()} onInput={handleChange} />
<input class="dasig-input" type="text" placeholder={props.placeholder} value={inputValue()} onInput={handleChange} />
</>
)
}

View file

@ -1,4 +1,4 @@
import { type JSXElement } from 'solid-js'
import type { JSXElement } from 'solid-js'
interface Props {
left: number

View file

@ -3,7 +3,7 @@ import { Show } from 'solid-js'
interface Props {
children?: any
alignment?: 'row' | 'column'
alignment?: 'dasig-page-row' | 'dasig-page-column'
}
export default (props: Props) => {
@ -13,7 +13,7 @@ export default (props: Props) => {
<main class={props.alignment}>{props.children}</main>
</Show>
<Show when={!props.alignment}>
<main class="page">{props.children}</main>
<main class="dasig-page">{props.children}</main>
</Show>
</>
)

View file

@ -11,13 +11,13 @@ export default (props: Props) => {
return (
<>
<Show when={props.gap}>
<section class={`row-${props.content || 'center'}`} style={`gap: ${props.gap}rem`}>
<section class={`dasig-row-${props.content || 'center'}`} style={`gap: ${props.gap}rem`}>
{props.children}
</section>
</Show>
<Show when={!props.gap}>
<section class={`row-${props.content || 'center'}`}>{props.children}</section>
<section class={`dasig-row-${props.content || 'center'}`}>{props.children}</section>
</Show>
</>
)