francois.baille/Laravel
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat: finish page styling and todo

Browse Source
This commit is contained in:
Azerothwav 2024-11-04 15:27:30 +01:00
parent ec0f77a45c
commit c792dd66ab
8 changed files with 28 additions and 26 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
public/css/todo.css
View File

@ -1,6 +1,5 @@
body { body {
font-family: Arial, sans-serif; font-family: Arial, sans-serif;
background-color: #f4f4f4;
margin: 0; margin: 0;
padding: 0; padding: 0;
} }

10
public/js/todo.js
View File

@ -13,11 +13,6 @@ function ajoutTache() {
var tacheDiv = document.createElement("div"); var tacheDiv = document.createElement("div");
tacheDiv.className = "task"; //mise en forme css tacheDiv.className = "task"; //mise en forme css
// Créer un élément <span> pour afficher la tâche
var tacheSpan = document.createElement("span");
tacheSpan.textContent = tache; //récupère texte saisi dans la zone de texte tacheInput
tacheDiv.appendChild(tacheSpan); //pour afficher à la suite
// Créer une checkbox pour marquer la tâche comme terminée // Créer une checkbox pour marquer la tâche comme terminée
var checkbox = document.createElement("input"); var checkbox = document.createElement("input");
checkbox.type = "checkbox"; checkbox.type = "checkbox";
@ -26,6 +21,11 @@ function ajoutTache() {
}; };
tacheDiv.appendChild(checkbox); tacheDiv.appendChild(checkbox);
// Créer un élément <span> pour afficher la tâche
var tacheSpan = document.createElement("span");
tacheSpan.textContent = tache; //récupère texte saisi dans la zone de texte tacheInput
tacheDiv.appendChild(tacheSpan); //pour afficher à la suite
// Ajouter un bouton "Supprimer" // Ajouter un bouton "Supprimer"
var suppButton = document.createElement("button"); var suppButton = document.createElement("button");
suppButton.textContent = "Supprimer"; suppButton.textContent = "Supprimer";

1
resources/css/todo.css
View File

@ -1,6 +1,5 @@
body { body {
font-family: Arial, sans-serif; font-family: Arial, sans-serif;
background-color: #f4f4f4;
margin: 0; margin: 0;
padding: 0; padding: 0;
} }

10
resources/js/todo.js
View File

@ -13,11 +13,6 @@ function ajoutTache() {
var tacheDiv = document.createElement("div"); var tacheDiv = document.createElement("div");
tacheDiv.className = "task"; //mise en forme css tacheDiv.className = "task"; //mise en forme css
// Créer un élément <span> pour afficher la tâche
var tacheSpan = document.createElement("span");
tacheSpan.textContent = tache; //récupère texte saisi dans la zone de texte tacheInput
tacheDiv.appendChild(tacheSpan); //pour afficher à la suite
// Créer une checkbox pour marquer la tâche comme terminée // Créer une checkbox pour marquer la tâche comme terminée
var checkbox = document.createElement("input"); var checkbox = document.createElement("input");
checkbox.type = "checkbox"; checkbox.type = "checkbox";
@ -26,6 +21,11 @@ function ajoutTache() {
}; };
tacheDiv.appendChild(checkbox); tacheDiv.appendChild(checkbox);
// Créer un élément <span> pour afficher la tâche
var tacheSpan = document.createElement("span");
tacheSpan.textContent = tache; //récupère texte saisi dans la zone de texte tacheInput
tacheDiv.appendChild(tacheSpan); //pour afficher à la suite
// Ajouter un bouton "Supprimer" // Ajouter un bouton "Supprimer"
var suppButton = document.createElement("button"); var suppButton = document.createElement("button");
suppButton.textContent = "Supprimer"; suppButton.textContent = "Supprimer";

1
resources/views/about.blade.php
View File

@ -7,7 +7,6 @@
@vite('resources/css/app.css') @vite('resources/css/app.css')
</head> </head>
<body> <body>
<h1>About</h1>
@include('menu') @include('menu')
</body> </body>
</html> </html>

7
resources/views/menu.blade.php
View File

@ -1,7 +1,6 @@
<main> <main class="w-screen h-[4dvh] absolute top-0 flex space-x-[1dvw] text-[2dvh] p-[15px]">
<h1>Menu</h1> <a href="">></a>
<div class="flex flex-col">
<a href="{{ route('route0') }}">Home</a> <a href="{{ route('route0') }}">Home</a>
<a href="{{ route('route1') }}">About</a> <a href="{{ route('route1') }}">About</a>
</div> <a href="{{ route('route2') }}">Todo</a>
</main> </main>

11
resources/views/todo.blade.php
View File

@ -5,15 +5,16 @@
<meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title> <title>Document</title>
@vite('resources/css/app.css') @vite('resources/css/app.css')
@vite('resources/css/todo.css')
<link href="{{ asset('css/todo.css') }}" rel="stylesheet"> <link href="{{ asset('css/todo.css') }}" rel="stylesheet">
</head> </head>
<body> <body>
<div class="container"> @include('menu')
<h1>Ma Liste</h1> <div class="w-screen h-screen grid place-items-center">
<input type="text" id="tacheInput" placeholder="Ajouter une tâche..."> <div class="flex">
<input class="border-2" type="text" id="tacheInput" placeholder="Ajouter une tâche...">
<button onclick="ajoutTache()">Ajouter</button> <button onclick="ajoutTache()">Ajouter</button>
<div id="listeTache"></div> </div>
<div id="listeTache" class="w-[30dvw] h-[70dvh] overflow-y-scroll"></div>
</div> </div>
<script src="{{ asset('js/todo.js')}}"></script> <script src="{{ asset('js/todo.js')}}"></script>
</body> </body>

7
resources/views/welcome.blade.php
View File

@ -6,7 +6,12 @@
@vite('resources/css/app.css') @vite('resources/css/app.css')
</head> </head>
<body> <body>
<h1>Bienvenue sur la page d'accueil</h1>
@include('menu') @include('menu')
<div class="w-screen h-screen grid place-items-center">
<div class="flex flex-col place-items-center">
<img width="200px" src="https://upload.wikimedia.org/wikipedia/commons/thumb/9/9a/Laravel.svg/1200px-Laravel.svg.png" alt="">
<h1 class="text-[5dvh]">Bienvenue sur la page d'accueil</h1>
</div>
</div>
</body> </body>
</html> </html>