ceza/GoupiliotWebsite
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Initial commit

Browse Source
This commit is contained in:
celeste
2026-01-19 14:45:57 +01:00
parent 751cff5eae
commit 24c86951cc
32 changed files with 3970 additions and 114 deletions
Download Patch File Download Diff File Expand all files Collapse all files

18
src/lib/Card.svelte
View File

@@ -36,8 +36,9 @@
<style>
main {
border-color: var(--text, #000);
border-style: solid;
border-width: 0.2em;
border-width: 0.15em;
margin: 1em;
background-color: var(--primary-soft, #f4f4f4);
@@ -52,9 +53,9 @@
min-height: inherit;
background-image:
linear-gradient(135deg, var(--primary-dark, #333) 10px, transparent 11px),
linear-gradient(45deg, var(--primary-dark, #333) 10px, transparent 11px),
linear-gradient(to right, var(--primary-dark, #333) 50px, transparent 50px);
linear-gradient(135deg, var(--primary, #333) 10px, transparent 11px),
linear-gradient(45deg, var(--primary, #333) 10px, transparent 11px),
linear-gradient(to right, var(--primary, #333) 50px, transparent 50px);
background-size:
30px 30px,
30px 30px,
@@ -92,6 +93,15 @@
margin-top: auto;
}
@media (max-width: 768px) {
.triangle-pattern {
background-image: none;
}
.child{
margin: 0 0;
}
}
</style>

45
src/routes/(accueil)/+layout.svelte Normal file
View File

@@ -0,0 +1,45 @@
<script lang="ts">
import favicon from '$lib/assets/favicon.svg';
let { children } = $props();
</script>
<svelte:head>
<link rel="icon" href={favicon} />
</svelte:head>
<div class="container">
<main class="content">
{@render children()}
</main>
</div>
<style>
:global(body) {
margin: 0;
padding: 0;
}
.container {
width: 100%;
max-height: 100vh;
}
.content {
max-width: 1000px;
margin: 0 auto;
padding: 2rem;
background-color: var(--background-alpha);
border-left: 4px solid var(--accent);
border-right: 4px solid var(--accent);
min-height: 100vh;
}
@media (max-width: 768px) {
.content {
padding: 1rem;
border-left-width: 2px;
}
}
</style>

0
src/routes/+page.svelte → src/routes/(accueil)/+page.svelte
View File

110
src/routes/+layout.svelte
View File

@@ -1,110 +0,0 @@
<script lang="ts">
import favicon from '$lib/assets/favicon.svg';
let { children } = $props();
</script>
<svelte:head>
<link rel="icon" href={favicon} />
</svelte:head>
<main>
<div class="left-panel">
<div class="pp">
<p>
pp
</p>
</div>
<div class="menu">
<p>
qdskjn
</p>
</div>
</div>
<div class="content">
{@render children()}
</div>
</main>
<style>
:global(body) {
margin: 0;
padding: 0;
}
main {
display: flex;
width: 100%;
height: 100%;
flex-direction: row;
}
.pp {
border: 2px solid black;
border-top: none;
width:100%;
padding: 2em;
margin-bottom: 2em;
height: 20%;
background-color: var(--background-alpha);
}
.left-panel {
display: flex;
flex-direction: column;
width: 15%;
margin-left: 3%;
justify-content: center;
}
.menu {
height: 60%;
display: flex;
flex-direction: column;
width: 100%;
margin: auto;
padding: 2em;
background-color: var(--background-alpha);
border-bottom: none;
}
.content {
display: flex;
flex-direction: column;
width: 63%;
margin: 0 auto;
padding: 2rem;
background-color: var(--background-alpha);
border-left: 4px solid var(--accent);
border-right: 4px solid var(--accent);
min-height: 100vh;
}
@media (max-width: 768px) {
.content {
padding: 1rem;
border-left-width: 2px;
}
}
</style>

149
src/routes/croa/+layout.svelte Normal file
View File

@@ -0,0 +1,149 @@
<script lang="ts">
import favicon from '$lib/assets/favicon.svg';
let { children } = $props();
</script>
<svelte:head>
<link rel="icon" href={favicon} />
</svelte:head>
<main>
<div class="menu-bottom">
</div>
<div class="left-panel">
<div class="pp">
<img src="lumity.jpg">
</div>
</div>
<div class="content">
{@render children()}
</div>
</main>
<style>
:global(body) {
margin: 0;
padding: 0;
}
main {
display: flex;
width: 100%;
height: 100%;
flex-direction: row;
}
.pp {
border: 5px solid var(--primary);
border-radius: 50%;
margin-bottom: 90%;
margin-top: 1em;
background-color: var(--background-alpha);
img {
border-radius: 50%;
width: 100%;
height:100%;
}
}
.left-panel {
display: flex;
justify-content: top;
flex-direction: column;
width: 13%;
padding-left: 3%;
padding-right: 3%;
background-color: var(--tertiary);
}
.menu-left {
display: flex;
flex-direction: column;
padding-left: 10%;
min-height: 70vh;
background-color: var(--primary-soft);
border: 0.15em solid var(--text);
border-radius: 10px;
}
.marge-pattern {
background-image:
linear-gradient(to right, var(--primary, #333) 10px, transparent 10px);
background-size:
100% 100%;
background-position:
0 0;
background-repeat:
no-repeat;
}
.menu-bottom {
position: fixed;
display: flex;
flex-direction: column;
width: 30%;
height: 20%;
background-color: var(--primary-soft);
bottom: 5%;
right: 5%;
border: 0.15em solid var(--text);
overflow: hidden;
z-index: 1000;
}
.content {
display: flex;
flex-direction: column;
width: 60%;
padding: 2rem;
background-color: var(--background-alpha);
border-left: 4px solid var(--accent);
border-right: 4px solid var(--accent);
min-height: 100vh;
}
@media (max-width: 768px) {
.content {
padding: 1rem;
border-left-width: 2px;
width: 100%
}
.menu-bottom {
position: fixed;
flex-direction: row;
width: 100%;
height: 10%;
bottom: 0;
right:0;
}
.left-panel{
position: fixed;
z-index: 1000;
width: 15%;
}
}
</style>