diff --git a/src/components/Footer.jsx b/src/components/Footer.jsx index f062581e9c6a3b21154b90bddee154686134c90a..e31b3a89e424685586c28c9730b3f3a21775c18e 100644 --- a/src/components/Footer.jsx +++ b/src/components/Footer.jsx @@ -1,4 +1,5 @@ import React from "react"; +import { NavLink } from "react-router-dom"; const Footer = () => { return ( @@ -15,76 +16,78 @@ const Footer = () => { sdílet za stejných podmínek. </p> </section> - <section className="footer__main-links bg-grey-700 text-white lg:grid grid-cols-3 gap-4"></section> + <section className="footer__main-links bg-grey-700 text-white lg:grid grid-cols-3 gap-4"> + <div className="pt-8 pb-4 lg:py-0"> + <div className="footer-collapsible"> + <span className="text-xl uppercase text-white footer-collapsible__toggle"> + CF 2021 + </span>{" "} + <div className=""> + <ul className="mt-6 space-y-2 text-grey-200"> + <li> + <NavLink to="/">Přímý přenos</NavLink> + </li> + <li> + <NavLink to="/program">Program</NavLink> + </li> + </ul> + </div> + </div> + </div> + <div className="py-4 lg:py-0 border-t border-grey-400 lg:border-t-0"> + <div className="footer-collapsible"> + <span className="text-xl uppercase text-white footer-collapsible__toggle"> + Otevřenost + </span>{" "} + <div className=""> + <ul className="mt-6 space-y-2 text-grey-200"> + <li> + <a href="https://ucet.pirati.cz">Transparentní účet</a> + </li>{" "} + <li> + <a href="https://smlouvy.pirati.cz">Registr smluv</a> + </li>{" "} + <li> + <a href="https://wiki.pirati.cz/fo/otevrene_ucetnictvi"> + Otevřené účetnictví + </a> + </li> + </ul> + </div> + </div> + </div> + </section> <section className="footer__social lg:text-right"> <div className="flex flex-col md:flex-row lg:flex-col lg:items-end space-y-2 md:space-y-0 md:space-x-2 lg:space-x-0 lg:space-y-2"> - <button className="btn btn--icon btn--blue-300 btn--hoveractive text-lg btn--fullwidth sm:btn--autowidth"> + <a + href="https://dary.pirati.cz" + rel="noopener noreferrer" + target="_blank" + className="btn btn--icon btn--cyan-200 btn--hoveractive text-lg btn--fullwidth sm:btn--autowidth" + > + <div className="btn__body-wrap"> + <div className="btn__body ">Přispěj</div>{" "} + <div className="btn__icon "> + <i className="ico--pig"></i> + </div> + </div> + </a>{" "} + <a + href="https://nalodeni.pirati.cz" + rel="noopener noreferrer" + target="_blank" + className="btn btn--icon btn--blue-300 btn--hoveractive text-lg btn--fullwidth sm:btn--autowidth" + > <div className="btn__body-wrap"> - <div className="btn__body ">Pomoz nám</div>{" "} + <div className="btn__body ">Naloď se</div>{" "} <div className="btn__icon "> <i className="ico--anchor"></i> </div> </div> - </button> + </a> </div> </section> </div> - <section className="bg-black py-4 lg:py-12"> - <div className="container container--default"> - <div className="grid gap-4 grid-cols-1 md:grid-cols-2"> - <div className="badge w-full"> - <div className="avatar avatar--sm badge__avatar"> - <img src="http://placeimg.com/100/100/people" alt="Avatar" /> - </div> - <div className="badge__body"> - <span className="head-heavy-2xs badge__title"> - Andrej Ramašeuski - </span> - <p className="badge__occupation">Kontakt pro dobrovolníky</p> - <a - href="mailto:example@example.com" - className="contact-line contact-line--responsive icon-link badge__link" - > - <i className="ico--phone"></i> - <span>+420 777 123 123</span> - </a> - <a - href="mailto:example@example.com" - className="contact-line contact-line--responsive icon-link badge__link" - > - <i className="ico--envelope"></i> - <span>example@example.com</span> - </a> - </div> - </div> - <div className="badge w-full"> - <div className="avatar avatar--sm badge__avatar"> - <img src="http://placeimg.com/100/100/people" alt="Avatar" /> - </div> - <div className="badge__body"> - <span className="head-heavy-2xs badge__title"> - Andrea Linhartová - </span> - <p className="badge__occupation">Kontakt pro média</p> - <a - href="mailto:example@example.com" - className="contact-line contact-line--responsive icon-link badge__link" - > - <i className="ico--phone"></i> - <span>+420 777 123 123</span> - </a> - <a - href="mailto:example@example.com" - className="contact-line contact-line--responsive icon-link badge__link" - > - <i className="ico--envelope"></i> - <span>example@example.com</span> - </a> - </div> - </div> - </div> - </div> - </section> </footer> ); };