From 9942f68ebfe118b56ff7e3893f07a31b19e52f31 Mon Sep 17 00:00:00 2001
From: Alx <alexandre@robail.com>
Date: Mon, 10 Feb 2025 15:57:19 +0100
Subject: [PATCH] update
---
ROBAIL/{La_cene.png => img.png} | Bin
ROBAIL/index.css | 94 ++++++++++++++++++++++++++++++++
ROBAIL/index.html | 49 ++++++++++++++++-
3 files changed, 142 insertions(+), 1 deletion(-)
rename ROBAIL/{La_cene.png => img.png} (100%)
create mode 100644 ROBAIL/index.css
diff --git a/ROBAIL/La_cene.png b/ROBAIL/img.png
similarity index 100%
rename from ROBAIL/La_cene.png
rename to ROBAIL/img.png
diff --git a/ROBAIL/index.css b/ROBAIL/index.css
new file mode 100644
index 0000000..973cf57
--- /dev/null
+++ b/ROBAIL/index.css
@@ -0,0 +1,94 @@
+/* Styles généraux */
+body {
+ font-family: Arial, sans-serif;
+ background-color: #f4f4f4;
+ margin: 0;
+ padding: 0;
+ color: #333;
+}
+
+/* Conteneur principal */
+#container {
+ display: flex;
+ justify-content: space-around;
+ align-items: flex-start;
+ margin: 20px;
+ padding: 20px;
+ background: white;
+ box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.1);
+ border-radius: 10px;
+}
+
+/* Sections */
+#container > div {
+ flex: 1;
+ padding: 10px;
+ text-align: center;
+}
+
+/* Titre */
+h3 {
+ text-align: center;
+ font-size: 22px;
+ color: #444;
+ border-bottom: 2px solid #666;
+ padding-bottom: 5px;
+ margin-bottom: 15px;
+}
+
+/* WebGL Container */
+#webGL {
+ width: 400px;
+ height: 400px;
+ background-color: #ddd;
+ border: 2px solid #999;
+ margin: 0 auto;
+ position: relative;
+}
+
+/* Légende des axes */
+#axes_legend {
+ font-size: 16px;
+ font-weight: bold;
+ color: #000;
+}
+
+/* Image */
+img {
+ max-width: 100%;
+ height: auto;
+ display: block;
+ margin: 0 auto;
+ border-radius: 5px;
+}
+
+/* Explications techniques */
+h3 + p {
+ font-size: 20px;
+ text-align: left;
+ padding-left: 60px;
+}
+
+/* Ligne de séparation */
+hr {
+ width: 70%;
+ margin: 20px auto;
+ border: 1px solid #ccc;
+}
+
+/* Responsive */
+@media (max-width: 768px) {
+ #container {
+ flex-direction: column;
+ align-items: center;
+ }
+
+ #webGL {
+ width: 90%;
+ height: 300px;
+ }
+
+ h3 + p {
+ padding-left: 20px;
+ }
+}
diff --git a/ROBAIL/index.html b/ROBAIL/index.html
index 76e27dc..7407e37 100644
--- a/ROBAIL/index.html
+++ b/ROBAIL/index.html
@@ -1 +1,48 @@
-Le travail n'a pas encore commencé!!!
\ No newline at end of file
+
+<!DOCTYPE html>
+<html>
+<head>
+ <meta charset="UTF-8">
+ <title>Projet webGL</title>
+ <link rel="stylesheet" href="index.css">
+ <script async src="https://unpkg.com/es-module-shims@1.3.6/dist/es-module-shims.js"></script>
+ <script type="importmap">
+ {
+ "imports": {
+ "three": "https://threejs.org/build/three.module.js",
+ "three/addons/": "https://threejs.org/examples/jsm/"
+ }
+ }
+ </script>
+
+</head>
+<body>
+
+
+ <div id="container">
+ <div>
+ <h3>Modèle</h3>
+ <div id="webGL">
+
+ </div>
+ </div>
+
+ <div>
+ <h3>La Cène, Léonard De Vinci, 1498</h3>
+
+ <img src="img.png" width="846" height="494" alt="La Cène, Léonard De Vinci, 1498"/>
+ </div>
+ </div>
+ <!-- Explication technique -->
+ <hr style="width: 70%; margin: 20px auto;">
+ <h3>Explications Techniques</h3>
+ <p style="font-size: 22px; text-align: left; padding-left: 60px">
+ A venir
+ <hr>
+
+
+ </p>
+ <script class="center" type="module" src="main.js"></script>
+ <script type="text/javascript" src="https://code.jquery.com/jquery-3.5.1.min.js"></script>
+</body>
+</html>
--
GitLab