PatAlcala9/dasig-static
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Updated

Browse source
This commit is contained in:
Patrick Alvin Alcala 2026-01-30 11:48:35 +08:00
parent 51161808ae
commit ed7f12cac4
22 changed files with 162 additions and 113 deletions
Download patch file Download diff file Expand all files Collapse all files

2
@dasig/components/Background.tsx
View file

@ -1,7 +1,7 @@
import '../styles/Background.sass' import '../styles/Background.sass'
import { Show, createSignal } from 'solid-js' import { Show, createSignal } from 'solid-js'
import fs from 'fs' import fs from 'fs'
import webpPath from '../images/background.avif' import webpPath from '../images/background.webp'
import avifPath from '../images/background.avif' import avifPath from '../images/background.avif'
import noBackground from '../images/no-background.webp' import noBackground from '../images/no-background.webp'

10
@dasig/components/Copyright.tsx
View file

@ -1,14 +1,18 @@
import * as toml from 'toml'
import * as fs from 'fs'
const config = toml.parse(fs.readFileSync('configs/config.site.toml', 'utf8'))
interface Props { interface Props {
year: string year: string
name: string name: string
} }
export default (props: Props) => { export default (props: Props) => {
return ( return (
<>
<span> <span>
Copyright © {props.year} {props.name} All Rights Reserved. Copyright © {config.copyright.year} {config.copyright.name} All Rights Reserved.
</span> </span>
</>
) )
} }

23
@dasig/components/HTML.tsx
View file

