Commit 8556d531 authored by Luc Didry's avatar Luc Didry

Une autre police pour les post-it + 2/3 mini changements

parent 0521becc
......@@ -104,22 +104,22 @@ theme = "hugo-identity-theme"
url = "https://metacpan.org/author/LDIDRY"
[[params.work]]
name = "ep_countable"
name = "ep countable"
more = "Plugin Etherpad affichant des statistiques sur le pad"
url = "https://framagit.org/luc/ep_countable"
[[params.work]]
name = "ep_delete_empty_pads"
name = "ep delete_empty_pads"
more = "Plugin Etherpad supprimant automatiquement les pads vides"
url = "https://framagit.org/luc/ep_delete_empty_pads"
[[params.work]]
name = "ep_delete_after_delay"
name = "ep delete_after_delay"
more = "Plugin Etherpad permettant d'avoir des pads temporaires"
url = "https://framagit.org/luc/ep_delete_after_delay"
[[params.work]]
name = "ep_pads_stats"
name = "ep pads_stats"
more = "Plugin Etherpad permettant d'avoir des statistiques sur le serveur Etherpad"
url = "https://framagit.org/luc/ep_pads_stats"
......
......@@ -24,13 +24,14 @@
src: local('Source Sans Pro Light'), local('SourceSansPro-Light'), url('../fonts/sourcesanspro_latin.woff2') format('woff2');
unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2212, U+2215, U+E0FF, U+EFFD, U+F000;
}
/* latin */
@font-face {
font-family: 'Reenie Beanie';
font-family: 'Handlee';
font-style: normal;
font-weight: 400;
src: local('Reenie Beanie'), local('ReenieBeanie'), url('../fonts/reenie_beanie.ttf') format('truetype');
src: local('Handlee Regular'), local('Handlee-Regular'), url('../fonts/handlee.woff2') format('woff2');
unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2212, U+2215, U+E0FF, U+EFFD, U+F000;
}
/*
* Identity by HTML5 UP
* html5up.net | @n33co
......@@ -834,6 +835,7 @@ body.is-ie #wrapper {
padding:3em;
}
#work ul li {
font-family: 'Handlee', cursive;
text-decoration:none;
color:#000;
background:#ffc;
......@@ -889,7 +891,12 @@ body.is-ie #wrapper {
z-index:5;
}
#work ul li p {
font-family: 'Reenie Beanie', cursive;
text-transform: initial;
}
#work ul li h3 {
text-overflow: ellipsis;
overflow: hidden;
font-weight: bold;
}
a.btn {
font-family: "Source Sans Pro",Helvetica,sans-serif;
......
......@@ -68,7 +68,7 @@
<ul>
<li>
<h2>Lufi</h2>
<h3>Lufi</h3>
<p>
Site d’hébergement chiffré (côté client) de fichiers
</p>
......@@ -80,7 +80,7 @@
</li>
<li>
<h2>Lutim</h2>
<h3>Lutim</h3>
<p>
Site d’hébergement chiffré (côté serveur) d’images
</p>
......@@ -92,7 +92,7 @@
</li>
<li>
<h2>Lstu</h2>
<h3>Lstu</h3>
<p>
Raccourcisseur d’URL
</p>
......@@ -104,7 +104,7 @@
</li>
<li>
<h2>FsPages</h2>
<h3>FsPages</h3>
<p>
Publication automatique de pages depuis un serveur Gitlab
</p>
......@@ -116,7 +116,7 @@
</li>
<li>
<h2>Erco</h2>
<h3>Erco</h3>
<p>
ExaBGP Routes Controller
</p>
......@@ -128,7 +128,7 @@
</li>
<li>
<h2>Diverses contributions à des projets libres</h2>
<h3>Diverses contributions à des projets libres</h3>
<p>
Augeas, Owncloud, Etherpad, Searx, Apticron…
</p>
......@@ -136,7 +136,7 @@
</li>
<li>
<h2>WebHooker</h2>
<h3>WebHooker</h3>
<p>
Web service permettant de mirrorer des dépôts Gitlab sur Github
</p>
......@@ -148,7 +148,7 @@
</li>
<li>
<h2>GiphyMatHooker</h2>
<h3>GiphyMatHooker</h3>
<p>
Web service permettant de rechercher des gifs sur Giphy depuis un serveur Mattermost
</p>
......@@ -160,7 +160,7 @@
</li>
<li>
<h2>Dynamic Motd</h2>
<h3>Dynamic Motd</h3>
<p>
Un motd dynamique pour Debian et dérivées
</p>
......@@ -172,7 +172,7 @@
</li>
<li>
<h2>ERT</h2>
<h3>ERT</h3>
<p>
Service web ajoutant un historique à un serveur Ethercalc
</p>
......@@ -184,7 +184,7 @@
</li>
<li>
<h2>Divers modules Perl</h2>
<h3>Divers modules Perl</h3>
<p>
</p>
......@@ -196,7 +196,7 @@
</li>
<li>
<h2>ep_countable</h2>
<h3>ep countable</h3>
<p>
Plugin Etherpad affichant des statistiques sur le pad
</p>
......@@ -208,7 +208,7 @@
</li>
<li>
<h2>ep_delete_empty_pads</h2>
<h3>ep delete_empty_pads</h3>
<p>
Plugin Etherpad supprimant automatiquement les pads vides
</p>
......@@ -220,7 +220,7 @@
</li>
<li>
<h2>ep_delete_after_delay</h2>
<h3>ep delete_after_delay</h3>
<p>
Plugin Etherpad permettant d&#39;avoir des pads temporaires
</p>
......@@ -232,7 +232,7 @@
</li>
<li>
<h2>ep_pads_stats</h2>
<h3>ep pads_stats</h3>
<p>
Plugin Etherpad permettant d&#39;avoir des statistiques sur le serveur Etherpad
</p>
......@@ -244,7 +244,7 @@
</li>
<li>
<h2>Etherpad::Admin</h2>
<h3>Etherpad::Admin</h3>
<p>
Interface web permettant de gérer les pads d&#39;un serveur etherpad
</p>
......@@ -256,7 +256,7 @@
</li>
<li>
<h2>Diverses sondes Munin</h2>
<h3>Diverses sondes Munin</h3>
<p>
</p>
......@@ -268,7 +268,7 @@
</li>
<li>
<h2>Munin coffee</h2>
<h3>Munin coffee</h3>
<p>
Sonde Munin pour monitorer le niveau de café dans une cafetière
</p>
......
/* http://meyerweb.com/eric/tools/css/reset/
v2.0 | 20110126
License: none (public domain)
*/
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed,
figure, figcaption, footer, header, hgroup,
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
margin: 0;
padding: 0;
border: 0;
font-size: 100%;
font: inherit;
vertical-align: baseline;
}
/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure,
footer, header, hgroup, menu, nav, section, main {
display: block;
}
body {
line-height: 1;
}
ol, ul {
list-style: none;
}
blockquote, q {
quotes: none;
}
blockquote:before, blockquote:after,
q:before, q:after {
content: '';
content: none;
}
table {
border-collapse: collapse;
border-spacing: 0;
}
\ No newline at end of file
/* --------------------------------
Modules - reusable parts of our design
-------------------------------- */
.cd-container {
/* this class is used to give a max-width to the element it is applied to, and center it horizontally when it reaches that max-width */
width: 90%;
max-width: 1170px;
margin: 0 auto;
}
.cd-container::after {
/* clearfix */
content: '';
display: table;
clear: both;
}
/* --------------------------------
Main components
-------------------------------- */
#cd-timeline {
position: relative;
padding: 2em 0;
margin-top: 2em;
margin-bottom: 2em;
}
#cd-timeline::before {
/* this is the vertical line */
content: '';
position: absolute;
top: 0;
left: 18px;
height: 100%;
width: 4px;
background: #d7e4ed;
}
@media only screen and (min-width: 1170px) {
#cd-timeline {
margin-top: 3em;
margin-bottom: 3em;
}
#cd-timeline::before {
left: 50%;
margin-left: -2px;
}
}
.cd-timeline-block {
position: relative;
margin: 2em 0;
}
.cd-timeline-block:after {
content: "";
display: table;
clear: both;
}
.cd-timeline-block:first-child {
margin-top: 0;
}
.cd-timeline-block:last-child {
margin-bottom: 0;
}
@media only screen and (min-width: 1170px) {
.cd-timeline-block {
margin: 4em 0;
}
.cd-timeline-block:first-child {
margin-top: 0;
}
.cd-timeline-block:last-child {
margin-bottom: 0;
}
}
.cd-timeline-img {
position: absolute;
top: 0;
left: 0;
width: 40px;
height: 40px;
border-radius: 50%;
box-shadow: 0 0 0 4px white, inset 0 2px 0 rgba(0, 0, 0, 0.08), 0 3px 0 4px rgba(0, 0, 0, 0.05);
}
.cd-timeline-img img {
display: block;
width: 32px;
height: 32px;
position: relative;
left: 50%;
top: 50%;
margin-left: -16px;
margin-top: -16px;
}
.cd-timeline-img.cd-work,
.cd-timeline-img.cd-picture {
background: #75ce66;
}
.cd-timeline-img.cd-graduation,
.cd-timeline-img.cd-movie {
background: #c03b44;
}
.cd-timeline-img.cd-location {
background: #f0ca45;
}
@media only screen and (min-width: 1170px) {
.cd-timeline-img {
width: 60px;
height: 60px;
left: 50%;
margin-left: -30px;
/* Force Hardware Acceleration in WebKit */
-webkit-transform: translateZ(0);
-webkit-backface-visibility: hidden;
}
.cssanimations .cd-timeline-img.is-hidden {
visibility: hidden;
}
.cssanimations .cd-timeline-img.bounce-in {
visibility: visible;
-webkit-animation: cd-bounce-1 0.6s;
-moz-animation: cd-bounce-1 0.6s;
animation: cd-bounce-1 0.6s;
}
}
@-webkit-keyframes cd-bounce-1 {
0% {
opacity: 0;
-webkit-transform: scale(0.5);
}
60% {
opacity: 1;
-webkit-transform: scale(1.2);
}
100% {
-webkit-transform: scale(1);
}
}
@-moz-keyframes cd-bounce-1 {
0% {
opacity: 0;
-moz-transform: scale(0.5);
}
60% {
opacity: 1;
-moz-transform: scale(1.2);
}
100% {
-moz-transform: scale(1);
}
}
@keyframes cd-bounce-1 {
0% {
opacity: 0;
-webkit-transform: scale(0.5);
-moz-transform: scale(0.5);
-ms-transform: scale(0.5);
-o-transform: scale(0.5);
transform: scale(0.5);
}
60% {
opacity: 1;
-webkit-transform: scale(1.2);
-moz-transform: scale(1.2);
-ms-transform: scale(1.2);
-o-transform: scale(1.2);
transform: scale(1.2);
}
100% {
-webkit-transform: scale(1);
-moz-transform: scale(1);
-ms-transform: scale(1);
-o-transform: scale(1);
transform: scale(1);
}
}
.cd-timeline-content {
background: rgba(0, 0, 0, 0.1) none repeat scroll 0% 0% !important;
position: relative;
margin-left: 60px;
background: white;
border-radius: 0.25em;
padding: 1em;
}
.cd-timeline-content:after {
content: "";
display: table;
clear: both;
}
.cd-timeline-content h2 {
color: #303e49;
}
.cd-timeline-content p, .cd-timeline-content .cd-read-more, .cd-timeline-content .cd-date {
font-size: 13px;
font-size: 0.8125rem;
}
.cd-timeline-content .cd-read-more, .cd-timeline-content .cd-date {
display: inline-block;
}
.cd-timeline-content p {
margin: 1em 0;
line-height: 1.6;
}
.cd-timeline-content .cd-read-more {
float: right;
padding: .8em 1em;
background: #acb7c0;
color: white;
border-radius: 0.25em;
}
.no-touch .cd-timeline-content .cd-read-more:hover {
background-color: #bac4cb;
}
.cd-timeline-content .cd-date {
float: left;
padding: .8em 0;
opacity: .7;
}
.cd-timeline-content::before {
content: '';
position: absolute;
top: 16px;
right: 100%;
height: 0;
width: 0;
border: 7px solid transparent;
border-right: 7px solid white;
}
@media only screen and (min-width: 768px) {
.cd-timeline-content h2 {
font-size: 20px;
font-size: 1.25rem;
}
.cd-timeline-content p {
font-size: 16px;
font-size: 1rem;
}
.cd-timeline-content .cd-read-more, .cd-timeline-content .cd-date {
font-size: 14px;
font-size: 0.875rem;
}
}
@media only screen and (min-width: 1170px) {
.cd-timeline-content {
margin-left: 0;
padding: 1.6em;
width: 45%;
}
.cd-timeline-content::before {
top: 24px;
left: 100%;
border-color: transparent;
border-left-color: rgba(0, 0, 0, 0.1);
}
.cd-timeline-content .cd-read-more {
float: left;
}
.cd-timeline-content .cd-date {
position: absolute;
width: 100%;
left: 122%;
top: 6px;
font-size: 16px;
font-size: 1rem;
text-align: left;
}
.cd-timeline-block:nth-child(even) .cd-timeline-content {
float: right;
}
.cd-timeline-block:nth-child(even) .cd-timeline-content::before {
top: 24px;
left: auto;
right: 100%;
border-color: transparent;
border-right-color: rgba(0, 0, 0, 0.1);
}
.cd-timeline-block:nth-child(even) .cd-timeline-content .cd-read-more {
float: right;
}
.cd-timeline-block:nth-child(even) .cd-timeline-content .cd-date {
left: auto;
right: 122%;
text-align: right;
}
.cssanimations .cd-timeline-content.is-hidden {
visibility: hidden;
}
.cssanimations .cd-timeline-content.bounce-in {
visibility: visible;
-webkit-animation: cd-bounce-2 0.6s;
-moz-animation: cd-bounce-2 0.6s;
animation: cd-bounce-2 0.6s;
}
}
@media only screen and (min-width: 1170px) {
/* inverse bounce effect on even content blocks */
.cssanimations .cd-timeline-block:nth-child(even) .cd-timeline-content.bounce-in {
-webkit-animation: cd-bounce-2-inverse 0.6s;
-moz-animation: cd-bounce-2-inverse 0.6s;
animation: cd-bounce-2-inverse 0.6s;
}
}
@-webkit-keyframes cd-bounce-2 {
0% {
opacity: 0;
-webkit-transform: translateX(-100px);
}
60% {
opacity: 1;
-webkit-transform: translateX(20px);
}
100% {
-webkit-transform: translateX(0);
}
}
@-moz-keyframes cd-bounce-2 {
0% {
opacity: 0;
-moz-transform: translateX(-100px);
}
60% {
opacity: 1;
-moz-transform: translateX(20px);
}
100% {
-moz-transform: translateX(0);
}
}
@keyframes cd-bounce-2 {
0% {
opacity: 0;
-webkit-transform: translateX(-100px);
-moz-transform: translateX(-100px);
-ms-transform: translateX(-100px);
-o-transform: translateX(-100px);
transform: translateX(-100px);
}
60% {
opacity: 1;
-webkit-transform: translateX(20px);
-moz-transform: translateX(20px);
-ms-transform: translateX(20px);
-o-transform: translateX(20px);
transform: translateX(20px);
}
100% {
-webkit-transform: translateX(0);
-moz-transform: translateX(0);
-ms-transform: translateX(0);
-o-transform: translateX(0);
transform: translateX(0);
}
}
@-webkit-keyframes cd-bounce-2-inverse {
0% {
opacity: 0;
-webkit-transform: translateX(100px);
}
60% {
opacity: 1;
-webkit-transform: translateX(-20px);
}
100% {
-webkit-transform: translateX(0);
}
}
@-moz-keyframes cd-bounce-2-inverse {
0% {
opacity: 0;
-moz-transform: translateX(100px);
}
60% {
opacity: 1;
-moz-transform: translateX(-20px);
}
100% {
-moz-transform: translateX(0);
}
}
@keyframes cd-bounce-2-inverse {
0% {
opacity: 0;
-webkit-transform: translateX(100px);
-moz-transform: translateX(100px);
-ms-transform: translateX(100px);
-o-transform: translateX(100px);
transform: translateX(100px);
}
60% {
opacity: 1;
-webkit-transform: translateX(-20px);
-moz-transform: translateX(-20px);
-ms-transform: translateX(-20px);
-o-transform: translateX(-20px);
transform: translateX(-20px);
}
100% {
-webkit-transform: translateX(0);