Skip to content
Snippets Groups Projects
Commit add40934 authored by Michael Haidner's avatar Michael Haidner
Browse files

Layout der Seite Termine verbessert

parent 4926bc14
No related branches found
No related tags found
1 merge request!237645_Button_fuer_Antrag_auf_Teilnahme_Informationstermine(planning#645)
Hide whitespace changes
Inline Side-by-side
src/components/CardTermine.jsx
+ 2
− 2
View file @ add40934
......@@ -13,10 +13,10 @@ export default function Card({title, icon, children}) {
}
}, [icon])
return <div className="relative flex flex-col items-center p-6 bg-white rounded shadow-xl">
return <div className="p-6 bg-white rounded shadow-xl">
{svgData && <img className="w-16 h-16 mb-2" src={svgData}/>}
<br/>
<h4 className="text-xl font-bold leading-snug tracking-tight mb-1" style={{ textAlign: "center" }} >FIT-Connect <br/> für {title}</h4>
<h4 className="text-xl font-bold leading-snug mb-1 text-center fitko-termine-heading" >FIT-Connect <br/> für {title}</h4>
{children}
</div>
}
src/css/style.scss
+ 39
− 1
View file @ add40934
......@@ -111,6 +111,32 @@ img {
display: none !important;
}
.fitko-termine {
text-align: center;
min-height: 500px;
}
.fitko-termine-heading {
text-align: center;
height: 80px;
}
.fitko-termine-before-button {
text-align: center;
min-height: 140px;
}
.fitko-termine-after-button {
text-align: center;
min-height: 470px;
margin-top: 25px;
}
@media (min-width: 997px) {
.navbar__items--right [class^="searchBox"] {
position: right;
......@@ -127,4 +153,16 @@ img {
margin-left: -60px;
margin-right: 0px;
}
}
\ No newline at end of file
}
@media (max-width:444px) {
.fitko-termine-after-button {
text-align: center;
display: inline-block;
height: 600px !important;
}
}
src/pages/termine.mdx
+ 38
− 24
View file @ add40934
......@@ -6,8 +6,7 @@ import MailToButtonTermine from '@components/MailToButtonTermine'
import BannerTermine from '@components/BannerTermine'
import CardTermine from '@components/CardTermine'
import MailToButton from '@components/MailToButton'
import '../css/style.scss';
<header className="max-w-3xl mx-auto text-center pb-16">
<h1 className="h1 mb-4">Veranstaltungen</h1>
......@@ -16,35 +15,50 @@ import MailToButton from '@components/MailToButton'
<BannerTermine>
<div style={{ width: "33%" }} >
<CardTermine title="Interessierte" icon={'Send'}>
<br/>
<p className="text-gray-600 text-center" style={{display: 'inline-block', height: '200px'}}>
Bei diesen Veranstaltungen erhalten Verantwortliche für die Umsetzung und Entwickler:innen Informationen darüber, wie sie Onlinedienste und Fachverfahren an FIT-Connect anbinden können.
Zum Anmelden per E-Mail klicken Sie bitte auf die folgende Schaltfläche:
</p>
<MailToButtonTermine label={'Anmelden'} recipient={'fit-connect@fitko.de'} subject={'Anfrage%20Teilnahme%20an%20der%20Online-Veranstaltung%20Anbindungsinteressent%3Ainnenkreis&body=Liebes%20FIT-Connect-Team%2C%0D%0A%0D%0Aber%C3%BCcksichtigen%20Sie%20mich%20bitte%20f%C3%BCr%20die%20n%C3%A4chste%20Online-Veranstaltung%20%E2%80%9EFIT-Connect%20Anbindungsinteressent%3Ainnenkreis%E2%80%9C.%0D%0A%0D%0AIch%20interessiere%20mich%20f%C3%BCr%20FIT-Connect%20und%20m%C3%B6chte%20mehr%20%C3%BCber%20die%20Anbindung%20an%20FIT-Connect%20erfahren.%0D%0A%0D%0A%0D%0A%0D%0A%0D%0A'} />
<br/>
</CardTermine>
<br/>
<div className="fitko-termine" >
<p className="fitko-termine-before-button" >
Diese Veranstaltungen richten sich an alle, die mehr über die Anbindng an FIT-Connect erfahren wollen.
</p>
<MailToButtonTermine label={'Anmelden'} recipient={'fit-connect@fitko.de'} subject={'Anfrage%20Teilnahme%20an%20der%20Online-Veranstaltung%20Anbindungsinteressent%3Ainnenkreis&body=Liebes%20FIT-Connect-Team%2C%0D%0A%0D%0Aber%C3%BCcksichtigen%20Sie%20mich%20bitte%20f%C3%BCr%20die%20n%C3%A4chste%20Online-Veranstaltung%20%E2%80%9EFIT-Connect%20Anbindungsinteressent%3Ainnenkreis%E2%80%9C.%0D%0A%0D%0AIch%20interessiere%20mich%20f%C3%BCr%20FIT-Connect%20und%20m%C3%B6chte%20mehr%20%C3%BCber%20die%20Anbindung%20an%20FIT-Connect%20erfahren.%0D%0A%0D%0A%0D%0A%0D%0A%0D%0A'} />
<br/>
<p className="fitko-termine-after-button" >
Zum Anmelden per E-Mail klicken Sie auf die Schaltfläche oben. <br/>
Bei diesen Veranstaltungen erhalten Verantwortliche für die Umsetzung des Onlinezugangsgesetzes (OZG) und Entwickler:innen Informationen darüber, wie sie Onlinedienste und Fachverfahren an FIT-Connect anbinden können.
</p>
</div>
</CardTermine>
</div>
<div style={{ width: "33%" }} >
<CardTermine title={'Verantwortliche'} icon={'Support'}>
<br/>
<p className="text-gray-600 text-center" style={{display: 'inline-block', height: '200px'}}>
Diese Veranstaltungen richten sich an Umsetzungsverantwortliche, die ihre Systeme anbinden oder angebunden haben.
Schwerpunkte sind die Feature-Roadmap, konzeptionelle Überlegungen, Upgrades. Diese Veranstaltungen finden monatlich statt. Zum Anmelden per E-Mail klicken Sie auf die folgende Schaltfläche:
</p>
<MailToButtonTermine label={'Anmelden'} recipient={'fit-connect@fitko.de'} subject={'Anfrage%20Teilnahme%20an%20der%20Online-Veranstaltung%20Nutzer%3Ainnenkreis&body=Liebes%20FIT-Connect-Team%2C%0D%0A%0D%0Aber%C3%BCcksichtigen%20Sie%20mich%20bitte%20f%C3%BCr%20die%20n%C3%A4chste%20Online-Veranstaltung%20%E2%80%9EFIT-Connect%20Nutzer%3Ainnenkreis%E2%80%9C.%0D%0A%0D%0AWir%20nutzen%20FIT-Connect%20und%20haben%20bereits%20ein%20System%20an%20FIT-Connect%20angebunden%20bzw.%20sind%20gerade%20dabei%2C%20an%20FIT-Connect%20anzubinden.%0D%0A%0D%0A%0D%0A'} />
<br/>
</CardTermine>
<br/>
<div className="fitko-termine" >
<p className="fitko-termine-before-button" >
Diese Veranstaltungen richten sich an Verantwortliche, die ihre Systeme anbinden oder angebunden haben.
</p>
<MailToButtonTermine label={'Anmelden'} recipient={'fit-connect@fitko.de'} subject={'Anfrage%20Teilnahme%20an%20der%20Online-Veranstaltung%20Nutzer%3Ainnenkreis&body=Liebes%20FIT-Connect-Team%2C%0D%0A%0D%0Aber%C3%BCcksichtigen%20Sie%20mich%20bitte%20f%C3%BCr%20die%20n%C3%A4chste%20Online-Veranstaltung%20%E2%80%9EFIT-Connect%20Nutzer%3Ainnenkreis%E2%80%9C.%0D%0A%0D%0AWir%20nutzen%20FIT-Connect%20und%20haben%20bereits%20ein%20System%20an%20FIT-Connect%20angebunden%20bzw.%20sind%20gerade%20dabei%2C%20an%20FIT-Connect%20anzubinden.%0D%0A%0D%0A%0D%0A'} />
<br/>
<p className="fitko-termine-after-button" >
Zum Anmelden per E-Mail klicken Sie auf die Schaltfläche oben. <br/>
Diese Veranstaltungen finden monatlich statt. Bei diesen Veranstaltungen erfahren Verantwortliche für die Umsetzung Informationen zu Themen wie die Feature-Roadmap, konzeptionelle Überlegungen, anstehende Upgrades und individuelle Themen.
</p>
</div>
</CardTermine>
</div>
<div style={{ width: "33%" }} >
<CardTermine title={'Entwickler:innen'} icon={'Bug'}>
<br/>
<p className="text-gray-600 text-center" style={{display: 'inline-block', height: '200px'}}>
Diese Veranstaltungen richten sich an Entwickler:innen, die bereits mit FIT-Connect arbeiten und sich in die Weiterentwicklung von FIT-Connect einbringen möchten.
Diese Veranstaltungen finden monatlich statt. Zum Anmelden per E-Mail klicken Sie auf die folgende Schaltfläche:
</p>
<MailToButtonTermine label={'Anmelden'} recipient={'fit-connect@fitko.de'} subject={'Anfrage%20Teilnahme%20an%20der%20Online-Veranstaltung%20%22FIT-Connect%20Austausch%20zur%20Technik%22&body=Liebes%20FIT-Connect-Team%2C%0D%0A%0D%0Aber%C3%BCcksichtigen%20Sie%20mich%20bitte%20f%C3%BCr%20die%20n%C3%A4chste%20Online-Veranstaltung%20%E2%80%9EFIT-Connect%20Austausch%20zur%20Technik%E2%80%9C.%0D%0A%0D%0AWir%20nutzen%20bereits%20FIT-Connect%20und%20m%C3%B6chten%20uns%20aktiv%20in%20die%20Weiterentwicklung%20von%20FIT-Connect%20einbringen.%0D%0A%0D%0A%0D%0A'} />
<br/>
<div className="fitko-termine" >
<p className="fitko-termine-before-button" >
Diese Veranstaltungen richten sich an Entwickler:innen, die ihre Systeme anbinden oder angebunden haben.
</p>
<MailToButtonTermine label={'Anmelden'} recipient={'fit-connect@fitko.de'} subject={'Anfrage%20Teilnahme%20an%20der%20Online-Veranstaltung%20%22FIT-Connect%20Austausch%20zur%20Technik%22&body=Liebes%20FIT-Connect-Team%2C%0D%0A%0D%0Aber%C3%BCcksichtigen%20Sie%20mich%20bitte%20f%C3%BCr%20die%20n%C3%A4chste%20Online-Veranstaltung%20%E2%80%9EFIT-Connect%20Austausch%20zur%20Technik%E2%80%9C.%0D%0A%0D%0AWir%20nutzen%20bereits%20FIT-Connect%20und%20m%C3%B6chten%20uns%20aktiv%20in%20die%20Weiterentwicklung%20von%20FIT-Connect%20einbringen.%0D%0A%0D%0A%0D%0A'} />
<br/>
<p className="fitko-termine-after-button" >
Zum Anmelden per E-Mail klicken Sie auf die Schaltfläche oben. <br/>
Diese Veranstaltungen finden monatlich statt. Schwerpunkte sind die Feature-Roadmap, konzeptionelle Überlegungen, Upgrades. Teilnehmer sind Entwwickler:innen, die mit FIT-Connect arbeiten und sich in die Weiterentwicklung einbringen möchten.
</p>
</div>
</CardTermine>
</div>
</BannerTermine>
......
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment