Ajouté le projet

This commit is contained in:
Alexandre1a 2025-04-05 14:03:55 +02:00
parent 0d489806b1
commit 8772ad4f09
No known key found for this signature in database
GPG Key ID: CE01C28FBC5EEF10
14 changed files with 236 additions and 0 deletions

BIN
.DS_Store vendored Normal file

Binary file not shown.

BIN
15 - langage HTML/.DS_Store vendored Normal file

Binary file not shown.

View File

@ -0,0 +1,11 @@
Découverte du Cosmos
Pages : Planètes - Missions - Quiz
Features :
Quiz interactif sur l'espace
Animation système solaire (CSS)
Formulaire de questions astronomiques
Liens vers NASA/ESA

Binary file not shown.

Binary file not shown.

View File

@ -0,0 +1 @@
<svg role="img" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg"><title>Airbus</title><path d="M11.0673 11.296c0-.8153-.5311-1.4329-1.6304-1.4329h-2.211v4.2614h1.0375v-3.335H9.437c.4323 0 .5928.247.5928.5311 0 .2965-.1605.5312-.5928.5312H8.4363l1.4329 2.2727h1.1858s-.9758-1.5316-.9635-1.5316c.5929-.1359.9758-.5558.9758-1.297M5.4966 9.8631h1.0376v4.2614H5.4966Zm-3.3227 0L0 14.137h1.1734l.3459-.7164h1.754l-.4324-.9017h-.877l.6424-1.3093h.0123l1.4575 2.9274h1.1982L3.1003 9.863Zm12.6854 2.0504c.3335-.1852.5065-.4693.5065-.9017 0-.6917-.5188-1.1487-1.3711-1.1487h-2.4333v4.2614h2.5198c.877 0 1.4575-.4693 1.4575-1.1981.0123-.494-.2718-.8646-.6794-1.0129m-2.2604-1.1487h1.3835c.21 0 .3705.1606.3705.3706s-.1606.3705-.3705.3705h-1.3835zm1.4205 2.4704H12.599v-.8646h1.4205c.247 0 .4447.1852.4447.4323 0 .247-.1977.4323-.4447.4323m4.8049-.9882c0 .6423-.2964 1.0005-.8893 1.0005-.5806 0-.877-.3582-.877-1.0005V9.8631h-1.0623v2.3098c0 1.3217.6917 2.0504 1.9516 2.0504 1.26 0 1.9516-.7287 1.9516-2.0504V9.8631h-1.0623v2.384zm3.8414-.6793c-.9881-.2347-1.1981-.2594-1.1981-.5435 0-.2223.247-.3211.667-.3211.5558 0 1.1364.1358 1.4699.3458l.3335-.8646c-.4447-.247-1.0623-.4076-1.8034-.4076-1.0993 0-1.717.5434-1.717 1.2846 0 .7905.4571 1.1116 1.5194 1.334.8276.1852 1.0005.2964 1.0005.531 0 .2471-.2224.3583-.6794.3583-.6546 0-1.2352-.1606-1.7045-.42l-.3212.914c.5188.2718 1.2846.4447 2.0504.4447 1.0746 0 1.717-.494 1.717-1.334.0123-.6793-.42-1.1116-1.334-1.3216"/></svg>

After

Width:  |  Height:  |  Size: 1.4 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 7.3 KiB

View File

@ -0,0 +1,110 @@
.planetContainer {
width: 100%;
display: flex;
justify-content: center;
align-items: center;
}
ol {
color: black;
all: unset;
aspect-ratio: 1 / 1;
container-type: inline-size;
display: grid;
width: 30%;
}
li {
aspect-ratio: 1 / 1;
border: 1px dashed;
border-radius: 50%;
display: grid;
grid-area: 1 / 1;
place-self: center;
width: var(--d, 2cqi);
&::after {
animation: rotate var(--t, 3s) linear infinite;
aspect-ratio: 1 / 1;
background: var(--b, hsl(0, 0%, 50%));
border-radius: 50%;
box-shadow: 0 0 15px rgba(0, 0, 0, 0.3);
content: '';
display: block;
offset-path: content-box;
width: var(--w, 2cqi);
}
}
@keyframes rotate {
to {
offset-distance: 100%;
}
}
.sun {
--b: radial-gradient(circle, #f9d71c 0%, #f9a825 50%, #f9a825 100%);
--d: 10cqi;
--w: 8cqi;
border: 0;
&::after {
animation: none;
offset-path: none;
place-self: center;
}
}
.mercury {
--b: radial-gradient(circle, #c2c2c2 0%, #8a8a8a 100%);
--d: 15cqi;
--t: 2105.26ms;
--w: 2.0526cqi;
}
.venus {
--b: radial-gradient(circle, #f4d03f 0%, #c39c43 100%);
--d: 25cqi;
--t: 4210.53ms;
--w: 2.6053cqi;
}
.earth {
--b: radial-gradient(circle, #3a82f7 0%, #2f9e44 80%, #1a5e20 100%);
--d: 35cqi;
--t: 6315.79ms;
--w: 3.1579cqi;
}
.mars {
--b: radial-gradient(circle, #e57373 0%, #af4448 100%);
--d: 45cqi;
--t: 8421.05ms;
--w: 3.7105cqi;
}
.jupiter {
--b: radial-gradient(circle, #d4a373 0%, #b36d32 50%, #f4e7d3 100%);
--d: 60cqi;
--t: 12631.58ms;
--w: 4.8158cqi;
}
.saturn {
--b: radial-gradient(circle, #e6dba0 0%, #c2a13e 100%);
--d: 75cqi;
--t: 14736.84ms;
--w: 5.3684cqi;
}
.uranus {
--b: radial-gradient(circle, #7de3f4 0%, #3ba0b5 100%);
--d: 84.5cqi;
--t: 10526.32ms;
--w: 4.2632cqi;
}
.neptune {
--b: radial-gradient(circle, #4c6ef5 0%, #1b3b8c 100%);
--d: 94cqi;
--t: 20000ms;
--w: 6cqi;
}

View File

@ -0,0 +1,4 @@
.mainContainer {
background-color: darkblue;
color: white;
}

View File

@ -0,0 +1,40 @@
<!doctype html>
<html>
<head>
<meta charset="utf-8" />
<link rel="stylesheet" href="./common/style.css" />
<script src="./common/script.js"></script>
<title>Le titre de ma page web</title>
<meta charset="utf-8" />
<meta name="description" content="Une description de la page..." />
<meta name="author" content="Nicolas AUNE" />
<meta name="copyright" content="© CC BY-NC-SA 4.0" />
</head>
<body>
<header>
<!-- Logo avec lien vers ma page d'acceil -->
<a href="index.html">
<img src="./assets/images/" />
</a>
<!-- navigation -->
<nav>
<ul>
<li><a href="index.html">Accueil</a></li>
<li><a href="prortfolio.html">Portfolio</a></li>
<li><a href="a_propos.html">À propos</a></li>
<li><a href="contact.html">Contact</a></li>
</ul>
</nav>
</header>
<div class="mainContainer">
<p>
<a href="./pages/solarsytstem.html">Test</a>
</p>
</div>
</body>
</html>

View File

@ -0,0 +1,17 @@
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<link rel="stylesheet" href="../common/styles.css" />
<script src="../common/script.js"></script>
</head>
<body>
<p>
Todo: Formulaire de questions astronomiques
</p>
</body>
</html>

View File

@ -0,0 +1,16 @@
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<link rel="stylesheet" href="../common/styles.css" />
<script src="../common/script.js"></script>
</head>
<body>
<p>
Todo: Quiz interactif sur l'espace
</p>
</body>
</html>

View File

@ -0,0 +1,37 @@
<!DOCTYPE html>
<html lang="fr">
<head>
<link rel="stylesheet" href="../common/animation.css">
</head>
<body>
<header class="cosmos-header">
<h1>🌌 Système Solaire</h1>
</header>
<div class="planetContainer">
<ol>
<li class="sun"></li>
<li class="mercury"></li>
<li class="venus"></li>
<li class="earth"></li>
<li class="mars"></li>
<li class="jupiter"></li>
<li class="saturn"></li>
<li class="uranus"></li>
<li class="neptune"></li>
</ol>
</div>
<div class="planet-card">
<img src="../assets/images/planets/mars.jpg" alt="Mars">
<h3>Mars</h3>
<ul>
<li>Diamètre : 6 779 km</li>
<li>Température : -63°C</li>
</ul>
</div>
</body>
</html>