Version without bootstrap
parent
b9c9134a9e
commit
3b0621d335
4
rakefile
4
rakefile
|
@ -1,5 +1,7 @@
|
|||
task default: :deploy
|
||||
|
||||
task :build do
|
||||
system 'middleman build'
|
||||
system 'bundle exec middleman build'
|
||||
end
|
||||
|
||||
task deploy: :build do
|
||||
|
|
|
@ -1,170 +0,0 @@
|
|||
<section id="conferences">
|
||||
<div class="container">
|
||||
<div class="row">
|
||||
<div class="col-lg-12 text-center">
|
||||
<h2>Conférences</h2>
|
||||
<hr />
|
||||
</div>
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="col-sm-12">
|
||||
<ul>
|
||||
<li>
|
||||
<span class="title">Le projet Tor</span>
|
||||
<span class="location">11/16/2013, Ubuntu Party</span>
|
||||
<span class="links">
|
||||
<a href="https://confs.imirhil.fr/20131116_ubuntu-party_tor/">
|
||||
<i class="fa fa-slideshare"></i>
|
||||
Support
|
||||
</a>
|
||||
<!--a href="">
|
||||
<i class="fa fa-video-camera"></i>
|
||||
Vidéo
|
||||
</a-->
|
||||
</span>
|
||||
</li>
|
||||
<li>
|
||||
<span class="title">OpenSSL Valhalla Rampage</span>
|
||||
<span class="location">26/06/2014, Pas sage en Seine</span>
|
||||
<span class="links">
|
||||
<a href="https://confs.imirhil.fr/20140626_pses_openssl-valhalla-rampage/">
|
||||
<i class="fa fa-slideshare"></i>
|
||||
Support
|
||||
</a>
|
||||
<a href="https://confs.imirhil.fr/20140626_pses_openssl-valhalla-rampage.webm">
|
||||
<i class="fa fa-video-camera"></i>
|
||||
Vidéo
|
||||
</a>
|
||||
</span>
|
||||
</li>
|
||||
<li>
|
||||
<span class="title">Cryptographie « unplugged »</span>
|
||||
<span class="location">27/06/2014, Pas sage en Seine</span>
|
||||
<span class="links">
|
||||
<a href="https://confs.imirhil.fr/20140627_pses_crypto-unplugged-solitaire.odp">
|
||||
<i class="fa fa-slideshare"></i>
|
||||
Support
|
||||
</a>
|
||||
<!--a href="">
|
||||
<i class="fa fa-video-camera"></i>
|
||||
Vidéo
|
||||
</a-->
|
||||
</span>
|
||||
</li>
|
||||
<li>
|
||||
<span class="title">Introduction aux chiffrofêtes</span>
|
||||
<span class="location">16/11/2014, Ubuntu Party</span>
|
||||
<span class="links">
|
||||
<!--a href="">
|
||||
<i class="fa fa-slideshare"></i>
|
||||
Support
|
||||
</a-->
|
||||
<a href="https://confs.imirhil.fr/20141116_ubuntu-party_introduction-chiffrofetes.webm">
|
||||
<i class="fa fa-video-camera"></i>
|
||||
Vidéo
|
||||
</a>
|
||||
</span>
|
||||
</li>
|
||||
<li>
|
||||
<span class="title">Hygiène numérique, applications mobiles et vie privée</span>
|
||||
<span class="location">16/11/2014, Ubuntu Party</span>
|
||||
<span class="links">
|
||||
<a href="https://confs.imirhil.fr/20141116_ubuntu_chiffrofete/privacy.html">
|
||||
<i class="fa fa-slideshare"></i>
|
||||
Support
|
||||
</a>
|
||||
<a href="https://confs.imirhil.fr/20141116_ubuntu-party_hygiene-numerique-applications-mobiles-vie-privee.webm">
|
||||
<i class="fa fa-video-camera"></i>
|
||||
Vidéo
|
||||
</a>
|
||||
</span>
|
||||
</li>
|
||||
<li>
|
||||
<span class="title">Les aventures d’un petit paquet réseau</span>
|
||||
<span class="location">16/11/2014, Ubuntu Party</span>
|
||||
<span class="links">
|
||||
<a href="https://confs.imirhil.fr/20141116_ubuntu_chiffrofete/paquet.html">
|
||||
<i class="fa fa-slideshare"></i>
|
||||
Support
|
||||
</a>
|
||||
<a href="https://confs.imirhil.fr/20141116_ubuntu-party_aventures-petit-paquet-reseau.webm">
|
||||
<i class="fa fa-video-camera"></i>
|
||||
Vidéo
|
||||
</a>
|
||||
</span>
|
||||
</li>
|
||||
<li>
|
||||
<span class="title">Comprendre HTTPS</span>
|
||||
<span class="location">16/11/2014, Ubuntu Party</span>
|
||||
<span class="links">
|
||||
<a href="https://confs.imirhil.fr/20141116_ubuntu_chiffrofete/tls.html">
|
||||
<i class="fa fa-slideshare"></i>
|
||||
Support
|
||||
</a>
|
||||
<a href="https://confs.imirhil.fr/20141116_ubuntu-party_comprendre-https.webm">
|
||||
<i class="fa fa-video-camera"></i>
|
||||
Vidéo
|
||||
</a>
|
||||
</span>
|
||||
</li>
|
||||
<li>
|
||||
<span class="title">Live FAQ</span>
|
||||
<span class="location">16/11/2014, Ubuntu Party</span>
|
||||
<span class="links">
|
||||
<!--a href="">
|
||||
<i class="fa fa-slideshare"></i>
|
||||
Support
|
||||
</a-->
|
||||
<a href="https://confs.imirhil.fr/20141116_ubuntu-party_live-faq.webm">
|
||||
<i class="fa fa-video-camera"></i>
|
||||
Vidéo
|
||||
</a>
|
||||
</span>
|
||||
</li>
|
||||
<li>
|
||||
<span class="title">La surveillance de masse</span>
|
||||
<span class="location">07/03/2015, Journées Fédérez</span>
|
||||
<span class="links">
|
||||
<a href="https://confs.imirhil.fr/20150307_federez_surveillance/">
|
||||
<i class="fa fa-slideshare"></i>
|
||||
Support
|
||||
</a>
|
||||
<a href="https://confs.imirhil.fr/20150307_federez_surveillance.webm">
|
||||
<i class="fa fa-video-camera"></i>
|
||||
Vidéo
|
||||
</a>
|
||||
</span>
|
||||
</li>
|
||||
<li>
|
||||
<span class="title">Dégooglisons Internet</span>
|
||||
<span class="location">28/03/2015, Bibliothèque Francophone Multimédia de Limoges</span>
|
||||
<span class="links">
|
||||
<a href="https://confs.imirhil.fr/20150328_bfm-limoges_degooglisons-internet.odp">
|
||||
<i class="fa fa-slideshare"></i>
|
||||
Support
|
||||
</a>
|
||||
<a href="https://confs.imirhil.fr/20150328_degooglisons-internet.webm">
|
||||
<i class="fa fa-video-camera"></i>
|
||||
Vidéo
|
||||
</a>
|
||||
</span>
|
||||
</li>
|
||||
<li>
|
||||
<span class="title">SSL/TLS pour les nuls</span>
|
||||
<span class="location">20/06/2015, Pas sage en Seine</span>
|
||||
<span class="links">
|
||||
<a href="https://confs.imirhil.fr/20150620_pses_tls.webm">
|
||||
<i class="fa fa-slideshare"></i>
|
||||
Support
|
||||
</a>
|
||||
<a href="https://confs.imirhil.fr/20150620_pses_tls/">
|
||||
<i class="fa fa-video-camera"></i>
|
||||
Vidéo
|
||||
</a>
|
||||
</span>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
|
@ -0,0 +1,103 @@
|
|||
%span.anchor#conferences
|
||||
%section.conferences
|
||||
%h1 Conférences
|
||||
%hr
|
||||
%ul
|
||||
%li
|
||||
%span.title Le projet Tor
|
||||
%span.location 11/16/2013, Ubuntu Party
|
||||
%span.links
|
||||
%a{href: 'https://confs.imirhil.fr/20131116_ubuntu-party_tor/'}
|
||||
%i.fa.fa-slideshare
|
||||
Support
|
||||
%li
|
||||
%span.title OpenSSL Valhalla Rampage
|
||||
%span.location 26/06/2014, Pas sage en Seine
|
||||
%span.links
|
||||
%a{href: 'https://confs.imirhil.fr/20140626_pses_openssl-valhalla-rampage/'}
|
||||
%i.fa.fa-slideshare
|
||||
Support
|
||||
%a{href: 'https://confs.imirhil.fr/20140626_pses_openssl-valhalla-rampage.webm'}
|
||||
%i.fa.fa-video-camera
|
||||
Vidéo
|
||||
%li
|
||||
%span.title Cryptographie « unplugged »
|
||||
%span.location 27/06/2014, Pas sage en Seine
|
||||
%span.links
|
||||
%a{href: 'https://confs.imirhil.fr/20140627_pses_crypto-unplugged-solitaire.odp'}
|
||||
%i.fa.fa-slideshare
|
||||
Support
|
||||
%li
|
||||
%span.title Introduction aux chiffrofêtes
|
||||
%span.location 16/11/2014, Ubuntu Party
|
||||
%span.links
|
||||
%a{href: 'https://confs.imirhil.fr/20141116_ubuntu-party_introduction-chiffrofetes.webm'}
|
||||
%i.fa.fa-video-camera
|
||||
Vidéo
|
||||
%li
|
||||
%span.title Hygiène numérique, applications mobiles et vie privée
|
||||
%span.location 16/11/2014, Ubuntu Party
|
||||
%span.links
|
||||
%a{href: 'https://confs.imirhil.fr/20141116_ubuntu_chiffrofete/privacy.html'}
|
||||
%i.fa.fa-slideshare
|
||||
Support
|
||||
%a{href: 'https://confs.imirhil.fr/20141116_ubuntu-party_hygiene-numerique-applications-mobiles-vie-privee.webm'}
|
||||
%i.fa.fa-video-camera
|
||||
Vidéo
|
||||
%li
|
||||
%span.title Les aventures d’un petit paquet réseau
|
||||
%span.location 16/11/2014, Ubuntu Party
|
||||
%span.links
|
||||
%a{href: 'https://confs.imirhil.fr/20141116_ubuntu_chiffrofete/paquet.html'}
|
||||
%i.fa.fa-slideshare
|
||||
Support
|
||||
%a{href: 'https://confs.imirhil.fr/20141116_ubuntu-party_aventures-petit-paquet-reseau.webm'}
|
||||
%i.fa.fa-video-camera
|
||||
Vidéo
|
||||
%li
|
||||
%span.title Comprendre HTTPS
|
||||
%span.location 16/11/2014, Ubuntu Party
|
||||
%span.links
|
||||
%a{href: 'https://confs.imirhil.fr/20141116_ubuntu_chiffrofete/tls.html'}
|
||||
%i.fa.fa-slideshare
|
||||
Support
|
||||
%a{href: 'https://confs.imirhil.fr/20141116_ubuntu-party_comprendre-https.webm'}
|
||||
%i.fa.fa-video-camera
|
||||
Vidéo
|
||||
%li
|
||||
%span.title Live FAQ
|
||||
%span.location 16/11/2014, Ubuntu Party
|
||||
%span.links
|
||||
%a{href: 'https://confs.imirhil.fr/20141116_ubuntu-party_live-faq.webm'}
|
||||
%i.fa.fa-video-camera
|
||||
Vidéo
|
||||
%li
|
||||
%span.title La surveillance de masse
|
||||
%span.location 07/03/2015, Journées Fédérez
|
||||
%span.links
|
||||
%a{href: 'https://confs.imirhil.fr/20150307_federez_surveillance/'}
|
||||
%i.fa.fa-slideshare
|
||||
Support
|
||||
%a{href: 'https://confs.imirhil.fr/20150307_federez_surveillance.webm'}
|
||||
%i.fa.fa-video-camera
|
||||
Vidéo
|
||||
%li
|
||||
%span.title Dégooglisons Internet
|
||||
%span.location 28/03/2015, Bibliothèque Francophone Multimédia de Limoges
|
||||
%span.links
|
||||
%a{href: 'https://confs.imirhil.fr/20150328_bfm-limoges_degooglisons-internet.odp'}
|
||||
%i.fa.fa-slideshare
|
||||
Support
|
||||
%a{href: 'https://confs.imirhil.fr/20150328_degooglisons-internet.webm'}
|
||||
%i.fa.fa-video-camera
|
||||
Vidéo
|
||||
%li
|
||||
%span.title SSL/TLS pour les nuls
|
||||
%span.location 20/06/2015, Pas sage en Seine
|
||||
%span.links
|
||||
%a{href: 'https://confs.imirhil.fr/20150620_pses_tls.webm'}
|
||||
%i.fa.fa-slideshare
|
||||
Support
|
||||
%a{href: 'https://confs.imirhil.fr/20150620_pses_tls/'}
|
||||
%i.fa.fa-video-camera
|
||||
Vidéo
|
|
@ -1,54 +0,0 @@
|
|||
<section id="contact">
|
||||
<div class="container">
|
||||
<div class="row">
|
||||
<div class="col-lg-12 text-center">
|
||||
<h2>Me contacter</h2>
|
||||
<hr />
|
||||
<div class="container">
|
||||
<div class="row">
|
||||
<div class="col-xs-4 text-right">Blog</div>
|
||||
<div class="col-xs-8 text-left">
|
||||
<a href="https://blog.imirhil.fr/">https://blog.imirhil.fr/</a>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="col-xs-4 text-right">Email & Jabber</div>
|
||||
<div class="col-xs-8 text-left">aeris@imirhil.fr</div>
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="col-xs-4 text-right">GPG</div>
|
||||
<div class="col-xs-8 text-left">
|
||||
6A68 B761 2629 7666 ECF4<br/>
|
||||
8F03 <strong>EFB7 4277 ECE4 E222</strong>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="col-xs-4 text-right">OTR</div>
|
||||
<div class="col-xs-8 text-left">
|
||||
F643 5CE0 300F 3236 62DA<br/>
|
||||
3C0E <strong>5769 616D 2D3D AC72</strong>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="col-xs-4 text-right">GNU Social</div>
|
||||
<div class="col-xs-8 text-left">
|
||||
<a href="https://status.imirhil.fr/">https://status.imirhil.fr/</a>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="col-xs-4 text-right">Twitter</div>
|
||||
<div class="col-xs-8 text-left">
|
||||
<a href="https://twitter.com/aeris22">@aeris22</a>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="col-xs-4 text-right">IRC</div>
|
||||
<div class="col-xs-8 text-left">
|
||||
_aeris_ (Freenode, Geeknode, OFTC)
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
|
@ -0,0 +1,36 @@
|
|||
%span#contact.anchor
|
||||
%section.contact
|
||||
%h1 Me contacter
|
||||
%hr
|
||||
%div
|
||||
%span.title Blog :
|
||||
%span.content
|
||||
%a{href: 'https://blog.imirhil.fr/'} https://blog.imirhil.fr/
|
||||
%div
|
||||
%span.title Email & Jabber :
|
||||
%span.content aeris@imirhil.fr
|
||||
%div
|
||||
%span.title GPG :
|
||||
%span.content
|
||||
6A68 B761 2629 7666 ECF4
|
||||
%br
|
||||
8F03
|
||||
%strong EFB7 4277 ECE4 E222
|
||||
%div
|
||||
%span.title OTR :
|
||||
%span.content
|
||||
F643 5CE0 300F 3236 62DA
|
||||
%br
|
||||
3C0E
|
||||
%strong 5769 616D 2D3D AC72
|
||||
%div
|
||||
%span.title GNU Social :
|
||||
%span.content
|
||||
%a{href: 'https://status.imirhil.fr/'} https://status.imirhil.fr/
|
||||
%div
|
||||
%span.title Twitter :
|
||||
%span.content
|
||||
%a{href: 'https://twitter.com/aeris22'} @aeris22
|
||||
%div
|
||||
%span.title IRC :
|
||||
%span.content _aeris_ (Freenode, Geeknode, OFTC)
|
|
@ -0,0 +1,22 @@
|
|||
%footer
|
||||
%p
|
||||
La plupart de mes sites utilise
|
||||
%a{href: 'http://www.cacert.org/'} CACert
|
||||
comme autoritée de certification pour mes certificats TLS.
|
||||
%p
|
||||
Ces sites étant aussi protégés par
|
||||
= succeed ',' do
|
||||
%a{href: 'https://fr.wikipedia.org/wiki/HTTP_Strict_Transport_Security'} HSTS
|
||||
vous aurez donc sûrement besoin d’installer
|
||||
%a{href: 'http://www.cacert.org/index.php?id=3'} leurs certificats
|
||||
pour pouvoir y accéder.
|
||||
%p
|
||||
Pour vous assurez de la validité des certificats utilisés, ils sont aussi protégés par
|
||||
= succeed ',' do
|
||||
%a{href: 'https://fr.wikipedia.org/wiki/Domain_Name_System_Security_Extensions'} DNSSec
|
||||
= succeed ',' do
|
||||
%a{href: 'https://fr.wikipedia.org/wiki/DNS_-_based_Authentication_of_Named_Entities'} DANE/TLSA
|
||||
et
|
||||
= succeed '.' do
|
||||
%a{href: 'https://fr.wikipedia.org/wiki/HTTP_Public_Key_Pinning'} HPKP
|
||||
|
|
@ -1,23 +0,0 @@
|
|||
<header>
|
||||
<div class="container text-center">
|
||||
<div class="row">
|
||||
<div class="col-lg-12">
|
||||
<img class="avatar" src="images/profile.png" alt="Tux Debian">
|
||||
<div class="intro-text">
|
||||
<h1>Aeris</h1>
|
||||
<hr />
|
||||
<p class="skills">
|
||||
Groupe crypto-terroriste individuel auto-radicalisé sur l’Internet digital
|
||||
</p>
|
||||
<p class="skills">
|
||||
Exégète numériste amateur de mauvaise foi
|
||||
</p>
|
||||
<p class="skills">
|
||||
Paysan du réseau et cultivateur d’oignons
|
||||
</p>
|
||||
<hr />
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</header>
|
|
@ -0,0 +1,11 @@
|
|||
%span.anchor#identity
|
||||
%section.identity
|
||||
%img.big{src: 'images/profile.png', alt: 'Tux Debian'}
|
||||
%img.small{src: 'images/profile-small.png', alt: 'Tux Debian'}
|
||||
%h1 Aeris
|
||||
%hr
|
||||
%div
|
||||
%p Groupe crypto-terroriste individuel auto-radicalisé sur l’Internet digital
|
||||
%p Exégète numériste amateur de mauvaise foi
|
||||
%p Paysan du réseau et cultivateur d’oignons
|
||||
%hr
|
|
@ -1,18 +0,0 @@
|
|||
<nav class="navbar navbar-default navbar-fixed-top">
|
||||
<div class="container">
|
||||
<ul class="nav navbar-nav navbar-right">
|
||||
<li class="page-scroll">
|
||||
<a href="https://blog.imirhil.fr/">Blog</a>
|
||||
</li>
|
||||
<li class="page-scroll">
|
||||
<a href="#projects">Projets</a>
|
||||
</li>
|
||||
<li class="page-scroll">
|
||||
<a href="#conferences">Conférences</a>
|
||||
</li>
|
||||
<li class="page-scroll">
|
||||
<a href="#contact">Contact</a>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</nav>
|
|
@ -0,0 +1,6 @@
|
|||
%nav
|
||||
%div
|
||||
%a{href: 'https://blog.imirhil.fr/'} Blog
|
||||
%a{href: '#projects'} Projets
|
||||
%a{href: '#conferences'} Conférences
|
||||
%a{href: '#contact'} Contact
|
|
@ -1,76 +0,0 @@
|
|||
<section id="projects">
|
||||
<div class="container">
|
||||
<div class="row">
|
||||
<div class="col-lg-12 text-center">
|
||||
<h2>Projets</h2>
|
||||
<hr />
|
||||
</div>
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="col-sm-4 project-container">
|
||||
<div class="project">
|
||||
<a href="https://imirhil.fr/tls/" data-toggle="modal">
|
||||
<i class="fa fa-search-plus fa-3x"></i>
|
||||
<img src="images/projects/sslcheck.png" alt="SSL Check" />
|
||||
<!--
|
||||
Image by Sean MacEntee
|
||||
CC-BY 2.0 https://creativecommons.org/licenses/by/2.0/
|
||||
https://www.flickr.com/photos/smemon/15944989872/
|
||||
/-->
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-sm-4 project-container">
|
||||
<div class="project">
|
||||
<a href="https://café-vie-privée.fr/" data-toggle="modal">
|
||||
<div class="caption">
|
||||
<div class="caption-content">
|
||||
<i class="fa fa-search-plus fa-3x"></i>
|
||||
</div>
|
||||
</div>
|
||||
<img src="images/projects/chiffrofete.png" alt="Café vie privée">
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-sm-4 project-container">
|
||||
<div class="project">
|
||||
<a href="https://nsa.imirhil.fr/" data-toggle="modal">
|
||||
<div class="caption">
|
||||
<div class="caption-content">
|
||||
<i class="fa fa-search-plus fa-3x"></i>
|
||||
</div>
|
||||
</div>
|
||||
<img src="images/projects/nsa-observer.png" alt="NSA Observer">
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<br/>
|
||||
<div class="row">
|
||||
<div class="col-sm-4 project-container">
|
||||
<div class="project">
|
||||
<a href="https://addons.mozilla.org/firefox/addon/enjoy-reading/" data-toggle="modal">
|
||||
<div class="caption">
|
||||
<div class="caption-content">
|
||||
<i class="fa fa-search-plus fa-3x"></i>
|
||||
</div>
|
||||
</div>
|
||||
<img src="images/projects/enjoy-reading.png" alt="Enjoy Reading">
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-sm-4 project-container">
|
||||
<div class="project">
|
||||
<a href="https://addons.mozilla.org/firefox/addon/shaarli/" data-toggle="modal">
|
||||
<div class="caption">
|
||||
<div class="caption-content">
|
||||
<i class="fa fa-search-plus fa-3x"></i>
|
||||
</div>
|
||||
</div>
|
||||
<img src="images/projects/shaarli.png" alt="Shaarli">
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
|
@ -0,0 +1,25 @@
|
|||
%span.anchor#projects
|
||||
%section.projects
|
||||
%h1 Projets
|
||||
%hr
|
||||
.projects
|
||||
.project
|
||||
%a{href: 'https//imirhil.fr/tls/'}
|
||||
%img{src: 'images/projects/sslcheck.png', alt: 'SSL Check'}
|
||||
/
|
||||
Image by Sean MacEntee
|
||||
CC-BY 2.0 https//creativecommons.org/licenses/by/2.0/
|
||||
https://www.flickr.com/photos/smemon/15944989872/
|
||||
.project
|
||||
%a{href: 'https//café-vie-privée.fr/'}
|
||||
%img{src: 'images/projects/chiffrofete.png', alt: 'Café vie privée'}
|
||||
.project
|
||||
%a{href: 'https//nsa.imirhil.fr/'}
|
||||
%img{src: 'images/projects/nsa-observer.png', alt: 'NSA Observer'}
|
||||
.projects
|
||||
.project
|
||||
%a{href: 'https//addons.mozilla.org/firefox/addon/enjoy-reading/'}
|
||||
%img{src: 'images/projects/enjoy-reading.png', alt: 'Enjoy Reading'}
|
||||
.project
|
||||
%a{href: 'https//addons.mozilla.org/firefox/addon/shaarli/'}
|
||||
%img{src: 'images/projects/shaarli.png', alt: 'Shaarli'}
|
|
@ -0,0 +1,2 @@
|
|||
%header
|
||||
= partial '_nav'
|
Binary file not shown.
After Width: | Height: | Size: 9.8 KiB |
|
@ -1,4 +0,0 @@
|
|||
<%= partial 'header' %>
|
||||
<%= partial 'projects' %>
|
||||
<%= partial 'conferences' %>
|
||||
<%= partial 'contact' %>
|
|
@ -0,0 +1,4 @@
|
|||
= partial 'identity'
|
||||
= partial 'projects'
|
||||
= partial 'conferences'
|
||||
= partial 'contact'
|
|
@ -9,7 +9,8 @@
|
|||
<%= stylesheet_link_tag 'all', media: :all %>
|
||||
</head>
|
||||
<body>
|
||||
<%= partial 'nav' %>
|
||||
<%= partial 'header' %>
|
||||
<%= yield %>
|
||||
<%= partial 'footer' %>
|
||||
</body>
|
||||
</html>
|
||||
|
|
|
@ -1,13 +1,288 @@
|
|||
@import 'font-awesome';
|
||||
@import "font-awesome/variables";
|
||||
@import "font-awesome/mixins";
|
||||
@import "font-awesome/path";
|
||||
@import "font-awesome/core";
|
||||
@import "font-awesome/icons";
|
||||
|
||||
@import 'mixins';
|
||||
@import 'theme';
|
||||
|
||||
@import 'bootstrap/variables';
|
||||
@import 'bootstrap/mixins';
|
||||
@import 'bootstrap/normalize';
|
||||
@import 'bootstrap/scaffolding';
|
||||
@import 'bootstrap/type';
|
||||
@import 'bootstrap/grid';
|
||||
@import 'bootstrap/forms';
|
||||
@import 'bootstrap/navs';
|
||||
@import 'bootstrap/navbar';
|
||||
* {
|
||||
box-sizing: border-box;
|
||||
-moz-box-sizing: border-box;
|
||||
-webkit-box-sizing: border-box;
|
||||
}
|
||||
|
||||
html {
|
||||
font-family: Arial, Helvetica, sans-serif;
|
||||
}
|
||||
|
||||
body {
|
||||
background-color: $primary-bg;
|
||||
color: $text-color;
|
||||
font-size: $font-size-base;
|
||||
padding-top: $navbar-height + 10px;
|
||||
|
||||
width: 100%;
|
||||
margin: auto;
|
||||
|
||||
padding-bottom: 100px;
|
||||
}
|
||||
|
||||
h1, h2 {
|
||||
margin: 0px;
|
||||
}
|
||||
|
||||
a {
|
||||
color: $link-color;
|
||||
text-decoration: none;
|
||||
|
||||
&:hover {
|
||||
color: $link-color-hover;
|
||||
text-decoration: underline;
|
||||
}
|
||||
}
|
||||
|
||||
p {
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
header {
|
||||
position: fixed;
|
||||
right: 0;
|
||||
left: 0;
|
||||
top: 0;
|
||||
width: 100%;
|
||||
height: $navbar-height;
|
||||
|
||||
background-color: $navbar-bg;
|
||||
color: $navbar-color;
|
||||
|
||||
font-weight: bold;
|
||||
|
||||
display: -webkit-flex;
|
||||
display: flex;
|
||||
-webkit-align-items: center;
|
||||
align-items: center;
|
||||
-webkit-justify-content: center;
|
||||
justify-content: center;
|
||||
|
||||
a {
|
||||
color: $navbar-link-color;
|
||||
text-transform: uppercase;
|
||||
|
||||
&:hover {
|
||||
color: $navbar-link-color-hover;
|
||||
}
|
||||
}
|
||||
|
||||
nav {
|
||||
width: 100%;
|
||||
|
||||
div {
|
||||
text-align: right;
|
||||
|
||||
a {
|
||||
margin-left: 10px;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
span.anchor {
|
||||
display: block;
|
||||
//height: $navbar-height;
|
||||
//margin-top: -$navbar-height;
|
||||
visibility: hidden;
|
||||
}
|
||||
|
||||
section {
|
||||
h1 {
|
||||
text-align: center;
|
||||
font-size: 2em;
|
||||
}
|
||||
}
|
||||
|
||||
section.identity {
|
||||
text-align: center;
|
||||
|
||||
img {
|
||||
margin: auto;
|
||||
background-color: $secondary-bg;
|
||||
|
||||
&.big {
|
||||
padding: 10px;
|
||||
border-radius: 105px;
|
||||
-moz-border-radius: 105px;
|
||||
-webkit-border-radius: 105px;
|
||||
}
|
||||
|
||||
&.small {
|
||||
padding: 4px;
|
||||
border-radius: 52px;
|
||||
-moz-border-radius: 52px;
|
||||
-webkit-border-radius: 52px;
|
||||
}
|
||||
}
|
||||
|
||||
h1 {
|
||||
font-size: 3em;
|
||||
margin: 20px 0;
|
||||
}
|
||||
|
||||
p {
|
||||
margin: 20px 0;
|
||||
}
|
||||
}
|
||||
|
||||
@media (max-width: $screen-xs) {
|
||||
header {
|
||||
height: $navbar-height / 2;
|
||||
|
||||
nav {
|
||||
font-size: 10px;
|
||||
}
|
||||
}
|
||||
|
||||
span.anchor {
|
||||
height: $navbar-height;
|
||||
margin-top: -$navbar-height;
|
||||
}
|
||||
|
||||
section.identity {
|
||||
img.big {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@media (min-width: $screen-xs) {
|
||||
section {
|
||||
margin-top: 100px;
|
||||
|
||||
&.identity {
|
||||
img.small {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
footer {
|
||||
margin-top: 50px;
|
||||
}
|
||||
}
|
||||
|
||||
@media (max-width: $body-width) {
|
||||
nav {
|
||||
padding-right: 10px;
|
||||
}
|
||||
}
|
||||
|
||||
@media (min-width: $body-width) {
|
||||
body, nav {
|
||||
max-width: $body-width;
|
||||
}
|
||||
|
||||
header {
|
||||
width: 100%;
|
||||
|
||||
div {
|
||||
width: 100%;
|
||||
margin: auto;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
section.projects {
|
||||
.projects {
|
||||
.project {
|
||||
margin: 10px;
|
||||
padding: 10px;
|
||||
border: 1px solid #fff;
|
||||
border-radius: 10px;
|
||||
-moz-border-radius: 10px;
|
||||
-webkit-border-radius: 10px;
|
||||
|
||||
display: -webkit-flex;
|
||||
display: flex;
|
||||
-webkit-align-items: center;
|
||||
align-items: center;
|
||||
-webkit-justify-content: center;
|
||||
justify-content: center;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@media (min-width: $screen-sm) {
|
||||
section.projects {
|
||||
.projects {
|
||||
display: -webkit-flex;
|
||||
display: flex;
|
||||
width: 100%;
|
||||
-webkit-align-items: stretch;
|
||||
align-items: stretch;
|
||||
|
||||
.project {
|
||||
-webkit-flex: 1;
|
||||
flex: 1;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
section.conferences {
|
||||
ul {
|
||||
list-style: none;
|
||||
|
||||
li {
|
||||
margin-top: 10px;
|
||||
}
|
||||
}
|
||||
|
||||
.title {
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
.location {
|
||||
font-size: 0.8em;
|
||||
}
|
||||
|
||||
.links a {
|
||||
margin-left: 10px;
|
||||
}
|
||||
}
|
||||
|
||||
section.contact {
|
||||
div:not([class = 'nb']) {
|
||||
margin-top: 10px;
|
||||
|
||||
display: -webkit-flex;
|
||||
display: flex;
|
||||
-webkit-align-items: stretch;
|
||||
align-items: stretch;
|
||||
|
||||
span {
|
||||
&.title {
|
||||
-webkit-flex: 1;
|
||||
flex: 1;
|
||||
|
||||
text-align: right;
|
||||
font-weight: bold;
|
||||
padding-right: 10px;
|
||||
}
|
||||
|
||||
&.content {
|
||||
-webkit-flex: 3;
|
||||
flex: 3;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
footer {
|
||||
font-size: 0.75em;
|
||||
|
||||
p {
|
||||
margin-top: 5px;
|
||||
}
|
||||
}
|
||||
|
|
|
@ -1,90 +1,21 @@
|
|||
@import 'variables';
|
||||
@import 'bootstrap/variables';
|
||||
$primary-bg: #2c3e50;
|
||||
$secondary-bg: lighten($primary-bg, 25%);
|
||||
|
||||
body {
|
||||
padding-top: $navbar-height + 20px;
|
||||
}
|
||||
$text-color: #fff;
|
||||
$link-color: lighten($secondary-bg, 25%);
|
||||
$link-color-hover: darken($link-color, 25%);
|
||||
|
||||
@media (max-width: 768px) {
|
||||
body {
|
||||
padding-top: 3*$navbar-height + 20px;
|
||||
}
|
||||
}
|
||||
$navbar-bg: $secondary-bg;
|
||||
$navbar-color: $text-color;
|
||||
$navbar-link-color: #fff;
|
||||
$navbar-link-color-hover: darken($navbar-link-color, 25%);
|
||||
$navbar-height: 50px;
|
||||
|
||||
header {
|
||||
.avatar {
|
||||
background-color: $secondary-bg;
|
||||
border-radius: 105px;
|
||||
padding: 10px;
|
||||
}
|
||||
}
|
||||
$font-size-base: 20px;
|
||||
|
||||
@media (min-width: 768px) {
|
||||
header {
|
||||
margin-top: 100px;
|
||||
margin-bottom: 150px;
|
||||
}
|
||||
}
|
||||
$screen-xs: 480px;
|
||||
$screen-sm: 768px;
|
||||
$screen-md: 992px;
|
||||
$screen-lg: 1200px;
|
||||
|
||||
.navbar {
|
||||
text-transform: uppercase;
|
||||
font-weight: 700;
|
||||
.navbar-nav {
|
||||
letter-spacing: 1px;
|
||||
}
|
||||
}
|
||||
|
||||
section {
|
||||
margin-bottom: 100px;
|
||||
}
|
||||
|
||||
#projects {
|
||||
.project-container {
|
||||
height: 200px;
|
||||
|
||||
.project {
|
||||
height: 100%;
|
||||
width: 100%;
|
||||
border: 1px solid $text-color;
|
||||
border-radius: 10px;
|
||||
|
||||
img, i.fa-search-plus {
|
||||
position: absolute;
|
||||
top: 50%;
|
||||
left: 50%;
|
||||
transform: translateX(-50%) translateY(-50%);
|
||||
}
|
||||
|
||||
i.fa-search-plus {
|
||||
z-index: 2;
|
||||
opacity: 0;
|
||||
transition: all ease 0.5s;
|
||||
-webkit-transition: all ease 0.5s;
|
||||
-moz-transition: all ease 0.5s;
|
||||
|
||||
&:hover {
|
||||
opacity: 1;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
}
|
||||
|
||||
#conferences {
|
||||
ul {
|
||||
list-style-type: none;
|
||||
}
|
||||
|
||||
.title {
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
.location {
|
||||
font-size: 0.75em;
|
||||
}
|
||||
|
||||
.links a {
|
||||
margin-left: 10px;
|
||||
}
|
||||
}
|
||||
$body-width: 960px;
|
||||
|
|
|
@ -1,12 +0,0 @@
|
|||
$primary-bg: #2c3e50;
|
||||
$secondary-bg: lighten($primary-bg, 25%);
|
||||
|
||||
$body-bg: $primary-bg;
|
||||
$text-color: #fff;
|
||||
$navbar-default-bg: $secondary-bg;
|
||||
$navbar-default-color: #fff;
|
||||
$navbar-default-link-color: #fff;
|
||||
$navbar-default-link-hover-color: darken($navbar-default-link-color, 10%);
|
||||
$link-color: lighten($secondary-bg, 25%);
|
||||
|
||||
$font-size-base: 20px;
|
Loading…
Reference in New Issue