Merge pull request #3087 from matrix-org/MTRNord/frontpage-plat-members

add a section for platinum members as well as a call to action for becoming a member
This commit is contained in:
Marcel 2025-12-19 19:51:35 +01:00 committed by GitHub
commit 90543e68d0
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
5 changed files with 167 additions and 1 deletions

View file

@ -0,0 +1 @@
All Rights Reserved. The Element name, logo and device are registered trade marks of Element Creations Ltd.

View file

@ -273,6 +273,87 @@
}
}
#platinum-sponsor {
display: flex;
flex-direction: column;
gap: 28px;
padding: 80px;
overflow: hidden;
align-items: center;
color: #fff;
background-color: #000;
text-align: center;
h2 {
font-size: 2.5rem;
}
.row {
display: grid;
grid-template-columns: repeat(
auto-fit,
minmax(min(100%, 400px), 1fr)
);
gap: 28px;
max-width: 55.8rem;
}
.membership-card {
max-width: 648px;
padding: 28px;
border-radius: 16px;
border: 1px #3c3f44 solid;
display: flex;
flex-direction: column;
text-align: center;
gap: 28px;
}
.membership-card__content {
flex-direction: column;
align-items: center;
gap: 16px;
display: flex;
img {
width: 148px;
height: 42px;
object-fit: contain;
}
}
.membership-card__extra {
border-top: 1px #3c3f44 solid;
padding-top: 16px;
}
}
#become-a-member {
display: flex;
flex-direction: column;
padding: 80px;
overflow: hidden;
align-items: center;
color: #000;
background-color: #fff;
h2 {
font-size: 2.5rem;
}
#become-a-member__content {
max-width: 55.8rem;
flex-direction: column;
align-items: center;
gap: 28px;
display: flex;
text-align: center;
p {
text-wrap: balance;
}
}
}
#buildonmatrix {
display: flex;
flex-direction: column;

File diff suppressed because one or more lines are too long

After

Width:  |  Height:  |  Size: 15 KiB

View file

@ -0,0 +1,3 @@
# SPDX-FileCopyrightText: 2025 Element Creations Ltd
#
# SPDX-License-Identifier: LicenseRef-ElementLogo

View file

@ -46,6 +46,25 @@
<img src="/element-call.webp" id="complex-apps-image"
alt="A conversation between four people on Element Call, a VoIP conference tool based on Matrix." />
</div>
<div id="platinum-sponsor" class="section">
<h2>Platinum member</h2>
<div class="row">
<div class="membership-card">
<a target="_blank" rel="noreferrer noopener" href="https://element.io/built-on-matrix" class="membership-card__content">
<img alt="Element.io Logo" src="images/element-creators-of-matrix--dark.svg"></img>
</a>
</div>
</div>
</div>
<div id="become-a-member" class="section">
<div id="become-a-member__content">
<h2>Become a member</h2>
<p>The Matrix.org Foundation members guide and support the Foundation's focus.</p>
<a href="/membership" class="call-to-action">Support us</a>
</div>
</div>
<div id="buildonmatrix" class="section">
<img class="logo" src="images/matrix-favicon.svg" alt="The Matrix Logo" />
<img id="bridge_visual" src="/assets/frontpage/bridge-visual.svg"
@ -67,4 +86,3 @@
</div>
</div>
{% endblock content %}