mirror of
https://github.com/skidoodle/erettsegi-browser.git
synced 2025-02-15 05:39:15 +01:00
nextui, next-themes, pnpm
This commit is contained in:
parent
4afb6adaed
commit
6ca06abc00
8 changed files with 5035 additions and 2592 deletions
1
.npmrc
Normal file
1
.npmrc
Normal file
|
@ -0,0 +1 @@
|
||||||
|
public-hoist-pattern[]=*@nextui-org/*
|
|
@ -9,13 +9,16 @@
|
||||||
"lint": "next lint"
|
"lint": "next lint"
|
||||||
},
|
},
|
||||||
"dependencies": {
|
"dependencies": {
|
||||||
|
"@nextui-org/react": "^2.1.13",
|
||||||
"@types/node": "20.6.1",
|
"@types/node": "20.6.1",
|
||||||
"@types/react": "18.2.21",
|
"@types/react": "18.2.21",
|
||||||
"@types/react-dom": "18.2.7",
|
"@types/react-dom": "18.2.7",
|
||||||
"autoprefixer": "10.4.15",
|
"autoprefixer": "10.4.15",
|
||||||
"eslint": "8.49.0",
|
"eslint": "8.49.0",
|
||||||
"eslint-config-next": "13.4.19",
|
"eslint-config-next": "13.4.19",
|
||||||
|
"framer-motion": "^10.16.4",
|
||||||
"next": "13.4.19",
|
"next": "13.4.19",
|
||||||
|
"next-themes": "^0.2.1",
|
||||||
"postcss": "8.4.29",
|
"postcss": "8.4.29",
|
||||||
"react": "18.2.0",
|
"react": "18.2.0",
|
||||||
"react-dom": "18.2.0",
|
"react-dom": "18.2.0",
|
||||||
|
|
4891
pnpm-lock.yaml
generated
Normal file
4891
pnpm-lock.yaml
generated
Normal file
File diff suppressed because it is too large
Load diff
|
@ -1,7 +1,9 @@
|
||||||
import { Inter } from 'next/font/google'
|
import { Inter } from 'next/font/google'
|
||||||
import { AppProps } from 'next/app'
|
import { AppProps } from 'next/app'
|
||||||
import '@/styles/globals.css'
|
import { NextUIProvider } from '@nextui-org/react'
|
||||||
|
import { ThemeProvider as NextThemesProvider } from 'next-themes'
|
||||||
import Head from 'next/head'
|
import Head from 'next/head'
|
||||||
|
import '@/styles/globals.css'
|
||||||
|
|
||||||
const inter = Inter({
|
const inter = Inter({
|
||||||
subsets: ['latin'],
|
subsets: ['latin'],
|
||||||
|
@ -14,9 +16,11 @@ export default function App({ Component, pageProps }: AppProps) {
|
||||||
<Head>
|
<Head>
|
||||||
<title>Érettségi kereső</title>
|
<title>Érettségi kereső</title>
|
||||||
</Head>
|
</Head>
|
||||||
<main className={`${inter.variable} font-sans`}>
|
<NextUIProvider className={`${inter.variable} font-sans`}>
|
||||||
|
<NextThemesProvider attribute="class" defaultTheme="dark">
|
||||||
<Component {...pageProps} />
|
<Component {...pageProps} />
|
||||||
</main>
|
</NextThemesProvider>
|
||||||
|
</NextUIProvider>
|
||||||
</>
|
</>
|
||||||
)
|
)
|
||||||
}
|
}
|
||||||
|
|
|
@ -2,6 +2,8 @@ import { useState, useEffect } from 'react'
|
||||||
import { useAvailableYears } from '@/utils/years'
|
import { useAvailableYears } from '@/utils/years'
|
||||||
import { subjects } from '@/utils/subjects'
|
import { subjects } from '@/utils/subjects'
|
||||||
import Footer from '@/components/Footer'
|
import Footer from '@/components/Footer'
|
||||||
|
import { Select, SelectItem } from '@nextui-org/select'
|
||||||
|
import { Button, ButtonGroup } from '@nextui-org/button'
|
||||||
|
|
||||||
export default function Home() {
|
export default function Home() {
|
||||||
const [flPdfLink, setflPdfLink] = useState<string>('')
|
const [flPdfLink, setflPdfLink] = useState<string>('')
|
||||||
|
@ -59,107 +61,125 @@ export default function Home() {
|
||||||
])
|
])
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<main className="flex min-h-screen flex-col items-center justify-between p-24">
|
<main className="dark text-foreground bg-background">
|
||||||
|
<div className="flex min-h-screen flex-col items-center justify-between p-24">
|
||||||
<div className="container mx-auto mt-15">
|
<div className="container mx-auto mt-15">
|
||||||
<div className="flex flex-col items-center justify-center">
|
<div className="flex flex-col items-center justify-center">
|
||||||
<div className="mb-3">
|
<div className="mb-3">
|
||||||
<select
|
<Select
|
||||||
|
selectionMode="single"
|
||||||
|
label="Tárgy"
|
||||||
value={selectedSubject}
|
value={selectedSubject}
|
||||||
onChange={(e) => setSelectedSubject(e.target.value)}
|
onChange={(e) => setSelectedSubject(e.target.value)}
|
||||||
className="bg-[#181a1b] text-[#efefef] w-56 max-w-lg h-10 px-4 text-sm border border-[#3C4143] rounded-lg focus:outline-none hover:bg-[#3C4143] transition-colors duration-150"
|
className="w-56"
|
||||||
>
|
>
|
||||||
<option className="hidden" value="">
|
|
||||||
Tárgy
|
|
||||||
</option>
|
|
||||||
{subjects.map((subject) => (
|
{subjects.map((subject) => (
|
||||||
<option key={subject.value} value={subject.value}>
|
<SelectItem key={subject.value} value={subject.value}>
|
||||||
{subject.label}
|
{subject.label}
|
||||||
</option>
|
</SelectItem>
|
||||||
))}
|
))}
|
||||||
</select>
|
</Select>
|
||||||
</div>
|
</div>
|
||||||
<div className="mb-3">
|
<div className="mb-3">
|
||||||
<select
|
<Select
|
||||||
|
selectionMode="single"
|
||||||
|
label="Év"
|
||||||
value={selectedYear}
|
value={selectedYear}
|
||||||
onChange={(e) => setSelectedYear(e.target.value)}
|
onChange={(e) => setSelectedYear(e.target.value)}
|
||||||
className="bg-[#181a1b] text-[#efefef] w-56 max-w-lg h-10 px-4 text-sm border border-[#3C4143] rounded-lg focus:outline-none hover:bg-[#3C4143] transition-colors duration-150"
|
className="w-56"
|
||||||
>
|
>
|
||||||
<option className="hidden" value="">
|
|
||||||
Év
|
|
||||||
</option>
|
|
||||||
{years.map((year) => (
|
{years.map((year) => (
|
||||||
<option key={year} value={year}>
|
<SelectItem key={year} value={year}>
|
||||||
{year}
|
{year}
|
||||||
</option>
|
</SelectItem>
|
||||||
))}
|
))}
|
||||||
</select>
|
</Select>
|
||||||
</div>
|
</div>
|
||||||
<div className="mb-3">
|
<div className="mb-3">
|
||||||
<select
|
<Select
|
||||||
|
selectionMode="single"
|
||||||
|
label="Időszak"
|
||||||
value={selectedPeriod}
|
value={selectedPeriod}
|
||||||
onChange={(e) => setSelectedPeriod(e.target.value)}
|
onChange={(e) => setSelectedPeriod(e.target.value)}
|
||||||
className="bg-[#181a1b] text-[#efefef] w-56 max-w-lg h-10 px-4 text-sm border border-[#3C4143] rounded-lg focus:outline-none hover:bg-[#3C4143] transition-colors duration-150"
|
className="w-56"
|
||||||
>
|
>
|
||||||
<option className="hidden" value="">
|
<SelectItem key={'tavasz'} value={'tavasz'}>
|
||||||
Időszak
|
Tavasz
|
||||||
</option>
|
</SelectItem>
|
||||||
<option value="tavasz">Tavasz</option>
|
<SelectItem key={'osz'} value={'osz'}>
|
||||||
<option value="osz">Ősz</option>
|
Ősz
|
||||||
</select>
|
</SelectItem>
|
||||||
|
</Select>
|
||||||
</div>
|
</div>
|
||||||
<div className="mb-3">
|
<div className="mb-3">
|
||||||
<select
|
<Select
|
||||||
|
selectionMode="single"
|
||||||
|
label="Szint"
|
||||||
value={selectedLevel}
|
value={selectedLevel}
|
||||||
onChange={(e) => setSelectedLevel(e.target.value)}
|
onChange={(e) => setSelectedLevel(e.target.value)}
|
||||||
className="bg-[#181a1b] text-[#efefef] w-56 max-w-lg h-10 px-4 text-sm border border-[#3C4143] rounded-lg focus:outline-none hover:bg-[#3C4143] transition-colors duration-150"
|
className="w-56"
|
||||||
>
|
>
|
||||||
<option className="hidden" value="">
|
<SelectItem key={'kozep'} value={'kozep'}>
|
||||||
Szint
|
Közép
|
||||||
</option>
|
</SelectItem>
|
||||||
<option value="kozep">Közép</option>
|
<SelectItem key={'emelt'} value={'emelt'}>
|
||||||
<option value="emelt">Emelt</option>
|
Emelt
|
||||||
</select>
|
</SelectItem>
|
||||||
|
</Select>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div className="space-x-3">
|
<div className="space-x-3">
|
||||||
<button
|
<ButtonGroup>
|
||||||
className="w-24 mt-3 text-sm bg-blue-500 hover:bg-blue-700 text-white font-bold py-2 px-2 rounded"
|
<Button
|
||||||
|
isDisabled={!flPdfLink}
|
||||||
|
className="w-24 mt-3 text-sm bg-blue-500 hover:bg-blue-700 text-white font-bold py-2 px-2"
|
||||||
onClick={flPdfLink ? () => window.open(flPdfLink) : () => {}}
|
onClick={flPdfLink ? () => window.open(flPdfLink) : () => {}}
|
||||||
>
|
>
|
||||||
Feladatlap
|
Feladatlap
|
||||||
</button>
|
</Button>
|
||||||
<button
|
<Button
|
||||||
className="w-24 mt-3 text-sm bg-blue-500 hover:bg-blue-700 text-white font-bold py-2 px-2 rounded"
|
isDisabled={!utPdfLink}
|
||||||
|
className="w-24 mt-3 text-sm bg-blue-500 hover:bg-blue-700 text-white font-bold py-2 px-2"
|
||||||
onClick={utPdfLink ? () => window.open(utPdfLink) : () => {}}
|
onClick={utPdfLink ? () => window.open(utPdfLink) : () => {}}
|
||||||
>
|
>
|
||||||
Útmutató
|
Útmutató
|
||||||
</button>
|
</Button>
|
||||||
|
</ButtonGroup>
|
||||||
</div>
|
</div>
|
||||||
<div className="space-x-3">
|
<div className="space-x-3">
|
||||||
|
<ButtonGroup>
|
||||||
{selectedSubject === 'inf' ||
|
{selectedSubject === 'inf' ||
|
||||||
selectedSubject === 'infoism' ||
|
selectedSubject === 'infoism' ||
|
||||||
selectedSubject === 'digkult' ? (
|
selectedSubject === 'digkult' ? (
|
||||||
<button
|
<Button
|
||||||
className="w-24 mt-3 text-sm bg-blue-500 hover:bg-blue-700 text-white font-bold py-2 px-2 rounded"
|
isDisabled={!flZipLink}
|
||||||
onClick={flZipLink ? () => window.open(flZipLink) : () => {}}
|
className="w-24 mt-3 text-sm bg-blue-500 hover:bg-blue-700 text-white font-bold py-2 px-2"
|
||||||
|
onClick={
|
||||||
|
flZipLink ? () => window.open(flZipLink) : () => {}
|
||||||
|
}
|
||||||
>
|
>
|
||||||
Forrás
|
Forrás
|
||||||
</button>
|
</Button>
|
||||||
) : null}
|
) : null}
|
||||||
{selectedSubject === 'inf' ||
|
{selectedSubject === 'inf' ||
|
||||||
selectedSubject === 'infoism' ||
|
selectedSubject === 'infoism' ||
|
||||||
selectedSubject === 'digkult' ? (
|
selectedSubject === 'digkult' ? (
|
||||||
<button
|
<Button
|
||||||
className="w-24 mt-3 text-sm bg-blue-500 hover:bg-blue-700 text-white font-bold py-2 px-2 rounded"
|
isDisabled={!utZipLink}
|
||||||
onClick={utZipLink ? () => window.open(utZipLink) : () => {}}
|
className="w-24 mt-3 text-sm bg-blue-500 hover:bg-blue-700 text-white font-bold py-2 px-2"
|
||||||
|
onClick={
|
||||||
|
utZipLink ? () => window.open(utZipLink) : () => {}
|
||||||
|
}
|
||||||
>
|
>
|
||||||
Megoldás
|
Megoldás
|
||||||
</button>
|
</Button>
|
||||||
) : null}
|
) : null}
|
||||||
|
</ButtonGroup>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<Footer />
|
<Footer />
|
||||||
</div>
|
</div>
|
||||||
|
</div>
|
||||||
</main>
|
</main>
|
||||||
)
|
)
|
||||||
}
|
}
|
||||||
|
|
|
@ -2,6 +2,9 @@
|
||||||
@tailwind components;
|
@tailwind components;
|
||||||
@tailwind utilities;
|
@tailwind utilities;
|
||||||
|
|
||||||
|
html,
|
||||||
body {
|
body {
|
||||||
background-color: #0e0f0f;
|
margin: 0;
|
||||||
|
height: 100%;
|
||||||
|
overflow: hidden;
|
||||||
}
|
}
|
||||||
|
|
|
@ -1,10 +1,21 @@
|
||||||
import type { Config } from 'tailwindcss'
|
import type { Config } from 'tailwindcss'
|
||||||
|
import { nextui } from '@nextui-org/react'
|
||||||
|
|
||||||
const config: Config = {
|
const config: Config = {
|
||||||
content: [
|
content: [
|
||||||
'./src/pages/**/*.{js,ts,jsx,tsx,mdx}',
|
'./src/pages/**/*.{js,ts,jsx,tsx,mdx}',
|
||||||
'./src/components/**/*.{js,ts,jsx,tsx,mdx}',
|
'./src/components/**/*.{js,ts,jsx,tsx,mdx}',
|
||||||
'./src/app/**/*.{js,ts,jsx,tsx,mdx}',
|
'./src/app/**/*.{js,ts,jsx,tsx,mdx}',
|
||||||
|
'./node_modules/@nextui-org/theme/dist/**/*.{js,ts,jsx,tsx}',
|
||||||
|
],
|
||||||
|
theme: {
|
||||||
|
extend: {},
|
||||||
|
},
|
||||||
|
darkMode: 'class',
|
||||||
|
plugins: [
|
||||||
|
nextui({
|
||||||
|
addCommonColors: true,
|
||||||
|
}),
|
||||||
],
|
],
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
Loading…
Add table
Add a link
Reference in a new issue