feat: Restyle the french page

This commit is contained in:
Tom Hubrecht 2023-12-19 15:45:41 +01:00
parent 41ef3fb326
commit 313e200264
2 changed files with 300 additions and 121 deletions

154
www/css/www-eleves.css Normal file
View file

@ -0,0 +1,154 @@
html {
text-rendering: optimizeLegibility;
}
body {
min-height: 100vh;
color: #4a4a4a;
font-size: 1em;
font-weight: 400;
line-height: 1.5;
font-family: BlinkMacSystemFont, -apple-system, "Segoe UI", Roboto, Oxygen, Ubuntu, Cantarell, "Fira Sans", "Droid Sans", "Helvetica Neue", Helvetica, Arial, sans-serif;
align-items: stretch;
display: flex;
flex-direction: column;
justify-content: space-between;
padding-top: 1.5rem;
padding-bottom: 1.5rem;
margin: 0 auto;
position: relative;
width: auto;
}
@media screen and (min-width: 1024px) {
body {
max-width: 960px;
}
}
@media screen and (min-width: 1216px) {
body {
max-width: 1152px;
}
}
@media screen and (min-width: 1408px) {
body {
max-width: 1344px;
}
}
h1 {
text-align: center;
margin-top: 2rem;
margin-bottom: 1.2rem;
color: #363636;
font-size: 2rem;
font-weight: 600;
line-height: 1.125;
word-break: break-word;
}
h2 {
font-size: 1.5rem;
line-height: 1.25;
margin-bottom: 1.5rem;
margin-top: 0;
font-weight: 700;
}
h4 {
font-size: 1.125rem;
margin-top: 2.25rem;
margin-bottom: -0.125rem;
}
section {
margin-top: 1.5rem;
background-color: #f5f5f5;
border-radius: 4px;
position: relative;
padding: 1.5rem;
display: block;
}
section a {
color: currentColor;
background-color: #485fc7;
color: #fff;
font-weight: 600;
align-items: center;
border-radius: 4px;
display: inline-flex;
height: 2em;
justify-content: center;
line-height: 1.5;
padding-left: 0.75em;
padding-right: 0.75em;
white-space: nowrap;
margin-top: 0.75rem;
}
a {
text-decoration: none;
color: #485fc7;
}
a:hover {
text-decoration: underline;
color: #363636;
}
abbr {
margin-left: 0.25em;
margin-right: 0.25em;
}
section a:hover {
color: #fff;
}
section a:not(:last-child) {
margin-right: 1rem;
}
code {
white-space: nowrap;
color: #da1039;
font-size: 1em;
font-family: monospace;
font-weight: 400;
padding: .25em .5em .25em;
}
footer {
display: block;
padding: 3rem 1.5rem 6rem;
text-align: center;
margin-top: 1.75rem;
}
a[lang] {
align-items: center;
background-color: #f5f5f5;
border-radius: 4px;
color: #4a4a4a;
display: inline-flex;
font-size: 1rem;
font-weight: 700;
height: 2em;
justify-content: center;
line-height: 1.5;
padding-left: .75em;
padding-right: .75em;
white-space: nowrap;
}
#restricted {
color: #f14668;
align-items: center;
justify-content: center;
display: inline-flex;
width: 100%;
font-size: 1.125rem;
}

View file

