phundrak/phundrak-com
1
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity

now it looks like something

Browse Source
This commit is contained in:
Phuntsok Drak-pa 2019-02-10 17:07:46 +01:00
parent 560ba8f018
commit b502ab2216
No known key found for this signature in database
GPG Key ID: 9CB34B6827C66D22
2 changed files with 374 additions and 86 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

249
index.html
View File

@ -19,8 +19,18 @@
<body>
<div class="ribbon">
<div>
<div class="header-container">
<h1>Lucien Cartier-Tilet</h1>
<div class="highlight-h1"></div>
</div>
</div>
<div>
<div class="header-container">
<h2>Étudiant Informatique</h2>
<div class="highlight-h2"></div>
</div>
</div>
<ul class="ribbon-links">
<li><a href="#cont-xp">Expérience</a></li>
<li><a href="#cont-skills">Compétences</a></li>
@ -32,24 +42,45 @@
<div class="sidebar">
<img class="side-picture center" src="https://cdn.phundrak.fr/img/photo.jpg" />
<div class="side-card">
<div>
<div class="header-container">
<h4>Contact</h4>
<div class="highlight-h4"></div>
</div>
</div>
<div class="side-content">
<a href="mailto:phundrak@phundrak.fr">phundrak@phundrak.fr</a>
<p>+33.(0)6.83.90.56.89</p>
</div>
</div>
<div class="side-card">
<h4>Situation Professionnelle</h4>
<div>
<div class="header-container">
<h4>Situation Pro</h4>
<div class="highlight-h4"></div>
</div>
</div>
<p class="side-content">Étudiant, tuteur</p>
<p class="side-content">Ouvert aux opportunités</p>
</div>
<div class="side-card">
<div>
<div class="header-container">
<h4>Présentation</h4>
<div class="highlight-h4"></div>
</div>
</div>
<p class="side-content">Actuellement étudiant depuis Septembre 2016 en licence d’informatique à l’Université Vincennes Saint-Denis (Paris VIII), je fût également directeur technique et développeur de voix de synthèse chez VoxWave de Septembre 2012 à Juillet 2018.</p>
<p class="side-content">Mes centres d’intérêt sont variés, allant de la programmation à l’audio en passant par la linguistique ; je parle par ailleurs courrament en anglais en plus du français (ma langue maternelle).</p>
</div>
<div class="side-card">
<div>
<div class="header-container">
<h4>Mes liens</h4>
<ul>
<div class="highlight-h4"></div>
</div>
</div>
<ul class="side-links">
<li><a href="https://labs.phundrak.fr/phundrak">GitLab</a></li>
<li><a href="https://github.com/phundrak">Github</a></li>
<li><a href="https://langue.phundrak.fr/">Site de linguistique</a></li>
@ -57,18 +88,29 @@
<li><a href="https://youtube.com/phundrak">YouTube</a></li>
<li><a href="https://instagram.com/phundrak">Instagram</a></li>
</ul>
<br/>
</div>
</div>
<div class="content">
<div id="cont-xp">
<div class="xp">
<div id="cont-xp" class="card">
<div>
<div class="header-container">
<h3>Expériences Professionnelles</h3>
<ul>
<div class="highlight-h3"></div>
</div>
</div>
<ul class="card card-lvl2">
<li class="list-lvl1">
<h5>Directeur Technique, Développeur</h5>
<div>
<div class="header-container">
<h4>Directeur Technique, Développeur</h4>
<div class="highlight-h4"></div>
</div>
</div>
<p>VoxWave</p>
<p>Septembre 2012 à Juillet 2018</p>
<ul>
<ul class="two-col-ul">
<li>Programmation de voix de synthèse</li>
<li>Recherches linguistiques</li>
<li>Support utilisateur</li>
@ -77,12 +119,24 @@
</li>
</ul>
</div>
</div>
<div id="cont-skills" class="card">
<div>
<div class="header-container">
<h3>Compétences</h3>
<ul>
<div class="highlight-h3"></div>
</div>
</div>
<ul class="card card-lvl2">
<li class="list-lvl1" id="skills-cs">
<div>
<div class="header-container">
<h4>Informatique</h4>
<div class="highlight-h4"></div>
</div>
</div>
<ul>
<li>
<p class="skill-name">Programmation</p>
@ -92,7 +146,7 @@
</li>
<li>
<p class="skill-name">Outils de développement</p>
<ul class="skill-list">
<ul class="skill-list two-col-ul">
<li>Emacs</li>
<li>Git</li>
<li>JetBrains CLion</li>
@ -106,19 +160,21 @@
</li>
<li>
<p class="skill-name">Systèmes d’exploitation</p>
<ul class="skill-list">
<ul class="skill-list two-col-ul">
<li>GNU/Linux (Arch Linux, Debian, Ubuntu)</li>
<li>Microsoft Windows XP/7/8.1/10</li>
</ul>
</li>
<li>
<p class="skill-name">Synthèse vocale</p>
<p class="skill-description">Développement de banques vocales pour VOCALOID3, Alter/Ego, Chipspeech, UTAU</p>
<p class="skill-description">Utilisation de VOCALOID2/3/4, Alter/Ego, Chipspeech, UTAU, CeVIO Creative Studio</p>
<ul class="skill-list two-col-ul">
<li>Développement de banques vocales pour VOCALOID3, Alter/Ego, Chipspeech, UTAU</li>
<li>Utilisation de VOCALOID2/3/4, Alter/Ego, Chipspeech, UTAU, CeVIO Creative Studio</li>
</ul>
</li>
<li>
<p class="skill-name">Son</p>
<ul class="skill-list">
<ul class="skill-list two-col-ul">
<li>FL Studio</li>
<li>iZotope RX 4/5/6</li>
<li>T-RackS CS</li>
@ -137,8 +193,14 @@
</ul>
</li>
<li class="list-lvl1" id="skills-lang">
<div>
<div class="header-container">
<h4>Langues Parlées</h4>
<ul>
<div class="highlight-h4"></div>
</div>
</div>
<ul class="two-col-ul">
<li>
<h5>Français</h5>
<p>Langue maternelle</p>
@ -154,52 +216,93 @@
</ul>
</li>
<li class="list-lvl1" id="skills-other">
<div>
<div class="header-container">
<h4>Autres</h4>
<div class="highlight-h4"></div>
</div>
</div>
<ul>
<li>
<h5>Linguistique</h5>
<p>Connaissances des concepts grammaticaux, de morphologie, de syntaxe et de phonétique</p>
<p>Connaissances des concepts grammaticaux, de morphologie, de syntaxe et de phonétique.</p>
</li>
<li>
<h5>Création de langues</h5>
<p>Des exemples peuvent être trouvés <a href="https://langue.phundrak.fr">sur mon site de linguistique</a></p>
<p>Des exemples peuvent être trouvés <a href="https://langue.phundrak.fr">sur mon site de linguistique</a>.</p>
</li>
<li>
<h5>Création d’univers fictifs</h5>
<p>Création d’un univers fictif complexe pour mon roman en cours d’écriture</p>
<p>Création d’un univers fictif complexe pour mon roman en cours d’écriture.</p>
</li>
</ul>
</li>
</ul>
</div>
<div id="cont-training">
<div id="cont-training" class="card">
<div>
<div class="header-container">
<h3>Formations</h3>
<ul>
<div class="highlight-h3"></div>
</div>
</div>
<ul class="card card-lvl2">
<li class="list-lvl1">
<h5>Licence d’Informatique</h5>
<div>
<div class="header-container">
<h4>Licence d’Informatique</h4>
<div class="highlight-h4"></div>
</div>
</div>
<p>Université Vincennes-Saint-Denis (Paris VIII)</p>
<p>Depuis Septembre 2016</p>
<p class="train-description">Formation en programmation et sciences de l’informatique</p>
</li>
<li class="list-lvl1">
<h5>Anglais LLCE</h5>
<div>
<div class="header-container">
<h4>Anglais LLCE</h4>
<div class="highlight-h4"></div>
</div>
</div>
<p>Université Lumière Lyon 2</p>
<p>Septembre 2013 à Mai 2015</p>
<p class="train-description">Formation d’Anglais en fillière Langue, Littérature et Civilisations Étrangères (LLCE)</p>
</li>
<li class="list-lvl1">
<h5>Baccalauréat</h5>
<div>
<div class="header-container">
<h4>Baccalauréat</h4>
<div class="highlight-h4"></div>
</div>
</div>
<p>Lycée de la Plaine de l’Ain</p>
<p>Septembre 2010 à Juillet 2013</p>
<p class="train-description">Baccalauréat série Scientifique spécialisation Sciences de l’Ingénieur, mention bien</p>
</li>
</ul>
</div>
<div id="cont-hobbies">
<div id="cont-hobbies" class="card">
<div>
<div class="header-container">
<h3>Loisirs</h3>
<ul>
<div class="highlight-h3"></div>
</div>
</div>
<ul class="card card-lvl2">
<li class="list-lvl1">
<h5>Écriture</h5>
<div>
<div class="header-container">
<h4>Écriture</h4>
<div class="highlight-h4"></div>
</div>
</div>
<ul>
<li>Écriture de roman, de nouvelles et de scénarios de jeux de rôles</li>
<li>Constructions d’univers fictifs</li>
@ -207,14 +310,26 @@
</ul>
</li class="list-lvl1">
<li class="list-lvl1">
<h5>Musique</h5>
<div>
<div class="header-container">
<h4>Musique</h4>
<div class="highlight-h4"></div>
</div>
</div>
<ul>
<li>Utilisation de voix de synthèse</li>
<li>Mixage et mastering audio</li>
</ul>
</li>
<li class="list-lvl1">
<h5>Lectures</h5>
<div>
<div class="header-container">
<h4>Lectures</h4>
<div class="highlight-h4"></div>
</div>
</div>
<ul>
<li>Livres de programmation (actuellement <i>Clean Code</i> par Robert C. Martin)</li>
<li>Livres de linguistique (principalement par Mark Rosenfelder)</li>
@ -222,7 +337,13 @@
</ul>
</li>
<li class="list-lvl1">
<h5>Jeux</h5>
<div>
<div class="header-container">
<h4>Jeux</h4>
<div class="highlight-h4"></div>
</div>
</div>
<ul>
<li>RPG (série des Elder Scrolls, ...)</li>
<li>RTS (Hearts of Iron IV)</li>
@ -231,38 +352,80 @@
</li>
</ul>
</div>
<div id="cont-portfolio">
<div id="cont-portfolio" class="card">
<div>
<div class="header-container">
<h3>Portfolio</h3>
<ul>
<div class="highlight-h3"></div>
</div>
</div>
<ul class="card card-lvl2">
<li class="list-lvl1">
<a class="port-proj-link" href="https://dict.phundrak.fr/">ConlangDict</a>
<a class="port-proj-src" href="https://labs.phundrak.fr/phundrak/dictionary-conlangs">source</a>
<div>
<div class="header-container">
<h4>ConlangDict</h4>
<div class="highlight-h4"></div>
</div>
</div>
<p>Dictionnaire bilingue en ligne entre langues naturelles et langues construites, le serveur est codé en Python basé sur Django&nbsp;2.</p>
<a class="port-proj-link" href="https://dict.phundrak.fr/">(lien)</a>
<a class="port-proj-src" href="https://labs.phundrak.fr/phundrak/dictionary-conlangs">(source)</a>
</li>
<li class="list-lvl1">
<a class="port-proj-link" href="https://langue.phundrak.fr/">Langues Construites de P’undrak</a>
<a class="port-proj-src" href="https://labs.phundrak.fr/phundrak/langue-phundrak-fr">source</a>
<div>
<div class="header-container">
<h4>Langues Construites de P’undrak</h4>
<div class="highlight-h4"></div>
</div>
</div>
<p>Site web de linguistique contenant mes fichiers de travail sur mes langues construites. Écrit en org-mode, exporté en HTML et PDF via Emacs.</p>
<a class="port-proj-link" href="https://langue.phundrak.fr/">(lien)</a>
<a class="port-proj-src" href="https://labs.phundrak.fr/phundrak/langue-phundrak-fr">(source)</a>
</li>
<li class="list-lvl1">
<a class="port-proj-link" href="https://phundrak.fr/git">Tutoriel sarcastique sur Git</a>
<a class="port-proj-src" href="https://github.com/Phundrak/tutoriel-git">source</a>
<div>
<div class="header-container">
<h4>Tutoriel sarcastique sur Git</h4>
<div class="highlight-h4"></div>
</div>
</div>
<p>Tutoriel sarcastique sur Git, écrit pour débutants souhaitant démarrer avec une utilisation de Git pour gérer leurs projets. Écrit en org-mode, exporté en HTML et PDF via Emacs.</p>
<a class="port-proj-link" href="https://phundrak.fr/git">(lien)</a>
<a class="port-proj-src" href="https://github.com/Phundrak/tutoriel-git">(source)</a>
</li>
<li class="list-lvl1">
<a class="port-proj-link" href="https://labs.phundrak.fr/phundrak/chat-reseau-p8">Chat en réseau</a>
<a class="port-proj-src" href="https://labs.phundrak.fr/phundrak/chat-reseau-p8">source</a>
<div>
<div class="header-container">
<h4>Chat en réseau</h4>
<div class="highlight-h4"></div>
</div>
</div>
<p>Projet d’université de chat en ligne se lançant dans un terminal. Écrit en Rust.</p>
<a class="port-proj-link" href="https://labs.phundrak.fr/phundrak/chat-reseau-p8">(lien)</a>
<a class="port-proj-src" href="https://labs.phundrak.fr/phundrak/chat-reseau-p8">(source)</a>
</li>
<li class="list-lvl1">
<a class="port-proj-link" href="http://gl4d.api8.fr/FR/">GL4Dummies</a>
<a class="port-proj-src" href="https://github.com/noalien/GL4Dummies">source</a>
<div>
<div class="header-container">
<h4>GL4Dummies</h4>
<div class="highlight-h4"></div>
</div>
</div>
<p>Participation au développement de GL4Dummies, un framework en C pour faciliter le développement en C avec OpenGL pour débutants en programmation graphique 2D et 3D.</p>
<a class="port-proj-link" href="http://gl4d.api8.fr/FR/">(lien)</a>
<a class="port-proj-src" href="https://github.com/noalien/GL4Dummies">(source)</a>
</li>
<li class="list-lvl1">
<a class="port-proj-link" href="https://github.com/GitSquared/edex-ui">eDEX UI</a>
<a class="port-proj-src" href="https://github.com/GitSquared/edex-ui">source</a>
<div>
<div class="header-container">
<h4>eDEX UI</h4>
<div class="highlight-h4"></div>
</div>
</div>
<p>Participation au développement d’eDEX UI, une interface desktop futuristique.</p>
<a class="port-proj-link" href="https://github.com/GitSquared/edex-ui">(lien)</a>
<a class="port-proj-src" href="https://github.com/GitSquared/edex-ui">(source)</a>
</li>
</ul>
</div>

