You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

index.html 12KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397
  1. <!DOCTYPE html>
  2. <html lang="en">
  3. <head>
  4. <meta charset="utf-8">
  5. <meta name="viewport" content="width=device-width, initial-scale=1.0">
  6. <meta name="description" content="Robin Thoni resume cv">
  7. <meta name="author" content="Robin Thoni">
  8. <title>Robin Thoni - Resume</title>
  9. <!-- Bootstrap core CSS -->
  10. <link href="assets/css/bootstrap.css" rel="stylesheet">
  11. <!-- Custom styles for this template -->
  12. <link href="assets/css/main.css" rel="stylesheet">
  13. <link rel="stylesheet" href="assets/css/font-awesome.min.css">
  14. <link href='http://fonts.googleapis.com/css?family=Lato:300,400,700,300italic,400italic' rel='stylesheet' type='text/css'>
  15. <link href='http://fonts.googleapis.com/css?family=Raleway:400,300,700' rel='stylesheet' type='text/css'>
  16. <script src="assets/js/jquery.min.js"></script>
  17. <script type="text/javascript" src="assets/js/smoothscroll.js"></script>
  18. <script src="assets/js/Chart.js"></script>
  19. <!-- HTML5 shim and Respond.js IE8 support of HTML5 elements and media queries -->
  20. <!--[if lt IE 9]>
  21. <script src="assets/js/html5shiv.js"></script>
  22. <script src="assets/js/respond.min.js"></script>
  23. <![endif]-->
  24. </head>
  25. <body data-spy="scroll" data-offset="0" data-target="#nav">
  26. <div id="section-topbar">
  27. <div id="topbar-inner">
  28. <div class="container">
  29. <div class="row">
  30. <div class="dropdown">
  31. <ul id="nav" class="nav">
  32. <li class="menu-item"><a class="smoothScroll" href="#about" title="About"><i class="icon-user"></i></a></li>
  33. <li class="menu-item"><a class="smoothScroll" href="#resume" title="Resume"><i class="icon-file"></i></a></li>
  34. <li class="menu-item"><a class="smoothScroll" href="#work" title="Works"><i class="icon-briefcase"></i></a></li>
  35. <li class="menu-item"><a class="smoothScroll" href="#contact" title="Contact"><i class="icon-envelope"></i></a></li>
  36. </ul><!--/ uL#nav -->
  37. </div><!-- /.dropdown -->
  38. <div class="clear"></div>
  39. </div><!--/.row -->
  40. </div><!--/.container -->
  41. <div class="clear"></div>
  42. </div><!--/ #topbar-inner -->
  43. </div><!--/ #section-topbar -->
  44. <section id="about" name="about"></section>
  45. <div id="intro">
  46. <div class="container">
  47. <div class="row centered">
  48. <div class="col-lg-12">
  49. <p>
  50. <h1>Robin Thoni</h1>
  51. <h3>IT Engineer | robin@rthoni.com</h3>
  52. </p>
  53. </div><!--/.col-lg-12 -->
  54. </div><!--/.row -->
  55. <div class="row">
  56. <div class="col-lg-2 col-lg-offset-1">
  57. <h5>ABOUT</h5>
  58. </div>
  59. <div class="col-lg-6">
  60. <p>
  61. I'm an IT engineer with a one year professionnal experience in the innovation laboratory of EPITA (3ie).
  62. I love IT, sys admin and development in a lot of languages. Due to my long internship, I have a
  63. preference for web technologies, both frontend and backend. I also have pretty good skills in desktop developments.
  64. </p>
  65. </div>
  66. <div class="col-lg-3">
  67. <p><a href="Robin_THONI_resume.pdf"><i class="icon-file"></i> <sm>DOWNLOAD PDF</sm></a></p>
  68. </div>
  69. </div><!--/.row -->
  70. </div><!--/.container -->
  71. </div><!--/ #intro -->
  72. <section id="resume" name="resume"></section>
  73. <!--EDUCATION DESCRIPTION -->
  74. <div class="container desc">
  75. <div class="row">
  76. <div class="col-lg-2 col-lg-offset-1">
  77. <h5>EDUCATION</h5>
  78. </div>
  79. <div class="col-lg-6">
  80. <p><t>Master of Web Design</t><br/>
  81. St. Patrick University <br/>
  82. <i>3 Years Course</i>
  83. </p>
  84. </div>
  85. <div class="col-lg-3">
  86. <p><sm>GRADUATING IN MAY 2014</sm><br/>
  87. <imp><sm>IN PROGRESS</sm></imp>
  88. </p>
  89. </div>
  90. <div class="col-lg-6 col-lg-offset-3">
  91. <p><t>Degree of Web Developer</t><br/>
  92. Hastings University <br/>
  93. <i>2 Years Course</i>
  94. </p>
  95. </div>
  96. <div class="col-lg-3">
  97. <p><sm>JUNE 2012</sm></p>
  98. </div>
  99. </div><!--/.row -->
  100. <br>
  101. <hr>
  102. </div><!--/.container -->
  103. <!--WORK DESCRIPTION -->
  104. <div class="container desc">
  105. <div class="row">
  106. <div class="col-lg-2 col-lg-offset-1">
  107. <h5>WORK</h5>
  108. </div>
  109. <div class="col-lg-6">
  110. <p><t>Front-end Developer</t><br/>
  111. Black Tie Corp. <br/>
  112. </p>
  113. <p><more>Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book.</more></p>
  114. </div>
  115. <div class="col-lg-3">
  116. <p><sm>AUGUST 2012 - CURRENT</sm></p>
  117. </div>
  118. <div class="col-lg-6 col-lg-offset-3">
  119. <p><t>Web Designer - Intern</t><br/>
  120. Onassis Ltd. <br/>
  121. </p>
  122. <p><more>Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book.</more></p>
  123. </div>
  124. <div class="col-lg-3">
  125. <p><sm>JUNE 2010 - JULY 2012</sm></p>
  126. </div>
  127. </div><!--/.row -->
  128. <br>
  129. <hr>
  130. </div><!--/.container -->
  131. <!--AWARDS DESCRIPTION -->
  132. <div class="container desc">
  133. <div class="row">
  134. <div class="col-lg-2 col-lg-offset-1">
  135. <h5>AWARDS</h5>
  136. </div>
  137. <div class="col-lg-6">
  138. <p><t>Best Web Design</t><br/>
  139. Black Tie Site <br/>
  140. </p>
  141. </div>
  142. <div class="col-lg-3">
  143. <p><sm>NOVEMBER 2013</sm></p>
  144. </div>
  145. <div class="col-lg-6 col-lg-offset-3">
  146. <p><t>Designer of the Year</t><br/>
  147. Awwwards Site
  148. </p>
  149. <p><more>Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book.</more></p>
  150. </div>
  151. <div class="col-lg-3">
  152. <p><sm>2013</sm></p>
  153. </div>
  154. </div><!--/.row -->
  155. <br>
  156. </div><!--/.container -->
  157. <!--SKILLS DESCRIPTION -->
  158. <div id="skillswrap">
  159. <div class="container">
  160. <div class="row">
  161. <div class="col-lg-2 col-lg-offset-1">
  162. <h5>SKILLS</h5>
  163. </div>
  164. <div class="col-lg-3 centered">
  165. <canvas id="javascript" height="130" width="130"></canvas>
  166. <p>Javascript</p>
  167. <br>
  168. <script>
  169. var doughnutData = [
  170. {
  171. value: 70,
  172. color:"#1abc9c"
  173. },
  174. {
  175. value : 30,
  176. color : "#ecf0f1"
  177. }
  178. ];
  179. var myDoughnut = new Chart(document.getElementById("javascript").getContext("2d")).Doughnut(doughnutData);
  180. </script>
  181. </div>
  182. <div class="col-lg-3 centered">
  183. <canvas id="bootstrap" height="130" width="130"></canvas>
  184. <p>Bootstrap</p>
  185. <br>
  186. <script>
  187. var doughnutData = [
  188. {
  189. value: 90,
  190. color:"#1abc9c"
  191. },
  192. {
  193. value : 10,
  194. color : "#ecf0f1"
  195. }
  196. ];
  197. var myDoughnut = new Chart(document.getElementById("bootstrap").getContext("2d")).Doughnut(doughnutData);
  198. </script>
  199. </div>
  200. <div class="col-lg-3 centered">
  201. <canvas id="wordpress" height="130" width="130"></canvas>
  202. <p>Wordpress</p>
  203. <br>
  204. <script>
  205. var doughnutData = [
  206. {
  207. value: 65,
  208. color:"#1abc9c"
  209. },
  210. {
  211. value : 35,
  212. color : "#ecf0f1"
  213. }
  214. ];
  215. var myDoughnut = new Chart(document.getElementById("wordpress").getContext("2d")).Doughnut(doughnutData);
  216. </script>
  217. </div>
  218. <div class="col-lg-3 col-lg-offset-3 centered">
  219. <canvas id="html" height="130" width="130"></canvas>
  220. <p>HTML/CSS</p>
  221. <br>
  222. <script>
  223. var doughnutData = [
  224. {
  225. value: 80,
  226. color:"#1abc9c"
  227. },
  228. {
  229. value : 20,
  230. color : "#ecf0f1"
  231. }
  232. ];
  233. var myDoughnut = new Chart(document.getElementById("html").getContext("2d")).Doughnut(doughnutData);
  234. </script>
  235. </div>
  236. <div class="col-lg-3 centered">
  237. <canvas id="photoshop" height="130" width="130"></canvas>
  238. <p>Photoshop</p>
  239. <br>
  240. <script>
  241. var doughnutData = [
  242. {
  243. value: 70,
  244. color:"#1abc9c"
  245. },
  246. {
  247. value : 30,
  248. color : "#ecf0f1"
  249. }
  250. ];
  251. var myDoughnut = new Chart(document.getElementById("photoshop").getContext("2d")).Doughnut(doughnutData);
  252. </script>
  253. </div>
  254. <div class="col-lg-3 centered">
  255. <canvas id="illustrator" height="130" width="130"></canvas>
  256. <p>Illustrator</p>
  257. <br>
  258. <script>
  259. var doughnutData = [
  260. {
  261. value: 50,
  262. color:"#1abc9c"
  263. },
  264. {
  265. value : 50,
  266. color : "#ecf0f1"
  267. }
  268. ];
  269. var myDoughnut = new Chart(document.getElementById("illustrator").getContext("2d")).Doughnut(doughnutData);
  270. </script>
  271. </div>
  272. </div><!--/.row -->
  273. <br>
  274. </div><!--/.container -->
  275. </div><!--/ #skillswrap -->
  276. <section id="work" name="work"></section>
  277. <!--PORTFOLIO DESCRIPTION -->
  278. <div class="container desc">
  279. <div class="row">
  280. <div class="col-lg-2 col-lg-offset-1">
  281. <h5>PORTFOLIO</h5>
  282. </div>
  283. <div class="col-lg-6">
  284. <p><img class="img-responsive" src="assets/img/port01.jpg" alt=""></p>
  285. </div>
  286. <div class="col-lg-3">
  287. <p>CANALS OF ENGLAND</p>
  288. <p><more>Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book.<br/><br/>
  289. <sm><i class="icon-tag"></i> design</sm></more>
  290. </p>
  291. </div>
  292. <div class="col-lg-6 col-lg-offset-3">
  293. <p><img class="img-responsive" src="assets/img/port02.jpg" alt=""></p>
  294. </div>
  295. <div class="col-lg-3">
  296. <p>SANKEY</p>
  297. <p><more>Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book.<br/><br/>
  298. <sm><i class="icon-tag"></i> front-end</sm></more>
  299. </p>
  300. </div>
  301. <div class="col-lg-6 col-lg-offset-3">
  302. <p><img class="img-responsive" src="assets/img/port03.jpg" alt=""></p>
  303. </div>
  304. <div class="col-lg-3">
  305. <p>WE GROW</p>
  306. <p><more>Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book.<br/><br/>
  307. <sm><i class="icon-tag"></i> web design</sm></more>
  308. </p>
  309. </div>
  310. </div><!--/.row -->
  311. <br>
  312. <br>
  313. </div><!--/.container -->
  314. <section id="contact" name="contact"></section>
  315. <!--FOOTER DESCRIPTION -->
  316. <div id="footwrap">
  317. <div class="container">
  318. <div class="row">
  319. <div class="col-lg-2 col-lg-offset-1">
  320. <h5>CONTACT</h5>
  321. </div>
  322. <div class="col-lg-3">
  323. <p><t>Email</t><br/>
  324. robin@rthoni.com <br/>
  325. </p>
  326. <p><t>Address</t><br/>
  327. 3 Parvis Georges Marchais <br/>
  328. 94800 <br/>
  329. Villejuif, France <br/>
  330. </p>
  331. </div>
  332. <div class="col-lg-3">
  333. <p><t>Phone</t><br/>
  334. +33 6 23 06 39 59<br/>
  335. </p>
  336. </div>
  337. </div><!--/.row -->
  338. </div><!--/.container -->
  339. </div><!--/ #footer -->
  340. <div id="c">
  341. <div class="container">
  342. <p>Created by <a href="http://www.blacktie.co">BLACKTIE.CO</a></p>
  343. </div>
  344. </div>
  345. <!-- Bootstrap core JavaScript
  346. ================================================== -->
  347. <!-- Placed at the end of the document so the pages load faster -->
  348. <script src="assets/js/bootstrap.js"></script>
  349. </body>
  350. </html>