A Faculty Section is used to display faculty members of an organization, university, or team. It usually includes a photo, name, designation, bio, and social media links.
Program Faculty (Default)
Lorem Ipsum is simply dummy text of the printing
Lorem Ipsum is simply dummy text of the printing and typesetting industry.
<div class="col-lg-6 col-md-8 col-sm-10 col-12 m-auto">
<div class="faculty__items">
<div class="faculty__item">
<div class="faculty__item-picture">
<img src="./assets/component-images/faculty-default.svg" alt="faculty" />
</div>
<div class="faculty__item-info">
<div class="professor-name text-primary">Lorem Ipsum is simply</div>
<div class="professor-desc gray-dark-color">
<p class="professor-desc-designation"> Lorem Ipsum is simply dummy text of the printing</p>
<p class="professor-desc-bio"> Lorem Ipsum is simply dummy text of the printing and typesetting industry. </p>
<p>
<button class="btn--transparent text-accent">Button</button>
</p>
</div>
</div>
</div>
</div>
</div>Multiple Faculty
Lorem Ipsum is simply dummy text of the printing
Lorem Ipsum is simply dummy text of the printing and typesetting industry.
Lorem Ipsum is simply dummy text of the printing
Lorem Ipsum is simply dummy text of the printing and typesetting industry.
<div class="col-lg-10 col-12 m-auto">
<div class="faculty__items overflow-auto">
<div class="faculty__item">
<div class="faculty__item-picture">
<img src="./assets/component-images/faculty-default.svg" alt="faculty" />
</div>
<div class="faculty__item-info">
<div class="professor-name text-primary">Lorem Ipsum is simply</div>
<div class="professor-desc gray-dark-color">
<p class="professor-desc-designation"> Lorem Ipsum is simply dummy text of the printing</p>
<p class="professor-desc-bio"> Lorem Ipsum is simply dummy text of the printing and typesetting industry. </p>
<p>
<button class="btn--transparent text-accent">Button</button>
</p>
</div>
</div>
</div>
<div class="faculty__item">
<div class="faculty__item-picture">
<img src="./assets/component-images/faculty-default.svg" alt="faculty" />
</div>
<div class="faculty__item-info">
<div class="professor-name text-primary">Lorem Ipsum is simply</div>
<div class="professor-desc gray-dark-color">
<p class="professor-desc-designation"> Lorem Ipsum is simply dummy text of the printing</p>
<p class="professor-desc-bio"> Lorem Ipsum is simply dummy text of the printing and typesetting industry. </p>
<p>
<button class="btn--transparent text-accent">Button</button>
</p>
</div>
</div>
</div>
</div>
</div>