20 changed files with 515 additions and 454 deletions
@ -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' |
|||
|
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' |
|||
@ -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