essaye de faire foncitonner un bouton
This commit is contained in:
batche
32
srcs/requirements/svelte/api_front/src/App.svelte
Normal file
32
srcs/requirements/svelte/api_front/src/App.svelte
Normal file
@@ -0,0 +1,32 @@
|
||||
<script>
|
||||
import Login from "./pages/auth/login.svelte";
|
||||
import Home from "./pages/home/home.svelte";
|
||||
import Router, {link} from 'svelte-spa-router';
|
||||
|
||||
const routes = {
|
||||
"/": Home,
|
||||
"/login": Login,
|
||||
};
|
||||
|
||||
</script>
|
||||
|
||||
<header class="p-3 text-bg-dark">
|
||||
<div class="container">
|
||||
<div
|
||||
class="d-flex flex-wrap align-items-center justify-content-center justify-content-lg-start">
|
||||
|
||||
<ul class="nav col-12 col-lg-auto me-lg-auto mb-2 justify-content-center mb-md-0">
|
||||
<li>
|
||||
<a href="/" type="button" class="btn btn-primary">Home</a>
|
||||
</li>
|
||||
</ul>
|
||||
|
||||
<div class="text-end">
|
||||
|
||||
<a href="/login" use:link type="button" class="btn btn-warning">Connexion</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</header>
|
||||
|
||||
<Router {routes} />
|
||||
1
srcs/requirements/svelte/api_front/src/global.d.ts
vendored
Normal file
1
srcs/requirements/svelte/api_front/src/global.d.ts
vendored
Normal file
@@ -0,0 +1 @@
|
||||
/// <reference types="svelte" />
|
||||
10
srcs/requirements/svelte/api_front/src/main.ts
Normal file
10
srcs/requirements/svelte/api_front/src/main.ts
Normal file
@@ -0,0 +1,10 @@
|
||||
import App from './App.svelte';
|
||||
|
||||
const app = new App({
|
||||
target: document.body,
|
||||
props: {
|
||||
name: 'world'
|
||||
}
|
||||
});
|
||||
|
||||
export default app;
|
||||
@@ -0,0 +1,40 @@
|
||||
<script lang="ts">
|
||||
import axios from 'axios';
|
||||
import {push} from 'svelte-spa-router';
|
||||
|
||||
$: submit = async() => {
|
||||
console.log("submit");
|
||||
const {data} = await axios.get('http://transcendance:8080/api/v2/auth',
|
||||
{
|
||||
withCredentials: true,
|
||||
}
|
||||
);
|
||||
if (data.status === "ok") {
|
||||
push('/');
|
||||
}
|
||||
}
|
||||
|
||||
</script>
|
||||
|
||||
<body>
|
||||
<main class="form-signin w-100 m-auto">
|
||||
<button on:click={submit} class="w-100 btn btn-lg btn-primary" type="submit">
|
||||
Connexion avec prout
|
||||
</button>
|
||||
</main>
|
||||
</body>
|
||||
|
||||
<style>
|
||||
|
||||
body {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
padding-top: 40px;
|
||||
padding-bottom: 40px;
|
||||
}
|
||||
|
||||
.form-signin {
|
||||
max-width: 330px;
|
||||
padding: 15px;
|
||||
}
|
||||
</style>
|
||||
@@ -0,0 +1,79 @@
|
||||
<body>
|
||||
<main class="d-flex flex-nowrap">
|
||||
<h1 class="visually-hidden">Sidebars examples</h1>
|
||||
|
||||
<div class="d-flex flex-column flex-shrink-0 p-3 text-bg-dark" style="width: 280px;">
|
||||
<a href="/" class="d-flex align-items-center mb-3 mb-md-0 me-md-auto text-white text-decoration-none">
|
||||
<svg class="bi pe-none me-2" width="40" height="32"><use xlink:href="#bootstrap"/></svg>
|
||||
<span class="fs-4">Sidebar</span>
|
||||
</a>
|
||||
<hr>
|
||||
<ul class="nav nav-pills flex-column mb-auto">
|
||||
<li class="nav-item">
|
||||
<a href="#" class="nav-link active" aria-current="page">
|
||||
<svg class="bi pe-none me-2" width="16" height="16"><use xlink:href="#home"/></svg>
|
||||
Home
|
||||
</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="#" class="nav-link text-white">
|
||||
<svg class="bi pe-none me-2" width="16" height="16"><use xlink:href="#speedometer2"/></svg>
|
||||
Dashboard
|
||||
</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="#" class="nav-link text-white">
|
||||
<svg class="bi pe-none me-2" width="16" height="16"><use xlink:href="#table"/></svg>
|
||||
Orders
|
||||
</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="#" class="nav-link text-white">
|
||||
<svg class="bi pe-none me-2" width="16" height="16"><use xlink:href="#grid"/></svg>
|
||||
Products
|
||||
</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="#" class="nav-link text-white">
|
||||
<svg class="bi pe-none me-2" width="16" height="16"><use xlink:href="#people-circle"/></svg>
|
||||
Customers
|
||||
</a>
|
||||
</li>
|
||||
</ul>
|
||||
<hr>
|
||||
<div class="dropdown">
|
||||
<a href="#" class="d-flex align-items-center text-white text-decoration-none dropdown-toggle" data-bs-toggle="dropdown" aria-expanded="false">
|
||||
<img src="https://github.com/mdo.png" alt="" width="32" height="32" class="rounded-circle me-2">
|
||||
<strong>mdo</strong>
|
||||
</a>
|
||||
<ul class="dropdown-menu dropdown-menu-dark text-small shadow">
|
||||
<li><a class="dropdown-item" href="#">New Game</a></li>
|
||||
<li><a class="dropdown-item" href="#">Leaderboard</a></li>
|
||||
<li><a class="dropdown-item" href="#">Chat</a></li>
|
||||
<li><hr class="dropdown-divider"></li>
|
||||
<li><a class="dropdown-item" href="#">Profile</a></li>
|
||||
<li><hr class="dropdown-divider"></li>
|
||||
<li><a class="dropdown-item" href="#">Sign out</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
</main>
|
||||
</body>
|
||||
<style>
|
||||
body {
|
||||
min-height: 100vh;
|
||||
min-height: -webkit-fill-available;
|
||||
}
|
||||
|
||||
|
||||
main {
|
||||
height: 100vh;
|
||||
height: -webkit-fill-available;
|
||||
max-height: 100vh;
|
||||
overflow-x: auto;
|
||||
overflow-y: hidden;
|
||||
}
|
||||
|
||||
.dropdown-toggle { outline: 0; }
|
||||
|
||||
</style>
|
||||
Reference in New Issue
Block a user