165
style/main.css
View File

@ -1,3 +1,6 @@
@import url('https://fonts.googleapis.com/css?family=Fira+Sans&subset=cyrillic,cyrillic-ext,greek,greek-ext,latin-ext,vietnamese');
@import url('https://fonts.googleapis.com/css?family=Alfa+Slab+One&subset=latin-ext,vietnamese');
body {
display: grid;
grid-template-areas:
@ -8,14 +11,28 @@ body {
a {
text-decoration: none;
color: #2c3e50;
text-decoration: none;
font-style: italic;
border-bottom: 5px solid #2c3e50;
transition: color 0.2s, border-bottom-color 0.2s;
}
a:hover {
text-decoration: underline;
color: #8e44ad;
border-bottom-color: #8e44ad;
transition: color 0.4s, border-bottom-color 0.4s;
}
.sidebar, .content {
/* margin: 10px; */
h1,
h2 {
margin: 0;
padding: 0 20px;
}
.sidebar,
.content {
padding: 10px;
background-color: #bdc3c7;
color: black;
@ -27,30 +44,20 @@ a:hover {
margin-right: auto;
}
.list-lvl1, .list-lvl1 a {
background-color: #34495e;
color: #ecf0f1;
}
/* ribbon ********************************************************************/
.ribbon {
grid-area: ribbon;
padding: 0;
margin: 0;
/* background: #2c3e50; */
background-color: #2c3e50;
}
.ribbon, .ribbon a {
.ribbon,
.ribbon a {
color: #ecf0f1;
}
h1, h2 {
margin: 0;
padding: 0 20px;
}
.ribbon-links {
display: table;
list-style-type: none;
@ -60,6 +67,7 @@ h1, h2 {
width: 100%;
white-space: nowrap;
}
.ribbon-links li {
display: table-cell;
float: left;
@ -75,7 +83,7 @@ h1, h2 {
.sidebar {
grid-area: sidebar;
margin: 10px 5px 10px 0;
margin: 10px 5px 10px 10px;
width: 300px;
}
@ -88,7 +96,8 @@ h1, h2 {
background-color: #ecf0f1;
}
.side-card h4, .side-content {
.side-card h4,
.side-content {
padding: 10px 1em;
margin: 0;
}
@ -97,15 +106,131 @@ p.side-content {
padding: 0.5em 1em;
}
.side-links {
line-height: 1.5em;
}
/* content *******************************************************************/
.content {
grid-area: content;
margin: 10px 0 10px 5px;
margin: 10px 10px 10px 5px;
}
.content div {
.card {
background-color: #ecf0f1;
padding: 10px;
margin: 10px;
margin: 40px 10px;
box-shadow: 3px 3px 6px rgba(0, 0, 0, 0.7);
transition: box-shadow 0.2s;
}
.card:hover {
box-shadow: 8px 8px 15px rgba(0, 0, 0, 0.7);
transition: box-shadow 0.3s;
}
.card-lvl2 {
margin: 10px 10px 20px 20px;
padding-left: 0;
background-color: #bdc3c7;
}
.list-lvl1,
.list-lvl1 a {
background-color: #bdc3c7;
list-style: none;
}
.list-lvl1 {
padding: 10px;
}
.list-lvl1 h4 {
margin-block-start: 0.5em;
margin-block-end: 1em;
}
.two-col-ul {
collumns: 2;
-webkit-columns: 2;
-moz-columns: 2;
}
/* highlights ****************************************************************/
h1,h2,h3,h4,h5 {
font-family: 'Alfa Slab One', serif;
font-weight: 300;
margin: 0;
z-index: 20;
position: relative;
}
h1 {
font-size: 4em;
}
h2 {
font-size: 3em;
}
h3 {
font-size: 2em;
}
h4 {
font-size: 1.2em;
}
.header-container {
display: inline-block;
}
.highlight-h1, .highlight-h2, .highlight-h3, .highlight-h4, .highlight-h5 {
position: relative;
left: -10px;
width: 120%;
max-width: 90vw;
z-index: 10;
}
.highlight-h1 {
background-color: #1abc9c !important;
height: 48px;
top: -48px;
}
.highlight-h2 {
background-color: #f1c40f !important;
height: 34px;
top: -34px;
}
.highlight-h3 {
background-color: #2ecc71 !important;
height: 24px;
top: -24px;
}
.highlight-h4 {
background-color: #e67e22 !important;
height: 24px;
top: -26px;
left: 0;
width: 110%;
}
.list-lvl1 .highlight-h4 {
background-color: #e67e22 !important;
height: 24px;
top: -34px;
left: 0;
left: -10px;
width: 120%;
}
.highlight-h5 {
background-color: #9b59b6 !important;
height: 12px;
top: -12px;
}