Cards wall list

Basic examples

Default

Vestibulum tincidunt ante non risus efficitur, feugiat auctor massa congue. Nam eu turpis non eros molestie tempus et in arcu.

Employee 3290 Lastname Besch Grupp 🌿

Futur président

Quisque eu velit feugiat, mollis ipsum eget, aliquam nibh. Donec blandit vitae nisl quis rhoncus. Mauris id justo sit amet nisl egestas ullamcorper.

Employee 502 Lastname Cocons👼🏻🐚

Employee 507 Lastname Besch Grupp 🌿

Employee 7106 Lastname Besch Grupp 🌿

Employee 2772 Lastname Besch Grupp 🌿

Einstein taré

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla id feugiat magna,

Employee 2879 Lastname Direction 🏰

Double grosses aptitudes

Maecenas nisi ante, molestie nec felis in, cursus porta tortor. Praesent at neque nec sem pharetra tempor. Maecenas tristique sem id enim dignissim, sit amet dignissim mi hendrerit. Phasellus molestie venenatis magna commodo tincidunt. Nfdsg sdfgsdfg

Employee 504 Lastname Maintenance 🦺

Employee 509 Lastname Papillons 💛

Employee 2776 Lastname Cuisine 🧁

Bully

Ut vitae massa ut purus maximus posuere vitae eget diam. Donec placerat faucibus commodo. Pellentesque venenatis, ante eu fringilla elementum, lectus dui fringilla tellus, eu lobortis erat dolor in nibh.

Employee 4510 Lastname

Presque utile

Mauris vitae sem gravida, rutrum nisl fermentum, viverra nibh

Employee 4703 Lastname

Employee 505 Lastname Besch Grupp 🌿

Employee 6742 Lastname Papillons jaunes 💛

Employee 2777 Lastname Maintenance 🦺

Grosse aptitude

Mauris at augue ullamcorper, consequat nibh quis, eleifend arcu. Cras elit urna, vestibulum a lorem vel, porta laoreet nulla.

Employee 4497 Lastname

Mort avant la fin

Employee 4640 Lastname Cocons👼🏻🐚

Meurt à la fin

Suspendisse eget maximus tortor. Nunc egestas aliquet nunc sit amet sollicitudin. Maecenas sit amet commodo turpis. Ut vitae massa ut purus maximus posuere vitae eget diam.

Employee 508 Lastname Papillons jaunes 💛

