Skip to content

Page partenaires #122

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Open
arihuss wants to merge 5 commits into
base: master
Choose a base branch
from
Open

Page partenaires #122

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
5 commits
Select commit Hold shift + click to select a range
53e468f
fix grid + add hero
sarahhannets Jul 10, 2025
357ef88
clean up code
arihuss Jul 11, 2025
c323f60
arranger card positions
arihuss Jul 11, 2025
3bf350b
changer hover colors
arihuss Jul 12, 2025
78a3077
rajouter href
arihuss Jul 12, 2025
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
175 changes: 124 additions & 51 deletions css/partners.css
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,69 +1,142 @@
main {
padding: 3rem 0;

h2 {
.hero {
background-color: #101426;
text-align: center;
}
margin-bottom: 3rem;
max-width: 100%;
min-height: 340px;
padding-top: 12rem;

ul {
padding: 0 0 4rem 0;
grid-template-rows: repeat(3, 1fr);
justify-content: center;
display: grid;
gap: 3rem;
list-style: none;

li {
h1 {
font-size: 2rem;
font-weight: bold;
margin-bottom: 2rem;
color: white;
}

.button-group {
display: flex;
transition: background-color 200ms;
flex-direction: column;
max-width: 30rem;
position: relative;
padding: 1rem;
background-color: #e6f7ffd5;
border-radius: 0.5rem;
justify-content: center;
gap: 2rem;
flex-wrap: wrap;

a {
width: 12rem;
}
}
}

.container {
max-width: 1100px;
margin: 3rem auto;
padding: 0 1rem;

.section-title {
text-align: center;
font-weight: bold;
font-size: 2.3rem;
margin-bottom: 2rem;
}

.partner-grid {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
column-gap: 4rem;
row-gap: 1.3rem;
justify-items: center;
justify-content: center;
list-style: none;
margin: 4rem 2rem;
padding: 0;

img {
margin: auto;
li {
display: flex;
transition: background-color 200ms;
flex-direction: column;
max-width: 30rem;
width: 100%;
max-width: 40rem;
height: 19rem;
position: relative;
/*Needed to expand link hitbox over whole card!!!*/
padding: 1rem 1.5rem;
background-color: #fff;
border-radius: 0.5rem;
}
text-align: center;

a {
color: #000 !important;
text-decoration: none;
border: 2px solid transparent;
font-size: 1.5rem;
margin-top: 0.25rem;
margin-bottom: 0.5rem;
font-weight: 600;
}
img {
margin: auto;
width: 100%;
max-width: 40rem;
border-radius: 0.5rem;
}

/* Expand link hitbox over whole card */
a::before {
content: "";
position: absolute;
inset: 0;
cursor: pointer;
border: 2px solid transparent;
border-radius: 0.5rem;
transition: border-color 200ms;
a {
color: #95a3a5 !important;
/*Est-ce qu'on enleve le texte?*/
text-decoration: none;
font-size: 1.2rem;
margin-top: 0.25rem;
margin-bottom: 0.5rem;
font-weight: 600;
}

/* Expand link hitbox over whole card */
a::before {
content: "";
position: absolute;
inset: 0;
cursor: pointer;
border: 2px solid transparent;
border-radius: 0.5rem;
transition: border-color 200ms;
}

a:focus {
outline: none;
}
}

a:focus {
outline: none;

li:hover,
li:focus-within {
background-color: #e0dede;
/*maybe change these colors*/

a::before {
border-color: #000000;
}
}
}

li:hover,
li:focus-within {
background-color: #e2f4ff;
.plan-button {
display: block;
margin: 2rem auto 0;
text-align: center;
max-width: 26rem;
}
}

a::before {
border-color: #65a7d3;
}
.join-button {
background-color: #6571A7;
color: white;
padding: 0.8rem 3rem;
border: 2px solid white;
border-radius: 10px;
text-decoration: none;
font-weight: bold;
transition: background-color 0.3s ease;
font-size: 1.3rem;
}

.join-button:hover {
background-color: #535e91;
}
}

@media (max-width: 370px) {
.partner-grid {
li {
max-width: 15rem !important;
height: 15rem !important;
}
}
}
Binary file added images/partenaires/PlanDePartenariat2025.pdf
View file
Open in desktop
Binary file not shown.
64 changes: 34 additions & 30 deletions partenaires.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -4,7 +4,8 @@
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
<meta name="description" content="Merci à tous nos partenaires qui soutiennent ApplETS, le club de développement mobile de l'ÉTS. Découvrez nos partenaires, tels que l'École de Technologie Supérieure, Intact #IntactLab, et la Banque Nationale du Canada. Envie de soutenir l'innovation ? Remplissez notre formulaire de don en ligne ou contactez-nous pour des partenariats industriels.">
<meta name="description"
content="Merci à tous nos partenaires qui soutiennent ApplETS, le club de développement mobile de l'ÉTS. Découvrez nos partenaires, tels que l'École de Technologie Supérieure, Intact #IntactLab, et la Banque Nationale du Canada. Envie de soutenir l'innovation ? Remplissez notre formulaire de don en ligne ou contactez-nous pour des partenariats industriels.">

<link rel="icon" type="image/webp" href="images/favicon.webp">
<link rel="stylesheet" href="css/styles.css">
Expand All @@ -17,39 +18,42 @@
<body>
<header id="header" data-current-page="partners"></header>

<main id="main" class="container">
<h1>Merci à tous nos partenaires.</h1>

<ul>
<li>
<img src="images/partenaires/ets.png" alt="">
<a href="https://www.etsmtl.ca">École de Technologie Supérieure</a>
</li>

<li>
<img src="images/partenaires/intact.png" alt="">
<a href="https://www.intact.ca">Intact #IntactLab team</a>
</li>

<li>
<img src="images/partenaires/bnc.webp" alt="">
<a href="https://www.bnc.ca">Banque Nationale du Canada</a>
</li>
</ul>

<h2>Vous souhaitez nous soutenir ? Investir dans la nouvelle économie du savoir&nbsp;?</h2>
<p class="partner-content">
Remplissez notre <a href="https://www.jedonneenligne.org/fdets/frm_detail.php?FrmUID=75">formulaire de don en
ligne</a> et bénéficiez de nombreux avantages corporatifs.
Contactez-nous à l’adresse <a href="mailto:ApplETS@etsmtl.ca">ApplETS@etsmtl.ca</a> afin d’avoir plus
d’information concernant les bénéfices que votre entreprise recevra. Vous pouvez aussi remplir notre
formulaire de partenariat industriel afin de nous aider à créer des applications exceptionnelles pour la
communauté étudiante.
</p>
<main id="main">

<div class="hero">
<h1>Merci pour votre support&nbsp;!</h1>
<div class="button-group">
<a href="https://www.jedonneenligne.org/fdets/CLUBSDONSCIEN/?PersonalKey=1&FrmTrxType=Da%2FoFePL19ORosiL8yj7yA%3D%3D&FrmActUID4583=7k%2F2gfptO29%2BsQaCmkqTGg%3D%3D"
class="join-button" target="_blank">Contribuer</a>
<a href="mailto:ApplETS@etsmtl.ca" class="join-button" target="_blank">Devenir Partenaire</a>
</div>
</div>

<div class="container">
<h1 class="section-title">NOS PARTENAIRES</h1>
<ul class="partner-grid">
<li>
<img src="images/partenaires/intact.png" alt="">
<a href="https://www.intact.ca">Intact #IntactLab team</a>
</li>
<li>
<img src="images/partenaires/ets.png" alt="">
<a href="https://www.etsmtl.ca">École de Technologie Supérieure</a>
</li>
<li>
<img src="images/partenaires/bnc.webp" alt="">
<a href="https://www.bnc.ca">Banque Nationale du Canada</a>
</li>
</ul>

<a href="images\partenaires\PlanDePartenariat2025.pdf" class="plan-button join-button" target="_blank">Découvrir
notre plan de partenariat</a>
</div>
</main>

<footer id="footer"></footer>

<script src="js/load-header-footer.js"></script>
</body>

</html>