Image + fonts + Page presentation

ServeurDeTest
nathan boileau 2 years ago
parent d7fec80c71
commit 285a554581

Binary file not shown.

Binary file not shown.

Binary file not shown.

After

Width:  |  Height:  |  Size: 3.7 MiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 814 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 5.5 KiB

@ -1,5 +1,6 @@
@import url("https://fonts.googleapis.com/css2?family=Orbitron&display=swap");
/*Default CSS*/
body {
min-height: 100vh;

@ -0,0 +1,43 @@
/*Fonts CSS */
@font-face {
font-family: Fauna;
src: url("../../assets/fonts/Fauna.ttf");
}
@font-face {
font-family: Equinox;
src: url("../../assets/fonts/Equinox.otf");
}
body {
min-height: 100vh;
font-family: "Equinox", sans-serif;
color: white;
scroll-behavior: smooth;
height: 100vh;
background-position: center center;
background-attachment: fixed;
background-repeat: no-repeat;
background-size: cover;
background-color: #050e15;
}
nav{
background: none;
}
h1{
z-index: 10;
color: #fff;
font-size: 65px;
letter-spacing: 1px;
}
section img {
position: absolute;
top: 0;
left: 0;
width: 100%;
object-fit: cover;
}

@ -1,75 +1,27 @@
<!DOCTYPE HTML>
<html>
<head>
<script>
window.onload = function () {
var chart = new CanvasJS.Chart("chartContainer", {
animationEnabled: true,
zoomEnabled: true,
theme: "dark2",
title: {
text: "Score"
},
axisX: {
title: "Enigme",
valueFormatString: "####",
interval: 1
},
axisY: {
title: "Point",
titleFontColor: "#6D78AD",
lineColor: "#6D78AD",
gridThickness: 0,
lineThickness: 1,
},
legend: {
verticalAlign: "top",
fontSize: 16,
},
data: [{
type: "line",
xValueFormatString: "Pierre",
dataPoints: [
{ x: 0, y: 0 },
{ x: 1, y: 50 },
{ x: 2, y: 100 },
{ x: 3, y: 150 },
{ x: 4, y: 150 },
{ x: 5, y: 200 },
]
},
{
type: "line",
xValueFormatString: "Noe",
dataPoints: [
{ x: 0, y: 0 },
{ x: 1, y: 100 },
{ x: 2, y: 100 },
{ x: 3, y: 200 },
{ x: 4, y: 250 },
{ x: 5, y: 300 },
]
},
{
type: "line",
xValueFormatString: "Nathan",
dataPoints: [
{ x: 0, y: 0 },
{ x: 1, y: 75 },
{ x: 2, y: 100 },
{ x: 3, y: 150 },
{ x: 4, y: 200 },
{ x: 5, y: 250 },
]
}
]
});
chart.render();
}
</script>
</head>
<body>
<div id="chartContainer" style="height: 370px; width: 100%;"></div>
<script src="https://canvasjs.com/assets/script/canvasjs.min.js"></script>
</body>
</html>
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Bootstrap Site</title>
<link
rel="stylesheet"
href="https://stackpath.bootstrapcdn.com/bootstrap/5.0.0-alpha1/css/bootstrap.min.css"
integrity="sha384-r4NyP46KrjDleawBgD5tp8Y7UzmLA05oM1iAEQ17CSuDqnUK2+k9luXQOfXJCJ4I"
crossorigin="anonymous"
/>
<script
src="https://cdn.jsdelivr.net/npm/popper.js@1.16.0/dist/umd/popper.min.js"
integrity="sha384-Q6E9RHvbIyZFJoft+2mJbHaEWldlvI9IOYy5n3zV9zzTtmI3UksdQRVvoxMfooAo"
crossorigin="anonymous"
></script>
<script
src="https://stackpath.bootstrapcdn.com/bootstrap/5.0.0-alpha1/js/bootstrap.min.js"
integrity="sha384-oesi62hOLfzrys4LxRF63OJCXdXDipiYWBnvTl9Y9/TRlw5xlKIEHpNyvvDShgf/"
crossorigin="anonymous"
></script>
</head>
<body>
</body>
</html>

@ -10,6 +10,7 @@
integrity="sha384-r4NyP46KrjDleawBgD5tp8Y7UzmLA05oM1iAEQ17CSuDqnUK2+k9luXQOfXJCJ4I"
crossorigin="anonymous"
/>
<link rel="stylesheet" href="../CSS/Pres.css" />
<script
src="https://cdn.jsdelivr.net/npm/popper.js@1.16.0/dist/umd/popper.min.js"
integrity="sha384-Q6E9RHvbIyZFJoft+2mJbHaEWldlvI9IOYy5n3zV9zzTtmI3UksdQRVvoxMfooAo"
@ -22,7 +23,7 @@
></script>
</head>
<body>
<nav class="navbar navbar-expand-lg navbar-dark bg-dark">
<nav class="navbar navbar-expand-lg navbar-dark">
<div class="container-fluid mx-0">
<div class="nav-item nav-link">
<a class="navbar-brand">Home</a>
@ -38,8 +39,11 @@
</div>
</nav>
<main class="container d-flex" style=" background-color: #3f5151;">
<h1 class="text-uppercase d-flex justify-content-center">Scripted</h1>
</main>
<section class=" position-relative w-100 h-100 d-flex justify-content-center align-items-center">
<h1>Scripted</h1>
<img src="../../assets/img/MenBGPres.png" id="men"></img>
<img src="../../assets/img/BuildingBG.png" id="building"></img>
</section>
</body>
</html>

Loading…
Cancel
Save