Show code


                <div class="cardWallList whiteContainer">
                <div class="teamWall"><div class="teamWall__column"><a class="teamCard" style="--teamCard-tilt: -1.1deg">
                <div class="teamCard__photo">
                <img src="http://127.0.0.1:8000/storage/employees/10/25846a9a90c0c15483.67651496.jpeg" alt="Employee 2584 Lastname" loading="lazy">
                <div class="teamCard__scrim">
                <div class="teamCard__identity">
                <span class="teamCard__name">Employee 2584 Lastname</span>
                <span class="badge -small -white">Direction 🏰</span>
                </div>
                <span class="teamCard__degree">Tout vert</span>
                </div>
                </div>
                <p class="teamCard__bio has-background-theme-primary-200">Vestibulum tincidunt ante non risus efficitur, feugiat auctor massa congue. Nam eu turpis non eros molestie tempus et in arcu.</p>
                </a><a class="teamCard" style="--teamCard-tilt: -1.4deg">
                <div class="teamCard__photo">
                <img src="http://127.0.0.1:8000/storage/employees/10/32906a9a91477c4be2.30024961.jpeg" alt="Employee 3290 Lastname" loading="lazy">
                <div class="teamCard__scrim">
                <div class="teamCard__identity">
                <span class="teamCard__name">Employee 3290 Lastname</span>
                <span class="badge -small -white">Besch Grupp 🌿</span>
                </div>
                <span class="teamCard__degree">Futur président</span>
                </div>
                </div>
                <p class="teamCard__bio has-background-theme-primary-200">Quisque eu velit feugiat, mollis ipsum eget, aliquam nibh. Donec blandit vitae nisl quis rhoncus. Mauris id justo sit amet nisl egestas ullamcorper.</p>
                </a><a class="teamCard" style="--teamCard-tilt: -.7deg">
                <div class="teamCard__photo">
                <span class="teamCard__monogram has-background-theme-primary-600" aria-hidden="true">
                E L
                </span>
                <div class="teamCard__scrim">
                <div class="teamCard__identity">
                <span class="teamCard__name">Employee 502 Lastname</span>
                <span class="badge -small -white">Cocons👼🏻🐚</span>
                </div>
                </div>
                </div>
                </a><a class="teamCard" style="--teamCard-tilt: -.7deg">
                <div class="teamCard__photo">
                <span class="teamCard__monogram has-background-theme-primary-600" aria-hidden="true">
                E L
                </span>
                <div class="teamCard__scrim">
                <div class="teamCard__identity">
                <span class="teamCard__name">Employee 507 Lastname</span>
                <span class="badge -small -white">Besch Grupp 🌿</span>
                </div>
                </div>
                </div>
                </a><a class="teamCard" style="--teamCard-tilt: 1.1deg">
                <div class="teamCard__photo">
                <span class="teamCard__monogram has-background-theme-secondary-500" aria-hidden="true">
                E L
                </span>
                <div class="teamCard__scrim">
                <div class="teamCard__identity">
                <span class="teamCard__name">Employee 7106 Lastname</span>
                <span class="badge -small -white">Besch Grupp 🌿</span>
                </div>
                </div>
                </div>
                </a></div><div class="teamWall__column"><a class="teamCard" style="--teamCard-tilt: -.7deg">
                <div class="teamCard__photo">
                <span class="teamCard__monogram has-background-theme-primary-600" aria-hidden="true">
                E L
                </span>
                <div class="teamCard__scrim">
                <div class="teamCard__identity">
                <span class="teamCard__name">Employee 2772 Lastname</span>
                <span class="badge -small -white">Besch Grupp 🌿</span>
                </div>
                <span class="teamCard__degree">Einstein taré</span>
                </div>
                </div>
                <p class="teamCard__bio has-background-theme-primary-200">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla id feugiat magna,</p>
                </a><a class="teamCard" style="--teamCard-tilt: -1.1deg">
                <div class="teamCard__photo">
                <img src="http://127.0.0.1:8000/storage/employees/10/28796a9a910e506a88.76271286.jpeg" alt="Employee 2879 Lastname" loading="lazy">
                <div class="teamCard__scrim">
                <div class="teamCard__identity">
                <span class="teamCard__name">Employee 2879 Lastname</span>
                <span class="badge -small -white">Direction 🏰</span>
                </div>
                <span class="teamCard__degree">Double grosses aptitudes</span>
                </div>
                </div>
                <p class="teamCard__bio has-background-theme-primary-200">Maecenas nisi ante, molestie nec felis in, cursus porta tortor. Praesent at neque nec sem pharetra tempor. Maecenas tristique sem id enim dignissim, sit amet dignissim mi hendrerit. Phasellus molestie venenatis magna commodo tincidunt. Nfdsg sdfgsdfg</p>
                </a><a class="teamCard" style="--teamCard-tilt: -1.1deg">
                <div class="teamCard__photo">
                <span class="teamCard__monogram has-background-theme-primary-500" aria-hidden="true">
                E L
                </span>
                <div class="teamCard__scrim">
                <div class="teamCard__identity">
                <span class="teamCard__name">Employee 504 Lastname</span>
                <span class="badge -small -white">Maintenance 🦺</span>
                </div>
                </div>
                </div>
                </a><a class="teamCard" style="--teamCard-tilt: -1.1deg">
                <div class="teamCard__photo">
                <span class="teamCard__monogram has-background-theme-primary-500" aria-hidden="true">
                E L
                </span>
                <div class="teamCard__scrim">
                <div class="teamCard__identity">
                <span class="teamCard__name">Employee 509 Lastname</span>
                <span class="badge -small -white">Papillons 💛</span>
                </div>
                </div>
                </div>
                </a></div><div class="teamWall__column"><a class="teamCard" style="--teamCard-tilt: 1.1deg">
                <div class="teamCard__photo">
                <img src="http://127.0.0.1:8000/storage/employees/10/27766a9a8c703cf127.29721112.webp" alt="Employee 2776 Lastname" loading="lazy">
                <div class="teamCard__scrim">
                <div class="teamCard__identity">
                <span class="teamCard__name">Employee 2776 Lastname</span>
                <span class="badge -small -white">Cuisine 🧁</span>
                </div>
                <span class="teamCard__degree">Bully</span>
                </div>
                </div>
                <p class="teamCard__bio has-background-theme-primary-200">Ut vitae massa ut purus maximus posuere vitae eget diam. Donec placerat faucibus commodo. Pellentesque venenatis, ante eu fringilla elementum, lectus dui fringilla tellus, eu lobortis erat dolor in nibh.</p>
                </a><a class="teamCard" style="--teamCard-tilt: -1.4deg">
                <div class="teamCard__photo">
                <img src="http://127.0.0.1:8000/storage/employees/10/45106a9a917fea57a7.01032673.jpeg" alt="Employee 4510 Lastname" loading="lazy">
                <div class="teamCard__scrim">
                <div class="teamCard__identity">
                <span class="teamCard__name">Employee 4510 Lastname</span>
                </div>
                <span class="teamCard__degree">Presque utile</span>
                </div>
                </div>
                <p class="teamCard__bio has-background-theme-primary-200">Mauris vitae sem gravida, rutrum nisl fermentum, viverra nibh</p>
                </a><a class="teamCard" style="--teamCard-tilt: 1.4deg">
                <div class="teamCard__photo">
                <span class="teamCard__monogram has-background-theme-secondary-600" aria-hidden="true">
                E L
                </span>
                <div class="teamCard__scrim">
                <div class="teamCard__identity">
                <span class="teamCard__name">Employee 4703 Lastname</span>
                </div>
                </div>
                </div>
                </a><a class="teamCard" style="--teamCard-tilt: -1.4deg">
                <div class="teamCard__photo">
                <span class="teamCard__monogram has-background-theme-primary-400" aria-hidden="true">
                E L
                </span>
                <div class="teamCard__scrim">
                <div class="teamCard__identity">
                <span class="teamCard__name">Employee 505 Lastname</span>
                <span class="badge -small -white">Besch Grupp 🌿</span>
                </div>
                </div>
                </div>
                </a><a class="teamCard" style="--teamCard-tilt: -.7deg">
                <div class="teamCard__photo">
                <span class="teamCard__monogram has-background-theme-primary-600" aria-hidden="true">
                E L
                </span>
                <div class="teamCard__scrim">
                <div class="teamCard__identity">
                <span class="teamCard__name">Employee 6742 Lastname</span>
                <span class="badge -small -white">Papillons jaunes 💛</span>
                </div>
                </div>
                </div>
                </a></div><div class="teamWall__column"><a class="teamCard" style="--teamCard-tilt: -.7deg">
                <div class="teamCard__photo">
                <img src="http://127.0.0.1:8000/storage/employees/10/27776a9a90cc02c5c1.02786268.jpeg" alt="Employee 2777 Lastname" loading="lazy">
                <div class="teamCard__scrim">
                <div class="teamCard__identity">
                <span class="teamCard__name">Employee 2777 Lastname</span>
                <span class="badge -small -white">Maintenance 🦺</span>
                </div>
                <span class="teamCard__degree">Grosse aptitude</span>
                </div>
                </div>
                <p class="teamCard__bio has-background-theme-primary-200">Mauris at augue ullamcorper, consequat nibh quis, eleifend arcu. Cras elit urna, vestibulum a lorem vel, porta laoreet nulla.</p>
                </a><a class="teamCard" style="--teamCard-tilt: -.7deg">
                <div class="teamCard__photo">
                <span class="teamCard__monogram has-background-theme-primary-600" aria-hidden="true">
                E L
                </span>
                <div class="teamCard__scrim">
                <div class="teamCard__identity">
                <span class="teamCard__name">Employee 4497 Lastname</span>
                </div>
                <span class="teamCard__degree">Mort avant la fin</span>
                </div>
                </div>
                </a><a class="teamCard" style="--teamCard-tilt: -1.4deg">
                <div class="teamCard__photo">
                <img src="http://127.0.0.1:8000/storage/employees/10/46406a9a91ddad1d93.16135838.jpeg" alt="Employee 4640 Lastname" loading="lazy">
                <div class="teamCard__scrim">
                <div class="teamCard__identity">
                <span class="teamCard__name">Employee 4640 Lastname</span>
                <span class="badge -small -white">Cocons👼🏻🐚</span>
                </div>
                <span class="teamCard__degree">Meurt à la fin</span>
                </div>
                </div>
                <p class="teamCard__bio has-background-theme-primary-200">Suspendisse eget maximus tortor. Nunc egestas aliquet nunc sit amet sollicitudin. Maecenas sit amet commodo turpis. Ut vitae massa ut purus maximus posuere vitae eget diam.</p>
                </a><a class="teamCard" style="--teamCard-tilt: 1.4deg">
                <div class="teamCard__photo">
                <span class="teamCard__monogram has-background-theme-secondary-600" aria-hidden="true">
                E L
                </span>
                <div class="teamCard__scrim">
                <div class="teamCard__identity">
                <span class="teamCard__name">Employee 508 Lastname</span>
                <span class="badge -small -white">Papillons jaunes 💛</span>
                </div>
                </div>
                </div>
                </a></div></div></div>