Skip to content
Extraits de code Groupes Projets
Vérifiée Valider 3f2f710d rédigé par salixor's avatar salixor
Parcourir les fichiers

Première version du site

parent
Aucune branche associée trouvée
Aucune étiquette associée trouvée
Aucune requête de fusion associée trouvée
Afficher les modifications d'espaces
En ligne Côte à côte
Affichage de
avec 608 ajouts et 0 suppression
403page.html 0 → 100644
+ 62
− 0
Voir le fichier @ 3f2f710d
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset=utf-8 />
<title>Oops, une erreur 403 ...</title>
<link href="https://fonts.googleapis.com/css?family=Roboto:300i" rel="stylesheet">
<link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet">
<link rel="icon" href="/ressources/favicon.ico" type="image/x-icon" />
<meta content='width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0' name='viewport' />
<meta name="theme-color" content="#333333">
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script>
<style>
* {
box-sizing: border-box;
margin: 0;
padding: 0;
text-decoration: none;
}
::selection { background-color: rgba(0,0,0,0.5); }
html {
background: #ffffff url('ressources/403.png') no-repeat center bottom fixed;
background-size: cover;
font-size: calc(1.5vw + 1.5vh);
color: #333;
font-family: 'Roboto', cursive;
text-align: right;
position: relative;
height: 100%;
}
.message {
position: absolute;
bottom: calc(0.5vw + 0.5vh);
right: calc(0.5vw + 0.5vh);
margin-left: calc(0.5vw + 0.5vh);
margin-top: calc(0.5vw + 0.5vh);
background-color: rgba(255, 255, 255, 0.9);
padding: 25px;
padding: calc(1.5vw + 1.5vh);
}
a { color: #2f2b6f; }
a:hover { color: #4943ac; }
a:active { color: #1f1d4a; }
</style>
<!--[if IE]>
<script src="http://html5shiv.googlecode.com/svn/trunk/html5.js"></script>
<![endif]-->
</head>
<body>
<div class="message">
Désolé, cette page ne vous est pas accessible !<br/><a href="/index.html">Retour à l'accueil</a>
</div>
</body>
</html>
404page.html 0 → 100644
+ 87
− 0
Voir le fichier @ 3f2f710d
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset=utf-8 />
<title>Oops, une erreur 404 ...</title>
<link href="https://fonts.googleapis.com/css?family=Roboto:300i" rel="stylesheet">
<link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet">
<link rel="icon" href="/ressources/favicon.ico" type="image/x-icon" />
<meta content='width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0' name='viewport' />
<meta name="theme-color" content="#333333">
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script>
<script type="text/javascript">
var iFrequency = 100;
var myInterval = 0;
startLoop();
function startLoop() {
if(myInterval > 0) clearInterval(myInterval);
myInterval = setInterval( "changeColor()", iFrequency );
}
function changeColor() {
$('meta[name=theme-color]').remove();
$('head').append('<meta name="theme-color" content="'+ getRandomColor() +'">');
}
function getRandomColor() {
var letters = '0123456789ABCDEF';
var color = '#';
for (var i = 0; i < 6; i++ ) {
color += letters[Math.floor(Math.random() * 16)];
}
return color;
}
</script>
<style>
* {
box-sizing: border-box;
margin: 0;
padding: 0;
text-decoration: none;
}
::selection { background-color: rgba(0,0,0,0.5); }
html {
background: #ffffff url('ressources/404.png') no-repeat center bottom fixed;
background-size: cover;
font-size: calc(1.5vw + 1.5vh);
color: #333;
font-family: 'Roboto', cursive;
text-align: right;
position: relative;
height: 100%;
}
.message {
position: absolute;
bottom: calc(0.5vw + 0.5vh);
right: calc(0.5vw + 0.5vh);
margin-left: calc(0.5vw + 0.5vh);
margin-top: calc(0.5vw + 0.5vh);
background-color: rgba(255, 255, 255, 0.9);
padding: 25px;
padding: calc(1.5vw + 1.5vh);
}
a { color: #2f2b6f; }
a:hover { color: #4943ac; }
a:active { color: #1f1d4a; }
</style>
<!--[if IE]>
<script src="http://html5shiv.googlecode.com/svn/trunk/html5.js"></script>
<![endif]-->
</head>
<body>
<div class="message">
Malheuresement, vous êtes tombé sur la mauvaise page ...<br/><a href="/index.html">Retour à l'accueil</a>
</div>
</body>
</html>
index.html 0 → 100644
+ 146
− 0
Voir le fichier @ 3f2f710d
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset=utf-8 />
<title>Kévin "Salixor" Cocchi</title>
<link rel="stylesheet" type="text/css" media="screen" href="styles.css" />
<link href="https://fonts.googleapis.com/css?family=Roboto:300i,400" rel="stylesheet">
<link rel="icon" href="ressources/favicon.ico" type="image/x-icon" />
<meta content='width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0' name='viewport' />
<meta name="theme-color" content="#2f2b6f">
<meta property="og:type" content="website">
<meta property="og:site_name" content="Perso de Salixor">
<meta property="og:url" content="http://www.cocchi.iiens.net/">
<meta property="og:title" content='Kévin "Salixor" Cocchi'>
<meta property="og:description" content="Dépôts de corrections de TP et TD">
<meta property="og:image" content="ressources/avatar.png">
</head>
<body>
<header>
<div class="image"></div>
<div class="subcontainer">
<div class="nickname"><b>Salixor</b></div>
<div class="name">> Dépôt de corrections</div>
<div class="avatar"></div>
</div>
</header>
<section class="container">
<div class="row">
<h3>IPF3</h3>
<a href="cours/IPFS3/Files-IPF.ml">Files</a>
<a href="cours/IPFS3/Ensembles-IPF.ml">Ensembles</a>
<a href="cours/IPFS3/ArbresBinaires-IPF.ml">Arbres binaires</a>
<a href="cours/IPFS3/Associations-IPF.ml">Associations</a>
<a href="cours/IPFS3/Graphes-IPF.ml">Graphes</a>
<a href="cours/IPFS3/TD1-IPF.pdf">TD1</a>
<a href="cours/IPFS3/TD2-IPF.pdf">TD2</a>
</div>
<div class="row">
<h3>IPF3 toclean</h3>
<a href="cours/IPFS3/TP4-IPF.ml">TP4</a>
<a href="cours/IPFS3/TP5-IPF.ml">TP5</a>
</div>
<hr/>
<div class="row">
<h3>PAP</h3>
<a href="cours/PAP/TP1-PAP.tgz">TP1</a>
<a href="cours/PAP/TP2-PAP.tgz">TP2</a>
</div>
<hr/>
<div class="row">
<h3>IPI TP</h3>
<a href="cours/IPI/TP1-IPI.c">TP1</a>
<a href="cours/IPI/TP2-IPI.c">TP2</a>
<a href="cours/IPI/TP3-IPI.c">TP3</a>
<a href="cours/IPI/TP4-IPI.c">TP4</a>
<a href="cours/IPI/TP5-IPI.c">TP5</a>
<a href="cours/IPI/TP6-IPI.tgz">TP6</a>
<a href="cours/IPI/TP7-IPI.c">TP7</a>
<a href="cours/IPI/TP8-IPI.c">TP8</a>
<a href="cours/IPI/TP9-IPI.tgz">TP9</a>
</div>
<div class="row">
<h3>IPI TD</h3>
<a href="cours/IPI/TD1-IPI.c">TD1</a>
<a href="cours/IPI/TD2-IPI.c">TD2</a>
<a href="cours/IPI/TD3-IPI.c">TD3</a>
</div>
<hr/>
<div class="row">
<h3>MAN</h3>
<a href="cours/MAN/TP1-MAN.tgz">TP1</a>
<a href="cours/MAN/TP2-MAN.tgz">TP2</a>
</div>
<hr/>
<div class="row">
<h3>IPF2</h3>
<a href="cours/IPFS2/TP1-IPF.ml">TP1</a>
<a href="cours/IPFS2/TP2-IPF.ml">TP2</a>
<a href="cours/IPFS2/TP3-IPF.ml">TP3</a>
<a href="cours/IPFS2/TP4-IPF.ml">TP4</a>
<a href="cours/IPFS2/TP5-IPF.ml">TP5</a>
<a href="cours/IPFS2/TP6-IPF.ml">TP6</a>
</div>
<hr/>
<div class="row">
<h3>IPW</h3>
<a href="cours/IPW/TP-PHP.tgz">TP PHP</a>
<a href="cours/IPW/TP-Curseurs.tgz">TP Curseurs</a>
</div>
<div class="row">
<h3>IPW Résumé</h3>
<a href="cours/IPW/Resume-HTML.pdf">HTML</a>
<a href="cours/IPW/Resume-PHP.pdf">PHP</a>
<a href="cours/IPW/Resume-XML.pdf">XML</a>
</div>
<div class="row">
<h3>IPW Correction</h3>
<a href="cours/IPW/CorrectionTPWeb2015.pdf">TP 2015</a>
<a href="cours/IPW/CorrectionTPWeb2016.pdf">TP 2016</a>
</div>
<hr/>
<div class="row">
<h3>ILO</h3>
<a href="cours/ILO/TD1-ILO.java">TD1</a>
<a href="cours/ILO/TP1-ILO.tgz">TP1</a>
<a href="cours/ILO/TP2-ILO.tgz">TP2</a>
</div>
</section>
<footer>
<a href="mailto:kevin.cocchi@gmail.com">kevin.cocchi@gmail.com</a>
<span class="discord">mrsalixor#8190</span>
<div class="clear"></div>
</footer>
</body>
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script>
<script type="text/javascript" src="scripts.js"></script>
<!--[if IE]>
<script src="http://html5shiv.googlecode.com/svn/trunk/html5.js"></script>
<![endif]-->
</html>
ressources/403.png 0 → 100644
+ 0
− 0
Voir le fichier @ 3f2f710d
ressources/403.png

1,12 Mo

ressources/404.png 0 → 100644
+ 0
− 0
Voir le fichier @ 3f2f710d
ressources/404.png

2,05 Mo

ressources/DiscordLogoGrey.png 0 → 100644
+ 0
− 0
Voir le fichier @ 3f2f710d
ressources/DiscordLogoGrey.png

18,3 ko

ressources/DiscordLogoWhite.png 0 → 100644
+ 0
− 0
Voir le fichier @ 3f2f710d
ressources/DiscordLogoWhite.png

18,4 ko

ressources/avatar.png 0 → 100644
+ 0
− 0
Voir le fichier @ 3f2f710d
ressources/avatar.png

192 ko

ressources/favicon.ico 0 → 100644
+ 0
− 0
Voir le fichier @ 3f2f710d
ressources/favicon.ico

338 ko

ressources/header_bg_crop_asuka.png 0 → 100644
+ 0
− 0
Voir le fichier @ 3f2f710d
ressources/header_bg_crop_asuka.png

311 ko

ressources/header_bg_crop_chitanda.png 0 → 100644
+ 0
− 0
Voir le fichier @ 3f2f710d
ressources/header_bg_crop_chitanda.png

442 ko

ressources/header_bg_crop_kumiko.png 0 → 100644
+ 0
− 0
Voir le fichier @ 3f2f710d
ressources/header_bg_crop_kumiko.png

144 ko

ressources/header_bg_crop_reina.png 0 → 100644
+ 0
− 0
Voir le fichier @ 3f2f710d
ressources/header_bg_crop_reina.png

530 ko

ressources/header_bg_crop_yohane.png 0 → 100644
+ 0
− 0
Voir le fichier @ 3f2f710d
ressources/header_bg_crop_yohane.png

123 ko

ressources/mayuri.png 0 → 100644
+ 0
− 0
Voir le fichier @ 3f2f710d
ressources/mayuri.png

137 ko

ressources/megumin.png 0 → 100644
+ 0
− 0
Voir le fichier @ 3f2f710d
ressources/megumin.png

78,8 ko

ressources/megumin_explosion.mp3 0 → 100644
+ 0
− 0
Voir le fichier @ 3f2f710d
Fichier ajouté
ressources/tuturu.mp3 0 → 100644
+ 0
− 0
Voir le fichier @ 3f2f710d
Fichier ajouté
scripts.js 0 → 100644
+ 92
− 0
Voir le fichier @ 3f2f710d
$(document).ready(function() {
// Chargement des sons
var megumin_explosion = new Audio("ressources/megumin_explosion.mp3");
var tuturu = new Audio("ressources/tuturu.mp3");
// Volumes des sons
megumin_explosion.volume = 0.3;
tuturu.volume = 0.2;
var sounds = [ // Tableau des sons
{ "name": "megumin", "s": megumin_explosion },
{ "name": "mayuri", "s": tuturu }
];
var color = ["#F17105", "#D11149", "#6610F2", "#177CC5", "#92A500"]; // Couleurs
var pics = ["asuka", "kumiko", "chitanda", "yohane"]; // Fonds
var col_rd = "#FFFFFF";
var pic_rd = "";
function changeStyle() {
// On randomise la couleur
do {
col_rd = Math.floor(Math.random() * color.length);
} while( $("header").css("background-color") == hexToRgbA(color[col_rd]) )
// On randomise l'image
do {
pic_rd = Math.floor(Math.random() * pics.length);
} while( $("div.image").css("background-image") == 'url("ressources/header_bg_crop_'+ pics[pic_rd] +'.png")' )
// Changement aléatoire de l'image et de la couleur parce que pourquoi pas ?
$("header").css("background-color", color[col_rd]);
$("div.image").css("background", 'url("ressources/header_bg_crop_'+ pics[pic_rd] +'.png") 90% 90% / contain no-repeat');
// $("div.image").css("background-size", "contain");
$(".container a").css("background", color[col_rd]);
$("hr").css("border-color", color[col_rd]);
$(".container a").hover(function(){
$(this).css("background", hexToRgbA(color[col_rd], 0.8));
}, function(){
$(this).css("background", hexToRgbA(color[col_rd], 1));
});
// Changement de la couleur pour Google Chrome Mobile
$('meta[name=theme-color]').remove();
$('head').append('<meta name="theme-color" content="'+ color[col_rd] +'">');
}
$( document ).ready(function() {
// On change le style au chargement de la page et avec le bouton de refresh
changeStyle();
// Choix aléatoire d'un son et personnage associé à la pression de l'avatar !
var canPlay = true;
$("div.avatar").click(function() {
canPlay = true; // On peut jouer de l'audio
var sound_rd = Math.floor(Math.random() * sounds.length);
for(i = 0; i < sounds.length; i++) {
if(!sounds[i]["s"].paused) { canPlay = false; } // Un audio est déjà joué : on attend
}
if(canPlay) {
sounds[sound_rd]["s"].play();
$("div.avatar").css("background-image", 'url("ressources/'+ sounds[sound_rd]["name"] +'.png")');
}
});
// Event listeners sur les sons
for(j = 0; j < sounds.length; j++) {
sounds[j]["s"].addEventListener('ended', function() {
$("div.avatar").css("background-image", 'url("ressources/avatar.png")');
});
}
});
function hexToRgbA(hex, opacity = 0) {
var c;
if(/^#([A-Fa-f0-9]{3}){1,2}$/.test(hex)){
c= hex.substring(1).split('');
if(c.length== 3){
c= [c[0], c[0], c[1], c[1], c[2], c[2]];
}
c= '0x'+c.join('');
if(opacity > 0)
return 'rgba('+[(c>>16)&255, (c>>8)&255, c&255].join(', ')+','+opacity+')';
else {
return 'rgb('+[(c>>16)&255, (c>>8)&255, c&255].join(', ')+')';
}
}
throw new Error('Bad Hex');
}
});
styles.css 0 → 100644
+ 221
− 0
Voir le fichier @ 3f2f710d
* {
-webkit-tap-highlight-color: #fff rgba(255,255,255,0.5);
box-sizing: border-box;
list-style: none;
margin: 0;
outline: none;
padding: 0;
text-decoration: none;
user-select: none;
}
::selection { background: #d5602f; }
.clear { clear: both; }
html, body {
background-color: #fff;
color: #fff;
font-family: 'Roboto', sans-serif;
height: 100%;
overflow-x: hidden;
}
hr { border: 0; border-bottom: 1px solid #333; margin: 15px 50px; opacity: 0.3;}
a { color: #fff; transition: opacity 0.1s ease-out; }
a:hover { background-color: rgba(51,51,51,0.8); }
.container .row { line-height: 50px; margin: 0 10px; }
.container a, .container h3 {
background-color: #222;
border-radius: 3px;
/*box-shadow: 0 1px 4px rgba(0,0,0,0.4);*/
display: inline-block;
font-size: 14px;
font-weight: normal;
height: 40px;
line-height: 40px;
margin: 0 10px 0 0;
overflow: hidden;
padding: 0 12px;
position: relative;
text-overflow: ellipsis;
vertical-align: middle;
width: auto;
}
.container a { font-style: italic; }
.container h3 {
color: #FFF;
cursor: default;
font-size: 20px;
text-align: left;
overflow: hidden;
padding: 0 15px;
white-space: pre-wrap;
}
.container a::after {
background: rgba(0,0,0,0.15);
bottom: 0;
content: "➜";
display: none;
font-size: 14px;
font-style: normal;
height: 100%;
margin: auto 0;
position: absolute;
right: 0;
text-align: center;
vertical-align: middle;
width: 30px;
}
@media only screen and (min-width: 1100px) {
.container .row { line-height: normal; margin: 10px; }
.container a, .container h3 { font-size: 16px; height: 56px; line-height: 56px; padding: 0 20px; }
.container a { padding-right: 40px; }
.container h3 { font-size: 28px; width: auto; }
.container a::after { display: block; }
}
header, div.image, div.subcontainer { transform-origin: bottom left; }
header { transform: rotate(-2deg); }
div.image, div.subcontainer { transform: rotate(2deg); }
header {
background: #333;
background-size: contain;
display: inline-block;
overflow: hidden;
position: relative;
position: sticky;
width: 103%;
z-index: 500;
}
div.image {
background: url("/ressources/header_bg_crop_kumiko.png") 90% 90% / contain no-repeat;
content: '';
float: right;
height: 100%;
position: relative;
width: 100%;
z-index: 2;
}
header::before {
background-color: #000;
bottom: 0;
content: '';
height: 10px;
opacity: 0.5;
position: absolute;
width: 100%;
z-index: 1;
}
header::after, div.image::after {
content: '';
display: block;
padding-top: 40%;
}
@media only screen and (min-width: 1100px) {
header { height: 430px; top: -300px; }
div.image { bottom: 25px; height: 430px; }
header::after, div.image::after { padding-top: 0; }
}
div.subcontainer {
bottom: 10px;
left: 0;
position: absolute;
right: 0;
top: 0;
z-index: 3;
}
section.container { color: #333; }
.container, div.subcontainer { margin: 0 auto; }
div.avatar, div.nickname, div.name { position: absolute; }
div.avatar {
background: #fff url("ressources/avatar.png") no-repeat center;
background-size: contain;
border: 4px #fff solid;
border-radius: 100%;
bottom: 15px;
box-shadow: 0 0 7px rgba(0,0,0,0.25);
cursor: pointer;
height: 50px;
margin-left: 15px;
transition: background 0.3s ease;
width: 50px;
}
div.nickname, div.name {
float: left;
font-family: 'Roboto';
font-style: italic;
font-weight: 300;
margin: 0 0 0 60px;
text-shadow: 1px 2px 3px rgba(0,0,0,0.25);
}
div.nickname, div.name { margin: 0 0 0 75px; }
div.nickname { bottom: 32px; font-size: 28px; }
div.name { bottom: 16px; font-size: 14px; }
@media only screen and (min-width: 450px) {
div.avatar {
border: 6px #fff solid;
height: 80px;
margin-left: 35px;
width: 80px;
}
div.nickname, div.name { margin: 0 0 0 125px; }
div.nickname { bottom: 40px; font-size: 38px; }
div.name { bottom: 25px; font-size: 16px; }
}
@media only screen and (min-width: 1100px) {
.container { width: 1100px; }
div.subcontainer { bottom: 15px; width: 1100px; }
}
footer {
background-color: rgba(0,0,0,0.8);
color: #FFF;
margin: 30px 0 0;
padding: 20px;
}
footer span { cursor: default; }
footer a, footer span {
border-radius: 2px;
color: #FFF;
font-style: italic;
padding: 5px;
margin: 0 4px;
float: right;
}
footer a:hover, footer span:hover {
background-color: rgba(255,255,255,0.7);
color: #333;
}
footer span.discord, footer span.discord:hover {
background: url('ressources/DiscordLogoWhite.png') no-repeat;
background-size: auto 60%;
background-position: left 6px top 6px;
padding-left: 28px;
}
footer span.discord:hover {
background-color: rgba(255,255,255,0.7);
background-image: url('ressources/DiscordLogoGrey.png');
}
0% ou .
You are about to add 0 people to the discussion. Proceed with caution.
Veuillez vous inscrire ou vous pour commenter