css modal et ships

ago%!(EXTRA string=1 year) · 4a9144a183
parent 3bfec8032f
commit 4a9144a183
5 changed files with 72 additions and 0 deletions
--- a/css/ship.css
+++ b/css/ship.css
@ -0,0 +1,42 @@
+* {
+    box-sizing: border-box;
+}
+@font-face {
+    font-family: M42;
+    src: url("/assets/fonts/m42.TTF");
+}
+.block-ships{
+    display:flex;
+    justify-content: center;
+    align-items: center;
+    color: white;
+    font-size:large;
+}
+.ships{
+    display: flex;
+    flex-direction: column;
+    flex-wrap: wrap;
+    text-align: center;
+}
+button{
+    color: white;
+    font-family: 'M42';
+    background-color: black;
+    font-size:x-small;
+    box-shadow: 3px 2px white;
+    border: 4px solid white;
+    border-radius: 10px;
+    padding: 10px;
+    padding-left: 15px;
+    padding-right: 15px;
+}
+button:hover{
+    background-color:aqua ;
+    transition: 1s;
+}
+.ships>*{
+    flex: 100px;
+}
+.my-modal{
+    font-size:small;
+}
--- a/html/templates/ship/ship.html
+++ b/html/templates/ship/ship.html
@ -0,0 +1,16 @@
+<!DOCTYPE html>
+<html lang="en">
+  <head>
+    <meta charset="UTF-8" />
+    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+    <title>Ship</title>
+  </head>
+  <body>
+    <div class="block-ships">
+      <div class="ships">
+    
+      </div>
+    </div>
+   
+  </body>
+</html>
--- a/html/templates/ship/ship_modal.html
+++ b/html/templates/ship/ship_modal.html
@ -0,0 +1,9 @@
+<!-- Copyright © 2023 Entreprise SkamKraft -->
+<div class="my-modal">
+    <div class="infos">
+  
+    </div>
+    <div>
+        <button class="btn btn-val btn-close">Close</button>
+    </div>
+  </div>
--- a/index.html
+++ b/index.html
@ -5,6 +5,7 @@
    <link rel="stylesheet" href="css/style.css">
    <link rel="stylesheet" href="css/ui.css">
    <link rel="stylesheet" href="css/animation.css">
+    <link rel="stylesheet" href="css/ship.css">
    <script src="js/lib/fabric.js"></script>
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.7.1/jquery.min.js"></script>    
    <script type="module" src="js/index.js" defer></script>
--- a/js/controllers/menu_mod.js
+++ b/js/controllers/menu_mod.js
@ -3,6 +3,7 @@ import login from "./login.js";
 import reg from "./reg.js";
 import home from "./home.js";
 import { systems } from "./systems.js";
+import ships from "./ships.js";

 function init_menu(temp_engine) {
    temp_engine.add_event("#reg-link", "click", () => {
@ -14,6 +15,9 @@ function init_menu(temp_engine) {
    temp_engine.add_event("#systems-link", "click", () => {
        systems(temp_engine);
    });
+    temp_engine.add_event("#ships-link", "click", () => {
+        ships(temp_engine);
+    });
    temp_engine.add_event(".nav-brand", "click", () => {
        home(temp_engine);
    });