agecem/agecem-org
4
1
Fork 0
Code Issues 33 Pull requests 2 Activity

Création et implémentation d'une snackbar #107

Merged
vlbeaudoin merged 3 commits from feature/snackbar into main 2023-08-22 14:00:00 -04:00
Conversation 0 Commits 3 Files changed 6 +70 -1
6 changed files with 70 additions and 1 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

42
public/css/snackbar.css Normal file
View file

@ -0,0 +1,42 @@
.snackbar {
position: fixed;
bottom: 0;
background-color: #FF563C;
color: #fff;
width: 100%;
padding: 5px 0;
}
.snackbar-is-closed {
display: none;
}
.snackbarWrapper {
display: flex;
flex-flow: row;
align-items: center;
justify-content: space-between;
line-height: 100%;
}
span {
margin: 10px 10px 10px 0;
font-size: 0.75rem;
/*12px*/
font-family: 'Poppins';
font-weight: 600;
/*semi-bold*/
}
@media screen and (min-width: 375px) {
span {
font-size: 1rem;
/*16px*/
}
}
.snackbarFermer {
height: 30px;
width: 30px;
cursor: pointer;
}

10
public/icones/fermer.svg Normal file
View file

@ -0,0 +1,10 @@
<svg width="512" height="512" viewBox="0 0 512 512" fill="none" xmlns="http://www.w3.org/2000/svg">
<g clip-path="url(#clip0_1412_1060)">
<path d="M256 16C123.45 16 16 123.45 16 256C16 388.55 123.45 496 256 496C388.55 496 496 388.55 496 256C496 123.45 388.55 16 256 16ZM256 76C355.41 76 436 156.59 436 256C436 355.41 355.41 436 256 436C156.59 436 76 355.41 76 256C76 156.59 156.59 76 256 76ZM175.375 136C174.405 135.995 173.369 136.112 172.312 136.313V136.281C154.015 139.717 127.048 171.024 138.937 182.907L212.094 256.032L138.938 329.158C124.308 343.783 168.213 387.692 182.844 373.064L256 299.906L329.156 373.062C343.786 387.69 387.693 343.782 373.062 329.156L299.906 256.031L373.062 182.907C387.692 168.282 343.787 124.407 329.156 139.032L256 212.157L182.844 139.032C180.784 136.986 178.284 136.017 175.374 136.002L175.375 136Z" fill="white"/>
</g>
<defs>
<clipPath id="clip0_1412_1060">
<rect width="512" height="512" fill="white"/>
</clipPath>
</defs>
</svg>
Side by side

After

Width:  |  Height:  |  Size: 965 B

2
templates/html/documentation.gohtml
View file

@ -17,7 +17,6 @@
{{ $bucket_display_name := .DisplayName }} {{ $bucket_display_name := .DisplayName }}
<details class="documentationCategorie"> <details class="documentationCategorie">
<summary class="documentationDescription">{{ $bucket_display_name }}</summary> <summary class="documentationDescription">{{ $bucket_display_name }}</summary>
<ul class="documentationListe"> <ul class="documentationListe">
{{ range .Documents }} {{ range .Documents }}
<a class ="documentationLien" href="/public/documentation/{{ $bucket_name }}/{{ . }}"><li class="documentationDocument">{{ . }}</li></a> <a class ="documentationLien" href="/public/documentation/{{ $bucket_name }}/{{ . }}"><li class="documentationDocument">{{ . }}</li></a>
@ -30,6 +29,7 @@
{{ .Message }} {{ .Message }}
</p> </p>
</div> </div>
{{ template "snackbar-html" }}
</body> </body>
</html> </html>
{{ end }} {{ end }}

1
templates/html/index.gohtml
View file

@ -13,6 +13,7 @@
<h1 class="heading1">AGECEM</h1> <h1 class="heading1">AGECEM</h1>
<h2 class="heading2">Association Générale Étudiante du Cégep Édouard-Montpetit</h2> <h2 class="heading2">Association Générale Étudiante du Cégep Édouard-Montpetit</h2>
</div> </div>
{{ template "snackbar-html" }}
</body> </body>
</html> </html>
{{ end }} {{ end }}

15
templates/html/snackbar.gohtml Normal file
View file

@ -0,0 +1,15 @@
{{ define "snackbar-html" }}
<link rel="stylesheet" href="/public/css/snackbar.css">
<script>
function closeSnackbar() {
var snackbar = document.querySelector(".snackbar");
snackbar.classList.add('snackbar-is-closed');
}
</script>
<div class="snackbar">
<div class="wrapper snackbarWrapper">
<span class="snackbarTexte">Ce site web est présentement en construction.</span>
<img src="/public/icones/fermer.svg" class="snackbarFermer" onclick="closeSnackbar()"></img>
</div>
</div>
{{ end }}

1
templates/html/vie-etudiante.gohtml
View file

@ -11,6 +11,7 @@
<div class="wrapper vieEtudianteWrapper"> <div class="wrapper vieEtudianteWrapper">
<h1 class="heading1">Vie étudiante</h1> <h1 class="heading1">Vie étudiante</h1>
</div> </div>
{{ template "snackbar-html" }}
</body> </body>
</html> </html>
{{ end }} {{ end }}