FüUF26 in Menüstruktur eingebunden ; CategorySelect Ordner umbenannt

master
David Heidl 2023-11-27 23:28:23 +01:00
parent 233b9d45a7
commit da2e8c8bc7
12 changed files with 28 additions and 11 deletions

View File

@ -14,7 +14,7 @@ import Page404 from './pages/Page404/Page404'
import RandomQuest from './pages/Train/RandomQuest/RandomQuest'
import RandomExam from './pages/Train/RandomExam/RandomExam'
import CategoryQuest from './pages/Train/CategoryQuest/CategoryQuest'
import CategorySelect from './pages/Train/Home/CategorySelect'
import CategorySelect from './pages/Train/CategorySelect/CategorySelect.js'
import FUEUF26_RandomExam from './pages/FUEUF26/RandomExam/FUEUF26_RandomExam'
import { generateUUID, getBrowser } from './main.js'

View File

@ -14,6 +14,7 @@
/* border-top-left-radius: 45px; */
/* border-bottom-left-radius: 45px; */
/* display: none; */
overflow-y: auto;
}
.mainmenumodalbg {
@ -58,6 +59,8 @@
margin-top: 20px;
padding-bottom: 20px;
display: flex;
/* flex-wrap: no-wrap; */
flex-wrap: wrap;
gap: 30px;
}

View File

