Browse Source

supprimer la dépandance à Fork Awesome

main
Rémi Borfigat 1 month ago
parent
commit
71941bf3fa
Signed by: boarim
GPG Key ID: 9E95193617DE9496
  1. 4
      README.md
  2. 12
      blog/articles/article.html
  3. 14
      blog/index.html
  4. 12
      index.html
  5. 12
      pages/contact.html
  6. 12
      pages/crédits.html
  7. 12
      pages/mentions-légales.html
  8. 12
      pages/politique-de-confidentialité.html
  9. 14
      pages/à-propos.html
  10. 26
      styles/styles.css

4
README.md

@ -3,10 +3,6 @@
On trouvera les fichiers sources du site sous forme de gabarit. Les fichiers de contenu, tels que les images, sont vides pour garder intact la structure.
## Dépendances
Le site utilise les icônes du projet Fork Awesome. Le code CSS est appelé dans l’en-tête des fichiers HTML. Si vous préférez héberger le contenu directement, consulter les [instructions sur leur site](https://forkaweso.me/Fork-Awesome/get-started/).
## Comment utiliser ce gabarit pour votre site ?
1. Cloner le répertoire sur votre machine avec git

12
blog/articles/article.html

@ -13,17 +13,15 @@
<link rel="alternate" type="application/atom+xml" title="Flux Atom des articles du blog" href="/blog/flux.atom">
<link rel="icon" type="image/png" sizes="32x32" href="/favicon.png">
<link rel="stylesheet" href="../../styles/styles.css">
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/fork-awesome@1.2.0/css/fork-awesome.min.css" integrity="sha256-XoaMnoYC5TH6/+ihMEnospgm0J1PM/nioxbOUdnM8HY=" crossorigin="anonymous">
</head>
<body>
<header id="nav-header">
<nav>
<a class="nav-link" href="/"><span class="fa fa-home fa-fw" aria-hidden="true"></span>Accueil</a>
<a class="nav-link" href="/blog/"><span class="fa fa-newspaper-o fa-fw" aria-hidden="true"></span>Blog</a>
<a class="nav-link" href="/pages/à-propos.html"><span class="fa fa-user-circle-o fa-fw" aria-hidden="true"></span>À propos</a>
<a class="nav-link" href="/pages/contact.html"><span class="fa fa-envelope-o fa-fw"></span>Contact</a>
<a class="nav-link" href="/pages/soutien.html"><span class="fa fa-money fa-fw"></span>Soutien</a>
<a class="nav-link" href="/">Accueil</a>
<a class="nav-link" href="/blog/">Blog</a>
<a class="nav-link" href="/pages/à-propos.html">À propos</a>
<a class="nav-link" href="/pages/contact.html">Contact</a>
</nav>
</header>
@ -55,7 +53,7 @@
</main>
<footer>
<p><a class="nav-link" title="S’abonner aux nouvelles publications du blog (flux Atom)" href="/blog/flux.atom"><span class="fa fa-rss fa-2x footer-icons" aria-hidden="true"></span></a></p>
<p><a class="nav-link" title="S’abonner aux nouvelles publications du blog (flux Atom)" href="/blog/flux.atom"><img src="/images/feed-icon.svg" alt="Flux Atom" width="30" height="30"></a></p>
<p><a class="nav-link" href="/pages/crédits.html">Crédits</a> · <a class="nav-link" href="/pages/mentions-légales.html">Mentions légales</a> · <a class="nav-link" href="/pages/politique-de-confidentialité.html">Politique de confidentialité</a></p>
</footer>
</body>

14
blog/index.html

@ -13,17 +13,15 @@
<link rel="alternate" type="application/atom+xml" title="Flux Atom des articles du blog" href="/blog/flux.atom">
<link rel="icon" type="image/png" sizes="32x32" href="/favicon.png">
<link rel="stylesheet" href="../styles/styles.css">
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/fork-awesome@1.2.0/css/fork-awesome.min.css" integrity="sha256-XoaMnoYC5TH6/+ihMEnospgm0J1PM/nioxbOUdnM8HY=" crossorigin="anonymous">
</head>
<body>
<header id="nav-header">
<nav>
<a class="nav-link" href="/"><span class="fa fa-home fa-fw" aria-hidden="true"></span>Accueil</a>
<a class="nav-link" href="/blog/"><span class="fa fa-newspaper-o fa-fw" aria-hidden="true"></span>Blog</a>
<a class="nav-link" href="/pages/à-propos.html"><span class="fa fa-user-circle-o fa-fw" aria-hidden="true"></span>À propos</a>
<a class="nav-link" href="/pages/contact.html"><span class="fa fa-envelope-o fa-fw"></span>Contact</a>
<a class="nav-link" href="/pages/soutien.html"><span class="fa fa-money fa-fw"></span>Soutien</a>
<a class="nav-link" href="/">Accueil</a>
<a class="nav-link" href="/blog/">Blog</a>
<a class="nav-link" href="/pages/à-propos.html">À propos</a>
<a class="nav-link" href="/pages/contact.html">Contact</a>
</nav>
</header>
@ -32,8 +30,6 @@
<p>Texte d’introduction.</p>
<p><a href="flux.atom"><span class="fa fa-rss fa-w"></span>Flux Atom</a></p>
<h2>Année N</h2>
<ul>
@ -48,7 +44,7 @@
</main>
<footer>
<p><a class="nav-link" title="S’abonner aux nouvelles publications du blog (flux Atom)" href="/blog/flux.atom"><span class="fa fa-rss fa-2x footer-icons" aria-hidden="true"></span></a></p>
<p><a class="nav-link" title="S’abonner aux nouvelles publications du blog (flux Atom)" href="/blog/flux.atom"><img src="/images/feed-icon.svg" alt="Flux Atom" width="30" height="30"></a></p>
<p><a class="nav-link" href="/pages/crédits.html">Crédits</a> · <a class="nav-link" href="/pages/mentions-légales.html">Mentions légales</a> · <a class="nav-link" href="/pages/politique-de-confidentialité.html">Politique de confidentialité</a></p>
</footer>
</body>

12
index.html

@ -13,17 +13,15 @@
<link rel="alternate" type="application/atom+xml" title="Flux Atom des articles du blog" href="/blog/flux.atom">
<link rel="icon" type="image/png" sizes="32x32" href="/favicon.png">
<link rel="stylesheet" href="styles/styles.css">
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/fork-awesome@1.2.0/css/fork-awesome.min.css" integrity="sha256-XoaMnoYC5TH6/+ihMEnospgm0J1PM/nioxbOUdnM8HY=" crossorigin="anonymous">
</head>
<body>
<header id="nav-header">
<nav>
<a class="nav-link" href="/"><span class="fa fa-home fa-fw" aria-hidden="true"></span>Accueil</a>
<a class="nav-link" href="/blog/"><span class="fa fa-newspaper-o fa-fw" aria-hidden="true"></span>Blog</a>
<a class="nav-link" href="/pages/à-propos.html"><span class="fa fa-user-circle-o fa-fw" aria-hidden="true"></span>À propos</a>
<a class="nav-link" href="/pages/contact.html"><span class="fa fa-envelope-o fa-fw"></span>Contact</a>
<a class="nav-link" href="/pages/soutien.html"><span class="fa fa-money fa-fw"></span>Soutien</a>
<a class="nav-link" href="/">Accueil</a>
<a class="nav-link" href="/blog/">Blog</a>
<a class="nav-link" href="/pages/à-propos.html">À propos</a>
<a class="nav-link" href="/pages/contact.html">Contact</a>
</nav>
</header>
@ -48,7 +46,7 @@
</main>
<footer>
<p><a class="nav-link" title="S’abonner aux nouvelles publications du blog (flux Atom)" href="/blog/flux.atom"><span class="fa fa-rss fa-2x footer-icons" aria-hidden="true"></span></a></p>
<p><a class="nav-link" title="S’abonner aux nouvelles publications du blog (flux Atom)" href="/blog/flux.atom"><img src="/images/feed-icon.svg" alt="Flux Atom" width="30" height="30"></a></p>
<p><a class="nav-link" href="/pages/crédits.html">Crédits</a> · <a class="nav-link" href="/pages/mentions-légales.html">Mentions légales</a> · <a class="nav-link" href="/pages/politique-de-confidentialité.html">Politique de confidentialité</a></p>
</footer>
</body>

12
pages/contact.html

@ -13,17 +13,15 @@
<link rel="alternate" type="application/atom+xml" title="Flux Atom des articles du blog" href="/blog/flux.atom">
<link rel="icon" type="image/png" sizes="32x32" href="/favicon.png">
<link rel="stylesheet" href="../styles/styles.css">
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/fork-awesome@1.2.0/css/fork-awesome.min.css" integrity="sha256-XoaMnoYC5TH6/+ihMEnospgm0J1PM/nioxbOUdnM8HY=" crossorigin="anonymous">
</head>
<body>
<header id="nav-header">
<nav>
<a class="nav-link" href="/"><span class="fa fa-home fa-fw" aria-hidden="true"></span>Accueil</a>
<a class="nav-link" href="/blog/"><span class="fa fa-newspaper-o fa-fw" aria-hidden="true"></span>Blog</a>
<a class="nav-link" href="/pages/à-propos.html"><span class="fa fa-user-circle-o fa-fw" aria-hidden="true"></span>À propos</a>
<a class="nav-link" href="/pages/contact.html"><span class="fa fa-envelope-o fa-fw"></span>Contact</a>
<a class="nav-link" href="/pages/soutien.html"><span class="fa fa-money fa-fw"></span>Soutien</a>
<a class="nav-link" href="/">Accueil</a>
<a class="nav-link" href="/blog/">Blog</a>
<a class="nav-link" href="/pages/à-propos.html">À propos</a>
<a class="nav-link" href="/pages/contact.html">Contact</a>
</nav>
</header>
@ -42,7 +40,7 @@
</main>
<footer>
<p><a class="nav-link" title="S’abonner aux nouvelles publications du blog (flux Atom)" href="/blog/flux.atom"><span class="fa fa-rss fa-2x footer-icons" aria-hidden="true"></span></a></p>
<p><a class="nav-link" title="S’abonner aux nouvelles publications du blog (flux Atom)" href="/blog/flux.atom"><img src="/images/feed-icon.svg" alt="Flux Atom" width="30" height="30"></a></p>
<p><a class="nav-link" href="/pages/crédits.html">Crédits</a> · <a class="nav-link" href="/pages/mentions-légales.html">Mentions légales</a> · <a class="nav-link" href="/pages/politique-de-confidentialité.html">Politique de confidentialité</a></p>
</footer>
</body>

12
pages/crédits.html

@ -13,17 +13,15 @@
<link rel="alternate" type="application/atom+xml" title="Flux Atom des articles du blog" href="/blog/flux.atom">
<link rel="icon" type="image/png" sizes="32x32" href="/favicon.png">
<link rel="stylesheet" href="../styles/styles.css">
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/fork-awesome@1.2.0/css/fork-awesome.min.css" integrity="sha256-XoaMnoYC5TH6/+ihMEnospgm0J1PM/nioxbOUdnM8HY=" crossorigin="anonymous">
</head>
<body>
<header id="nav-header">
<nav>
<a class="nav-link" href="/"><span class="fa fa-home fa-fw" aria-hidden="true"></span>Accueil</a>
<a class="nav-link" href="/blog/"><span class="fa fa-newspaper-o fa-fw" aria-hidden="true"></span>Blog</a>
<a class="nav-link" href="/pages/à-propos.html"><span class="fa fa-user-circle-o fa-fw" aria-hidden="true"></span>À propos</a>
<a class="nav-link" href="/pages/contact.html"><span class="fa fa-envelope-o fa-fw"></span>Contact</a>
<a class="nav-link" href="/pages/soutien.html"><span class="fa fa-money fa-fw"></span>Soutien</a>
<a class="nav-link" href="/">Accueil</a>
<a class="nav-link" href="/blog/">Blog</a>
<a class="nav-link" href="/pages/à-propos.html">À propos</a>
<a class="nav-link" href="/pages/contact.html">Contact</a>
</nav>
</header>
@ -56,7 +54,7 @@
</main>
<footer>
<p><a class="nav-link" title="S’abonner aux nouvelles publications du blog (flux Atom)" href="/blog/flux.atom"><span class="fa fa-rss fa-2x footer-icons" aria-hidden="true"></span></a></p>
<p><a class="nav-link" title="S’abonner aux nouvelles publications du blog (flux Atom)" href="/blog/flux.atom"><img src="/images/feed-icon.svg" alt="Flux Atom" width="30" height="30"></a></p>
<p>Crédits · <a class="nav-link" href="/pages/mentions-légales.html">Mentions légales</a> · <a class="nav-link" href="/pages/politique-de-confidentialité.html">Politique de confidentialité</a></p>
</footer>
</body>

12
pages/mentions-légales.html

@ -13,17 +13,15 @@
<link rel="alternate" type="application/atom+xml" title="Flux Atom des articles du blog" href="/blog/flux.atom">
<link rel="icon" type="image/png" sizes="32x32" href="/favicon.png">
<link rel="stylesheet" href="../styles/styles.css">
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/fork-awesome@1.2.0/css/fork-awesome.min.css" integrity="sha256-XoaMnoYC5TH6/+ihMEnospgm0J1PM/nioxbOUdnM8HY=" crossorigin="anonymous">
</head>
<body>
<header id="nav-header">
<nav>
<a class="nav-link" href="/"><span class="fa fa-home fa-fw" aria-hidden="true"></span>Accueil</a>
<a class="nav-link" href="/blog/"><span class="fa fa-newspaper-o fa-fw" aria-hidden="true"></span>Blog</a>
<a class="nav-link" href="/pages/à-propos.html"><span class="fa fa-user-circle-o fa-fw" aria-hidden="true"></span>À propos</a>
<a class="nav-link" href="/pages/contact.html"><span class="fa fa-envelope-o fa-fw"></span>Contact</a>
<a class="nav-link" href="/pages/soutien.html"><span class="fa fa-money fa-fw"></span>Soutien</a>
<a class="nav-link" href="/">Accueil</a>
<a class="nav-link" href="/blog/">Blog</a>
<a class="nav-link" href="/pages/à-propos.html">À propos</a>
<a class="nav-link" href="/pages/contact.html">Contact</a>
</nav>
</header>
@ -45,7 +43,7 @@
</main>
<footer>
<p><a class="nav-link" title="S’abonner aux nouvelles publications du blog (flux Atom)" href="/blog/flux.atom"><span class="fa fa-rss fa-2x footer-icons" aria-hidden="true"></span></a></p>
<p><a class="nav-link" title="S’abonner aux nouvelles publications du blog (flux Atom)" href="/blog/flux.atom"><img src="/images/feed-icon.svg" alt="Flux Atom" width="30" height="30"></a></p>
<p><a class="nav-link" href="/pages/crédits.html">Crédits</a> · Mentions légales · <a class="nav-link" href="/pages/politique-de-confidentialité.html">Politique de confidentialité</a></p>
</footer>
</body>

12
pages/politique-de-confidentialité.html

@ -13,17 +13,15 @@
<link rel="alternate" type="application/atom+xml" title="Flux Atom des articles du blog" href="/blog/flux.atom">
<link rel="icon" type="image/png" sizes="32x32" href="/favicon.png">
<link rel="stylesheet" href="../styles/styles.css">
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/fork-awesome@1.2.0/css/fork-awesome.min.css" integrity="sha256-XoaMnoYC5TH6/+ihMEnospgm0J1PM/nioxbOUdnM8HY=" crossorigin="anonymous">
</head>
<body>
<header id="nav-header">
<nav>
<a class="nav-link" href="/"><span class="fa fa-home fa-fw" aria-hidden="true"></span>Accueil</a>
<a class="nav-link" href="/blog/"><span class="fa fa-newspaper-o fa-fw" aria-hidden="true"></span>Blog</a>
<a class="nav-link" href="/pages/à-propos.html"><span class="fa fa-user-circle-o fa-fw" aria-hidden="true"></span>À propos</a>
<a class="nav-link" href="/pages/contact.html"><span class="fa fa-envelope-o fa-fw"></span>Contact</a>
<a class="nav-link" href="/pages/soutien.html"><span class="fa fa-money fa-fw"></span>Soutien</a>
<a class="nav-link" href="/">Accueil</a>
<a class="nav-link" href="/blog/">Blog</a>
<a class="nav-link" href="/pages/à-propos.html">À propos</a>
<a class="nav-link" href="/pages/contact.html">Contact</a>
</nav>
</header>
@ -46,7 +44,7 @@
</main>
<footer>
<p><a class="nav-link" title="S’abonner aux nouvelles publications du blog (flux Atom)" href="/blog/flux.atom"><span class="fa fa-rss fa-2x footer-icons" aria-hidden="true"></span></a></p>
<p><a class="nav-link" title="S’abonner aux nouvelles publications du blog (flux Atom)" href="/blog/flux.atom"><img src="/images/feed-icon.svg" alt="Flux Atom" width="30" height="30"></a></p>
<p><a class="nav-link" href="/pages/crédits.html">Crédits</a> · <a class="nav-link" href="/pages/mentions-légales.html">Mentions légales</a> · Politique de confidentialité</p>
</footer>
</body>

14
pages/à-propos.html

@ -13,17 +13,15 @@
<link rel="alternate" type="application/atom+xml" title="Flux Atom des articles du blog" href="/blog/flux.atom">
<link rel="icon" type="image/png" sizes="32x32" href="/favicon.png">
<link rel="stylesheet" href="../styles/styles.css">
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/fork-awesome@1.2.0/css/fork-awesome.min.css" integrity="sha256-XoaMnoYC5TH6/+ihMEnospgm0J1PM/nioxbOUdnM8HY=" crossorigin="anonymous">
</head>
<body>
<header id="nav-header">
<nav>
<a class="nav-link" href="/"><span class="fa fa-home fa-fw" aria-hidden="true"></span>Accueil</a>
<a class="nav-link" href="/blog/"><span class="fa fa-newspaper-o fa-fw" aria-hidden="true"></span>Blog</a>
<a class="nav-link" href="/pages/à-propos.html"><span class="fa fa-user-circle-o fa-fw" aria-hidden="true"></span>À propos</a>
<a class="nav-link" href="/pages/contact.html"><span class="fa fa-envelope-o fa-fw"></span>Contact</a>
<a class="nav-link" href="/pages/soutien.html"><span class="fa fa-money fa-fw"></span>Soutien</a>
<a class="nav-link" href="/">Accueil</a>
<a class="nav-link" href="/blog/">Blog</a>
<a class="nav-link" href="/pages/à-propos.html">À propos</a>
<a class="nav-link" href="/pages/contact.html">Contact</a>
</nav>
</header>
@ -37,7 +35,7 @@
<source type="image/avif" srcset="../images/profil-150w.avif 150w, ../images/profil-200w.avif 200w" sizes="(max-width: 700px) 150px, 200px">
<source type="image/webp" srcset="../images/profil-150w.webp 150w, ../images/profil-200w.webp 200w" sizes="(max-width: 700px) 150px, 200px">
<source type="image/jpeg" srcset="../images/profil-150w.jpg 150w, ../images/profil-200w.jpg 200w" sizes="(max-width: 700px) 150px, 200px">
<img id="profil" alt="Texte alternatif de l’image." src="../images/profil-200w.jpg">
<img id="profile" alt="Texte alternatif de l’image." src="../images/profil-200w.jpg">
</picture>
</section>
@ -49,7 +47,7 @@
</main>
<footer>
<p><a class="nav-link" title="S’abonner aux nouvelles publications du blog (flux Atom)" href="/blog/flux.atom"><span class="fa fa-rss fa-2x footer-icons" aria-hidden="true"></span></a></p>
<p><a class="nav-link" title="S’abonner aux nouvelles publications du blog (flux Atom)" href="/blog/flux.atom"><img src="/images/feed-icon.svg" alt="Flux Atom" width="30" height="30"></a></p>
<p><a class="nav-link" href="/pages/crédits.html">Crédits</a> · <a class="nav-link" href="/pages/mentions-légales.html">Mentions légales</a> · <a class="nav-link" href="/pages/politique-de-confidentialité.html">Politique de confidentialité</a></p>
</footer>
</body>

26
styles/styles.css

@ -11,10 +11,6 @@ body {
/* Outils */
.fa {
margin-right: 5px;
}
.nav-link {
text-decoration: none;
}
@ -81,7 +77,7 @@ article header {
font-weight: bold;
}
#profil {
#profile {
display: block;
margin: 5vh auto;
border: 2px solid #282828;
@ -105,23 +101,14 @@ footer {
text-decoration: underline;
}
.footer-icons {
border-radius: 3px;
}
.footer-icons:hover {
background-color: #af3a03;
color: #fbf1c7;
}
a:hover {
text-decoration: underline;
color: #79740e;
}
}
@media (min-width: 500px) { /* Mettre la photo de profil à droite */
#profil {
@media (min-width: 500px) { /* Mettre la photo de profile à droite */
#profile {
float: right;
margin-left: 1vw;
}
@ -158,17 +145,12 @@ footer {
}
@media (hover: hover) and (pointer: fine) { /* Activer les effets des liens seulement sur les terminaux avec pointeurs */
.footer-icons:hover {
background-color: #fabd2f;
color: #282828;
}
a:hover {
color: #98971a;
}
}
#profil {
#profile {
border-color: #a89984;
}
}

Loading…
Cancel
Save