Removed old files
|
|
@ -1 +0,0 @@
|
|||
export default new Map();
|
||||
|
|
@ -1 +0,0 @@
|
|||
export default new Map();
|
||||
199
.astro/content.d.ts
vendored
|
|
@ -1,199 +0,0 @@
|
|||
declare module 'astro:content' {
|
||||
export interface RenderResult {
|
||||
Content: import('astro/runtime/server/index.js').AstroComponentFactory;
|
||||
headings: import('astro').MarkdownHeading[];
|
||||
remarkPluginFrontmatter: Record<string, any>;
|
||||
}
|
||||
interface Render {
|
||||
'.md': Promise<RenderResult>;
|
||||
}
|
||||
|
||||
export interface RenderedContent {
|
||||
html: string;
|
||||
metadata?: {
|
||||
imagePaths: Array<string>;
|
||||
[key: string]: unknown;
|
||||
};
|
||||
}
|
||||
}
|
||||
|
||||
declare module 'astro:content' {
|
||||
type Flatten<T> = T extends { [K: string]: infer U } ? U : never;
|
||||
|
||||
export type CollectionKey = keyof AnyEntryMap;
|
||||
export type CollectionEntry<C extends CollectionKey> = Flatten<AnyEntryMap[C]>;
|
||||
|
||||
export type ContentCollectionKey = keyof ContentEntryMap;
|
||||
export type DataCollectionKey = keyof DataEntryMap;
|
||||
|
||||
type AllValuesOf<T> = T extends any ? T[keyof T] : never;
|
||||
type ValidContentEntrySlug<C extends keyof ContentEntryMap> = AllValuesOf<
|
||||
ContentEntryMap[C]
|
||||
>['slug'];
|
||||
|
||||
export type ReferenceDataEntry<
|
||||
C extends CollectionKey,
|
||||
E extends keyof DataEntryMap[C] = string,
|
||||
> = {
|
||||
collection: C;
|
||||
id: E;
|
||||
};
|
||||
export type ReferenceContentEntry<
|
||||
C extends keyof ContentEntryMap,
|
||||
E extends ValidContentEntrySlug<C> | (string & {}) = string,
|
||||
> = {
|
||||
collection: C;
|
||||
slug: E;
|
||||
};
|
||||
export type ReferenceLiveEntry<C extends keyof LiveContentConfig['collections']> = {
|
||||
collection: C;
|
||||
id: string;
|
||||
};
|
||||
|
||||
/** @deprecated Use `getEntry` instead. */
|
||||
export function getEntryBySlug<
|
||||
C extends keyof ContentEntryMap,
|
||||
E extends ValidContentEntrySlug<C> | (string & {}),
|
||||
>(
|
||||
collection: C,
|
||||
// Note that this has to accept a regular string too, for SSR
|
||||
entrySlug: E,
|
||||
): E extends ValidContentEntrySlug<C>
|
||||
? Promise<CollectionEntry<C>>
|
||||
: Promise<CollectionEntry<C> | undefined>;
|
||||
|
||||
/** @deprecated Use `getEntry` instead. */
|
||||
export function getDataEntryById<C extends keyof DataEntryMap, E extends keyof DataEntryMap[C]>(
|
||||
collection: C,
|
||||
entryId: E,
|
||||
): Promise<CollectionEntry<C>>;
|
||||
|
||||
export function getCollection<C extends keyof AnyEntryMap, E extends CollectionEntry<C>>(
|
||||
collection: C,
|
||||
filter?: (entry: CollectionEntry<C>) => entry is E,
|
||||
): Promise<E[]>;
|
||||
export function getCollection<C extends keyof AnyEntryMap>(
|
||||
collection: C,
|
||||
filter?: (entry: CollectionEntry<C>) => unknown,
|
||||
): Promise<CollectionEntry<C>[]>;
|
||||
|
||||
export function getLiveCollection<C extends keyof LiveContentConfig['collections']>(
|
||||
collection: C,
|
||||
filter?: LiveLoaderCollectionFilterType<C>,
|
||||
): Promise<
|
||||
import('astro').LiveDataCollectionResult<LiveLoaderDataType<C>, LiveLoaderErrorType<C>>
|
||||
>;
|
||||
|
||||
export function getEntry<
|
||||
C extends keyof ContentEntryMap,
|
||||
E extends ValidContentEntrySlug<C> | (string & {}),
|
||||
>(
|
||||
entry: ReferenceContentEntry<C, E>,
|
||||
): E extends ValidContentEntrySlug<C>
|
||||
? Promise<CollectionEntry<C>>
|
||||
: Promise<CollectionEntry<C> | undefined>;
|
||||
export function getEntry<
|
||||
C extends keyof DataEntryMap,
|
||||
E extends keyof DataEntryMap[C] | (string & {}),
|
||||
>(
|
||||
entry: ReferenceDataEntry<C, E>,
|
||||
): E extends keyof DataEntryMap[C]
|
||||
? Promise<DataEntryMap[C][E]>
|
||||
: Promise<CollectionEntry<C> | undefined>;
|
||||
export function getEntry<
|
||||
C extends keyof ContentEntryMap,
|
||||
E extends ValidContentEntrySlug<C> | (string & {}),
|
||||
>(
|
||||
collection: C,
|
||||
slug: E,
|
||||
): E extends ValidContentEntrySlug<C>
|
||||
? Promise<CollectionEntry<C>>
|
||||
: Promise<CollectionEntry<C> | undefined>;
|
||||
export function getEntry<
|
||||
C extends keyof DataEntryMap,
|
||||
E extends keyof DataEntryMap[C] | (string & {}),
|
||||
>(
|
||||
collection: C,
|
||||
id: E,
|
||||
): E extends keyof DataEntryMap[C]
|
||||
? string extends keyof DataEntryMap[C]
|
||||
? Promise<DataEntryMap[C][E]> | undefined
|
||||
: Promise<DataEntryMap[C][E]>
|
||||
: Promise<CollectionEntry<C> | undefined>;
|
||||
export function getLiveEntry<C extends keyof LiveContentConfig['collections']>(
|
||||
collection: C,
|
||||
filter: string | LiveLoaderEntryFilterType<C>,
|
||||
): Promise<import('astro').LiveDataEntryResult<LiveLoaderDataType<C>, LiveLoaderErrorType<C>>>;
|
||||
|
||||
/** Resolve an array of entry references from the same collection */
|
||||
export function getEntries<C extends keyof ContentEntryMap>(
|
||||
entries: ReferenceContentEntry<C, ValidContentEntrySlug<C>>[],
|
||||
): Promise<CollectionEntry<C>[]>;
|
||||
export function getEntries<C extends keyof DataEntryMap>(
|
||||
entries: ReferenceDataEntry<C, keyof DataEntryMap[C]>[],
|
||||
): Promise<CollectionEntry<C>[]>;
|
||||
|
||||
export function render<C extends keyof AnyEntryMap>(
|
||||
entry: AnyEntryMap[C][string],
|
||||
): Promise<RenderResult>;
|
||||
|
||||
export function reference<C extends keyof AnyEntryMap>(
|
||||
collection: C,
|
||||
): import('astro/zod').ZodEffects<
|
||||
import('astro/zod').ZodString,
|
||||
C extends keyof ContentEntryMap
|
||||
? ReferenceContentEntry<C, ValidContentEntrySlug<C>>
|
||||
: ReferenceDataEntry<C, keyof DataEntryMap[C]>
|
||||
>;
|
||||
// Allow generic `string` to avoid excessive type errors in the config
|
||||
// if `dev` is not running to update as you edit.
|
||||
// Invalid collection names will be caught at build time.
|
||||
export function reference<C extends string>(
|
||||
collection: C,
|
||||
): import('astro/zod').ZodEffects<import('astro/zod').ZodString, never>;
|
||||
|
||||
type ReturnTypeOrOriginal<T> = T extends (...args: any[]) => infer R ? R : T;
|
||||
type InferEntrySchema<C extends keyof AnyEntryMap> = import('astro/zod').infer<
|
||||
ReturnTypeOrOriginal<Required<ContentConfig['collections'][C]>['schema']>
|
||||
>;
|
||||
|
||||
type ContentEntryMap = {
|
||||
|
||||
};
|
||||
|
||||
type DataEntryMap = {
|
||||
|
||||
};
|
||||
|
||||
type AnyEntryMap = ContentEntryMap & DataEntryMap;
|
||||
|
||||
type ExtractLoaderTypes<T> = T extends import('astro/loaders').LiveLoader<
|
||||
infer TData,
|
||||
infer TEntryFilter,
|
||||
infer TCollectionFilter,
|
||||
infer TError
|
||||
>
|
||||
? { data: TData; entryFilter: TEntryFilter; collectionFilter: TCollectionFilter; error: TError }
|
||||
: { data: never; entryFilter: never; collectionFilter: never; error: never };
|
||||
type ExtractDataType<T> = ExtractLoaderTypes<T>['data'];
|
||||
type ExtractEntryFilterType<T> = ExtractLoaderTypes<T>['entryFilter'];
|
||||
type ExtractCollectionFilterType<T> = ExtractLoaderTypes<T>['collectionFilter'];
|
||||
type ExtractErrorType<T> = ExtractLoaderTypes<T>['error'];
|
||||
|
||||
type LiveLoaderDataType<C extends keyof LiveContentConfig['collections']> =
|
||||
LiveContentConfig['collections'][C]['schema'] extends undefined
|
||||
? ExtractDataType<LiveContentConfig['collections'][C]['loader']>
|
||||
: import('astro/zod').infer<
|
||||
Exclude<LiveContentConfig['collections'][C]['schema'], undefined>
|
||||
>;
|
||||
type LiveLoaderEntryFilterType<C extends keyof LiveContentConfig['collections']> =
|
||||
ExtractEntryFilterType<LiveContentConfig['collections'][C]['loader']>;
|
||||
type LiveLoaderCollectionFilterType<C extends keyof LiveContentConfig['collections']> =
|
||||
ExtractCollectionFilterType<LiveContentConfig['collections'][C]['loader']>;
|
||||
type LiveLoaderErrorType<C extends keyof LiveContentConfig['collections']> = ExtractErrorType<
|
||||
LiveContentConfig['collections'][C]['loader']
|
||||
>;
|
||||
|
||||
export type ContentConfig = typeof import("../src/content.config.mjs");
|
||||
export type LiveContentConfig = never;
|
||||
}
|
||||
|
|
@ -1 +0,0 @@
|
|||
[["Map",1,2],"meta::meta",["Map",3,4,5,6],"astro-version","5.13.8","astro-config-digest","{\"root\":{},\"srcDir\":{},\"publicDir\":{},\"outDir\":{},\"cacheDir\":{},\"site\":\"http://localhost:4321\",\"compressHTML\":true,\"base\":\"/\",\"trailingSlash\":\"ignore\",\"output\":\"static\",\"scopedStyleStrategy\":\"attribute\",\"build\":{\"format\":\"directory\",\"client\":{},\"server\":{},\"assets\":\"_fwt\",\"serverEntry\":\"entry.mjs\",\"redirects\":true,\"inlineStylesheets\":\"never\",\"concurrency\":1},\"server\":{\"open\":false,\"host\":false,\"port\":4321,\"streaming\":true,\"allowedHosts\":[]},\"redirects\":{},\"prefetch\":true,\"image\":{\"endpoint\":{\"route\":\"/_image\"},\"service\":{\"entrypoint\":\"astro/assets/services/sharp\",\"config\":{}},\"domains\":[],\"remotePatterns\":[],\"responsiveStyles\":false},\"devToolbar\":{\"enabled\":true},\"markdown\":{\"syntaxHighlight\":{\"type\":\"shiki\",\"excludeLangs\":[\"math\"]},\"shikiConfig\":{\"langs\":[],\"langAlias\":{},\"theme\":\"github-dark\",\"themes\":{},\"wrap\":false,\"transformers\":[]},\"remarkPlugins\":[],\"rehypePlugins\":[],\"remarkRehype\":{},\"gfm\":true,\"smartypants\":true},\"security\":{\"checkOrigin\":true},\"env\":{\"schema\":{},\"validateSecrets\":false},\"experimental\":{\"clientPrerender\":false,\"contentIntellisense\":false,\"headingIdCompat\":false,\"preserveScriptOrder\":false,\"liveContentCollections\":false,\"csp\":false,\"staticImportMetaEnv\":false,\"chromeDevtoolsWorkspace\":false},\"legacy\":{\"collections\":false}}"]
|
||||
|
|
@ -1,5 +0,0 @@
|
|||
{
|
||||
"_variables": {
|
||||
"lastUpdateCheck": 1758157364090
|
||||
}
|
||||
}
|
||||
2
.astro/types.d.ts
vendored
|
|
@ -1,2 +0,0 @@
|
|||
/// <reference types="astro/client" />
|
||||
/// <reference path="content.d.ts" />
|
||||
|
|
@ -1,17 +0,0 @@
|
|||
import sharp from 'sharp'
|
||||
|
||||
const convertBackground = async () => {
|
||||
const inputSrc = 'src/assets/images/background.png'
|
||||
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)
|
||||
|
||||
const webpBuffer = await sharp(inputSrc).webp({ quality: 75 }).resize(1920).toBuffer()
|
||||
await sharp(webpBuffer).toFile(webpOutput)
|
||||
}
|
||||
|
||||
export default () => {
|
||||
convertBackground()
|
||||
}
|
||||
|
|
@ -1,21 +0,0 @@
|
|||
import sharp from 'sharp'
|
||||
|
||||
interface Props {
|
||||
src: string
|
||||
size?: number
|
||||
}
|
||||
|
||||
const convertImage = async (props: Props) => {
|
||||
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)
|
||||
|
||||
const webpBuffer = await sharp(`src/assets/images/${props.src}`).webp({ quality: 75 }).resize(props.size).toBuffer()
|
||||
await sharp(webpBuffer).toFile(webpOutputPath)
|
||||
}
|
||||
|
||||
export default (props: Props) => {
|
||||
convertImage(props)
|
||||
}
|
||||
|
|
@ -1,34 +0,0 @@
|
|||
import sharp from 'sharp'
|
||||
|
||||
interface Props {
|
||||
size?: number
|
||||
favicon?: boolean
|
||||
}
|
||||
|
||||
const convertLogo = async (props: Props) => {
|
||||
const inputSrc = 'src/assets/images/logo.png'
|
||||
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)
|
||||
|
||||
const webpBuffer = await sharp(inputSrc).webp({ quality: 75 }).resize(props.size).toBuffer()
|
||||
await sharp(webpBuffer).toFile(webpImage)
|
||||
}
|
||||
|
||||
const generateFavicon = async (props: Props) => {
|
||||
const inputSrc = 'src/assets/images/logo.png'
|
||||
const favicon = 'public/favicon.png'
|
||||
|
||||
const faviconBuffer = await sharp(inputSrc).png({ quality: 90 }).resize(50).toBuffer()
|
||||
await sharp(faviconBuffer).toFile(favicon)
|
||||
}
|
||||
|
||||
export default (props: Props) => {
|
||||
convertLogo(props)
|
||||
|
||||
if (props.favicon) {
|
||||
generateFavicon(props)
|
||||
}
|
||||
}
|
||||
|
|
@ -1,50 +0,0 @@
|
|||
import '../styles/Background.sass'
|
||||
import { Show, createSignal } from 'solid-js'
|
||||
import fs from 'fs'
|
||||
import webpPath from '../images/background.webp'
|
||||
import avifPath from '../images/background.avif'
|
||||
import noBackground from '../images/no-background.webp'
|
||||
|
||||
interface Props {
|
||||
image?: boolean
|
||||
color?: string
|
||||
}
|
||||
|
||||
let [imageLoaded, setImageLoaded] = createSignal(false)
|
||||
|
||||
const checkBackground = () => {
|
||||
if (!fs.existsSync(avifPath.src) && !fs.existsSync(webpPath.src)) {
|
||||
setImageLoaded(true)
|
||||
} else {
|
||||
setImageLoaded(false)
|
||||
}
|
||||
}
|
||||
|
||||
export default (props: Props) => {
|
||||
checkBackground()
|
||||
|
||||
return (
|
||||
<>
|
||||
<Show when={props.image}>
|
||||
<Show when={imageLoaded()}>
|
||||
<picture class="fullscreen">
|
||||
<source srcset={avifPath.src} type="image/avif" />
|
||||
<source srcset={webpPath.src} type="image/webp" />
|
||||
<source srcset={noBackground.src} type="image/webp" />
|
||||
<img width="1920" height="auto" decoding="async" loading="lazy" alt="An image background" />
|
||||
</picture>
|
||||
</Show>
|
||||
<Show when={!imageLoaded()}>
|
||||
<picture class="fullscreen">
|
||||
<source srcset={noBackground.src} type="image/webp" />
|
||||
<img width="1920" height="auto" decoding="async" loading="lazy" alt="An alternative background if found no image background" />
|
||||
</picture>
|
||||
</Show>
|
||||
</Show>
|
||||
|
||||
<Show when={!props.image}>
|
||||
<div style={{ background: props.color }} class="fullscreen" />
|
||||
</Show>
|
||||
</>
|
||||
)
|
||||
}
|
||||
|
|
@ -1,19 +0,0 @@
|
|||
import '../styles/Box.sass'
|
||||
import { type JSXElement, createMemo } from 'solid-js'
|
||||
|
||||
interface Props {
|
||||
thickness: number
|
||||
color?: string
|
||||
children: JSXElement
|
||||
curved?: boolean
|
||||
}
|
||||
|
||||
export default (props: Props) => {
|
||||
const boxClass = createMemo(() => (props.curved ? 'curvedbox' : 'box'))
|
||||
|
||||
return (
|
||||
<section class={boxClass()} style={{ border: `${props.thickness}px solid ${props.color || 'white'}` }}>
|
||||
{props.children}
|
||||
</section>
|
||||
)
|
||||
}
|
||||
|
|
@ -1,83 +0,0 @@
|
|||
import '../styles/Button.sass'
|
||||
import { Show, Switch, Match } from 'solid-js'
|
||||
|
||||
interface Props {
|
||||
label?: string
|
||||
to?: string
|
||||
onClick?: () => void
|
||||
edges?: 'curved' | 'rounded' | 'flat'
|
||||
design?: 'bu-primary' | 'bu-link' | 'bu-info' | 'bu-success' | 'bu-warning' | 'bu-danger' | 'bu-dark' | 'bu-light' | 'bu-text' | 'bu-ghost' | 'bo-primary' | 'bo-secondary' | 'bo-success' | 'bo-danger' | 'bo-warning' | 'bo-info' | 'bo-light' | 'bo-dark' | 'bo-link'
|
||||
submit?: boolean
|
||||
newtab?: boolean
|
||||
}
|
||||
|
||||
const getBorderRadius = (edge: Props['edges']) => {
|
||||
switch (edge) {
|
||||
case 'curved':
|
||||
return 'border-radius: 6px'
|
||||
case 'rounded':
|
||||
return 'border-radius: 32px'
|
||||
case 'flat':
|
||||
return 'border-radius: 0'
|
||||
default:
|
||||
return 'border-radius: 0'
|
||||
}
|
||||
}
|
||||
|
||||
export default (props: Props) => {
|
||||
const borderRadius = getBorderRadius(props.edges)
|
||||
|
||||
return (
|
||||
<>
|
||||
<Show when={props.to}>
|
||||
<Switch>
|
||||
<Match when={props.design}>
|
||||
<a href={props.to} aria-label={props.label} rel="noopener" target={props.newtab ? '_blank' : '_self'} data-astro-prefetch>
|
||||
<button class={props.design} style={borderRadius}>
|
||||
{props.label || 'Click Me!'}
|
||||
</button>
|
||||
</a>
|
||||
</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}>
|
||||
{props.label || 'Click Me!'}
|
||||
</button>
|
||||
</a>
|
||||
</Match>
|
||||
</Switch>
|
||||
</Show>
|
||||
|
||||
<Show when={!props.to}>
|
||||
<Switch>
|
||||
<Match when={props.design}>
|
||||
<Show when={props.submit}>
|
||||
<button class={props.design} type="submit" style={borderRadius}>
|
||||
{props.label || 'Click Me!'}
|
||||
</button>
|
||||
</Show>
|
||||
|
||||
<Show when={!props.submit}>
|
||||
<button class={props.design} onClick={props.onClick} style={borderRadius}>
|
||||
{props.label || 'Click Me!'}
|
||||
</button>
|
||||
</Show>
|
||||
</Match>
|
||||
<Match when={!props.design}>
|
||||
<Show when={props.submit}>
|
||||
<button class="button" type="submit" style={borderRadius}>
|
||||
{props.label || 'Click Me!'}
|
||||
</button>
|
||||
</Show>
|
||||
|
||||
<Show when={!props.submit}>
|
||||
<button class="button" onClick={props.onClick} style={borderRadius}>
|
||||
{props.label || 'Click Me!'}
|
||||
</button>
|
||||
</Show>
|
||||
</Match>
|
||||
</Switch>
|
||||
</Show>
|
||||
</>
|
||||
)
|
||||
}
|
||||
|
|
@ -1,18 +0,0 @@
|
|||
import '../styles/Column.sass'
|
||||
import type { JSXElement } from 'solid-js'
|
||||
|
||||
interface Props {
|
||||
children: JSXElement
|
||||
content?: 'top' | 'center' | 'right' | 'split' | 'spaced'
|
||||
gap?: number
|
||||
}
|
||||
|
||||
export default (props: Props) => {
|
||||
return (
|
||||
<>
|
||||
<section class={`column-${props.content || 'center'}`} style={`gap: ${props.gap}rem`}>
|
||||
{props.children}
|
||||
</section>
|
||||
</>
|
||||
)
|
||||
}
|
||||
|
|
@ -1,14 +0,0 @@
|
|||
interface Props {
|
||||
year: string
|
||||
name: string
|
||||
}
|
||||
|
||||
export default (props: Props) => {
|
||||
return (
|
||||
<>
|
||||
<span>
|
||||
Copyright © {props.year} {props.name} All Rights Reserved.
|
||||
</span>
|
||||
</>
|
||||
)
|
||||
}
|
||||
|
|
@ -1,41 +0,0 @@
|
|||
import '../styles/Viewport.sass'
|
||||
import { type JSXElement, Switch, Match } from 'solid-js'
|
||||
|
||||
interface Props {
|
||||
children: JSXElement
|
||||
desktop?: boolean
|
||||
tablet?: boolean
|
||||
mobile?: boolean
|
||||
}
|
||||
|
||||
export default (props: Props) => {
|
||||
return (
|
||||
<>
|
||||
<Switch>
|
||||
<Match when={props.desktop && !props.tablet && !props.mobile}>
|
||||
<div class="on-desktop-only">{props.children}</div>
|
||||
</Match>
|
||||
|
||||
<Match when={!props.desktop && props.tablet && !props.mobile}>
|
||||
<div class="on-tablet-only">{props.children}</div>
|
||||
</Match>
|
||||
|
||||
<Match when={!props.desktop && !props.tablet && props.mobile}>
|
||||
<div class="on-mobile-only">{props.children}</div>
|
||||
</Match>
|
||||
|
||||
<Match when={props.desktop && props.tablet && !props.mobile}>
|
||||
<div class="on-desktop-tablet-only">{props.children}</div>
|
||||
</Match>
|
||||
|
||||
<Match when={props.desktop && !props.tablet && props.mobile}>
|
||||
<div class="on-desktop-mobile-only">{props.children}</div>
|
||||
</Match>
|
||||
|
||||
<Match when={!props.desktop && props.tablet && props.mobile}>
|
||||
<div class="on-tablet-mobile-only">{props.children}</div>
|
||||
</Match>
|
||||
</Switch>
|
||||
</>
|
||||
)
|
||||
}
|
||||
|
|
@ -1,16 +0,0 @@
|
|||
import '../styles/Footer.sass'
|
||||
import type { JSXElement } from 'solid-js'
|
||||
|
||||
interface Props {
|
||||
children: JSXElement
|
||||
}
|
||||
|
||||
export default (props: Props) => {
|
||||
return (
|
||||
<>
|
||||
<footer class="footer">
|
||||
<small>{props.children}</small>
|
||||
</footer>
|
||||
</>
|
||||
)
|
||||
}
|
||||
|
|
@ -1,16 +0,0 @@
|
|||
import '../styles/Form.sass'
|
||||
import type { JSXElement } from 'solid-js'
|
||||
|
||||
interface Props {
|
||||
children: JSXElement
|
||||
}
|
||||
|
||||
export default (props: Props) => {
|
||||
return (
|
||||
<>
|
||||
<form method="post" enctype="application/x-www-form-urlencoded">
|
||||
{props.children}
|
||||
</form>
|
||||
</>
|
||||
)
|
||||
}
|
||||
|
|
@ -1,46 +0,0 @@
|
|||
import '../styles/HTML.sass'
|
||||
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) => {
|
||||
return (
|
||||
<>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<base href="/" />
|
||||
<meta charset="utf-8" />
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1, viewport-fit=cover" />
|
||||
<meta name="name" content={props.name} />
|
||||
<meta name="description" content={props.description} />
|
||||
<meta name="title" property="og:title" content={props.name} />
|
||||
<meta name="keywords" content="HTML, CSS, JavaScript" />
|
||||
<meta name="author" content={props.author} />
|
||||
<meta property="og:description" content={props.description} />
|
||||
<meta property="og:type" content="website" />
|
||||
<link rel="icon" type="image/svg+xml" href="/favicon.png" />
|
||||
<Show when={props.font}>
|
||||
<link rel="preconnect" href="https://cdn.jsdelivr.net" />
|
||||
</Show>
|
||||
<Show when={props.preloadBackground}>
|
||||
<link rel="preload" href={background1.src} as="image" type="image/svg+xml" />
|
||||
<link rel="preload" href={background2.src} as="image" type="image/svg+xml" />
|
||||
</Show>
|
||||
<title>{props.title}</title>
|
||||
</head>
|
||||
|
||||
<body class={props.font}>{props.children}</body>
|
||||
</html>
|
||||
</>
|
||||
)
|
||||
}
|
||||
|
|
@ -1,19 +0,0 @@
|
|||
interface Props {
|
||||
avif: string
|
||||
webp: string
|
||||
size?: number
|
||||
alt?: string
|
||||
radius?: number
|
||||
}
|
||||
|
||||
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>
|
||||
</>
|
||||
)
|
||||
}
|
||||
|
|
@ -1,27 +0,0 @@
|
|||
import '../styles/Input.sass'
|
||||
import { createSignal } from 'solid-js'
|
||||
|
||||
interface Props {
|
||||
placeholder?: string
|
||||
value?: string
|
||||
onChange?: (value: string) => void
|
||||
}
|
||||
|
||||
export default (props: Props) => {
|
||||
const [inputValue, setInputValue] = createSignal(props.value || '')
|
||||
|
||||
const handleChange = (event: Event) => {
|
||||
const target = event.target as HTMLInputElement
|
||||
const newValue = target.value
|
||||
setInputValue(newValue)
|
||||
if (props.onChange) {
|
||||
props.onChange(newValue)
|
||||
}
|
||||
}
|
||||
|
||||
return (
|
||||
<>
|
||||
<input class="input" type="text" placeholder={props.placeholder} value={inputValue()} onInput={handleChange} />
|
||||
</>
|
||||
)
|
||||
}
|
||||
|
|
@ -1,17 +0,0 @@
|
|||
import '../styles/Link.sass'
|
||||
|
||||
interface Props {
|
||||
to: string
|
||||
children?: any
|
||||
newtab?: boolean
|
||||
}
|
||||
|
||||
export default (props: Props) => {
|
||||
return (
|
||||
<>
|
||||
<a href={props.to} aria-label={`Go to ${props.to}`} rel="noopener" target={props.newtab ? '_blank' : '_self'} data-astro-prefetch>
|
||||
{props.children}
|
||||
</a>
|
||||
</>
|
||||
)
|
||||
}
|
||||
|
|
@ -1,19 +0,0 @@
|
|||
import webpPath from '../images/logo.webp'
|
||||
import avifPath from '../images/logo.avif'
|
||||
|
||||
interface Props {
|
||||
size?: number
|
||||
alt?: string
|
||||
}
|
||||
|
||||
export default (props: Props) => {
|
||||
return (
|
||||
<>
|
||||
<picture>
|
||||
<source srcset={avifPath.src} type="image/avif" />
|
||||
<source srcset={webpPath.src} type="image/webp" />
|
||||
<img width={props.size} height="auto" decoding="async" loading="lazy" alt="logo" />
|
||||
</picture>
|
||||
</>
|
||||
)
|
||||
}
|
||||
|
|
@ -1,72 +0,0 @@
|
|||
// <script>
|
||||
// const modal = document.getElementById('modal')
|
||||
// const modalButton = document.getElementById('modal-button')
|
||||
|
||||
// modalButton?.addEventListener('click', () => {
|
||||
// gsap.to(modal, {
|
||||
// duration: 0,
|
||||
// display: 'block',
|
||||
// ease: 'power2.out',
|
||||
// })
|
||||
// })
|
||||
|
||||
// modal?.addEventListener('click', () => {
|
||||
// gsap.to(modal, {
|
||||
// duration: 0,
|
||||
// display: 'none',
|
||||
// ease: 'power2.out',
|
||||
// })
|
||||
// })
|
||||
// </script>
|
||||
|
||||
import '../styles/Modal.sass'
|
||||
import { type JSXElement, Show, createSignal } from 'solid-js'
|
||||
import gsap from 'gsap'
|
||||
import Button from './Button'
|
||||
|
||||
interface Props {
|
||||
children: JSXElement
|
||||
background?: string
|
||||
color?: string
|
||||
border?: string
|
||||
}
|
||||
|
||||
export default (props: Props) => {
|
||||
let dialogRef!: HTMLDivElement
|
||||
|
||||
const [open, setOpen] = createSignal(false)
|
||||
|
||||
const openHandler = () => {
|
||||
gsap.to(dialogRef, {
|
||||
duration: 0,
|
||||
display: 'flex',
|
||||
ease: 'power2.out',
|
||||
})
|
||||
}
|
||||
|
||||
const closeHandler = () => {
|
||||
gsap.to(dialogRef, {
|
||||
duration: 0,
|
||||
display: 'none',
|
||||
ease: 'power2.out',
|
||||
})
|
||||
}
|
||||
|
||||
return (
|
||||
<>
|
||||
<div class="modal" ref={dialogRef} onClick={closeHandler}>
|
||||
<Show when={props.border}>
|
||||
<div class="modal__content" style={`background-color: ${props.background}; color: ${props.color}; border: 2px solid ${props.border}`}>
|
||||
{props.children}
|
||||
</div>
|
||||
</Show>
|
||||
|
||||
<Show when={!props.border}>
|
||||
<div class="modal__content" style={`background-color: ${props.background}; color: ${props.color}; box-shadow: 5px 4px 6px rgba(0, 0, 0, 0.5)`}>
|
||||
{props.children}
|
||||
</div>
|
||||
</Show>
|
||||
</div>
|
||||
</>
|
||||
)
|
||||
}
|
||||
|
|
@ -1,44 +0,0 @@
|
|||
import '../styles/Button.sass'
|
||||
import { Show, Switch, Match } from 'solid-js'
|
||||
|
||||
interface Props {
|
||||
label?: string
|
||||
onClick?: () => void
|
||||
edges?: 'curved' | 'rounded' | 'flat'
|
||||
design?: 'bu-primary' | 'bu-link' | 'bu-info' | 'bu-success' | 'bu-warning' | 'bu-danger' | 'bu-dark' | 'bu-light' | 'bu-text' | 'bu-ghost' | 'bo-primary' | 'bo-secondary' | 'bo-success' | 'bo-danger' | 'bo-warning' | 'bo-info' | 'bo-light' | 'bo-dark' | 'bo-link'
|
||||
}
|
||||
|
||||
const getBorderRadius = (edge: Props['edges']) => {
|
||||
switch (edge) {
|
||||
case 'curved':
|
||||
return 'border-radius: 6px'
|
||||
case 'rounded':
|
||||
return 'border-radius: 32px'
|
||||
case 'flat':
|
||||
return 'border-radius: 0'
|
||||
default:
|
||||
return 'border-radius: 0'
|
||||
}
|
||||
}
|
||||
|
||||
export default (props: Props) => {
|
||||
const borderRadius = getBorderRadius(props.edges)
|
||||
|
||||
return (
|
||||
<>
|
||||
<Switch>
|
||||
<Match when={props.design}>
|
||||
<button class={props.design} onClick={props.onClick} style={borderRadius}>
|
||||
{props.label || 'Click Me!'}
|
||||
</button>
|
||||
</Match>
|
||||
|
||||
<Match when={!props.design}>
|
||||
<button class="button" onClick={props.onClick} style={borderRadius}>
|
||||
{props.label || 'Click Me!'}
|
||||
</button>
|
||||
</Match>
|
||||
</Switch>
|
||||
</>
|
||||
)
|
||||
}
|
||||
|
|
@ -1,17 +0,0 @@
|
|||
import '../styles/Navbar.sass'
|
||||
import Row from './Row'
|
||||
|
||||
interface Props {
|
||||
transparent?: boolean
|
||||
children: HTMLElement
|
||||
}
|
||||
|
||||
export default (props: Props) => {
|
||||
return (
|
||||
<>
|
||||
<nav class="nav" role="navigation" aria-label="main navigation">
|
||||
<Row content="split">{props.children}</Row>
|
||||
</nav>
|
||||
</>
|
||||
)
|
||||
}
|
||||
|
|
@ -1,13 +0,0 @@
|
|||
import { type JSXElement } from 'solid-js'
|
||||
|
||||
interface Props {
|
||||
left: number
|
||||
right: number
|
||||
top?: number
|
||||
bottom?: number
|
||||
children: JSXElement
|
||||
}
|
||||
|
||||
export default (props: Props) => {
|
||||
return <div style={{ padding: `${props.top || 0}rem ${props.right}rem ${props.bottom || 0}rem ${props.left}rem` }}>{props.children}</div>
|
||||
}
|
||||
|
|
@ -1,20 +0,0 @@
|
|||
import '../styles/Page.sass'
|
||||
import { Show } from 'solid-js'
|
||||
|
||||
interface Props {
|
||||
children?: any
|
||||
alignment?: 'row' | 'column'
|
||||
}
|
||||
|
||||
export default (props: Props) => {
|
||||
return (
|
||||
<>
|
||||
<Show when={props.alignment}>
|
||||
<main class={props.alignment}>{props.children}</main>
|
||||
</Show>
|
||||
<Show when={!props.alignment}>
|
||||
<main class="page">{props.children}</main>
|
||||
</Show>
|
||||
</>
|
||||
)
|
||||
}
|
||||
|
|
@ -1,24 +0,0 @@
|
|||
import '../styles/Row.sass'
|
||||
import { Show, type JSXElement } from 'solid-js'
|
||||
|
||||
interface Props {
|
||||
children: JSXElement
|
||||
content?: 'left' | 'center' | 'right' | 'split' | 'spaced' | 'even'
|
||||
gap?: number
|
||||
}
|
||||
|
||||
export default (props: Props) => {
|
||||
return (
|
||||
<>
|
||||
<Show when={props.gap}>
|
||||
<section class={`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>
|
||||
</Show>
|
||||
</>
|
||||
)
|
||||
}
|
||||
|
Before Width: | Height: | Size: 6 KiB |
|
Before Width: | Height: | Size: 13 KiB |
|
Before Width: | Height: | Size: 4 KiB |
|
Before Width: | Height: | Size: 6.8 KiB |
|
Before Width: | Height: | Size: 11 KiB |
|
Before Width: | Height: | Size: 2.1 KiB |
|
Before Width: | Height: | Size: 2.1 KiB |
|
Before Width: | Height: | Size: 2.9 KiB |
|
Before Width: | Height: | Size: 3.9 KiB |
23
fwt/index.ts
|
|
@ -1,23 +0,0 @@
|
|||
export { default as Background } from './components/Background'
|
||||
export { default as Box } from './components/Box'
|
||||
export { default as Button } from './components/Button'
|
||||
export { default as Column } from './components/Column'
|
||||
export { default as Copyright } from './components/Copyright'
|
||||
export { default as Footer } from './components/Footer'
|
||||
export { default as Form } from './components/Form'
|
||||
export { default as HTML } from './components/HTML'
|
||||
export { default as Image } from './components/Image'
|
||||
export { default as Link } from './components/Link'
|
||||
export { default as Logo } from './components/Logo'
|
||||
export { default as Navbar } from './components/Navbar'
|
||||
export { default as Page } from './components/Page'
|
||||
export { default as Row } from './components/Row'
|
||||
export { default as Display } from './components/Display'
|
||||
export { default as Padding } from './components/Padding'
|
||||
export { default as Modal } from './components/Modal'
|
||||
export { default as ModalButton } from './components/ModalButton'
|
||||
export { default as Input } from './components/Input'
|
||||
|
||||
export { default as OptimizeBackground } from './Optimizers/OptimizeBackground'
|
||||
export { default as OptimizeImage } from './Optimizers/OptimizeImage'
|
||||
export { default as OptimizeLogo } from './Optimizers/OptimizeLogo'
|
||||
|
|
@ -1 +0,0 @@
|
|||
@use '/src/styles/classes.sass'
|
||||
|
|
@ -1,6 +0,0 @@
|
|||
.box
|
||||
padding: 1rem
|
||||
|
||||
.curvedbox
|
||||
@extend .box
|
||||
border-radius: 8px
|
||||
|
|
@ -1,223 +0,0 @@
|
|||
@use '/src/styles/variables.sass' as vars
|
||||
@use '/src/styles/fonts.sass' as fonts
|
||||
@use 'sass:color'
|
||||
|
||||
$bulmaPrimary: rgb(0, 235, 199)
|
||||
$bulmaPrimaryText: rgb(0, 31, 26)
|
||||
$bulmaLink: rgb(92, 111, 255)
|
||||
$bulmaLinkText: rgb(245, 246, 255)
|
||||
$bulmaInfo: rgb(128, 217, 255)
|
||||
$bulmaInfoText: rgb(0, 36, 51)
|
||||
$bulmaSuccess: rgb(91, 205, 154)
|
||||
$bulmaSuccessText: rgb(10, 31, 21)
|
||||
$bulmaWarning: rgb(255, 191, 41)
|
||||
$bulmaWarningText: rgb(41, 29, 0)
|
||||
$bulmaDanger: rgb(255, 128, 153)
|
||||
$bulmaDangerText: rgb(26, 0, 5)
|
||||
$bulmaLight: rgb(255, 255, 255)
|
||||
$bulmaLightText: rgb(46, 51, 61)
|
||||
$bulmaDark: rgb(57, 63, 76)
|
||||
$bulmaDarkText: rgb(243, 244, 246)
|
||||
$bulmaText: rgb(31, 34, 41)
|
||||
$bulmaTextText: rgb(235, 236, 240)
|
||||
$bulmaGhost: rgba(0,0,0,0)
|
||||
$bulmaGhostText: rgb(66, 88, 255)
|
||||
|
||||
$bootstrapTextLight: rgb(255, 255, 253)
|
||||
$bootstrapTextDark: rgb(0, 0, 2)
|
||||
$bootstrapTextLink: rgb(139, 185, 254)
|
||||
$bootstrapPrimary: rgb(13, 110, 253)
|
||||
$bootstrapSecondary: rgb(92, 99, 106)
|
||||
$bootstrapSuccess: rgb(21, 115, 71)
|
||||
$bootstrapDanger: rgb(187, 45, 59)
|
||||
$bootstrapWarning: rgb(255, 202, 44)
|
||||
$bootstrapInfo: rgb(49, 210, 242)
|
||||
$bootstrapLight: rgb(211, 212, 213)
|
||||
$bootstrapDark: rgb(33, 37, 41)
|
||||
|
||||
.button
|
||||
background-color: vars.$primaryColor
|
||||
border: none
|
||||
color: white
|
||||
padding: 0.5rem 1.25rem
|
||||
text-align: center
|
||||
text-decoration: none
|
||||
display: inline-block
|
||||
font-size: 1rem
|
||||
font-weight: 500
|
||||
cursor: pointer
|
||||
transition: all 0.2s ease-out
|
||||
|
||||
&:hover
|
||||
background-color: color.adjust(vars.$primaryColor, $blackness: 20%)
|
||||
|
||||
&:active
|
||||
transform: scale(0.95)
|
||||
|
||||
.bu-primary
|
||||
@extend .button
|
||||
font-family: fonts.$Inter
|
||||
background-color: $bulmaPrimary
|
||||
color: $bulmaPrimaryText
|
||||
border: none
|
||||
font-size: 1rem
|
||||
border-radius: 0.375rem
|
||||
font-weight: 500
|
||||
padding: 0.5rem 1.25rem
|
||||
height: 2.5rem
|
||||
|
||||
&:hover
|
||||
background-color: color.adjust($bulmaPrimary, $lightness: 10%)
|
||||
|
||||
.bu-link
|
||||
@extend .bu-primary
|
||||
background-color: $bulmaLink
|
||||
color: $bulmaLinkText
|
||||
|
||||
&:hover
|
||||
background-color: color.adjust($bulmaLink, $lightness: 5%)
|
||||
|
||||
.bu-info
|
||||
@extend .bu-primary
|
||||
background-color: $bulmaInfo
|
||||
color: $bulmaInfoText
|
||||
|
||||
&:hover
|
||||
background-color: color.adjust($bulmaInfo, $lightness: 5%)
|
||||
|
||||
.bu-success
|
||||
@extend .bu-primary
|
||||
background-color: $bulmaSuccess
|
||||
color: $bulmaSuccessText
|
||||
|
||||
&:hover
|
||||
background-color: color.adjust($bulmaSuccess, $lightness: 5%)
|
||||
|
||||
.bu-warning
|
||||
@extend .bu-primary
|
||||
background-color: $bulmaWarning
|
||||
color: $bulmaWarningText
|
||||
|
||||
&:hover
|
||||
background-color: color.adjust($bulmaWarning, $lightness: 5%)
|
||||
|
||||
.bu-danger
|
||||
@extend .bu-primary
|
||||
background-color: $bulmaDanger
|
||||
color: $bulmaDangerText
|
||||
|
||||
&:hover
|
||||
background-color: color.adjust($bulmaDanger, $lightness: 5%)
|
||||
|
||||
.bu-light
|
||||
@extend .bu-primary
|
||||
background-color: $bulmaLight
|
||||
color: $bulmaLightText
|
||||
|
||||
&:hover
|
||||
background-color: color.adjust($bulmaLight, $lightness: 5%)
|
||||
|
||||
.bu-dark
|
||||
@extend .bu-primary
|
||||
background-color: $bulmaDark
|
||||
color: $bulmaDarkText
|
||||
|
||||
&:hover
|
||||
background-color: color.adjust($bulmaDark, $lightness: 5%)
|
||||
|
||||
.bu-text
|
||||
@extend .bu-primary
|
||||
background-color: rgba(0,0,0,0)
|
||||
color: $bulmaTextText
|
||||
text-decoration: underline
|
||||
|
||||
&:hover
|
||||
background-color: hsl(221,14%,14%)
|
||||
|
||||
.bu-ghost
|
||||
@extend .bu-primary
|
||||
background-color: $bulmaGhost
|
||||
color: $bulmaGhostText
|
||||
|
||||
&:hover
|
||||
background-color: transparent
|
||||
text-decoration: underline
|
||||
|
||||
.bo-primary
|
||||
@extend .button
|
||||
font-family: 'Segoe UI', fonts.$Roboto
|
||||
background-color: $bootstrapPrimary
|
||||
color: $bootstrapTextLight
|
||||
border: none
|
||||
font-size: 1rem
|
||||
border-radius: 0.375rem
|
||||
font-weight: 400
|
||||
padding: 0.5rem 1.25rem
|
||||
height: 2.5rem
|
||||
margin: 0.25rem 0.125rem
|
||||
|
||||
&:hover
|
||||
background-color: color.adjust($bootstrapPrimary, $blackness: 10%)
|
||||
|
||||
.bo-secondary
|
||||
@extend .bo-primary
|
||||
background-color: $bootstrapSecondary
|
||||
|
||||
&:hover
|
||||
background-color: color.adjust($bootstrapSecondary, $blackness: 10%)
|
||||
|
||||
.bo-success
|
||||
@extend .bo-primary
|
||||
background-color: $bootstrapSuccess
|
||||
|
||||
&:hover
|
||||
background-color: color.adjust($bootstrapSuccess, $blackness: 10%)
|
||||
|
||||
.bo-danger
|
||||
@extend .bo-primary
|
||||
background-color: $bootstrapDanger
|
||||
|
||||
&:hover
|
||||
background-color: color.adjust($bootstrapDanger, $blackness: 10%)
|
||||
|
||||
.bo-warning
|
||||
@extend .bo-primary
|
||||
background-color: $bootstrapWarning
|
||||
color: $bootstrapTextDark
|
||||
|
||||
&:hover
|
||||
background-color: color.adjust($bootstrapWarning, $lightness: 5%)
|
||||
|
||||
.bo-info
|
||||
@extend .bo-primary
|
||||
background-color: $bootstrapInfo
|
||||
color: $bootstrapTextDark
|
||||
|
||||
&:hover
|
||||
background-color: color.adjust($bootstrapInfo, $lightness: 5%)
|
||||
|
||||
.bo-light
|
||||
@extend .bo-primary
|
||||
background-color: $bootstrapLight
|
||||
color: $bootstrapTextDark
|
||||
|
||||
&:hover
|
||||
background-color: color.adjust($bootstrapLight, $blackness: 10%)
|
||||
|
||||
.bo-dark
|
||||
@extend .bo-primary
|
||||
background-color: $bootstrapDark
|
||||
// color: $bootstrapTextDark
|
||||
|
||||
&:hover
|
||||
background-color: color.adjust($bootstrapDark, $lightness: 10%)
|
||||
|
||||
.bo-link
|
||||
@extend .bo-primary
|
||||
background-color: transparent
|
||||
color: $bootstrapTextLink
|
||||
text-decoration: underline
|
||||
|
||||
&:hover
|
||||
color: color.adjust($bootstrapTextLink, $lightness: 5%)
|
||||
background-color: transparent
|
||||
|
|
@ -1,39 +0,0 @@
|
|||
.column-top
|
||||
display: flex
|
||||
flex-direction: column
|
||||
flex-wrap: wrap
|
||||
justify-content: flex-start
|
||||
align-items: center
|
||||
align-content: center
|
||||
|
||||
.column-center
|
||||
display: flex
|
||||
flex-direction: column
|
||||
flex-wrap: wrap
|
||||
justify-content: center
|
||||
align-items: center
|
||||
align-content: center
|
||||
|
||||
.column-right
|
||||
display: flex
|
||||
flex-direction: column
|
||||
flex-wrap: wrap
|
||||
justify-content: flex-end
|
||||
align-items: center
|
||||
align-content: center
|
||||
|
||||
.column-split
|
||||
display: flex
|
||||
flex-direction: column
|
||||
flex-wrap: wrap
|
||||
justify-content: space-between
|
||||
align-items: center
|
||||
align-content: center
|
||||
|
||||
.column-spaced
|
||||
display: flex
|
||||
flex-direction: column
|
||||
flex-wrap: wrap
|
||||
justify-content: space-around
|
||||
align-items: center
|
||||
align-content: center
|
||||
|
|
@ -1,13 +0,0 @@
|
|||
@use '/src/styles/breakpoint.sass' as view
|
||||
|
||||
.footer
|
||||
padding: 1rem 0
|
||||
margin: 0 2rem
|
||||
position: fixed
|
||||
bottom: 0
|
||||
width: 100%
|
||||
opacity: 0.8
|
||||
font-size: 1rem
|
||||
|
||||
@media only screen and (max-width: view.$tablet)
|
||||
font-size: 0.75rem
|
||||
|
|
@ -1,25 +0,0 @@
|
|||
@use '/src/styles/variables.sass' as vars
|
||||
@use '/src/styles/fonts.sass' as fonts
|
||||
|
||||
.body
|
||||
color: vars.$textColor
|
||||
|
||||
.inter
|
||||
@extend .body
|
||||
font-family: fonts.$Inter
|
||||
|
||||
.roboto
|
||||
@extend .body
|
||||
font-family: fonts.$Roboto
|
||||
|
||||
.montserrat
|
||||
@extend .body
|
||||
font-family: fonts.$Montserrat
|
||||
|
||||
.open-sans
|
||||
@extend .body
|
||||
font-family: fonts.$OpenSans
|
||||
|
||||
.public-sans
|
||||
@extend .body
|
||||
font-family: fonts.$PublicSans
|
||||
|
|
@ -1,27 +0,0 @@
|
|||
.input
|
||||
font-size: 1rem
|
||||
padding: 0.5rem 1rem
|
||||
width: 100%
|
||||
border: 2px solid #ccc
|
||||
border-radius: 4px
|
||||
outline: none
|
||||
transition: border-color 0.3s, box-shadow 0.3s
|
||||
|
||||
&:focus
|
||||
border-color: #3377AC
|
||||
box-shadow: 0 0 5px rgba(51, 119, 168, 0.3)
|
||||
|
||||
&::placeholder
|
||||
color: #888
|
||||
font-style: italic
|
||||
|
||||
&:disabled
|
||||
background-color: #f0f0f0
|
||||
border-color: #ddd
|
||||
|
||||
&--error
|
||||
border-color: #ff4d4f
|
||||
box-shadow: 0 0 5px rgba(255, 77, 79, 0.3)
|
||||
|
||||
&:focus
|
||||
border-color: #e81123
|
||||
|
|
@ -1,3 +0,0 @@
|
|||
a
|
||||
text-decoration: none
|
||||
color: inherit
|
||||
|
|
@ -1,20 +0,0 @@
|
|||
@use '/src/styles/variables.sass' as vars
|
||||
@use 'sass:color'
|
||||
|
||||
.modal
|
||||
display: flex
|
||||
justify-content: center
|
||||
align-items: center
|
||||
position: fixed
|
||||
top: 0
|
||||
left: 0
|
||||
width: 100%
|
||||
height: 100%
|
||||
backdrop-filter: blur(20px)
|
||||
background-color: rgba(color.adjust(vars.$background, $blackness: 5%), 0.6)
|
||||
z-index: 999
|
||||
|
||||
&__content
|
||||
border-radius: 8px
|
||||
padding: 2rem
|
||||
position: relative
|
||||
|
|
@ -1,7 +0,0 @@
|
|||
.nav
|
||||
position: fixed
|
||||
top: 0
|
||||
width: 100%
|
||||
padding: 1rem 0
|
||||
// margin: 5rem
|
||||
|
||||
|
|
@ -1,13 +0,0 @@
|
|||
.page
|
||||
margin: 2rem
|
||||
height: auto
|
||||
min-height: 90vh
|
||||
|
||||
.column
|
||||
@extend .page
|
||||
display: flex
|
||||
flex-direction: column
|
||||
|
||||
.row
|
||||
@extend .column
|
||||
flex-direction: row
|
||||
|
|
@ -1,47 +0,0 @@
|
|||
.row-left
|
||||
display: flex
|
||||
flex-direction: row
|
||||
flex-wrap: wrap
|
||||
justify-content: flex-start
|
||||
align-items: center
|
||||
align-content: center
|
||||
|
||||
.row-center
|
||||
display: flex
|
||||
flex-direction: row
|
||||
flex-wrap: wrap
|
||||
justify-content: center
|
||||
align-items: center
|
||||
align-content: center
|
||||
|
||||
.row-right
|
||||
display: flex
|
||||
flex-direction: row
|
||||
flex-wrap: wrap
|
||||
justify-content: flex-end
|
||||
align-items: center
|
||||
align-content: center
|
||||
|
||||
.row-split
|
||||
display: flex
|
||||
flex-direction: row
|
||||
flex-wrap: wrap
|
||||
justify-content: space-between
|
||||
align-items: center
|
||||
align-content: center
|
||||
|
||||
.row-spaced
|
||||
display: flex
|
||||
flex-direction: row
|
||||
flex-wrap: wrap
|
||||
justify-content: space-around
|
||||
align-items: center
|
||||
align-content: center
|
||||
|
||||
.row-even
|
||||
display: flex
|
||||
flex-direction: row
|
||||
flex-wrap: wrap
|
||||
justify-content: space-evenly
|
||||
align-items: center
|
||||
align-content: center
|
||||
|
|
@ -1 +0,0 @@
|
|||
@use '/src/styles/breakpoint.sass'
|
||||