cohabit/website
5
0
Fork 0
Code Issues Pull requests Actions Packages Projects Releases Wiki Activity

feat(ui): 💄 improve membercard size and background

Browse source
This commit is contained in:
Julien Oculi 2024-07-11 17:06:31 +02:00
parent 99f100540e
commit 57e09f8b31
2 changed files with 6 additions and 4 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

8
components/MemberCard.css
View file

@ -1,11 +1,12 @@
.components__member_card { .components__member_card {
display: grid; display: grid;
grid-template-rows: 1fr 5rem; grid-template-rows: 1fr auto;
min-width: 15rem; width: 16rem;
aspect-ratio: 1; aspect-ratio: 1;
box-shadow: 0 0 0.4rem 0.2rem var(--_translucent); box-shadow: 0 0 0.4rem 0.2rem var(--_translucent);
border: var(--_border-size) solid transparent; border: var(--_border-size) solid transparent;
background-size: cover; background-size: 90%;
background-position-x: center;
background-repeat: no-repeat; background-repeat: no-repeat;
&:has(a:focus-visible), &:has(a:focus-visible),
@ -15,6 +16,7 @@
& h3 { & h3 {
margin: 0; margin: 0;
text-align: center;
} }
& a { & a {

2
routes/index.tsx
View file

@ -51,7 +51,7 @@ export default function Home() {
</section> </section>
<section> <section>
<h2>Nos membres</h2> <h2>Nos membres</h2>
<AutoGrid columnWidth='15rem' style={{ alignItems: 'center' }}> <AutoGrid columnWidth='16rem' style={{ alignItems: 'center' }}>
<MemberCardList <MemberCardList
limit={4} limit={4}
usePlaceholder={true} usePlaceholder={true}