Press n or j to go to the next uncovered block, b, p or k for the previous block.
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 | import DottedLine from '../../components/DottedLine' import Link from 'next/link' import { useRouter } from 'next/router' import en from '../../locales/services/en' import fr from '../../locales/services/fr' export default function Challenges({ locale }) { const router = useRouter() const t = locale === 'en' ? en : fr return ( <div className="max-w-3xl mx-auto p-2"> <h1 className="text-center">{t.challenges}</h1> <DottedLine /> <section className="w-full mx-auto md:w-5/6 border-b-2 pb-5 pt-5 mb-6"> <div className="flex flex-col md:flex-row gap-5 mb-4 items-center mx-10"> <img src="/workshops.png" alt="" className="w-96" /> <div className="flex flex-col gap-2"> <button onClick={() => router.push('/services/workshops')} className="bg-periwinkle text-white rounded-full py-1 px-4 hover:bg-darkPeriwinkle" > {t.previousService} </button> </div> </div> <p className="text-center text-periwinkle text-lg font-bold">{t.cP1}</p> </section> <section className="space-y-6"> <div className="space-y-2"> <h2 className="text-lg text-periwinkle font-bold">{t.cH2}</h2> <ol className="list-decimal list-inside ml-5"> <li>{t.cLi1}</li> <li>{t.cLi2}</li> </ol> <p>{t.cP2}</p> <ul className="list-disc list-inside ml-5"> <li>{t.cLi3}</li> <li>{t.cLi4}</li> <li>{t.cLi5}</li> <li>{t.cLi6}</li> </ul> </div> <div className="space-y-2"> <h2 className="text-lg text-periwinkle font-bold">{t.c30}</h2> <p>{t.c30P}</p> <p>{t.c30P2}</p> </div> <div className="space-y-2"> <h2 className="text-lg text-periwinkle font-bold">{t.c10}</h2> <p>{t.c10P}</p> <p>{t.c10P2}</p> </div> </section> <div className="mt-10 space-x-5"> <button onClick={() => router.push('/services/workshops')} className="bg-periwinkle text-white rounded-full py-1 px-4 hover:bg-darkPeriwinkle w-32" > {t.back} </button> <Link href="/services"> <a className="text-periwinkle underline">{t.backToService}</a> </Link> </div> </div> ) } export async function getStaticProps({ locale }) { /* istanbul ignore next */ const langToggleLink = locale === 'en' ? '/fr/services/challenges' : '/services/challenges' /* Place-holder Meta Data Props */ const meta = { data_en: { title: 'Digital Dojo - Dojo Challenges', desc: 'English', author: '', keywords: '', }, data_fr: { title: 'Dojo Numérique - Le Défi du Dojo', desc: 'Français', author: '', keywords: '', }, } return { props: { locale, langToggleLink, meta }, } } |