kopia lustrzana https://github.com/badgen/badgen.net
feat: init new next app
Amio
rodzic
779b4d2de2
commit
44f79afb84
|
|
@ -7,6 +7,7 @@ extends:
|
|||
# https://github.com/yannickcr/eslint-plugin-react
|
||||
- plugin:react/recommended
|
||||
- eslint:recommended
|
||||
- plugin:@next/next/recommended
|
||||
|
||||
plugins:
|
||||
- react
|
||||
|
|
|
|||
|
|
@ -1,3 +1,4 @@
|
|||
{
|
||||
"typescript.tsdk": "node_modules/typescript/lib"
|
||||
}
|
||||
"typescript.tsdk": "node_modules/typescript/lib",
|
||||
"typescript.enablePromptUseWorkspaceTsdk": true
|
||||
}
|
||||
|
|
@ -1,2 +1,5 @@
|
|||
/// <reference types="next" />
|
||||
/// <reference types="next/types/global" />
|
||||
/// <reference types="next/image-types/global" />
|
||||
|
||||
// NOTE: This file should not be edited
|
||||
// see https://nextjs.org/docs/basic-features/typescript for more information.
|
||||
|
|
|
|||
|
|
@ -1,3 +1,10 @@
|
|||
module.exports = {
|
||||
target: 'server'
|
||||
/** @type {import('next').NextConfig} */
|
||||
const nextConfig = {
|
||||
reactStrictMode: true,
|
||||
experimental: {
|
||||
appDir: true,
|
||||
forceSwcTransforms: true,
|
||||
}
|
||||
}
|
||||
|
||||
module.exports = nextConfig
|
||||
|
|
|
|||
Plik diff jest za duży
Load Diff
|
|
@ -28,6 +28,7 @@
|
|||
"badgen-icons": "^0.22.0",
|
||||
"byte-size": "^8.1.0",
|
||||
"date-fns": "^2.21.1",
|
||||
"eslint-config-next": "^13.1.1",
|
||||
"got": "^10.7.0",
|
||||
"haxe-rpc-client": "^1.0.0",
|
||||
"humanize-duration": "^3.24.0",
|
||||
|
|
@ -37,7 +38,7 @@
|
|||
"millify": "^4.0.0",
|
||||
"my-way": "^2.0.0",
|
||||
"original-url": "^1.2.3",
|
||||
"react-debounce-render": "^5.0.0",
|
||||
"react-debounce-render": "^8.0.2",
|
||||
"semver": "^7.3.5",
|
||||
"serve-handler": "^6.1.3",
|
||||
"serve-marked": "^4.0.0",
|
||||
|
|
@ -47,6 +48,7 @@
|
|||
},
|
||||
"devDependencies": {
|
||||
"@babel/core": "^7.13.15",
|
||||
"@next/font": "^13.1.1",
|
||||
"@types/fs-extra": "^9.0.11",
|
||||
"@types/lodash.debounce": "^4.0.6",
|
||||
"@types/micro": "^7.3.4",
|
||||
|
|
@ -60,7 +62,7 @@
|
|||
"@typescript-eslint/parser": "^5.16.0",
|
||||
"@zeit/next-typescript": "^1.1.1",
|
||||
"csstype": "^3.1.0",
|
||||
"eslint": "^8.12.0",
|
||||
"eslint": "^8.30.0",
|
||||
"eslint-plugin-react": "^7.23.2",
|
||||
"fs-extra": "^10.1.0",
|
||||
"next": "^13.1.1",
|
||||
|
|
@ -69,7 +71,7 @@
|
|||
"react-dom": "^18.2.0",
|
||||
"supertest": "^6.2.2",
|
||||
"ts-node": "^10.7.0",
|
||||
"typescript": "^4.2.4"
|
||||
"typescript": "^4.9.4"
|
||||
},
|
||||
"engines": {
|
||||
"node": ">=16.x",
|
||||
|
|
|
|||
|
|
@ -0,0 +1,49 @@
|
|||
/* eslint-disable @next/next/no-css-tags */
|
||||
import React from 'react'
|
||||
import App from 'next/app'
|
||||
import { Html, Head } from 'next/document'
|
||||
import Script from 'next/script'
|
||||
|
||||
declare global {
|
||||
interface Window {
|
||||
dataLayer: Array<any>;
|
||||
}
|
||||
}
|
||||
|
||||
export default class MyApp extends App {
|
||||
componentDidMount () {
|
||||
window.dataLayer = window.dataLayer || []
|
||||
function gtag (...args) { window.dataLayer.push(args) }
|
||||
gtag('js', new Date())
|
||||
gtag('config', 'UA-4646421-14')
|
||||
}
|
||||
|
||||
render () {
|
||||
const { Component, pageProps } = this.props
|
||||
|
||||
return (
|
||||
<Html>
|
||||
<Head>
|
||||
<link rel='icon' type='image/png' href='/static/favicon.png' />
|
||||
<meta name='viewport' content='initial-scale=1.0, width=device-width' />
|
||||
<link
|
||||
rel='stylesheet'
|
||||
href='https://fonts.googleapis.com/css?family=Merriweather:700,300&display=optional'
|
||||
/>
|
||||
<link rel='stylesheet' href='/static/index.css' />
|
||||
<Script
|
||||
src="https://www.googletagmanager.com/gtag/js?id=UA-4646421-14"
|
||||
strategy="afterInteractive"
|
||||
/>
|
||||
</Head>
|
||||
<Component {...pageProps} />
|
||||
<style>{`
|
||||
html, body { margin: 0; height: 100%; scroll-behavior: smooth }
|
||||
#__next { height: 100% }
|
||||
a { text-decoration: none }
|
||||
`}
|
||||
</style>
|
||||
</Html>
|
||||
)
|
||||
}
|
||||
}
|
||||
|
|
@ -0,0 +1,71 @@
|
|||
import { useState, useEffect } from 'react'
|
||||
import BadgeExamples from '../components/badge-examples'
|
||||
import BadgenTitle from '../components/badgen-title'
|
||||
// import TopBar from '../components/top-bar'
|
||||
import Intro from '../components/home-intro'
|
||||
import Footer from '../components/footer'
|
||||
import examples from '../static/.meta/badges.json'
|
||||
|
||||
const Index = () => {
|
||||
const [tab, setTab] = useState('live')
|
||||
const [host, setHost] = useState('')
|
||||
const badges = examples[tab]
|
||||
|
||||
useEffect(() => {
|
||||
const forceHost = new URL(window.location.href).searchParams.get('host')
|
||||
setHost((forceHost || window.location.origin) + '/')
|
||||
})
|
||||
|
||||
return <>
|
||||
<BadgenTitle host={host} />
|
||||
<div className='docs' style={{ width: '980px', margin: '0 auto' }}>
|
||||
<Intro />
|
||||
<h2 style={{ textAlign: 'center' }}>Badge Gallery</h2>
|
||||
|
||||
<div className='tab-row'>
|
||||
<div className={`tab ${tab}`}>
|
||||
<a onClick={() => setTab('live')} className='live'>Live Badges</a>
|
||||
<a onClick={() => setTab('static')} className='static'>Static Badges</a>
|
||||
</div>
|
||||
</div>
|
||||
<BadgeExamples data={badges} />
|
||||
</div>
|
||||
<Footer />
|
||||
<style jsx>{`
|
||||
.docs {
|
||||
margin: 0 auto;
|
||||
padding-bottom: 6em;
|
||||
}
|
||||
p {
|
||||
text-align: center
|
||||
}
|
||||
|
||||
.tab-row {
|
||||
text-align: center;
|
||||
}
|
||||
.tab {
|
||||
display: inline-block;
|
||||
border: 1px solid #333;
|
||||
margin-bottom: 2rem;
|
||||
}
|
||||
.tab a {
|
||||
display: inline-block;
|
||||
padding: 0 8px;
|
||||
color: #333;
|
||||
font: 14px/26px sans-serif;
|
||||
text-transform: uppercase;
|
||||
}
|
||||
.tab a:hover {
|
||||
cursor: pointer;
|
||||
}
|
||||
.live a.live,
|
||||
.static a.static {
|
||||
color: #EEE;
|
||||
background-color: #333;
|
||||
}
|
||||
`}
|
||||
</style>
|
||||
</> // eslint-disable-line
|
||||
}
|
||||
|
||||
export default Index
|
||||
|
|
@ -1,45 +1,6 @@
|
|||
import React from 'react'
|
||||
import App from 'next/app'
|
||||
import Head from 'next/head'
|
||||
import '../styles/globals.css'
|
||||
import type { AppProps } from 'next/app'
|
||||
|
||||
declare global {
|
||||
interface Window {
|
||||
dataLayer: Array<any>;
|
||||
}
|
||||
}
|
||||
|
||||
export default class MyApp extends App {
|
||||
componentDidMount () {
|
||||
window.dataLayer = window.dataLayer || []
|
||||
function gtag (...args) { window.dataLayer.push(args) }
|
||||
gtag('js', new Date())
|
||||
gtag('config', 'UA-4646421-14')
|
||||
}
|
||||
|
||||
render () {
|
||||
const { Component, pageProps } = this.props
|
||||
|
||||
return (
|
||||
<>
|
||||
<Head>
|
||||
<title>Badgen - Fast badge generating service</title>
|
||||
<link rel='icon' type='image/png' href='/static/favicon.png' />
|
||||
<meta name='viewport' content='initial-scale=1.0, width=device-width' />
|
||||
<link
|
||||
rel='stylesheet'
|
||||
href='https://fonts.googleapis.com/css?family=Merriweather:700,300'
|
||||
/>
|
||||
<link rel='stylesheet' href='/static/index.css' />
|
||||
<script async src='https://www.googletagmanager.com/gtag/js?id=UA-4646421-14' />
|
||||
</Head>
|
||||
<Component {...pageProps} />
|
||||
<style jsx global>{`
|
||||
html, body { margin: 0; height: 100%; scroll-behavior: smooth }
|
||||
#__next { height: 100% }
|
||||
a { text-decoration: none }
|
||||
`}
|
||||
</style>
|
||||
</>
|
||||
)
|
||||
}
|
||||
export default function App({ Component, pageProps }: AppProps) {
|
||||
return <Component {...pageProps} />
|
||||
}
|
||||
|
|
|
|||
|
|
@ -0,0 +1,22 @@
|
|||
import { Html, Head, Main, NextScript } from 'next/document'
|
||||
import Script from 'next/script'
|
||||
|
||||
export default function Document() {
|
||||
return (
|
||||
<Html lang="en">
|
||||
<Head>
|
||||
<link rel='icon' type='image/png' href='/static/favicon.png' />
|
||||
<meta name='viewport' content='initial-scale=1.0, width=device-width' />
|
||||
<link rel='stylesheet' href='https://fonts.googleapis.com/css?family=Merriweather:700,300&display=optional' />
|
||||
<Script
|
||||
src="https://www.googletagmanager.com/gtag/js?id=UA-4646421-14"
|
||||
strategy="afterInteractive"
|
||||
/>
|
||||
</Head>
|
||||
<body>
|
||||
<Main />
|
||||
<NextScript />
|
||||
</body>
|
||||
</Html>
|
||||
)
|
||||
}
|
||||
|
|
@ -0,0 +1,13 @@
|
|||
// Next.js API route support: https://nextjs.org/docs/api-routes/introduction
|
||||
import type { NextApiRequest, NextApiResponse } from 'next'
|
||||
|
||||
type Data = {
|
||||
name: string
|
||||
}
|
||||
|
||||
export default function handler(
|
||||
req: NextApiRequest,
|
||||
res: NextApiResponse<Data>
|
||||
) {
|
||||
res.status(200).json({ name: 'John Doe' })
|
||||
}
|
||||
|
|
@ -0,0 +1,13 @@
|
|||
// Next.js API route support: https://nextjs.org/docs/api-routes/introduction
|
||||
import type { NextApiRequest, NextApiResponse } from 'next'
|
||||
|
||||
type Data = {
|
||||
name: string
|
||||
}
|
||||
|
||||
export default function handler(
|
||||
req: NextApiRequest,
|
||||
res: NextApiResponse<Data>
|
||||
) {
|
||||
res.status(200).json({ name: 'John Doe' })
|
||||
}
|
||||
|
|
@ -1,71 +1,22 @@
|
|||
import { useState, useEffect } from 'react'
|
||||
import BadgeExamples from '../components/badge-examples'
|
||||
import BadgenTitle from '../components/badgen-title'
|
||||
// import TopBar from '../components/top-bar'
|
||||
import Intro from '../components/home-intro'
|
||||
import Footer from '../components/footer'
|
||||
import examples from '../static/.meta/badges.json'
|
||||
import Head from 'next/head'
|
||||
import Image from 'next/image'
|
||||
import { Inter } from '@next/font/google'
|
||||
import styles from '../styles/Home.module.css'
|
||||
|
||||
const Index = () => {
|
||||
const [tab, setTab] = useState('live')
|
||||
const [host, setHost] = useState('')
|
||||
const badges = examples[tab]
|
||||
const inter = Inter({ subsets: ['latin'] })
|
||||
|
||||
useEffect(() => {
|
||||
const forceHost = new URL(window.location.href).searchParams.get('host')
|
||||
setHost((forceHost || window.location.origin) + '/')
|
||||
})
|
||||
|
||||
return <>
|
||||
<BadgenTitle host={host} />
|
||||
<div className='docs' style={{ width: '980px', margin: '0 auto' }}>
|
||||
<Intro />
|
||||
<h2 style={{ textAlign: 'center' }}>Badge Gallery</h2>
|
||||
|
||||
<div className='tab-row'>
|
||||
<div className={`tab ${tab}`}>
|
||||
<a onClick={() => setTab('live')} className='live'>Live Badges</a>
|
||||
<a onClick={() => setTab('static')} className='static'>Static Badges</a>
|
||||
</div>
|
||||
</div>
|
||||
<BadgeExamples data={badges} />
|
||||
</div>
|
||||
<Footer />
|
||||
<style jsx>{`
|
||||
.docs {
|
||||
margin: 0 auto;
|
||||
padding-bottom: 6em;
|
||||
}
|
||||
p {
|
||||
text-align: center
|
||||
}
|
||||
|
||||
.tab-row {
|
||||
text-align: center;
|
||||
}
|
||||
.tab {
|
||||
display: inline-block;
|
||||
border: 1px solid #333;
|
||||
margin-bottom: 2rem;
|
||||
}
|
||||
.tab a {
|
||||
display: inline-block;
|
||||
padding: 0 8px;
|
||||
color: #333;
|
||||
font: 14px/26px sans-serif;
|
||||
text-transform: uppercase;
|
||||
}
|
||||
.tab a:hover {
|
||||
cursor: pointer;
|
||||
}
|
||||
.live a.live,
|
||||
.static a.static {
|
||||
color: #EEE;
|
||||
background-color: #333;
|
||||
}
|
||||
`}
|
||||
</style>
|
||||
</> // eslint-disable-line
|
||||
export default function Home() {
|
||||
return (
|
||||
<>
|
||||
<Head>
|
||||
<title>Create Next App</title>
|
||||
<meta name="description" content="Generated by create next app" />
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1" />
|
||||
<link rel="icon" href="/favicon.ico" />
|
||||
</Head>
|
||||
<main className={styles.main}>
|
||||
asdf
|
||||
</main>
|
||||
</>
|
||||
)
|
||||
}
|
||||
|
||||
export default Index
|
||||
|
|
|
|||
|
|
@ -0,0 +1,278 @@
|
|||
.main {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
padding: 6rem;
|
||||
min-height: 100vh;
|
||||
}
|
||||
|
||||
.description {
|
||||
display: inherit;
|
||||
justify-content: inherit;
|
||||
align-items: inherit;
|
||||
font-size: 0.85rem;
|
||||
max-width: var(--max-width);
|
||||
width: 100%;
|
||||
z-index: 2;
|
||||
font-family: var(--font-mono);
|
||||
}
|
||||
|
||||
.description a {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
gap: 0.5rem;
|
||||
}
|
||||
|
||||
.description p {
|
||||
position: relative;
|
||||
margin: 0;
|
||||
padding: 1rem;
|
||||
background-color: rgba(var(--callout-rgb), 0.5);
|
||||
border: 1px solid rgba(var(--callout-border-rgb), 0.3);
|
||||
border-radius: var(--border-radius);
|
||||
}
|
||||
|
||||
.code {
|
||||
font-weight: 700;
|
||||
font-family: var(--font-mono);
|
||||
}
|
||||
|
||||
.grid {
|
||||
display: grid;
|
||||
grid-template-columns: repeat(4, minmax(25%, auto));
|
||||
width: var(--max-width);
|
||||
max-width: 100%;
|
||||
}
|
||||
|
||||
.card {
|
||||
padding: 1rem 1.2rem;
|
||||
border-radius: var(--border-radius);
|
||||
background: rgba(var(--card-rgb), 0);
|
||||
border: 1px solid rgba(var(--card-border-rgb), 0);
|
||||
transition: background 200ms, border 200ms;
|
||||
}
|
||||
|
||||
.card span {
|
||||
display: inline-block;
|
||||
transition: transform 200ms;
|
||||
}
|
||||
|
||||
.card h2 {
|
||||
font-weight: 600;
|
||||
margin-bottom: 0.7rem;
|
||||
}
|
||||
|
||||
.card p {
|
||||
margin: 0;
|
||||
opacity: 0.6;
|
||||
font-size: 0.9rem;
|
||||
line-height: 1.5;
|
||||
max-width: 30ch;
|
||||
}
|
||||
|
||||
.center {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
position: relative;
|
||||
padding: 4rem 0;
|
||||
}
|
||||
|
||||
.center::before {
|
||||
background: var(--secondary-glow);
|
||||
border-radius: 50%;
|
||||
width: 480px;
|
||||
height: 360px;
|
||||
margin-left: -400px;
|
||||
}
|
||||
|
||||
.center::after {
|
||||
background: var(--primary-glow);
|
||||
width: 240px;
|
||||
height: 180px;
|
||||
z-index: -1;
|
||||
}
|
||||
|
||||
.center::before,
|
||||
.center::after {
|
||||
content: '';
|
||||
left: 50%;
|
||||
position: absolute;
|
||||
filter: blur(45px);
|
||||
transform: translateZ(0);
|
||||
}
|
||||
|
||||
.logo,
|
||||
.thirteen {
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.thirteen {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
width: 75px;
|
||||
height: 75px;
|
||||
padding: 25px 10px;
|
||||
margin-left: 16px;
|
||||
transform: translateZ(0);
|
||||
border-radius: var(--border-radius);
|
||||
overflow: hidden;
|
||||
box-shadow: 0px 2px 8px -1px #0000001a;
|
||||
}
|
||||
|
||||
.thirteen::before,
|
||||
.thirteen::after {
|
||||
content: '';
|
||||
position: absolute;
|
||||
z-index: -1;
|
||||
}
|
||||
|
||||
/* Conic Gradient Animation */
|
||||
.thirteen::before {
|
||||
animation: 6s rotate linear infinite;
|
||||
width: 200%;
|
||||
height: 200%;
|
||||
background: var(--tile-border);
|
||||
}
|
||||
|
||||
/* Inner Square */
|
||||
.thirteen::after {
|
||||
inset: 0;
|
||||
padding: 1px;
|
||||
border-radius: var(--border-radius);
|
||||
background: linear-gradient(
|
||||
to bottom right,
|
||||
rgba(var(--tile-start-rgb), 1),
|
||||
rgba(var(--tile-end-rgb), 1)
|
||||
);
|
||||
background-clip: content-box;
|
||||
}
|
||||
|
||||
/* Enable hover only on non-touch devices */
|
||||
@media (hover: hover) and (pointer: fine) {
|
||||
.card:hover {
|
||||
background: rgba(var(--card-rgb), 0.1);
|
||||
border: 1px solid rgba(var(--card-border-rgb), 0.15);
|
||||
}
|
||||
|
||||
.card:hover span {
|
||||
transform: translateX(4px);
|
||||
}
|
||||
}
|
||||
|
||||
@media (prefers-reduced-motion) {
|
||||
.thirteen::before {
|
||||
animation: none;
|
||||
}
|
||||
|
||||
.card:hover span {
|
||||
transform: none;
|
||||
}
|
||||
}
|
||||
|
||||
/* Mobile */
|
||||
@media (max-width: 700px) {
|
||||
.content {
|
||||
padding: 4rem;
|
||||
}
|
||||
|
||||
.grid {
|
||||
grid-template-columns: 1fr;
|
||||
margin-bottom: 120px;
|
||||
max-width: 320px;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.card {
|
||||
padding: 1rem 2.5rem;
|
||||
}
|
||||
|
||||
.card h2 {
|
||||
margin-bottom: 0.5rem;
|
||||
}
|
||||
|
||||
.center {
|
||||
padding: 8rem 0 6rem;
|
||||
}
|
||||
|
||||
.center::before {
|
||||
transform: none;
|
||||
height: 300px;
|
||||
}
|
||||
|
||||
.description {
|
||||
font-size: 0.8rem;
|
||||
}
|
||||
|
||||
.description a {
|
||||
padding: 1rem;
|
||||
}
|
||||
|
||||
.description p,
|
||||
.description div {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
position: fixed;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.description p {
|
||||
align-items: center;
|
||||
inset: 0 0 auto;
|
||||
padding: 2rem 1rem 1.4rem;
|
||||
border-radius: 0;
|
||||
border: none;
|
||||
border-bottom: 1px solid rgba(var(--callout-border-rgb), 0.25);
|
||||
background: linear-gradient(
|
||||
to bottom,
|
||||
rgba(var(--background-start-rgb), 1),
|
||||
rgba(var(--callout-rgb), 0.5)
|
||||
);
|
||||
background-clip: padding-box;
|
||||
backdrop-filter: blur(24px);
|
||||
}
|
||||
|
||||
.description div {
|
||||
align-items: flex-end;
|
||||
pointer-events: none;
|
||||
inset: auto 0 0;
|
||||
padding: 2rem;
|
||||
height: 200px;
|
||||
background: linear-gradient(
|
||||
to bottom,
|
||||
transparent 0%,
|
||||
rgb(var(--background-end-rgb)) 40%
|
||||
);
|
||||
z-index: 1;
|
||||
}
|
||||
}
|
||||
|
||||
/* Tablet and Smaller Desktop */
|
||||
@media (min-width: 701px) and (max-width: 1120px) {
|
||||
.grid {
|
||||
grid-template-columns: repeat(2, 50%);
|
||||
}
|
||||
}
|
||||
|
||||
@media (prefers-color-scheme: dark) {
|
||||
.vercelLogo {
|
||||
filter: invert(1);
|
||||
}
|
||||
|
||||
.logo,
|
||||
.thirteen img {
|
||||
filter: invert(1) drop-shadow(0 0 0.3rem #ffffff70);
|
||||
}
|
||||
}
|
||||
|
||||
@keyframes rotate {
|
||||
from {
|
||||
transform: rotate(360deg);
|
||||
}
|
||||
to {
|
||||
transform: rotate(0deg);
|
||||
}
|
||||
}
|
||||
|
|
@ -0,0 +1,107 @@
|
|||
:root {
|
||||
--max-width: 1100px;
|
||||
--border-radius: 12px;
|
||||
--font-mono: ui-monospace, Menlo, Monaco, 'Cascadia Mono', 'Segoe UI Mono',
|
||||
'Roboto Mono', 'Oxygen Mono', 'Ubuntu Monospace', 'Source Code Pro',
|
||||
'Fira Mono', 'Droid Sans Mono', 'Courier New', monospace;
|
||||
|
||||
--foreground-rgb: 0, 0, 0;
|
||||
--background-start-rgb: 214, 219, 220;
|
||||
--background-end-rgb: 255, 255, 255;
|
||||
|
||||
--primary-glow: conic-gradient(
|
||||
from 180deg at 50% 50%,
|
||||
#16abff33 0deg,
|
||||
#0885ff33 55deg,
|
||||
#54d6ff33 120deg,
|
||||
#0071ff33 160deg,
|
||||
transparent 360deg
|
||||
);
|
||||
--secondary-glow: radial-gradient(
|
||||
rgba(255, 255, 255, 1),
|
||||
rgba(255, 255, 255, 0)
|
||||
);
|
||||
|
||||
--tile-start-rgb: 239, 245, 249;
|
||||
--tile-end-rgb: 228, 232, 233;
|
||||
--tile-border: conic-gradient(
|
||||
#00000080,
|
||||
#00000040,
|
||||
#00000030,
|
||||
#00000020,
|
||||
#00000010,
|
||||
#00000010,
|
||||
#00000080
|
||||
);
|
||||
|
||||
--callout-rgb: 238, 240, 241;
|
||||
--callout-border-rgb: 172, 175, 176;
|
||||
--card-rgb: 180, 185, 188;
|
||||
--card-border-rgb: 131, 134, 135;
|
||||
}
|
||||
|
||||
@media (prefers-color-scheme: dark) {
|
||||
:root {
|
||||
--foreground-rgb: 255, 255, 255;
|
||||
--background-start-rgb: 0, 0, 0;
|
||||
--background-end-rgb: 0, 0, 0;
|
||||
|
||||
--primary-glow: radial-gradient(rgba(1, 65, 255, 0.4), rgba(1, 65, 255, 0));
|
||||
--secondary-glow: linear-gradient(
|
||||
to bottom right,
|
||||
rgba(1, 65, 255, 0),
|
||||
rgba(1, 65, 255, 0),
|
||||
rgba(1, 65, 255, 0.3)
|
||||
);
|
||||
|
||||
--tile-start-rgb: 2, 13, 46;
|
||||
--tile-end-rgb: 2, 5, 19;
|
||||
--tile-border: conic-gradient(
|
||||
#ffffff80,
|
||||
#ffffff40,
|
||||
#ffffff30,
|
||||
#ffffff20,
|
||||
#ffffff10,
|
||||
#ffffff10,
|
||||
#ffffff80
|
||||
);
|
||||
|
||||
--callout-rgb: 20, 20, 20;
|
||||
--callout-border-rgb: 108, 108, 108;
|
||||
--card-rgb: 100, 100, 100;
|
||||
--card-border-rgb: 200, 200, 200;
|
||||
}
|
||||
}
|
||||
|
||||
* {
|
||||
box-sizing: border-box;
|
||||
padding: 0;
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
html,
|
||||
body {
|
||||
max-width: 100vw;
|
||||
overflow-x: hidden;
|
||||
}
|
||||
|
||||
body {
|
||||
color: rgb(var(--foreground-rgb));
|
||||
background: linear-gradient(
|
||||
to bottom,
|
||||
transparent,
|
||||
rgb(var(--background-end-rgb))
|
||||
)
|
||||
rgb(var(--background-start-rgb));
|
||||
}
|
||||
|
||||
a {
|
||||
color: inherit;
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
@media (prefers-color-scheme: dark) {
|
||||
html {
|
||||
color-scheme: dark;
|
||||
}
|
||||
}
|
||||
|
|
@ -20,14 +20,21 @@
|
|||
"forceConsistentCasingInFileNames": true,
|
||||
"resolveJsonModule": true,
|
||||
"isolatedModules": true,
|
||||
"noEmit": false
|
||||
"noEmit": false,
|
||||
"incremental": true,
|
||||
"plugins": [
|
||||
{
|
||||
"name": "next"
|
||||
}
|
||||
]
|
||||
},
|
||||
"include": [
|
||||
"api",
|
||||
"libs",
|
||||
"index.ts",
|
||||
"components",
|
||||
"pages"
|
||||
"pages",
|
||||
"next-env.d.ts"
|
||||
],
|
||||
"exclude": [
|
||||
"node_modules"
|
||||
|
|
|
|||
Ładowanie…
Reference in New Issue