PatAlcala9/articles
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Initial commit

Browse source
This commit is contained in:
Patrick Alvin Alcala 2026-02-10 19:45:22 +08:00
commit eb8731d039
90 changed files with 6380 additions and 0 deletions
Download patch file Download diff file Expand all files Collapse all files

51
src/components/Article.astro Normal file
View file

@ -0,0 +1,51 @@
---
import { Row, Column } from '../../@dasig'
interface Props {
title: string
subtitle: string
date: string
imageA: string
imageW: string
alt: string
minutes: number
}
const { title, subtitle, date, imageA, imageW, alt, minutes } = Astro.props
---
<section class="article">
<Column gap={1} content="top">
<Row gap={1}>
<picture>
<source srcset={imageA} type="image/avif" />
<source srcset={imageW} type="image/webp" />
<img style={`border-radius: 0.5rem`} width="200" height="auto" decoding="async" loading="lazy" alt={alt} />
</picture>
<div>
<span class="article__title">{title}</span>
<h2 class="article__subtitle">{subtitle}</h2>
</div>
</Row>
<Row gap={1} content="left">
<span>{date}</span>
<span>:</span>
<span>{minutes} min read</span>
</Row>
</Column>
</section>
<style lang="sass">
.article
font-size: 1rem
border: 1px solid white
&__title
font-size: 2rem
font-weight: 700
&__subtitle
font-size: 1.25rem
font-weight: 500
opacity: 0.8
</style>

12
src/components/Input/Input.tsx Normal file
View file

@ -0,0 +1,12 @@
import Input from '../../../@dasig/components/Input'
import { createSignal } from 'solid-js'
const [sample, setSample] = createSignal('')
export default () => {
return (
<>
<Input onChange={(val) => setSample(val)}></Input>
</>
)
}

BIN
src/images/A.png Normal file
View file

Binary file not shown.
Side by side

After

Width:  |  Height:  |  Size: 1.1 MiB

BIN
src/images/background.png Normal file
View file

Binary file not shown.
Side by side

After

Width:  |  Height:  |  Size: 23 MiB

BIN
src/images/favicon.png Normal file
View file

Binary file not shown.
Side by side

After

Width:  |  Height:  |  Size: 11 KiB

BIN
src/images/logo.png Normal file
View file

Binary file not shown.
Side by side

After

Width:  |  Height:  |  Size: 11 KiB

BIN
src/images/sample.png Normal file
View file

Binary file not shown.
Side by side

After

Width:  |  Height:  |  Size: 47 KiB

9
src/layouts/Layout.astro Normal file
View file

@ -0,0 +1,9 @@
---
const { title } = Astro.props
import { Background, HTML } from '../../@dasig'
---
<HTML title={title} font="inter">
<Background />
<slot />
</HTML>

19
src/pages/index.astro Normal file
View file

@ -0,0 +1,19 @@
---
import Layout from '../layouts/Layout.astro'
import { Logo, Page, Footer, Row, Image, Copyright, Column } from '../../@dasig'
import Article from '../components/Article.astro'
import AA from '../../@dasig/images/sample.avif'
import AW from '../../@dasig/images/sample.webp'
---
<Layout title="Articles - Pat Alcala">
<Page alignment="column">
<Article title="How to sample" subtitle="This is just a sample" date="Feb 10, 2026" imageA={AA.src} imageW={AW.src} alt="aaa" minutes={5} />
</Page>
</Layout>
<style lang="sass">
h1
color: #3377AC
</style>

3
src/stores/sample.ts Normal file
View file

@ -0,0 +1,3 @@
// import { atom } from 'nanostores'
// export const $sample = atom(0)

49
src/styles/breakpoints.sass Normal file
View file

@ -0,0 +1,49 @@
@use '../../configs/design/sizes.sass' as sizes
.on-desktop-only
@media only screen and (min-width: 0px) and (max-width: sizes.$desktop)
display: none
@media only screen and (min-width: sizes.$desktop)
display: block
.on-tablet-only
@media only screen and (min-width: 0px) and (max-width: sizes.$tablet)
display: none
@media only screen and (min-width: sizes.$tablet) and (max-width: sizes.$desktop)
display: block
@media only screen and (min-width: sizes.$desktop)
display: none
.on-mobile-only
@media only screen and (min-width: sizes.$mobile)
display: block
@media only screen and (min-width: sizes.$tablet)
display: none
.on-desktop-tablet-only
@media only screen and (min-width: 0px) and (max-width: sizes.$tablet)
display: none
@media only screen and (min-width: sizes.$tablet)
display: block
.on-desktop-mobile-only
@media only screen and (min-width: 0px) and (max-width: sizes.$mobile)
display: block
@media only screen and (min-width: sizes.$mobile) and (max-width: sizes.$desktop)
display: none
@media only screen and (min-width: sizes.$desktop)
display: block
.on-tablet-mobile-only
@media only screen and (min-width: 0px) and (max-width: sizes.$desktop)
display: block
@media only screen and (min-width: sizes.$desktop)
display: none

9
src/styles/classes.sass Normal file
View file

@ -0,0 +1,9 @@
.fullscreen
position: absolute
top: 0
left: 0
width: 100vw
height: 100vh
object-fit: cover
z-index: -1
opacity: 1

45
src/styles/fonts.sass Normal file
View file

@ -0,0 +1,45 @@
$Roboto: Roboto, sans-serif
$Inter: Inter, sans-serif
$Montserrat: Montserrat, sans-serif
$OpenSans: 'Open Sans', sans-serif
$PublicSans: 'Public Sans', sans-serif
@font-face
font-family: 'Roboto'
font-style: normal
font-display: swap
font-weight: 100 900
src: url(https://cdn.jsdelivr.net/fontsource/fonts/roboto:vf@latest/latin-wght-normal.woff2) format('woff2-variations');
unicode-range: U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD
@font-face
font-family: 'Inter'
font-style: normal
font-display: swap
font-weight: 100 900
src: url(https://cdn.jsdelivr.net/fontsource/fonts/inter:vf@latest/latin-wght-normal.woff2) format('woff2-variations');
unicode-range: U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD
@font-face
font-family: 'Montserrat'
font-style: normal
font-display: swap
font-weight: 100 900
src: url(https://cdn.jsdelivr.net/fontsource/fonts/montserrat:vf@latest/latin-wght-normal.woff2) format('woff2-variations');
unicode-range: U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD
@font-face
font-family: 'Open Sans'
font-style: normal
font-display: swap
font-weight: 300 800
src: url(https://cdn.jsdelivr.net/fontsource/fonts/open-sans:vf@latest/latin-wght-normal.woff2) format('woff2-variations');
unicode-range: U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD
@font-face
font-family: 'Public Sans'
font-style: normal
font-display: swap
font-weight: 100 900
src: url(https://cdn.jsdelivr.net/fontsource/fonts/public-sans:vf@latest/latin-wght-normal.woff2) format('woff2-variations');
unicode-range: U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD