ne02ptzero.me

my old website
Log | Files | Refs | LICENSE | git clone https://git.ne02ptzero.me/git/ne02ptzero.me

commit ceeb0a581fc92ce9c284e14a9f27d3e9f4f162f1
parent b2c3d12d610333d17bb78724fa20224c196dc6ef
Author: Louis Solofrizzo <ne02ptzero@debian>
Date:   Thu, 10 Jul 2014 21:23:08 +0200

Some change

Diffstat:
Aimg/emma.png | 0
Aimg/msh.png | 0
Aimg/sophie.png | 0
Mindex.html | 100++++++++++++++++++++++++++++++++++---------------------------------------------
Ajs/script.js | 21+++++++++++++++++++++
Astyle/style.css | 92+++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++
6 files changed, 156 insertions(+), 57 deletions(-)

diff --git a/img/emma.png b/img/emma.png Binary files differ. diff --git a/img/msh.png b/img/msh.png Binary files differ. diff --git a/img/sophie.png b/img/sophie.png Binary files differ. diff --git a/index.html b/index.html @@ -1,66 +1,52 @@ <!DOCTYPE HTML> <html lang="en"> <head> - <link href='http://fonts.googleapis.com/css?family=Open+Sans:300' rel='stylesheet' type='text/css'> - <link href="//maxcdn.bootstrapcdn.com/font-awesome/4.1.0/css/font-awesome.min.css" rel="stylesheet"> - <meta name="viewport" content="width=device-width, initial-scale=1.0, minimal-ui"> - <script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script> - <title>Louis</title> - <style> - html { - text-align: center; - background: #1E1E20; - color: rgba(222, 209, 169, 1); - font-family: 'Open Sans', sans-serif; - font-size: 1.3em; - } + <!-- CSS Declaration --> + <link href='http://fonts.googleapis.com/css?family=Open+Sans:300' rel='stylesheet' type='text/css'> + <link href="//maxcdn.bootstrapcdn.com/font-awesome/4.1.0/css/font-awesome.min.css" rel="stylesheet"> + <link href="style/style.css" rel="stylesheet"> - body { - display: none; - } + <!-- JS import --> + <script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script> + <script src="js/script.js"></script> - h1 { - margin-top: 10%; - font-size: 3em; - } - - a { - text-decoration: none; - color: #374140; - transition-property: all; - transition-duration: 0.3s; - } - - a:hover { - color: #DC3522; - } - - a i { - font-size: 2em; - margin-right: 2%; - } - - .mail-t i { - margin-right: 0.5%; - color: #046380; - } - - .mail-t { - color: #EFECCA; - } - </style> + <!-- META Declaration --> + <meta name="viewport" content="width=device-width, initial-scale=1.0, minimal-ui"> + <meta charset="utf-8"> + <title>Louis</title> </head> <body> - <h1>Hello,</h1> - <p>My name is Louis Solofrizzo, and i am a developer.<br />See my work below !</p> - <a href="http://github.com/ne02ptzero/"><i class='fa fa-github'></i></a> - <a href="http://facebook.com/ne02ptzero/"><i class='fa fa-facebook'></i></a> - <a href="http://twitter/ne02ptzero"><i class='fa fa-twitter'></i></a> - <br /> - <br /> - <a class='mail-t' href="mailto:louis@ne02ptzero.me">louis@ne02ptzero.me</a> + <div id="home"> + <h1>Hi !</h1> + <i class='fa fa-chevron-down' onclick="moveto('#content')"></i> + </div> + <div id="content"> + <p>My name is Louis Solofrizzo, and i am a developer.<br />See my works below !</p> + <div class='img'> + <img src="img/emma.png"> + <div class='p'><p>Emma & ChloƩ is a website selling jewelry box online.<br /> + This site is based on Magento.<br /><a href="http://emma-chloe.com/">Here</a></p></div> + <span class='num'>1</span> + </div> + <div class='hr'></div> + <div class='img'> + <img src="img/sophie.png"> + <div class='p'><p>A personnal website for a designer.<br /><a href="sophiebattin.fr">Here</a></p></div> + <span class='num'>2</span> + </div> + <div class='hr'></div> + <div class='img'> + <img src="img/msh.png"> + <div class='p'><p> MSH (MiSHell) is a very user friendly shell,<br /> w/ cool command coloration (fish-like).<br /><a href="http://github.com/Ne02ptzero/msh">Here</a></p></div> + </div> + <br /> + <a href="http://github.com/ne02ptzero/"><i class='fa fa-github'></i></a> + <a href="http://facebook.com/ne02ptzero/"><i class='fa fa-facebook'></i></a> + <a href="http://twitter/ne02ptzero"><i class='fa fa-twitter'></i></a> + <a href="https://www.linkedin.com/profile/view?id=340936531"><i class='fa fa-linkedin'></i></a> + <br /> + <br /> + <a class='mail-t' href="mailto:louis@ne02ptzero.me">louis@ne02ptzero.me</a> + </div> </body> - <script> - $("body").fadeIn(800); - </script> </html> diff --git a/js/script.js b/js/script.js @@ -0,0 +1,21 @@ +var g_actual = 0; +var g_numActual = 0; + +function moveto(argument) { + $('html,body').animate({scrollTop: $(argument).offset().top}, 'slow'); +} + +$(document).ready(function() { + $("body").fadeIn(800, function() { + $("#home i").slideDown(400); + }); + + $(".img").on('mouseover', function() { + if (g_numActual != $(this).find('span').html()) { + $(g_actual).find('.p').hide(200); + $(this).find('.p').show("fold"); + g_numActual = $(this).find('span').html(); + g_actual = $(this); + } + }) +}); diff --git a/style/style.css b/style/style.css @@ -0,0 +1,92 @@ +html { + text-align: center; +background: #1E1E20; +color: rgba(222, 209, 169, 1); + font-family: 'Open Sans', sans-serif; + font-size: 1.3em; +} + +body { +display: none; +} + +html, body { + height: 100%; + width: 100%; + margin: 0; + padding: 0; +} + +h1 { + margin-top: 15%; + font-size: 3.5em; +} + +a { + text-decoration: none; +color: #374140; + transition-property: all; + transition-duration: 0.3s; +} + +a:hover { +color: #DC3522; + } + +a i { + font-size: 2em; + margin-right: 2%; +} + +.mail-t i { + margin-right: 0.2%; + margin-left: 0.2%; +color: #046380; +} + +.mail-t { +color: #EFECCA; +} + +#home , #content { + height: 100%; +} + +#home i { + margin-top: 15%; + font-size: 2em; + display: none; +} + +#content { + padding-top: 2%; +} + +.img { + height: 20%; +} + +.img img { + max-height: 100%; + width: auto; +} + +.img .p { + margin-right: 5%; + float: right; + max-height: 100%; + width: 30%; + display: none; +} + +.num { + display: none; +} + +.hr { + border-bottom: 1px solid rgba(57, 57, 56, 1); + margin-left: 45%; + margin-right: 45%; + margin-top: 1%; + margin-top: 1%; +}