@ -1,19 +1,19 @@
import '../styles/HTML.sass' import '../styles/HTML.sass'
import * as fs from "fs";
import * as toml from 'toml';
import { type JSXElement, Show } from 'solid-js' import { type JSXElement, Show } from 'solid-js'
import background1 from '../images/background.avif' import background1 from '../images/background.avif'
import background2 from '../images/background.webp' import background2 from '../images/background.webp'
interface Props { interface Props {
title: string title: string
name: string
description: string
children: JSXElement children: JSXElement
font?: 'roboto' | 'inter' | 'montserrat' | 'open-sans' | 'public-sans' font?: 'roboto' | 'inter' | 'montserrat' | 'open-sans' | 'public-sans'
preloadBackground?: boolean preloadBackground?: boolean
author: string
} }
export default (props: Props) => { export default (props: Props) => {
const config = toml.parse(fs.readFileSync('configs/config.site.toml', 'utf8'))
return ( return (
<> <>
<html lang="en"> <html lang="en">
@ -21,14 +21,19 @@ export default (props: Props) => {
<base href="/" /> <base href="/" />
<meta charset="utf-8" /> <meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1, viewport-fit=cover" /> <meta name="viewport" content="width=device-width, initial-scale=1, viewport-fit=cover" />
<meta name="name" content={props.name} /> <meta name="name" content={config.website.name} />
<meta name="description" content={props.description} /> <meta name="description" content={config.website.description} />
<meta name="title" property="og:title" content={props.name} /> <meta name="title" property="og:title" content={config.website.name} />
<meta name="keywords" content="HTML, CSS, JavaScript" /> <meta name="keywords" content="HTML, CSS, JavaScript" />
<meta name="author" content={props.author} /> <meta name="developer" content={config.website.developer} />
<meta property="og:description" content={props.description} /> <meta name="designer" content={config.website.designer} />
<meta property="og:description" content={config.website.description} />
<meta property="og:type" content="website" /> <meta property="og:type" content="website" />
<link rel="icon" type="image/svg+xml" href="/favicon.png" /> <link rel="icon" type="image/png" href="/favicon.png" />
<link rel="apple-touch-icon" sizes="180x180" href="/apple-touch-icon.png" />
<link rel="icon" type="image/png" sizes="32x32" href="/favicon-32x32.png" />
<link rel="icon" type="image/png" sizes="16x16" href="/favicon-16x16.png" />
<link rel="manifest" href="/site.webmanifest" />
<Show when={props.font}> <Show when={props.font}>
<link rel="preconnect" href="https://cdn.jsdelivr.net" /> <link rel="preconnect" href="https://cdn.jsdelivr.net" />
</Show> </Show>

3
@dasig/scripts/node/optimizeImage.ts
View file

@ -1,6 +1,3 @@
/** biome-ignore-all assist/source/organizeImports: <_> */
/** biome-ignore-all lint/suspicious/noExplicitAny: <_> */
import { consola } from "consola"; import { consola } from "consola";
import process from "node:process"; import process from "node:process";
import sharp from "sharp"; import sharp from "sharp";

8
@dasig/styles/Background.sass
View file

@ -1 +1,7 @@
@use '/src/styles/classes.sass' // @use '/src/styles/classes.sass'
@use '../../configs/design/site.sass' as design
:root
color-scheme: light dark
background-color: light-dark(design.$light-background, design.$dark-background)
transition: background-color 0.6s ease-out

7
@dasig/styles/Button.sass
View file

@ -1,7 +1,8 @@
@use '/src/styles/variables.sass' as vars
@use '/src/styles/fonts.sass' as fonts @use '/src/styles/fonts.sass' as fonts
@use 'sass:color' @use 'sass:color'
$primaryColor: #0075BB
$bulmaPrimary: rgb(0, 235, 199) $bulmaPrimary: rgb(0, 235, 199)
$bulmaPrimaryText: rgb(0, 31, 26) $bulmaPrimaryText: rgb(0, 31, 26)
$bulmaLink: rgb(92, 111, 255) $bulmaLink: rgb(92, 111, 255)
@ -36,7 +37,7 @@ $bootstrapLight: rgb(211, 212, 213)
$bootstrapDark: rgb(33, 37, 41) $bootstrapDark: rgb(33, 37, 41)
.button .button
background-color: vars.$primaryColor background-color: $primaryColor
border: none border: none
color: white color: white
padding: 0.5rem 1.25rem padding: 0.5rem 1.25rem
@ -49,7 +50,7 @@ $bootstrapDark: rgb(33, 37, 41)
transition: all 0.2s ease-out transition: all 0.2s ease-out
&:hover &:hover
background-color: color.adjust(vars.$primaryColor, $blackness: 20%) background-color: color.adjust($primaryColor, $blackness: 20%)
&:active &:active
transform: scale(0.95) transform: scale(0.95)

2
@dasig/styles/Footer.sass
View file

@ -1,4 +1,4 @@
@use '/src/styles/breakpoint.sass' as view @use '../../configs/design/sizes' as view
.footer .footer
padding: 1rem 0 padding: 1rem 0

4
@dasig/styles/HTML.sass
View file

@ -1,8 +1,8 @@
@use '/src/styles/variables.sass' as vars @use '../../configs/design/colors.sass' as colors
@use '/src/styles/fonts.sass' as fonts @use '/src/styles/fonts.sass' as fonts
.body .body
color: vars.$textColor color: colors.$white
.inter .inter
@extend .body @extend .body

4
@dasig/styles/Modal.sass
View file

@ -1,4 +1,4 @@
@use '/src/styles/variables.sass' as vars @use '../../configs/design/site' as site
@use 'sass:color' @use 'sass:color'
.modal .modal
@ -11,7 +11,7 @@
width: 100% width: 100%
height: 100% height: 100%
backdrop-filter: blur(20px) backdrop-filter: blur(20px)
background-color: rgba(color.adjust(vars.$background, $blackness: 5%), 0.6) background-color: rgba(color.adjust(site.$dark-background, $blackness: 5%), 0.6)
z-index: 999 z-index: 999
&__content &__content

2
@dasig/styles/Viewport.sass
View file

@ -1 +1 @@
@use '/src/styles/breakpoint.sass' @use '/src/styles/breakpoints.sass'

6
configs/config.api.toml
View file

@ -1,6 +0,0 @@
[backend]
url = "http://localhost:8080"
[request]
retries = 3
retry_codes = [400, 404, 405, 500, 502]

4
configs/config.site.toml
View file

@ -2,6 +2,8 @@
name = "Dasig" name = "Dasig"
short_name = "Dasig" short_name = "Dasig"
description = "An architectural framework for pure speed fullstack development" description = "An architectural framework for pure speed fullstack development"
developer = "Pat Alcala"
designer = "Pat Alcala"
[font] [font]
name = "inter" name = "inter"
@ -9,5 +11,5 @@ source = "cdn" # cdn or local
[copyright] [copyright]
name = "Pat Alcala" name = "Pat Alcala"
year = 2025 year = 2026
color = "#ffffffff" color = "#ffffffff"

0
configs/design.components.sass
View file

2
configs/design/colors.sass Normal file
View file

@ -0,0 +1,2 @@
$white: #f4f3f2
$black: #0A0A0A

4
configs/design.site.sass → configs/design/site.sass
View file

@ -1,6 +1,2 @@
$light-background: #e2e7f2 $light-background: #e2e7f2
$dark-background: #0a152a $dark-background: #0a152a
$mobile: 575.98px
$tablet: 768px
$desktop: 1440px

3
configs/design/sizes.sass Normal file
View file

@ -0,0 +1,3 @@
$mobile: 575.98px
$tablet: 768px
$desktop: 1440px

4
package.json
View file

@ -20,10 +20,12 @@
"sharp": "^0.34.4", "sharp": "^0.34.4",
"solid-icons": "^1.1.0", "solid-icons": "^1.1.0",
"solid-js": "^1.9.11", "solid-js": "^1.9.11",
"toml": "^3.0.0" "toml": "^3.0.0",
"yargs": "^18.0.0"
}, },
"devDependencies": { "devDependencies": {
"@types/node": "^24.5.2", "@types/node": "^24.5.2",
"@types/yargs": "^17.0.35",
"sass-embedded": "^1.92.1" "sass-embedded": "^1.92.1"
} }
} }

59
pnpm-lock.yaml generated
View file

@ -50,10 +50,16 @@ importers:
toml: toml:
specifier: ^3.0.0 specifier: ^3.0.0
version: 3.0.0 version: 3.0.0
yargs:
specifier: ^18.0.0
version: 18.0.0
devDependencies: devDependencies:
'@types/node': '@types/node':
specifier: ^24.5.2 specifier: ^24.5.2
version: 24.10.9 version: 24.10.9
'@types/yargs':
specifier: ^17.0.35
version: 17.0.35
sass-embedded: sass-embedded:
specifier: ^1.92.1 specifier: ^1.92.1
version: 1.97.3 version: 1.97.3
@ -815,6 +821,12 @@ packages:
'@types/unist@3.0.3': '@types/unist@3.0.3':
resolution: {integrity: sha512-ko/gIFJRv177XgZsZcBwnqJN5x/Gien8qNOn0D5bQU/zAzVf9Zt3BlcUiLqhV9y4ARk0GbT3tnUiPNgnTXzc/Q==} resolution: {integrity: sha512-ko/gIFJRv177XgZsZcBwnqJN5x/Gien8qNOn0D5bQU/zAzVf9Zt3BlcUiLqhV9y4ARk0GbT3tnUiPNgnTXzc/Q==}
'@types/yargs-parser@21.0.3':
resolution: {integrity: sha512-I4q9QU9MQv4oEOz4tAHJtNz1cwuLxn2F3xcc2iV5WdqLPpUnj30aUuxt1mAxYTG+oe8CZMV/+6rU4S4gRDzqtQ==}
'@types/yargs@17.0.35':
resolution: {integrity: sha512-qUHkeCyQFxMXg79wQfTtfndEC+N9ZZg76HJftDJp+qH2tV7Gj4OJi7l+PiWwJ+pWtW8GwSmqsDj/oymhrTWXjg==}
'@ungap/structured-clone@1.3.0': '@ungap/structured-clone@1.3.0':
resolution: {integrity: sha512-WmoN8qaIAo7WTYWbAZuG8PYEhn5fkz7dZrqTBZ7dtt//lL2Gwms1IcnQ5yHqjDfX8Ft5j4YzDM23f87zBfDe9g==} resolution: {integrity: sha512-WmoN8qaIAo7WTYWbAZuG8PYEhn5fkz7dZrqTBZ7dtt//lL2Gwms1IcnQ5yHqjDfX8Ft5j4YzDM23f87zBfDe9g==}
@ -950,6 +962,10 @@ packages:
resolution: {integrity: sha512-/lzGpEWL/8PfI0BmBOPRwp0c/wFNX1RdUML3jK/RcSBA9T8mZDdQpqYBKtCFTOfQbwPqWEOpjqW+Fnayc0969g==} resolution: {integrity: sha512-/lzGpEWL/8PfI0BmBOPRwp0c/wFNX1RdUML3jK/RcSBA9T8mZDdQpqYBKtCFTOfQbwPqWEOpjqW+Fnayc0969g==}
engines: {node: '>=10'} engines: {node: '>=10'}
cliui@9.0.1:
resolution: {integrity: sha512-k7ndgKhwoQveBL+/1tqGJYNz097I7WOvwbmmU2AR5+magtbjPWQTS1C5vzGkBC8Ym8UWRzfKUzUUqFLypY4Q+w==}
engines: {node: '>=20'}
clsx@2.1.1: clsx@2.1.1:
resolution: {integrity: sha512-eYm0QWBtUrBWZWG0d386OGAw16Z995PiOVo2B7bjWSbHedGl5e0ZWaq65kOGgUSNesEIDkB9ISbTg/JK9dhCZA==} resolution: {integrity: sha512-eYm0QWBtUrBWZWG0d386OGAw16Z995PiOVo2B7bjWSbHedGl5e0ZWaq65kOGgUSNesEIDkB9ISbTg/JK9dhCZA==}
engines: {node: '>=6'} engines: {node: '>=6'}
@ -1170,6 +1186,10 @@ packages:
resolution: {integrity: sha512-3hN7NaskYvMDLQY55gnW3NQ+mesEAepTqlg+VEbj7zzqEMBVNhzcGYYeqFo/TlYz6eQiFcp1HcsCZO+nGgS8zg==} resolution: {integrity: sha512-3hN7NaskYvMDLQY55gnW3NQ+mesEAepTqlg+VEbj7zzqEMBVNhzcGYYeqFo/TlYz6eQiFcp1HcsCZO+nGgS8zg==}
engines: {node: '>=6.9.0'} engines: {node: '>=6.9.0'}
get-caller-file@2.0.5:
resolution: {integrity: sha512-DyFP3BM/3YHTQOCUL/w0OZHR0lpKeGrxotcHWcqNEdnltqFwXVfhEBQ94eIo34AfQpo0rGki4cyIiftY06h2Fg==}
engines: {node: 6.* || 8.* || >= 10.*}
get-east-asian-width@1.4.0: get-east-asian-width@1.4.0:
resolution: {integrity: sha512-QZjmEOC+IT1uk6Rx0sX22V6uHWVwbdbxf1faPqJ1QhLdGgsRGCZoyaQBm/piRdJy/D2um6hM1UP7ZEeQ4EkP+Q==} resolution: {integrity: sha512-QZjmEOC+IT1uk6Rx0sX22V6uHWVwbdbxf1faPqJ1QhLdGgsRGCZoyaQBm/piRdJy/D2um6hM1UP7ZEeQ4EkP+Q==}
engines: {node: '>=18'} engines: {node: '>=18'}
@ -2220,6 +2240,10 @@ packages:
xxhash-wasm@1.1.0: xxhash-wasm@1.1.0:
resolution: {integrity: sha512-147y/6YNh+tlp6nd/2pWq38i9h6mz/EuQ6njIrmW8D1BS5nCqs0P6DG+m6zTGnNz5I+uhZ0SHxBs9BsPrwcKDA==} resolution: {integrity: sha512-147y/6YNh+tlp6nd/2pWq38i9h6mz/EuQ6njIrmW8D1BS5nCqs0P6DG+m6zTGnNz5I+uhZ0SHxBs9BsPrwcKDA==}
y18n@5.0.8:
resolution: {integrity: sha512-0pfFzegeDWJHJIAmTLRP2DwHjdF5s7jo9tuztdQxAhINCdvS+3nGINqPd00AphqJR/0LhANUS6/+7SCb98YOfA==}
engines: {node: '>=10'}
yallist@3.1.1: yallist@3.1.1:
resolution: {integrity: sha512-a4UGQaWPH59mOXUYnAG2ewncQS4i4F43Tv3JoAM+s2VDAmS9NsK8GpDMLrCHPksFT7h3K6TOoUNn2pb7RoXx4g==} resolution: {integrity: sha512-a4UGQaWPH59mOXUYnAG2ewncQS4i4F43Tv3JoAM+s2VDAmS9NsK8GpDMLrCHPksFT7h3K6TOoUNn2pb7RoXx4g==}
@ -2227,6 +2251,14 @@ packages:
resolution: {integrity: sha512-tVpsJW7DdjecAiFpbIB1e3qxIQsE6NoPc5/eTdrbbIC4h0LVsWhnoa3g+m2HclBIujHzsxZ4VJVA+GUuc2/LBw==} resolution: {integrity: sha512-tVpsJW7DdjecAiFpbIB1e3qxIQsE6NoPc5/eTdrbbIC4h0LVsWhnoa3g+m2HclBIujHzsxZ4VJVA+GUuc2/LBw==}
engines: {node: '>=12'} engines: {node: '>=12'}
yargs-parser@22.0.0:
resolution: {integrity: sha512-rwu/ClNdSMpkSrUb+d6BRsSkLUq1fmfsY6TOpYzTwvwkg1/NRG85KBy3kq++A8LKQwX6lsu+aWad+2khvuXrqw==}
engines: {node: ^20.19.0 || ^22.12.0 || >=23}
yargs@18.0.0:
resolution: {integrity: sha512-4UEqdc2RYGHZc7Doyqkrqiln3p9X2DZVxaGbwhn2pi7MrRagKaOcIKe8L3OxYcbhXLgLFUS3zAYuQjKBQgmuNg==}
engines: {node: ^20.19.0 || ^22.12.0 || >=23}
yocto-queue@1.2.2: yocto-queue@1.2.2:
resolution: {integrity: sha512-4LCcse/U2MHZ63HAJVE+v71o7yOdIe4cZ70Wpf8D/IyjDKYQLV5GD46B+hSTjJsvV5PztjvHoU580EftxjDZFQ==} resolution: {integrity: sha512-4LCcse/U2MHZ63HAJVE+v71o7yOdIe4cZ70Wpf8D/IyjDKYQLV5GD46B+hSTjJsvV5PztjvHoU580EftxjDZFQ==}
engines: {node: '>=12.20'} engines: {node: '>=12.20'}
@ -2885,6 +2917,12 @@ snapshots:
'@types/unist@3.0.3': {} '@types/unist@3.0.3': {}
'@types/yargs-parser@21.0.3': {}
'@types/yargs@17.0.35':
dependencies:
'@types/yargs-parser': 21.0.3
'@ungap/structured-clone@1.3.0': {} '@ungap/structured-clone@1.3.0': {}
acorn@8.15.0: {} acorn@8.15.0: {}
@ -3095,6 +3133,12 @@ snapshots:
cli-boxes@3.0.0: {} cli-boxes@3.0.0: {}
cliui@9.0.1:
dependencies:
string-width: 7.2.0
strip-ansi: 7.1.2
wrap-ansi: 9.0.2
clsx@2.1.1: {} clsx@2.1.1: {}
color-convert@2.0.1: color-convert@2.0.1:
@ -3292,6 +3336,8 @@ snapshots:
gensync@1.0.0-beta.2: {} gensync@1.0.0-beta.2: {}
get-caller-file@2.0.5: {}
get-east-asian-width@1.4.0: {} get-east-asian-width@1.4.0: {}
github-slugger@2.0.0: {} github-slugger@2.0.0: {}
@ -4543,10 +4589,23 @@ snapshots:
xxhash-wasm@1.1.0: {} xxhash-wasm@1.1.0: {}
y18n@5.0.8: {}
yallist@3.1.1: {} yallist@3.1.1: {}
yargs-parser@21.1.1: {} yargs-parser@21.1.1: {}
yargs-parser@22.0.0: {}
yargs@18.0.0:
dependencies:
cliui: 9.0.1
escalade: 3.2.0
get-caller-file: 2.0.5
string-width: 7.2.0
y18n: 5.0.8
yargs-parser: 22.0.0
yocto-queue@1.2.2: {} yocto-queue@1.2.2: {}
yocto-spinner@0.2.3: yocto-spinner@0.2.3:

8
src/layouts/Layout.astro
View file

@ -1,13 +1,9 @@
--- ---
const { title } = Astro.props const { title } = Astro.props
const websiteName = 'Template'
const websiteDescription = 'This is just a template.'
import { Background, HTML } from '../../@dasig' import { Background, HTML } from '../../@dasig'
--- ---
<HTML title={title} name={websiteName} description={websiteDescription} font="inter" author="Patrick Alvin Alcala"> <HTML title={title} font="inter">
<Background color="#0c1b31" /> <Background />
<slot /> <slot />
</HTML> </HTML>

51
src/styles/breakpoint.sass
View file

@ -1,51 +0,0 @@
$mobile: 375px
$tablet: 768px
$desktop: 1440px
.on-desktop-only
@media only screen and (min-width: 0px) and (max-width: $desktop)
display: none
@media only screen and (min-width: $desktop)
display: block
.on-tablet-only
@media only screen and (min-width: 0px) and (max-width: $tablet)
display: none
@media only screen and (min-width: $tablet) and (max-width: $desktop)
display: block
@media only screen and (min-width: $desktop)
display: none
.on-mobile-only
@media only screen and (min-width: $mobile)
display: block
@media only screen and (min-width: $tablet)
display: none
.on-desktop-tablet-only
@media only screen and (min-width: 0px) and (max-width: $tablet)
display: none
@media only screen and (min-width: $tablet)
display: block
.on-desktop-mobile-only
@media only screen and (min-width: 0px) and (max-width: $mobile)
display: block
@media only screen and (min-width: $mobile) and (max-width: $desktop)
display: none
@media only screen and (min-width: $desktop)
display: block
.on-tablet-mobile-only
@media only screen and (min-width: 0px) and (max-width: $desktop)
display: block
@media only screen and (min-width: $desktop)
display: none

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

16
src/styles/variables.sass
View file

@ -1,16 +0,0 @@
@use 'sass:color'
$background: #0c1b31
$textColor: #f0f8ff
$fontSize: 1rem
$borderMargin: 2rem
$primaryColor: #0075BB
$secondaryColor: #57687F
$accentColor: #00887C
$infoColor: #0082A4
$successColor: #009435
$warningColor: #E5B400
$errorColor: #E8595C