Mise en place nouveau framework css pour v.0.2.0 (début)

master
iGor milhit 2016-05-31 07:50:24 +02:00
parent 571ed7da67
commit 3311326581
2 changed files with 1184 additions and 79 deletions

1118
css/rocssti.css 100644

File diff suppressed because it is too large Load Diff

View File

@ -6,71 +6,64 @@
<title>iGor milhit</title>
<meta name="description" content="iGor milhit">
<meta name="keywords" content="iGor milhit, carte d'identité, ePortfolio, contact, CV, veille">
<link rel="stylesheet" href="css/normalize.css">
<link rel="stylesheet" href="css/skeleton.css">
<link rel="stylesheet" href="css/style.css">
<link rel="icon" href="favicon.ico">
<link rel="stylesheet" href="css/rocssti.css">
<link rel="stylesheet" href="css/font-awesome.css">
<link rel="icon" href="favicon.ico">
</head>
<body>
<div itemscope itemtype="http://schema.org/Person">
<header>
<div id="title" class="container">
<img id="avatar" alt="mon avatar, un micket fâché, en rose et violet" src="img/avatar.svg">
<h1 itemprop="name">iGor milhit</h1>
</div>
</header>
<div class="container">
<nav>
<ul>
<li class="button button-primary">Menu</li>
<header>
<section id="titre" class="main center">
<img class="logo" alt="mon avatar, un micket fâché, en rose et violet" src="img/avatar.svg">
<h1 itemprop="name">iGor milhit</h1>
</section>
<nav class="navigation main center">
<ul>
<li><a href="#contact" class="button">Contact</a></li>
<li><a href="#qui" class="button">Qui suis-je ?</a></li>
<li><a href="#que" class="button">Que fais-je ?</a></li>
<li><a href="#online" class="button">Ailleurs, en ligne</a></li>
<li>Menu</li>
<ul>
<li><a href="#contact">Contact</a></li>
<li><a href="#qui">Qui suis-je ?</a></li>
<li><a href="#que">Que fais-je ?</a></li>
<li><a href="#online">Ailleurs, en ligne</a></li>
</ul>
</ul>
</ul>
</nav>
</div>
</nav>
</header>
<div class="container">
<h2 id="contact">Contact</h2>
<section class="row">
<section id="contact" class="main center">
<h2>Contact</h2>
<div class="six columns" id="prive">
<ul>
<li><i class="fa fa-envelope-o"></i> privé : <a href="mailto:igor@milhit.ch" title="m'écrire" itemprop="email">igor@milhit.ch</a></li>
<li><i class="fa fa-home"></i> : Ch. des Clochettes 16, 1206 Genève [<i class="fa fa-map-marker"></i> <a href="http://osm.org/go/0CFtAk9Rb?m=" title="Situation sur OpenStreetMap">carte</a>]</li>
<li><i class="fa fa-mobile"></i> : <a href="tel:+41765528059">+41 76 552 80 59</a></li>
<li><i class="fa fa-key"></i> publique : <a href="igor-milhit.asc" title="ma clé publique">igor-milhit-pub.asc</a></li>
<li>empreinte : <span id="empreinte">9347 2713 B56F 31D4 724A 8972 3E9D 7C16 05E4 0FCD</span></li>
</ul>
<div class="row w100">
<div class="col w49">
<ul>
<li><i class="fa fa-envelope-o"></i> privé : <a href="mailto:igor@milhit.ch" title="m'écrire" itemprop="email">igor@milhit.ch</a></li>
<li><i class="fa fa-home"></i> : Ch. des Clochettes 16, 1206 Genève [<i class="fa fa-map-marker"></i> <a href="http://osm.org/go/0CFtAk9Rb?m=" title="Situation sur OpenStreetMap">carte</a>]</li>
<li><i class="fa fa-mobile"></i> : <a href="tel:+41765528059">+41 76 552 80 59</a></li>
<li><i class="fa fa-key"></i> publique : <a href="igor-milhit.asc" title="ma clé publique">igor-milhit-pub.asc</a></li>
<li>empreinte : <code>9347 2713 B56F 31D4 724A 8972 3E9D 7C16 05E4 0FCD</code></li>
</ul>
</div>
<div class="col w2 gut"></div>
<div class="col w49">
<ul>
<li><i class="fa fa-envelope"></i> prof. : <a href="mailto:igor.milhit@hesge.ch" title="m'écrire sur mon e-mail professionnel" itemprop="email">igor.milhit@hesge.ch</a></li>
<li><i class="fa fa-building"></i> : Rue de la Tambourine 17, 1227 Carouge [<i class="fa fa-map-marker"></i> <a href="http://osm.org/go/0CFm8oMak--?m=" title="Situation sur OpenStreetMap">carte</a>]</li>
<li><i class="fa fa-phone"></i> : <a href="tel:+41223881790">+41 22 388 17 90</a>
<li><i class="fa fa-eye"></i> veille : <a href="https://id-libre.org/shaarli/?searchtags=ID" title="mon site de social-bookmarking">id-libre.org/shaarli</a></li>
<li><i class="fa fa-file-pdf-o"></i> CV : <a href="cv-igor-milhit.pdf" title="Mon CV, en format PDF, mis à jour">cv-igor-milhit.pdf</a></li>
</ul>
</div>
</div>
<div class="six columns" id="prof">
<ul>
<li><i class="fa fa-envelope"></i> prof. : <a href="mailto:igor.milhit@hesge.ch" title="m'écrire sur mon e-mail professionnel" itemprop="email">igor.milhit@hesge.ch</a></li>
<li><i class="fa fa-building"></i> : Rue de la Tambourine 17, 1227 Carouge [<i class="fa fa-map-marker"></i> <a href="http://osm.org/go/0CFm8oMak--?m=" title="Situation sur OpenStreetMap">carte</a>]</li>
<li><i class="fa fa-phone"></i> : <a href="tel:+41223881790">+41 22 388 17 90</a>
<li><i class="fa fa-eye"></i> veille : <a href="https://id-libre.org/shaarli/?searchtags=ID" title="mon site de social-bookmarking">id-libre.org/shaarli</a></li>
<li><i class="fa fa-file-pdf-o"></i> CV : <a href="cv-igor-milhit.pdf" title="Mon CV, en format PDF, mis à jour">cv-igor-milhit.pdf</a></li>
</ul>
</div>
</section>
</div>
<div class="container">
<section id="qui">
<section id="qui" class="main center">
<h2>Qui suis-je ?</h2>
<p>Vieux comme la <a href="https://fr.wikipedia.org/wiki/Premier_choc_pétrolier" title="Article Wikipedia sur le Premier choc pétrolier">crise du pétrole</a>, je suis né entre des <a href="https://inventaire.io/inventory/igor" title="Mon compte Inventaire.io">livres</a>, des taches dencre et quelques <a href="https://www.discogs.com/fr/user/ignami/collection?sort=artist&amp;sort_order=asc" title="Mon compte Discogs">vinyles</a>. Les noyaux des centrales nucléaires se sont <a href="https://fr.wikipedia.org/wiki/Fusion_du_c%C5%93ur_d&#39;un_r%C3%A9acteur_nucl%C3%A9aire#Cas_r.C3.A9els" title="Section Cas réels de l'article Wikipedia sur la Fusion du co&oelig;ur d'un réacteur nucléaire">mises à fusionner</a>, les empires daprès les empires <a href="https://fr.wikipedia.org/wiki/Union_des_r%C3%A9publiques_socialistes_sovi%C3%A9tiques#Derni.C3.A8res_ann.C3.A9es_de_l.27URSS_.281985-1991.29" title="Section Dernières années de l'URSS de l'article Wikipedia sur l'URSS">sécroulèrent</a> et sécroulent encore, et à la croissance des montagnes de papiers sajoute la croissance des montagnes de déchets électroniques. Au milieu de cette dématérialisation joyeuse, jobserve les <a href="https://id-libre.org/blogigor/" title="blogiGor : traces éphémères">traces éphémères</a> de mon cheminement chaotique.</p>
</section>
<section id="que">
<section id="que" class="main center">
<h2>Que fais-je ?</h2>
<p>De profession, je suis <em><span itemprop="jobTitle">spécialiste HES en information documentaire</span></em>. En clair, si tu as besoin de pouvoir compter sur une information de qualité, <em>just in time</em>, pourtant noyée dans la surabondance des flux contemporains, alors je suis en mesure de te satisfaire. Depuis septembre 2013, je suis assistant HES d'enseignement à la <a href="http://hesge.ch/heg/" title="site web de la Haute école de gestion de Genève" itemprop="worksFor"><span itemprop="worksFor">Haute école de gestion de Genève</span></a>, au sein de la filière où j'ai obtenu mon diplôme.</p>
@ -79,42 +72,36 @@
<p>Cet attrait pour l'informatique libre m'a poussé dans l'aventure de l'<a href="https://fr.wikipedia.org/wiki/Auto-hébergement_(Internet)" title="article 'auto-hebergement' sur Wikipedia en français">auto-hébergement</a> : <a href="http://id-libre.org" title="id-libre.org">id-libre</a>. L'administration d'un serveur me permet de pousser plus loin ma compréhension des fonctionnements du Web et m'initie peu à peu à la sécurité d'un système d'information.</p>
</section>
</div>
<div class="container">
<h2 id="online">Ailleurs, en ligne</h2>
<section class="row">
<div class="one-third column">
<ul>
<li><a href="https://fr.wikipedia.org/wiki/Utilisateur:IGor.avoi" title="Mon compte Wikipédia"><i class="fa fa-wikipedia-w"></i></a></li>
<li><a href="https://www.openstreetmap.org/user/iGormilhit" title="Mon compte OpenStreetMap"><i class="fa fa-map-o"></i></a></li>
<li><a href="https://keybase.io/1g0r" title="Mon profil Keybase"><i class="fa fa-key"></i></a></li>
</ul>
<section id="online" class="main center">
<h2>Ailleurs, en ligne</h2>
<div class="row w100">
<div class="col w30">
<ul>
<li><a href="https://fr.wikipedia.org/wiki/Utilisateur:IGor.avoi" title="Mon compte Wikipédia"><i class="fa fa-wikipedia-w"></i></a></li>
<li><a href="https://www.openstreetmap.org/user/iGormilhit" title="Mon compte OpenStreetMap"><i class="fa fa-map-o"></i></a></li>
<li><a href="https://keybase.io/1g0r" title="Mon profil Keybase"><i class="fa fa-key"></i></a></li>
</ul>
</div>
<div class="col w5 gut"></div>
<div class="col w30">
<ul>
<li><a href="https://status.vinilox.eu/1g0r/all" title="Mon compte GnuSocial"><i class="fa fa-twitter"></i></a></li>
<li><a href="https://github.com/iGormilhit" title="Mon compte Github"><i class="fa fa-github"></i></a></li>
<li><i class="fa fa-btc"></i><code> 1KKmsg9CkFtbREf1sLEirJbsqJGTqJpStoi</code></li>
</ul>
</div>
<div class="col w5 gut"></div>
<div class="col w30">
<ul>
<li><a href="https://inventaire.io/inventory/igor" title="Mon compte Inventaire.io"><i class="fa fa-book"></i></a></li>
<li><a href="https://www.discogs.com/user/ignami/collection" title="Mon compte Discogs"><i class="fa fa-music"></i></a></li>
</ul>
</div>
</div>
<div class="one-third column">
<ul>
<li><a href="https://status.vinilox.eu/1g0r/all" title="Mon compte GnuSocial"><i class="fa fa-twitter"></i></a></li>
<li><a href="https://github.com/iGormilhit" title="Mon compte Github"><i class="fa fa-github"></i></a></li>
<li><i class="fa fa-btc"></i><code> 1KKmsg9CkFtbREf1sLEirJbsqJGTqJpStoi</code></li>
</ul>
</div>
<div class="one-third column">
<ul>
<li><a href="https://inventaire.io/inventory/igor" title="Mon compte Inventaire.io"><i class="fa fa-book"></i></a></li>
<li><a href="https://www.discogs.com/user/ignami/collection" title="Mon compte Discogs"><i class="fa fa-music"></i></a></li>
</ul>
</div>
</section>
</div>
</div>
</body>
</html>