@ -1,5 +1,5 @@
<!DOCTYPE html> <!DOCTYPE html>
<html> <html lang="fr">
<head> <head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"> <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
@ -7,162 +7,187 @@
<meta name="keywords" content="ENS, élèves" lang="en"> <meta name="keywords" content="ENS, élèves" lang="en">
<meta http-equiv="Content-Language" content="fr"> <meta http-equiv="Content-Language" content="fr">
<title>École normale supérieure : serveur élèves</title> <title>École normale supérieure : serveur élèves</title>
<link rel="stylesheet" type="text/css" href="/style.css"> <link rel="stylesheet" type="text/css" href="/css/www-eleves.css">
</head> </head>
<body> <body>
<p style="text-align:right; margin: 0cm" lang="en"> <a lang="en" rel="Alternate" hreflang="en" href="/en/index.html">
<a rel="Alternate" hreflang="en" href="/en/index.html">English version</a> English version
</p> </a>
<h1>École normale supérieure : serveur élèves</h1> <h1>École Normale Supérieure : serveur élèves</h1>
<p>
Ce serveur héberge les pages personnelles des élèves de l'ENS. Ce n'est ni le <a href="http://www.ens.fr/">site
web officiel</a> de l'ENS, ni <a href="http://www.cof.ens.fr/">celui</a> du COF (l'association des élèves).
</p>
<section>
<h2>Pages personnelles</h2> <h2>Pages personnelles</h2>
<p> Si vous désirez joindre un élève par courrier électronique, toutes les adresses à l'<abbr>ENS</abbr> sont de la <p>
forme <code><var>Prenom</var>.<var>Nom</var>@ens.fr</code>.</p> Si vous désirez joindre un élève par courrier électronique,
toutes les adresses à l'<abbr title="Ecole Normale Supérieure">ENS</abbr> sont de la forme
<p class="links"> <code>prenom . nom @ ens.psl.eu</code>.
<a href="https://www.eleves.ens.fr/home/index.html.fr"
title="Pages personnelles des élèves, triées par date de dernière modification">Index des pages
personnelles</a>&nbsp;&bull;
<a href="/annuaire">Annuaire des élèves</a>&nbsp;&bull;
<a href="http://annuaireweb.ens.fr/">Annuaire de l'administration</a>
</p> </p>
<a href="https://www.eleves.ens.fr/home/index.html.fr">
Index des pages personnelles
</a>
<a href="https://www.eleves.ens.fr/annuaire">
Annuaire des élèves
</a>
<a href="https://annuaireweb.ens.fr">
Annuaire de l'administration
</a>
</section>
<section>
<h2>La vie à l'<abbr>ENS</abbr></h2> <h2>La vie à l'<abbr>ENS</abbr></h2>
<p>De nombreuses pages de cette section sont en accès restreint.</p> <b id="restricted">De nombreuses pages de cette section sont en accès restreint.</b>
<div class="links">
<h4>Actualités</h4> <h4>Actualités</h4>
<a href="https://bocal.cof.ens.fr/" title="Journal du COF">Le BOcal</a>&nbsp;&bull; <a href="https://bocal.cof.ens.fr">
<a href="https://www.ens.fr/actualites/" title="Page actualités du site web officiel de l'école">Actus de Le BOcal
l'admin</a> </a>
</div> <a href="https://www.ens.fr/actualites">
Actus de l'admin
</a>
<hr>
<div class="links">
<h4>Courrier électronique</h4> <h4>Courrier électronique</h4>
<a href="https://mail.eleves.ens.fr/">Lire son courriel</a>&nbsp;&bull; <a href="https://mail.eleves.ens.fr/roundcube">
<a href="http://blogs.eleves.ens.fr/tous/" title="Archive des courriels collectifs (accès restreint)">Courriels Lire son courriel
collectifs</a>&nbsp;&bull; </a>
<a href="https://lists.ens.fr/wws" <a href="http://blogs.eleves.ens.fr/tous">
title="Informations sur les listes de diffusion gérées par le service informatique">Listes de diffusion Courriels collectifs
@ens</a> </a>
</div> <a href="https://lists.ens.fr/wws">
Listes de diffusion @ens
</a>
<hr>
<div class="links">
<h4>Clubs</h4> <h4>Clubs</h4>
<a href="http://www.cof.ens.fr/"><abbr>COF</abbr> (association des <a href="http://www.cof.ens.fr/">
élèves)</a>&nbsp;&bull; COF (association des élèves)
<a href="http://www.cof.ens.fr/news/clubs.php" title="La liste des clubs du COF">Clubs du </a>
<abbr>COF</abbr></a>&nbsp;&bull; <a href="http://www.cof.ens.fr/news/clubs.php" title="La liste des clubs du COF">
<a href="http://www.cof.ens.fr/bda/" title="Bureau des arts">BDA</a>&nbsp;&bull; Clubs du COF
<a href="http://www.cof.ens.fr/bds/" title="Bureau des sports">BDS</a>&nbsp;&bull; </a>
<a href="https://www.cof.ens.fr/sftheque/" title="bibliothèque des élèves">SFthèque</a>&nbsp;&bull; <a href="http://www.cof.ens.fr/bda/" title="Bureau des arts">
<a href="autresclubs.html" title="Clubs non affiliés au COF (aumôneries, associations politiques, etc.)">Autres Bureau des Arts
groupes d'élèves</a> </a>
</div> <a href="http://www.cof.ens.fr/bds/" title="Bureau des sports">
Bureau des Sports
</a>
<a href="https://www.cof.ens.fr/sftheque/" title="bibliothèque des élèves">
SFthèque
</a>
<hr>
<div class="links">
<h4>Représentants des élèves</h4> <h4>Représentants des élèves</h4>
<a href="https://www.dg.ens.fr/">Délégation générale</a>&nbsp;&bull; <a href="https://www.dg.ens.fr/">
<a href="cacs/" title="Élus des élèves au conseil d'administration et au conseil scientifique">Élus Délégation générale
<abbr>CA-CS</abbr></a> </a>
</div> <a href="https://www.eleves.ens.fr/cacs/"
title="Élus des élèves au conseil d'administration et au conseil scientifique">
Élus CA-CS
</a>
<hr>
<div class="links">
<h4>Pratique</h4> <h4>Pratique</h4>
<a href="https://www.intranet.ens.psl.eu/" title="Intranet de l'ENS (accès restreint)">Intranet</a>&nbsp;&bull; <a href="https://www.intranet.ens.psl.eu/" title="Intranet de l'ENS (accès restreint)">
<a href="https://www.eleves.ens.fr/experiens/" Intranet
title="ExperiENS - Partagez vos expériences de stage">ExperiENS</a>&nbsp;&bull; </a>
<a href="https://cloud.eleves.ens.fr/">NextCloud</a>&nbsp;&bull; <a href="https://www.eleves.ens.fr/experiens/" title="ExperiENS - Partagez vos expériences de stage">
<a href="https://calendrier.eleves.ens.fr">Calendrier de la vie étudiante</a> ExperiENS
</div> </a>
<a href="https://cloud.eleves.ens.fr/">
NextCloud
</a>
<a href="https://calendrier.dgnum.eu">
Calendrier de la vie étudiante
</a>
<hr>
<div class="links">
<h4>Outils informatiques</h4> <h4>Outils informatiques</h4>
<a href="https://www.eleves.ens.fr/pads/" title="Espace Commun de Travail Simultané">Pads de <a href="https://www.eleves.ens.fr/pads/" title="Espace Commun de Travail Simultané">
travail</a>&nbsp;&bull; Pads de travail
<a href="https://www.eleves.ens.fr/calc/_start/" title="Des tableurs.">Feuilles de calcul</a>&nbsp;&bull; </a>
<a href="http://blogs.eleves.ens.fr/" title="Blogs, journels, appelez ça comme vous voulez.">Blogs internes à <a href="https://www.eleves.ens.fr/calc/_start/" title="Des tableurs.">
l'ENS</a>&nbsp;&bull; Feuilles de calcul
<a href="https://git.eleves.ens.fr/" title="Serveur git interne">Serveur Git interne à l'ENS</a>&nbsp;&bull; </a>
<a href="https://partage.eleves.ens.fr/" title="Pour vos thèses et vos photos de vacances.">Partage de <a href="http://blogs.eleves.ens.fr/" title="Blogs, journels, appelez ça comme vous voulez.">
fichiers</a>&nbsp;&bull; Blogs internes à l'ENS
<a href="http://rdv.spi.ens.fr/" title="Se mettre d'accord sur une date.">Prise de rendez-vous</a>&nbsp;&bull; </a>
<a href="http://salles.ens.fr/" title="Réserver une salle pour un cours ou un séminaire.">Réservation de <a href="https://git.eleves.ens.fr/" title="Serveur git interne">
salles</a>&nbsp;&bull; Serveur Git interne à l'ENS
<a href="https://ens-etud.helvetius.net/pegasus/" title="PEGASUS - Portail Etudiant">Pegasus : saisie des cours </a>
suivis</a>&nbsp;&bull; <a href="https://partage.eleves.ens.fr/" title="Pour vos thèses et vos photos de vacances.">
<a href="https://merle.eleves.ens.fr/" title="Serveur de discussion de l'ENS">Merle : serveur de Partage de fichiers
discussion</a>&nbsp;&bull; </a>
<a href="https://wiki.eleves.ens.fr/" title="Wiki des Élèves">Wiki des Élèves</a> <a href="http://rdv.spi.ens.fr/" title="Se mettre d'accord sur une date.">
Prise de rendez-vous
</div> </a>
<a href="http://salles.ens.fr/" title="Réserver une salle pour un cours ou un séminaire.">
<div class="links"> Réservation de salles
<h4>Ressources informatiques</h4> </a>
<a href="http://www.spi.ens.fr" <a href="https://ens-etud.helvetius.net/pegasus/" title="PEGASUS - Portail Etudiant">
title="Service de prestations informatique (responsable de clipper et des salles en libre service)">SPI</a>&nbsp;&bull; Pegasus : saisie des cours suivis
<a href="https://www.tuteurs.ens.fr/" </a>
title="Documentation sur le système informatique de l'école et divers logiciels courants">Tuteurs (doc <a href="https://merle.eleves.ens.fr/" title="Serveur de discussion de l'ENS">
&#038; aide Unix)</a>&nbsp;&bull; Merle : serveur de discussion
<a href="http://www.eleves.ens.fr/rezoweb/" title="Inscriptions au </a>
rézo, dépannage">Connecter votre ordinateur au rézo des thurnes</a>&nbsp;&bull; <a href="https://wiki.eleves.ens.fr/" title="Wiki des Élèves">
<a href="https://www.tuteurs.ens.fr/internet/web/creer.html" Wiki des Élèves
title="Pages perso élèves&nbsp;: documentation et formulaire de création">Gérer sa page web</a> </a>
</div>
<h2>Autres serveurs de l'école</h2>
<div class="links">
<h4>Administration, enseignement, recherche</h4>
<a href="https://www.ens.psl.eu/">Serveur web principal</a>&nbsp;&bull;
<a href="https://bib.ens.psl.eu/">Bibliothèques</a>&nbsp;&bull;
<a href="http://savoirs.ens.fr/" title="Vidéos de conférences ayant lieu à l'ENS">Diffusion des savoirs</a>
</div>
<div class="links">
<h4>Élèves et anciens</h4>
<a href="https://www.archicubes.ens.fr/">Archicubes et amis de l'ENS</a>
</div>
<!--<h2>Recherche sur ce serveur</h2>
<form method="get" action="http://www.google.com/custom">
<p>
<input type="text" name="q" size="48" maxlength="255" value="" />
<input type="submit" name="sa" value="Chercher" />
<input type="hidden" name="domains" value="www.eleves.ens.fr" />
<br />
<span class="petit" style="display:none;">
<input type="radio" name="sitesearch" value="www.eleves.ens.fr"
checked="checked" /> Chercher sur <code>www.eleves.ens.fr</code>
<input type="radio" name="sitesearch" value="" /> Chercher sur le Web <br />
(recherche <a class="google"
href="http://www.google.com/search">Google&#8482;</a>)
</span>
</p>
</form>-->
<hr> <hr>
<p class="colophon" id="colophon"> <h4>Ressources informatiques</h4>
Ce serveur est maintenu par l'équipe des webmasters élèves [<span class="mail-antispam">rf.sne ta <a href="http://www.spi.ens.fr"
ved-bulk</span>] pendant leur temps libre. Ce n'est ni le <a href="http://www.ens.fr/">serveur web title="Service de prestations informatique (responsable de clipper et des salles en libre service)">
officiel</a> de l'ENS, ni <a href="http://www.cof.ens.fr/">celui</a> de l'association des élèves. La SPI
compétence des webmasters se limite à ce serveur, les contacter n'est pas un bon moyen pour joindre l'ensemble </a>
des élèves. En revanche, tout <a href="/cgi-bin/mail?webmaster">commentaire</a> est bienvenu. <a href="https://www.tuteurs.ens.fr/"
</p> title="Documentation sur le système informatique de l'école et divers logiciels courants">
Tuteurs (documentation, aide Unix)
</a>
<a href="http://www.eleves.ens.fr/rezoweb/" title="Inscriptions au rézo, dépannage">
Connecter votre ordinateur au rézo des thurnes
</a>
<a href="https://www.tuteurs.ens.fr/internet/web/creer.html"
title="Pages perso élèves&nbsp;: documentation et formulaire de création">
Gérer sa page web
</a>
</section>
<section>
<h2>Autres serveurs de l'école</h2>
<h4>Administration, enseignement, recherche</h4>
<a href="https://www.ens.psl.eu/">
Serveur web principal
</a>
<a href="https://bib.ens.psl.eu/">
Bibliothèques
</a>
<a href="http://savoirs.ens.fr/" title="Vidéos de conférences ayant lieu à l'ENS">
Diffusion des savoirs
</a>
<hr>
<h4>Élèves et anciens</h4>
<a href="https://www.archicubes.ens.fr/">
Archicubes et amis de l'ENS
</a>
</section>
<footer>
Ce serveur est maintenu par la <a href="https://dgnum.eu">Délégation Générale Numérique</a>.
<br>
Ce n'est ni le <a href="http://www.ens.fr/">serveur web officiel</a> de l'ENS,
ni <a href="http://www.cof.ens.fr/">celui</a> de l'association des élèves.
</footer>
</body> </body>
</html> </html>