Updated
|
|
@ -1,9 +1,9 @@
|
|||
import './Background.sass'
|
||||
import { Show, createSignal } from 'solid-js'
|
||||
import fs from 'fs'
|
||||
import webpPath from '../../../templates/images/background.webp'
|
||||
import avifPath from '../../../templates/images/background.avif'
|
||||
import noBackground from '../../../templates/images/no-background.webp'
|
||||
import webpPath from '../../images/background.webp'
|
||||
import avifPath from '../../images/background.avif'
|
||||
import noBackground from '../../images/no-background.webp'
|
||||
|
||||
interface Props {
|
||||
image?: boolean
|
||||
|
|
@ -1,5 +1,5 @@
|
|||
import webpPath from '../../../templates/images/logo.webp'
|
||||
import avifPath from '../../../templates/images/logo.avif'
|
||||
import webpPath from '../../images/logo.webp'
|
||||
import avifPath from '../../images/logo.avif'
|
||||
|
||||
interface Props {
|
||||
size?: number
|
||||
|
|
@ -2,8 +2,8 @@ import sharp from 'sharp'
|
|||
|
||||
const convertBackground = async () => {
|
||||
const inputSrc = 'src/assets/images/background.png'
|
||||
const webpOutput = 'src/templates/images/background.webp'
|
||||
const avifOutput = 'src/templates/images/background.avif'
|
||||
const webpOutput = 'fwt/images/background.webp'
|
||||
const avifOutput = 'fwt/images/background.avif'
|
||||
|
||||
const avifBuffer = await sharp(inputSrc).avif({ quality: 60 }).resize(1920).toBuffer()
|
||||
await sharp(avifBuffer).toFile(avifOutput)
|
||||
|
|
@ -6,8 +6,8 @@ interface Props {
|
|||
}
|
||||
|
||||
const convertImage = async (props: Props) => {
|
||||
const avifOutputPath = `src/templates/images/${props.src.split('.').slice(0, -1).join('.')}.avif`
|
||||
const webpOutputPath = `src/templates/images/${props.src.split('.').slice(0, -1).join('.')}.webp`
|
||||
const avifOutputPath = `fwt/images/${props.src.split('.').slice(0, -1).join('.')}.avif`
|
||||
const webpOutputPath = `fwt/images/${props.src.split('.').slice(0, -1).join('.')}.webp`
|
||||
|
||||
const avifBuffer = await sharp(`src/assets/images/${props.src}`).avif({ quality: 60 }).resize(props.size).toBuffer()
|
||||
await sharp(avifBuffer).toFile(avifOutputPath)
|
||||
|
|
@ -6,8 +6,8 @@ interface Props {
|
|||
|
||||
const convertLogo = async (props: Props) => {
|
||||
const inputSrc = 'src/assets/images/logo.png'
|
||||
const webpImage = 'src/templates/images/logo.webp'
|
||||
const avifImage = 'src/templates/images/logo.avif'
|
||||
const webpImage = 'fwt/images/logo.webp'
|
||||
const avifImage = 'fwt/images/logo.avif'
|
||||
|
||||
const avifBuffer = await sharp(inputSrc).avif({ quality: 60 }).resize(props.size).toBuffer()
|
||||
await sharp(avifBuffer).toFile(avifImage)
|
||||
|
Before Width: | Height: | Size: 96 KiB After Width: | Height: | Size: 96 KiB |
|
Before Width: | Height: | Size: 140 KiB After Width: | Height: | Size: 140 KiB |
|
Before Width: | Height: | Size: 4.3 KiB After Width: | Height: | Size: 4.3 KiB |
|
Before Width: | Height: | Size: 5.6 KiB After Width: | Height: | Size: 5.6 KiB |
|
Before Width: | Height: | Size: 11 KiB After Width: | Height: | Size: 11 KiB |
|
Before Width: | Height: | Size: 2.9 KiB After Width: | Height: | Size: 2.9 KiB |
|
Before Width: | Height: | Size: 3.9 KiB After Width: | Height: | Size: 3.9 KiB |
|
|
@ -1,9 +0,0 @@
|
|||
<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 128 128">
|
||||
<path d="M50.4 78.5a75.1 75.1 0 0 0-28.5 6.9l24.2-65.7c.7-2 1.9-3.2 3.4-3.2h29c1.5 0 2.7 1.2 3.4 3.2l24.2 65.7s-11.6-7-28.5-7L67 45.5c-.4-1.7-1.6-2.8-2.9-2.8-1.3 0-2.5 1.1-2.9 2.7L50.4 78.5Zm-1.1 28.2Zm-4.2-20.2c-2 6.6-.6 15.8 4.2 20.2a17.5 17.5 0 0 1 .2-.7 5.5 5.5 0 0 1 5.7-4.5c2.8.1 4.3 1.5 4.7 4.7.2 1.1.2 2.3.2 3.5v.4c0 2.7.7 5.2 2.2 7.4a13 13 0 0 0 5.7 4.9v-.3l-.2-.3c-1.8-5.6-.5-9.5 4.4-12.8l1.5-1a73 73 0 0 0 3.2-2.2 16 16 0 0 0 6.8-11.4c.3-2 .1-4-.6-6l-.8.6-1.6 1a37 37 0 0 1-22.4 2.7c-5-.7-9.7-2-13.2-6.2Z" />
|
||||
<style>
|
||||
path { fill: #000; }
|
||||
@media (prefers-color-scheme: dark) {
|
||||
path { fill: #FFF; }
|
||||
}
|
||||
</style>
|
||||
</svg>
|
||||
|
Before Width: | Height: | Size: 749 B |
|
|
@ -4,8 +4,8 @@ const { title } = Astro.props
|
|||
const websiteName = 'Template'
|
||||
const websiteDescription = 'This is just a template.'
|
||||
|
||||
import Background from '../templates/components/Background/Background'
|
||||
import OptimizeBackground from '../templates/components/Optimizer/OptimizeBackground'
|
||||
import Background from '../../fwt/components/Background/Background'
|
||||
import OptimizeBackground from '../../fwt/components/Optimizer/OptimizeBackground'
|
||||
---
|
||||
|
||||
<html lang="en">
|
||||
|
|
|
|||
|
|
@ -1,11 +1,11 @@
|
|||
---
|
||||
import Layout from '../layouts/Layout.astro'
|
||||
import Button from '../templates/components/Button/Button'
|
||||
import Logo from '../templates/components/Logo/Logo'
|
||||
import OptimizeLogo from '../templates/components/Optimizer/OptimizeLogo'
|
||||
import Link from '../templates/components/Link/Link'
|
||||
import Button from '../../fwt/components/Button/Button'
|
||||
import Logo from '../../fwt/components/Logo/Logo'
|
||||
import OptimizeLogo from '../../fwt/components/Optimizer/OptimizeLogo'
|
||||
import Link from '../../fwt/components/Link/Link'
|
||||
import Counter from '../components/Counter/Counter'
|
||||
import Page from '../templates/components/Page/Page'
|
||||
import Page from '../../fwt/components/Page/Page'
|
||||
---
|
||||
|
||||
<Layout title="FWT">
|
||||
|
|
|
|||
|
|
@ -1,11 +1,11 @@
|
|||
---
|
||||
import Layout from '../layouts/Layout.astro'
|
||||
import Button from '../templates/components/Button/Button.tsx'
|
||||
import Image from '../templates/components/Image/Image'
|
||||
import Page from '../templates/components/Page/Page'
|
||||
import sampleA from '../templates/images/sample.avif'
|
||||
import sampleW from '../templates/images/sample.webp'
|
||||
import OptimizeImage from '../templates/components/Optimizer/OptimizeImage'
|
||||
import Button from '../../fwt/components/Button/Button'
|
||||
import Image from '../../fwt/components/Image/Image'
|
||||
import Page from '../../fwt/components/Page/Page'
|
||||
import sample1 from '../../fwt/images/sample.avif'
|
||||
import sample2 from '../../fwt/images/sample.webp'
|
||||
import OptimizeImage from '../../fwt/components/Optimizer/OptimizeImage.tsx'
|
||||
---
|
||||
|
||||
<Layout title="Home">
|
||||
|
|
@ -15,10 +15,10 @@ import OptimizeImage from '../templates/components/Optimizer/OptimizeImage'
|
|||
|
||||
<section class="image">
|
||||
<!-- <OptimizeImage src="sample.png" size={400} /> -->
|
||||
<Image avif={sampleA.src} webp={sampleW.src} alt="Example Image" size={400} />
|
||||
<Image avif={sampleA.src} webp={sampleW.src} alt="Example Image" size={400} />
|
||||
<Image avif={sampleA.src} webp={sampleW.src} alt="Example Image" size={400} />
|
||||
<Image avif={sampleA.src} webp={sampleW.src} alt="Example Image" size={400} />
|
||||
<Image avif={sample1.src} webp={sample2.src} alt="Example Image" size={400} />
|
||||
<Image avif={sample1.src} webp={sample2.src} alt="Example Image" size={400} />
|
||||
<Image avif={sample1.src} webp={sample2.src} alt="Example Image" size={400} />
|
||||
<Image avif={sample1.src} webp={sample2.src} alt="Example Image" size={400} />
|
||||
</section>
|
||||
</Page>
|
||||
</Layout>
|
||||
|
|
|
|||