@ -1,7 +1,7 @@
import { React, useEffect, useState } from 'react'
import { FontAwesomeIcon } from '@fortawesome/react-fontawesome'
import { faXmark, faPeopleGroup, faHeadset, faScaleBalanced, faHome, faLinesLeaning, faGraduationCap, faBookOpenReader } from '@fortawesome/free-solid-svg-icons'
import { faXmark, faPeopleGroup, faHeadset, faScaleBalanced, faHome, faLinesLeaning, faGraduationCap, faBookOpenReader, faDatabase } from '@fortawesome/free-solid-svg-icons'
// import logo_breit from '../../assets/pictures/logos/GAT-Logo512.png'
@ -47,10 +47,14 @@ export default function MainMenu(props) {
<FontAwesomeIcon className="mainmenutileicon" icon={faLinesLeaning} />
Zufallsfragen
</div>
<div className="mainmenutile" onClick={() => { lP("/fueuf26/randomexam") }}>
<div className="mainmenutile" onClick={() => { lP("/train/categoryselect") }}>
<FontAwesomeIcon className="mainmenutileicon" icon={faDatabase} />
Fragenkatalog
</div>
{/* <div className="mainmenutile" onClick={() => { lP("/fueuf26/randomexam") }}>
<FontAwesomeIcon className="mainmenutileicon" icon={faBookOpenReader} />
FüUF26
</div>
</div> */}
</div>
<h2 className='mainmenuh2'>Weiteres</h2>
<div className="mainmenutilecont">
@ -58,11 +62,14 @@ export default function MainMenu(props) {
<FontAwesomeIcon className="mainmenutileicon" icon={faHeadset} />
Support
</div>
<div className="mainmenutile" onClick={() => { lP("https://tonetwork.de/datenschutz.php") }}>
<FontAwesomeIcon className="mainmenutileicon" icon={faScaleBalanced} />
Rechtliches
</div>
<div className="mainmenutile" onClick={() => { lP("/fueuf26/randomexam") }}>
<FontAwesomeIcon className="mainmenutileicon" icon={faBookOpenReader} />
FüUF26
</div>
</div>
</div>

View File

@ -1 +1 @@
.mainmenu{background-color:var(--ci_color_tilebg);box-sizing:border-box;padding:30px;padding-left:60px;position:fixed;right:50px;top:5vh;bottom:5vh;z-index:100;width:30vw;height:90vh;border-radius:55px}.mainmenumodalbg{background-color:rgba(200,200,200,.4);position:fixed;right:0;top:0;bottom:0;z-index:99;width:100vw;height:100vh}.mainmenucloseicon{cursor:pointer;position:absolute;right:40px;font-size:40px;color:var(--ci_color_primary);color:#fff}.mainmenu .mainmenuh1{all:unset;font-size:30px;color:var(--ci_color_primary);color:#fff;font-weight:700}.mainmenu .mainmenuh2{all:unset;margin-top:40px;margin-bottom:0;font-size:26px;color:var(--ci_color_primary);font-weight:700}.mainmenutilecont{margin-top:20px;padding-bottom:20px;display:flex;gap:30px}.mainmenutile{padding:10px;background-color:var(--ci_color_secondary);background-color:var(--ci_color_primary);border-radius:15px;width:100px;height:100px;display:flex;flex-direction:column;justify-content:center;align-items:center;color:#fff;cursor:pointer;transition:all .5s}.mainmenutile:hover{box-shadow:10px 10px 20px 4px rgba(107,87,164,.4)}.mainmenutile:active{background-color:var(--ci_color_secondary)}.mainmenutile .mainmenutileicon{font-size:40px;padding-bottom:10px}.mainmenutile .mainmenutileimg{max-height:60px;max-width:90%;padding-bottom:10px;-webkit-filter:brightness(0) invert(1);filter:brightness(0) invert(1)}
.mainmenu{background-color:var(--ci_color_tilebg);box-sizing:border-box;padding:30px;padding-left:60px;position:fixed;right:50px;top:5vh;bottom:5vh;z-index:100;width:30vw;height:90vh;border-radius:55px;overflow-y:auto}.mainmenumodalbg{background-color:rgba(200,200,200,.4);position:fixed;right:0;top:0;bottom:0;z-index:99;width:100vw;height:100vh}.mainmenucloseicon{cursor:pointer;position:absolute;right:40px;font-size:40px;color:var(--ci_color_primary);color:#fff}.mainmenu .mainmenuh1{all:unset;font-size:30px;color:var(--ci_color_primary);color:#fff;font-weight:700}.mainmenu .mainmenuh2{all:unset;margin-top:40px;margin-bottom:0;font-size:26px;color:var(--ci_color_primary);font-weight:700}.mainmenutilecont{margin-top:20px;padding-bottom:20px;display:flex;flex-wrap:wrap;gap:30px}.mainmenutile{padding:10px;background-color:var(--ci_color_secondary);background-color:var(--ci_color_primary);border-radius:15px;width:100px;height:100px;display:flex;flex-direction:column;justify-content:center;align-items:center;color:#fff;cursor:pointer;transition:all .5s}.mainmenutile:hover{box-shadow:10px 10px 20px 4px rgba(107,87,164,.4)}.mainmenutile:active{background-color:var(--ci_color_secondary)}.mainmenutile .mainmenutileicon{font-size:40px;padding-bottom:10px}.mainmenutile .mainmenutileimg{max-height:60px;max-width:90%;padding-bottom:10px;-webkit-filter:brightness(0) invert(1);filter:brightness(0) invert(1)}

View File

@ -43,4 +43,10 @@
backdrop-filter: blur(2px);
color: var(--ci_color_primary);
border: 3px solid var(--ci_color_primary);
}
.cta_markred {
color: red;
color: gold;
color: var(--ci_color_red);
}

View File

@ -27,7 +27,8 @@ export default function Home() {
<div className='cta_container'>
<CTAButton className='start_cta' hideArrow={true} title="Prüfungsmodus" onclick={() => lP('/train/randomexam')} />
<CTAButton className='start_cta' hideArrow={true} title="Zufällige Fragen" onclick={() => lP('/train/randomquest')} />
<CTAButton className='start_cta' hideArrow={true} title="Fragen nach Kategorie" onclick={() => lP('/train/categoryselect')} />
{/* <CTAButton className='start_cta' hideArrow={true} title="Fragen nach Kategorie" onclick={() => lP('/train/categoryselect')} /> */}
<CTAButton className='start_cta cta_markred' hideArrow={true} title="Zum FüUF26 Lehrgang" onclick={() => lP('/fueuf26/randomexam')} />
<a onClick={() => lP('/about')} className='abig noselect'><b>Über die App</b></a>
</div>
</section>

View File

@ -1 +1 @@
.home--sec_start{position:relative}.home--sec_start h1{position:absolute;left:50%;transform:translateX(-50%);top:17%;font-family:Roboto,sans-serif;font-weight:700;font-size:58px;text-align:center;color:var(--ci_color_primary)}.home--sec_start .cta_container{position:absolute;top:55%;display:flex;flex-direction:column;justify-content:flex-start;align-items:center;width:100vw;gap:20px}.home--sec_start .start_cta{text-align:center;display:block;min-width:80%;background-color:var(--ci_color_primary);border:3px solid transparent}.home--sec_start .start_cta:hover{background-color:var(--ci_color_secondary);background-color:rgba(0,0,0,0);-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(2px);color:var(--ci_color_primary);border:3px solid var(--ci_color_primary)}
.home--sec_start{position:relative}.home--sec_start h1{position:absolute;left:50%;transform:translateX(-50%);top:17%;font-family:Roboto,sans-serif;font-weight:700;font-size:58px;text-align:center;color:var(--ci_color_primary)}.home--sec_start .cta_container{position:absolute;top:55%;display:flex;flex-direction:column;justify-content:flex-start;align-items:center;width:100vw;gap:20px}.home--sec_start .start_cta{text-align:center;display:block;min-width:80%;background-color:var(--ci_color_primary);border:3px solid transparent}.home--sec_start .start_cta:hover{background-color:var(--ci_color_secondary);background-color:rgba(0,0,0,0);-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(2px);color:var(--ci_color_primary);border:3px solid var(--ci_color_primary)}.cta_markred{color:red;color:gold;color:var(--ci_color_red)}

View File

@ -2,9 +2,9 @@ import { React, useState, useEffect } from 'react'
import { FontAwesomeIcon } from '@fortawesome/react-fontawesome'
import { faChevronLeft } from '@fortawesome/free-solid-svg-icons'
import MainHeader from '../../../components/MainHeader/MainHeader'
import MainFooter from '../../../components/MainFooter/MainFooter'
import CTAButton from '../../../components/CTAButton/CTAButton'
import MainHeader from '../../../components/MainHeader/MainHeader.js'
import MainFooter from '../../../components/MainFooter/MainFooter.js'
import CTAButton from '../../../components/CTAButton/CTAButton.js'
import { lP, oP, sT } from '../../../main.js'