PGL/Clyde
PGL/Clyde
3
2
Fork 3
Code Issues 13 Pull Requests Actions Projects 3 Releases 2 Wiki Activity

Login et agencement de la main page #51

Merged
Wal merged 9 commits from loginProto into master 2024-03-04 19:42:58 +01:00
Conversation 0 Commits 9 Files Changed 6 +34 -30
4 changed files with 34 additions and 30 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files
Showing only changes of commit 7087b48245 - Show all commits

29
frontend/login.html
View File

@ -1,29 +0,0 @@
<!DOCTYPE html>
<html>
<body>
<div class="logBoxCenterer">
<div class='loginBox'>
<div class="form">
<h1 style="color:rgb(239,60,168); font-family: sans-serif;">SIGN IN</h1>
<div class="inputBox">
<p>USERNAME</p>
<input type="text" required>
</div>
<div class="inputBox">
<p>PASSWORD</p>
<input type="password" required>
</div>
<div class="register">
<a>Register</a>
</div>
<div class="inputBox">
<input type="submit" value="Login">
</div>
</div>
</div>
</div>
<script type="module" src="/src/main.js"></script>
</body>
</html>

28
frontend/src/assets/styleLogin.css → frontend/src/Login.vue
View File

@ -1,3 +1,30 @@
<template>
<body>
<div class="logBoxCenterer">
<div class='loginBox'>
<div class="form">
<h1 style="color:rgb(239,60,168); font-family: sans-serif;">SIGN IN</h1>
<div class="inputBox">
<p>USERNAME</p>
<input type="text" required>
</div>
<div class="inputBox">
<p>PASSWORD</p>
<input type="password" required>
</div>
<div class="register">
<a>Register</a>
</div>
<div class="inputBox">
<input type="submit" value="Login">
</div>
</div>
</div>
</div>
</body>
</template>
<style scoped>
.logBoxCenterer {
position: absolute;
@ -75,3 +102,4 @@ input[type = "submit"]:active{
}
</style>

6
frontend/src/login.js Normal file
View File

@ -0,0 +1,6 @@
import './assets/main.css'
import { createApp } from 'vue'
import App from './Login.vue'
createApp(App).mount('#login')

1
frontend/src/main.js
View File

@ -1,5 +1,4 @@
import './assets/main.css'
import './assets/styleLogin.css'
import 'vue3-toastify/dist/index.css';
tonitch commented 2024-03-02 22:32:29 +01:00
Outdated
Review
Copy Link

Le fait de mettre le style ici fait que cette feuille de style est chargé pour tout le site (dont la page principale) ce qui pourrait ne pas être désirable.

Le mieux est soit d'utiliser le propre main.js pour la page de login (genre login.js) et de tout refaire dedans (pour ainsi profiter de vue.js dans la page de login)

soit comme c'est le cas maintenant de faire la page en pure html/css sans vue.js et du coup de pas charger ce script et de suprimer le chargement (ligne * référencé). La méthode actuellement n'est pas correcte car elle tente de charger une page Vue dans #app qui n'éxiste pas. (tu peux le voir dans la console quand tu vas sur la page de login)

Le fait de mettre le style ici fait que cette feuille de style est chargé pour tout le site (dont la page principale) ce qui pourrait ne pas être désirable. Le mieux est soit d'utiliser le propre main.js pour la page de login (genre login.js) et de tout refaire dedans (pour ainsi profiter de vue.js dans la page de login) soit comme c'est le cas maintenant de faire la page en pure html/css sans vue.js et du coup de pas charger ce script et de suprimer le chargement (ligne * référencé). La méthode actuellement n'est pas correcte car elle tente de charger une page Vue dans #app qui n'éxiste pas. (tu peux le voir dans la console quand tu vas sur la page de login)
👍 1
tonitch commented 2024-03-02 22:36:58 +01:00
Outdated
Review
Copy Link

ps: Si tu souhaite que je clean tout ça moi même ça ne me dérange pas non plus.

ps: Si tu souhaite que je clean tout ça moi même ça ne me dérange pas non plus.
import { createApp } from 'vue'