diff --git a/@dasig/components/Background.tsx b/@dasig/components/Background.tsx index bb6c587..e10af59 100644 --- a/@dasig/components/Background.tsx +++ b/@dasig/components/Background.tsx @@ -1,7 +1,7 @@ import '../styles/Background.sass' import { Show, createSignal } from 'solid-js' import fs from 'fs' -import webpPath from '../images/background.avif' +import webpPath from '../images/background.webp' import avifPath from '../images/background.avif' import noBackground from '../images/no-background.webp' diff --git a/@dasig/components/Copyright.tsx b/@dasig/components/Copyright.tsx index b8338d7..ab4ae87 100644 --- a/@dasig/components/Copyright.tsx +++ b/@dasig/components/Copyright.tsx @@ -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 { year: string name: string } + export default (props: Props) => { return ( - <> - - Copyright © {props.year} {props.name} All Rights Reserved. - - + + Copyright © {config.copyright.year} {config.copyright.name} All Rights Reserved. + ) } diff --git a/@dasig/components/HTML.tsx b/@dasig/components/HTML.tsx index dda61e9..e77275e 100644 --- a/@dasig/components/HTML.tsx +++ b/@dasig/components/HTML.tsx @@ -1,19 +1,19 @@ import '../styles/HTML.sass' +import * as fs from "fs"; +import * as toml from 'toml'; import { type JSXElement, Show } from 'solid-js' import background1 from '../images/background.avif' import background2 from '../images/background.webp' interface Props { title: string - name: string - description: string children: JSXElement font?: 'roboto' | 'inter' | 'montserrat' | 'open-sans' | 'public-sans' preloadBackground?: boolean - author: string } export default (props: Props) => { + const config = toml.parse(fs.readFileSync('configs/config.site.toml', 'utf8')) return ( <> @@ -21,14 +21,19 @@ export default (props: Props) => { - - - + + + - - + + + - + + + + + diff --git a/@dasig/scripts/node/optimizeImage.ts b/@dasig/scripts/node/optimizeImage.ts index 13f4cc1..ba06f43 100644 --- a/@dasig/scripts/node/optimizeImage.ts +++ b/@dasig/scripts/node/optimizeImage.ts @@ -1,6 +1,3 @@ -/** biome-ignore-all assist/source/organizeImports: <_> */ -/** biome-ignore-all lint/suspicious/noExplicitAny: <_> */ - import { consola } from "consola"; import process from "node:process"; import sharp from "sharp"; diff --git a/@dasig/styles/Background.sass b/@dasig/styles/Background.sass index 1e0b5bc..52965f3 100644 --- a/@dasig/styles/Background.sass +++ b/@dasig/styles/Background.sass @@ -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 diff --git a/@dasig/styles/Button.sass b/@dasig/styles/Button.sass index 329ba1d..8765cfe 100644 --- a/@dasig/styles/Button.sass +++ b/@dasig/styles/Button.sass @@ -1,7 +1,8 @@ -@use '/src/styles/variables.sass' as vars @use '/src/styles/fonts.sass' as fonts @use 'sass:color' +$primaryColor: #0075BB + $bulmaPrimary: rgb(0, 235, 199) $bulmaPrimaryText: rgb(0, 31, 26) $bulmaLink: rgb(92, 111, 255) @@ -36,7 +37,7 @@ $bootstrapLight: rgb(211, 212, 213) $bootstrapDark: rgb(33, 37, 41) .button - background-color: vars.$primaryColor + background-color: $primaryColor border: none color: white padding: 0.5rem 1.25rem @@ -49,7 +50,7 @@ $bootstrapDark: rgb(33, 37, 41) transition: all 0.2s ease-out &:hover - background-color: color.adjust(vars.$primaryColor, $blackness: 20%) + background-color: color.adjust($primaryColor, $blackness: 20%) &:active transform: scale(0.95) diff --git a/@dasig/styles/Footer.sass b/@dasig/styles/Footer.sass index 0215b16..04c87c9 100644 --- a/@dasig/styles/Footer.sass +++ b/@dasig/styles/Footer.sass @@ -1,4 +1,4 @@ -@use '/src/styles/breakpoint.sass' as view +@use '../../configs/design/sizes' as view .footer padding: 1rem 0 diff --git a/@dasig/styles/HTML.sass b/@dasig/styles/HTML.sass index 92e9d1c..38fcdfe 100644 --- a/@dasig/styles/HTML.sass +++ b/@dasig/styles/HTML.sass @@ -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 .body - color: vars.$textColor + color: colors.$white .inter @extend .body diff --git a/@dasig/styles/Modal.sass b/@dasig/styles/Modal.sass index 9f8368d..989dbab 100644 --- a/@dasig/styles/Modal.sass +++ b/@dasig/styles/Modal.sass @@ -1,4 +1,4 @@ -@use '/src/styles/variables.sass' as vars +@use '../../configs/design/site' as site @use 'sass:color' .modal @@ -11,7 +11,7 @@ width: 100% height: 100% 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 &__content diff --git a/@dasig/styles/Viewport.sass b/@dasig/styles/Viewport.sass index 6c4b1f0..eede3bd 100644 --- a/@dasig/styles/Viewport.sass +++ b/@dasig/styles/Viewport.sass @@ -1 +1 @@ -@use '/src/styles/breakpoint.sass' +@use '/src/styles/breakpoints.sass' diff --git a/configs/config.api.toml b/configs/config.api.toml deleted file mode 100644 index 95721c3..0000000 --- a/configs/config.api.toml +++ /dev/null @@ -1,6 +0,0 @@ -[backend] -url = "http://localhost:8080" - -[request] -retries = 3 -retry_codes = [400, 404, 405, 500, 502] diff --git a/configs/config.site.toml b/configs/config.site.toml index 6597638..6f45ff4 100644 --- a/configs/config.site.toml +++ b/configs/config.site.toml @@ -2,6 +2,8 @@ name = "Dasig" short_name = "Dasig" description = "An architectural framework for pure speed fullstack development" +developer = "Pat Alcala" +designer = "Pat Alcala" [font] name = "inter" @@ -9,5 +11,5 @@ source = "cdn" # cdn or local [copyright] name = "Pat Alcala" -year = 2025 +year = 2026 color = "#ffffffff" diff --git a/configs/design.components.sass b/configs/design.components.sass deleted file mode 100644 index e69de29..0000000 diff --git a/configs/design/colors.sass b/configs/design/colors.sass new file mode 100644 index 0000000..2688ea6 --- /dev/null +++ b/configs/design/colors.sass @@ -0,0 +1,2 @@ +$white: #f4f3f2 +$black: #0A0A0A diff --git a/configs/design.site.sass b/configs/design/site.sass similarity index 50% rename from configs/design.site.sass rename to configs/design/site.sass index 6aa6b27..8b11688 100644 --- a/configs/design.site.sass +++ b/configs/design/site.sass @@ -1,6 +1,2 @@ $light-background: #e2e7f2 $dark-background: #0a152a - -$mobile: 575.98px -$tablet: 768px -$desktop: 1440px diff --git a/configs/design/sizes.sass b/configs/design/sizes.sass new file mode 100644 index 0000000..2575248 --- /dev/null +++ b/configs/design/sizes.sass @@ -0,0 +1,3 @@ +$mobile: 575.98px +$tablet: 768px +$desktop: 1440px diff --git a/package.json b/package.json index 6c26854..b077bdf 100644 --- a/package.json +++ b/package.json @@ -20,10 +20,12 @@ "sharp": "^0.34.4", "solid-icons": "^1.1.0", "solid-js": "^1.9.11", - "toml": "^3.0.0" + "toml": "^3.0.0", + "yargs": "^18.0.0" }, "devDependencies": { "@types/node": "^24.5.2", + "@types/yargs": "^17.0.35", "sass-embedded": "^1.92.1" } } diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml index ba86cef..bb0e153 100644 --- a/pnpm-lock.yaml +++ b/pnpm-lock.yaml @@ -50,10 +50,16 @@ importers: toml: specifier: ^3.0.0 version: 3.0.0 + yargs: + specifier: ^18.0.0 + version: 18.0.0 devDependencies: '@types/node': specifier: ^24.5.2 version: 24.10.9 + '@types/yargs': + specifier: ^17.0.35 + version: 17.0.35 sass-embedded: specifier: ^1.92.1 version: 1.97.3 @@ -815,6 +821,12 @@ packages: '@types/unist@3.0.3': 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': resolution: {integrity: sha512-WmoN8qaIAo7WTYWbAZuG8PYEhn5fkz7dZrqTBZ7dtt//lL2Gwms1IcnQ5yHqjDfX8Ft5j4YzDM23f87zBfDe9g==} @@ -950,6 +962,10 @@ packages: resolution: {integrity: sha512-/lzGpEWL/8PfI0BmBOPRwp0c/wFNX1RdUML3jK/RcSBA9T8mZDdQpqYBKtCFTOfQbwPqWEOpjqW+Fnayc0969g==} engines: {node: '>=10'} + cliui@9.0.1: + resolution: {integrity: sha512-k7ndgKhwoQveBL+/1tqGJYNz097I7WOvwbmmU2AR5+magtbjPWQTS1C5vzGkBC8Ym8UWRzfKUzUUqFLypY4Q+w==} + engines: {node: '>=20'} + clsx@2.1.1: resolution: {integrity: sha512-eYm0QWBtUrBWZWG0d386OGAw16Z995PiOVo2B7bjWSbHedGl5e0ZWaq65kOGgUSNesEIDkB9ISbTg/JK9dhCZA==} engines: {node: '>=6'} @@ -1170,6 +1186,10 @@ packages: resolution: {integrity: sha512-3hN7NaskYvMDLQY55gnW3NQ+mesEAepTqlg+VEbj7zzqEMBVNhzcGYYeqFo/TlYz6eQiFcp1HcsCZO+nGgS8zg==} 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: resolution: {integrity: sha512-QZjmEOC+IT1uk6Rx0sX22V6uHWVwbdbxf1faPqJ1QhLdGgsRGCZoyaQBm/piRdJy/D2um6hM1UP7ZEeQ4EkP+Q==} engines: {node: '>=18'} @@ -2220,6 +2240,10 @@ packages: xxhash-wasm@1.1.0: 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: resolution: {integrity: sha512-a4UGQaWPH59mOXUYnAG2ewncQS4i4F43Tv3JoAM+s2VDAmS9NsK8GpDMLrCHPksFT7h3K6TOoUNn2pb7RoXx4g==} @@ -2227,6 +2251,14 @@ packages: resolution: {integrity: sha512-tVpsJW7DdjecAiFpbIB1e3qxIQsE6NoPc5/eTdrbbIC4h0LVsWhnoa3g+m2HclBIujHzsxZ4VJVA+GUuc2/LBw==} 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: resolution: {integrity: sha512-4LCcse/U2MHZ63HAJVE+v71o7yOdIe4cZ70Wpf8D/IyjDKYQLV5GD46B+hSTjJsvV5PztjvHoU580EftxjDZFQ==} engines: {node: '>=12.20'} @@ -2885,6 +2917,12 @@ snapshots: '@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': {} acorn@8.15.0: {} @@ -3095,6 +3133,12 @@ snapshots: 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: {} color-convert@2.0.1: @@ -3292,6 +3336,8 @@ snapshots: gensync@1.0.0-beta.2: {} + get-caller-file@2.0.5: {} + get-east-asian-width@1.4.0: {} github-slugger@2.0.0: {} @@ -4543,10 +4589,23 @@ snapshots: xxhash-wasm@1.1.0: {} + y18n@5.0.8: {} + yallist@3.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-spinner@0.2.3: diff --git a/src/layouts/Layout.astro b/src/layouts/Layout.astro index 1e2436c..e3d08d1 100644 --- a/src/layouts/Layout.astro +++ b/src/layouts/Layout.astro @@ -1,13 +1,9 @@ --- const { title } = Astro.props - -const websiteName = 'Template' -const websiteDescription = 'This is just a template.' - import { Background, HTML } from '../../@dasig' --- - - + + diff --git a/src/styles/breakpoint.sass b/src/styles/breakpoint.sass deleted file mode 100644 index 7ccdc2b..0000000 --- a/src/styles/breakpoint.sass +++ /dev/null @@ -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 diff --git a/src/styles/breakpoints.sass b/src/styles/breakpoints.sass new file mode 100644 index 0000000..e513145 --- /dev/null +++ b/src/styles/breakpoints.sass @@ -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 diff --git a/src/styles/variables.sass b/src/styles/variables.sass deleted file mode 100644 index cb81aaa..0000000 --- a/src/styles/variables.sass +++ /dev/null @@ -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