pull/89/head
Pierre-Louis Guhur 1 year ago
parent 043033075b
commit 4045b4bbe5

@ -9,8 +9,11 @@ import vote from '../public/vote.svg';
const Experiencediv = () => {
const { t } = useTranslation('resource');
return (
<div className="mt-5">
<div className="w-100 justify-content-end d-flex d-md-none">
<div className="pt-5">
<div
className="w-100 justify-content-end d-flex d-md-none"
style={{ marginTop: '-150px' }}
>
<Image src={vote} alt={t('home.alt-icon-ballot')} />
</div>

@ -1,4 +1,5 @@
import Link from 'next/link';
import { useRouter } from 'next/router';
import { useTranslation } from 'next-i18next';
import { Button, Row, Col } from 'reactstrap';
import Logo from '@components/Logo';
@ -10,9 +11,11 @@ import {
PAYPAL,
WHO_WE_ARE_LINK,
} from '@services/constants';
import { getUrl, RouteTypes } from '@services/routes';
const Footer = () => {
const { t } = useTranslation();
const router = useRouter();
const [app, _] = useAppContext();
if (app.fullPage) {
@ -42,10 +45,16 @@ const Footer = () => {
),
},
{
component: <Link href="/faq">{t('menu.faq')}</Link>,
component: (
<Link href={getUrl(RouteTypes.FAQ, router)}>{t('menu.faq')}</Link>
),
},
{
component: <Link href={NEWS_LINK}>{t('menu.news')}</Link>,
component: (
<a target="_blank" rel="noopener noreferrer" href={NEWS_LINK}>
{t('menu.news')}
</a>
),
},
{
component: (

@ -1,20 +1,99 @@
/* eslint react/prop-types: 0 */
import {useState} from 'react';
import {Collapse, Nav, NavItem, Button} from 'reactstrap';
import { useState } from 'react';
import { Collapse, Nav, NavItem, Button } from 'reactstrap';
import Link from 'next/link';
import Image from 'next/image';
import {useTranslation} from 'next-i18next';
import {useAppContext} from '@services/context';
import { useTranslation } from 'next-i18next';
import { useAppContext } from '@services/context';
import LanguageSelector from './LanguageSelector';
import openMenuIcon from '../../public/open-menu-icon.svg';
import { FontAwesomeIcon } from '@fortawesome/react-fontawesome';
import { faXmark } from '@fortawesome/free-solid-svg-icons';
import {
CONTACT_MAIL,
MAJORITY_JUDGMENT_LINK,
NEWS_LINK,
PAYPAL,
WHO_WE_ARE_LINK,
} from '@services/constants';
import ShareRow from '@components/Share';
import { getUrl, RouteTypes } from '@services/routes';
import { useRouter } from 'next/router';
import Logo from '@components/Logo';
const Header = () => {
const [isOpen, setOpen] = useState(false);
const router = useRouter();
const { t } = useTranslation();
const [app, _] = useAppContext();
const toggle = () => setOpen(!isOpen);
if (app.fullPage) {return null;}
if (app.fullPage) {
return null;
}
const menu = [
{
component: (
<a
href={MAJORITY_JUDGMENT_LINK}
target="_blank"
rel="noopener noreferrer"
className="navbar-my-link nav-link"
>
{t('menu.majority-judgment')}
</a>
),
},
{
component: (
<a
href={WHO_WE_ARE_LINK}
target="_blank"
rel="noopener noreferrer"
className="navbar-my-link nav-link"
>
{t('menu.whoarewe')}
</a>
),
},
{
component: (
<Link
href={getUrl(RouteTypes.FAQ, router)}
className="navbar-my-link nav-link"
>
{t('menu.faq')}
</Link>
),
},
{
component: (
<a
target="_blank"
rel="noopener noreferrer"
href={NEWS_LINK}
className="navbar-my-link nav-link"
>
{t('menu.news')}
</a>
),
},
{
component: (
<a
href="mailto:app@mieuxvoter.fr?subject=[HELP]"
className="navbar-my-link nav-link"
>
{t('menu.contact-us')}
</a>
),
},
{
component: <LanguageSelector selectedSize={24} />,
},
];
return (
<>
@ -30,90 +109,39 @@ const Header = () => {
<Collapse isOpen={isOpen} navbar>
<Nav className="navbar-nav-scroll" navbar>
<div className="d-flex flex-row justify-content-between nav-logo">
<Link href="/" className="navbar-brand navbar-brand-mobile">
<img src="/logos/logo.svg" alt="logo" height="80" />
</Link>
<Button
onClick={toggle}
className="navbar-toggle navbar-close-button"
>
<img height="20" src="/close-menu-icon.svg" alt="logo" />
</Button>
</div>
<div>
<NavItem>
<Link
href="/"
onClick={toggle}
className="navbar-my-link nav-link"
>
Le jugement majoritaire
</Link>
</NavItem>
<NavItem>
<Link
href="/"
onClick={toggle}
className="navbar-my-link nav-link"
>
Qui sommes-nous ?
</Link>
</NavItem>
<NavItem>
<Link
href="/"
onClick={toggle}
className="navbar-my-link nav-link"
>
Foire aux questions
</Link>
</NavItem>
<div className="d-flex flex-column min-vh-100 justify-content-between">
<div>
<div className="d-flex flex-row justify-content-between align-items-center nav-logo">
<Link href="/" className="navbar-brand navbar-brand-mobile">
<img src="/logos/logo.svg" alt="logo" height="80" />
</Link>
<NavItem>
<Link
href="/"
onClick={toggle}
className="navbar-my-link nav-link"
>
On parle de nous
</Link>
</NavItem>
<FontAwesomeIcon
icon={faXmark}
onClick={toggle}
size="2x"
role="button"
className="navbar-toggle navbar-close-button"
/>
</div>
<div>
{menu.map((item, i) => (
<NavItem key={i}>{item.component}</NavItem>
))}
</div>
<NavItem>
<Link
href="/"
onClick={toggle}
className="navbar-my-link nav-link"
>
Nous contactez
</Link>
</NavItem>
<hr className="my-3" />
</div>
<NavItem className="d-flex w-100 align-items-center flex-column">
<a href={PAYPAL} target="_blank" rel="noreferrer noopener">
<Button color="primary" className="text-white">
{t('common.support-us')}
</Button>
</a>
<NavItem>
<LanguageSelector selectedSize={24} />
<ShareRow />
</NavItem>
</div>
<NavItem className="navbar-credits-container">
<Button className="btn-primary btn-nav">
<a href="/">Soutenez-nous</a>
</Button>
<hr />
<div className="navbar-credits sharing sharing-mobile">
<p>Partagez lapplication Mieux voter</p>
<Link href="https://www.facebook.com/mieuxvoter.fr/">
<img src="/facebook.svg" />
</Link>
<Link href="https://twitter.com/mieux_voter">
<img src="/twitter.svg" />
</Link>
</div>
</NavItem>
</Nav>
</Collapse>
</>

@ -138,10 +138,7 @@ const Home = () => {
<StartForm />
</div>
<section className="sectionTwoHome pb-5 text-center">
<div className="d-none d-md-block pt-5 mt-5">
<AdvantagesRow />
</div>
<div className="d-md-none d-block">
<div className=" pt-5 mt-5">
<AdvantagesRow />
</div>
<ExperienceRow />

@ -129,10 +129,7 @@ const Vote = ({ electionRef, token }: VoteInterface) => {
<GoToBallotConfirmMobile electionRef={electionRef} token={token} />
</section>
<section className="sectionTwoHome p-2 pb-5 text-center">
<div className="d-none d-md-block pt-5 mt-5">
<AdvantagesRow />
</div>
<div className="d-md-none d-block">
<div className=" pt-5 mt-5">
<AdvantagesRow />
</div>
<ExperienceRow />

@ -5,13 +5,14 @@ import { NextRouter } from 'next/router';
import { getWindowUrl, displayRef, getLocaleShort } from './utils';
export enum RouteTypes {
HOME = '',
CREATE_ELECTION = 'admin/new',
ADMIN = 'admin',
BALLOT = 'ballot',
CREATE_ELECTION = 'admin/new',
ENDED_VOTE = 'end',
VOTE = 'vote',
FAQ = 'faq',
HOME = '',
RESULTS = 'result',
VOTE = 'vote',
}
export const getUrl = (

Loading…
Cancel
Save