diff --git a/source/components/pages/Menu.css b/source/components/pages/Header.css similarity index 67% rename from source/components/pages/Menu.css rename to source/components/pages/Header.css index ac09272ae..7231ca171 100644 --- a/source/components/pages/Menu.css +++ b/source/components/pages/Header.css @@ -1,3 +1,33 @@ + +@media screen and (max-width:860px) { + nav:not(.bm-item-list) > a { + display: none; + } + nav > a { + display: block; + } +} +@media screen and (min-width:860px) { + nav > div { + display: none; + } + nav { + position: absolute; + right: 1em; + top: 4.5em; + font-size: 90%; + } + nav > a { + display: inline; + margin: .6em; + } + nav > a > i { + margin: 0 .3em; + font-size: 120% !important; + } +} + + /* Position and sizing of burger button */ .bm-burger-button { position: fixed; diff --git a/source/components/pages/Header.js b/source/components/pages/Header.js index 80e354250..a7491c939 100644 --- a/source/components/pages/Header.js +++ b/source/components/pages/Header.js @@ -1,6 +1,6 @@ import React, { Component } from 'react' import { slide as Menu } from 'react-burger-menu' -import 'Components/pages/Menu.css' +import 'Components/pages/Header.css' import { Link } from 'react-router-dom' export default class Header extends Component { @@ -14,24 +14,32 @@ export default class Header extends Component { alt="Un service de l'État français" /> - - - Accueil - - - À propos - - - Intégrer le module - - - Contribuer - - - Toutes nos règles - - + ) } } + +let Links = () => <> + + + + + Intégrer le module + + + Contribuer + + + Toutes nos règles + + + À propos + + diff --git a/source/components/pages/Pages.css b/source/components/pages/Pages.css index 40d3428dc..59bdbdf81 100644 --- a/source/components/pages/Pages.css +++ b/source/components/pages/Pages.css @@ -1,7 +1,8 @@ .page { max-width: 45em; - margin: 2em; + margin: 2em auto; + padding: 0 2em; font-size: 130%; }