User Profile
Component #1
Hanna Wolfe
July 15, 2018
<div class="container">
<!-- Author -->
<div class="border-top border-bottom py-4">
<div class="row align-items-md-center">
<div class="col-md-7 mb-5 mb-md-0">
<div class="media align-items-center">
<div class="avatar avatar-circle">
<img class="avatar-img" src="../assets/img/100x100/img11.jpg" alt="Image Description">
</div>
<div class="media-body font-size-1 ml-3">
<span class="h6"><a href="#">Hanna Wolfe</a> <button type="button" class="btn btn-xs btn-soft-primary font-weight-bold transition-3d-hover py-1 px-2 ml-1">Follow</button></span>
<span class="d-block text-muted">July 15, 2018</span>
</div>
</div>
</div>
<div class="col-md-5">
<div class="d-flex justify-content-md-end align-items-center">
<span class="d-block small font-weight-bold text-cap mr-2">Share:</span>
<a class="btn btn-xs btn-icon btn-soft-secondary rounded-circle ml-2" href="#">
<i class="fab fa-facebook-f"></i>
</a>
<a class="btn btn-xs btn-icon btn-soft-secondary rounded-circle ml-2" href="#">
<i class="fab fa-twitter"></i>
</a>
<a class="btn btn-xs btn-icon btn-soft-secondary rounded-circle ml-2" href="#">
<i class="fab fa-instagram"></i>
</a>
<a class="btn btn-xs btn-icon btn-soft-secondary rounded-circle ml-2" href="#">
<i class="fab fa-telegram"></i>
</a>
</div>
</div>
</div>
</div>
<!-- End Author -->
</div>
Component #2
Written by
Hanna Wolfe
I create advanced website builders made exclusively for web developers.
<div class="container">
<!-- Author -->
<div class="media align-items-center border-top border-bottom py-5">
<div class="avatar avatar-circle avatar-xl">
<img class="avatar-img" src="../../assets/img/100x100/img11.jpg" alt="Image Description">
</div>
<div class="media-body ml-3">
<small class="d-block small font-weight-bold text-cap">Written by</small>
<h3 class="mb-0"><a href="#">Hanna Wolfe</a> <button type="button" class="btn btn-xs btn-soft-primary font-weight-bold transition-3d-hover py-1 px-2 ml-1">Follow</button></h3>
<p class="mb-0">I create advanced website builders made exclusively for web developers.</p>
</div>
</div>
<!-- End Author -->
</div>
Component #3
Hanna Wolfe
906
Posts
19.5k
Followers
109
Following
Nataly is a freelance journalist who's been published by Popular Science, The Washington Post, USA Today, Slate, and many more. Read more at hannawolfe.com
<!-- User Profile Section -->
<div class="container space-2">
<div class="border-bottom w-md-75 w-lg-60 space-bottom-2 mx-md-auto">
<div class="media d-block d-sm-flex">
<div class="position-relative mx-auto mb-3 mb-sm-0 mr-sm-4" style="width: 160px; height: 160px;">
<img class="img-fluid rounded-circle" src="../../assets/img/160x160/img1.jpg" alt="Image Description" width="160" height="160">
<img class="bg-white position-absolute bottom-0 right-0 rounded-circle p-1" src="../../assets/svg/illustrations/top-vendor.svg" alt="Icon" width="36" height="36" title="Top Writer">
</div>
<div class="media-body">
<div class="d-flex justify-content-between align-items-center mb-2">
<h1 class="h3">Hanna Wolfe</h1>
<div class="d-block">
<button type="button" class="btn btn-xs btn-outline-primary font-weight-bold text-nowrap ml-1">Follow</button>
</div>
</div>
<div class="row text-body font-size-1 mb-2">
<div class="col-auto">
<span class="h6">906</span>
<span>Posts</span>
</div>
<div class="col-auto">
<span class="h6">19.5k</span>
<span>Followers</span>
</div>
<div class="col-auto">
<span class="h6">109</span>
<span>Following</span>
</div>
</div>
<p class="mb-0">Nataly is a freelance journalist who's been published by Popular Science, The Washington Post, USA Today, Slate, and many more. Read more at <a class="font-weight-bold" href="#">hannawolfe.com</a></p>
</div>
</div>
</div>
</div>
<!-- End User Profile Section -->
Component #4
About the instructor
4.87 Instructor rating
1,533 reviews
23,912 students
29 courses
Nataly Gaga
Head of Data Science, Pierian Data Inc.Nataly Gaga has a BS and MS in Mechanical Engineering from Santa Clara University and years of experience as a professional instructor and trainer for Data Science and programming. She has publications and patents in various fields such as microfluidics, materials science, and data science technologies.
<!-- Author -->
<div class="container">
<h3 class="mb-4">About the instructor</h3>
<div class="row">
<div class="col-lg-4 mb-4 mb-lg-0">
<div class="avatar avatar-xl avatar-circle mb-3">
<img class="avatar-img" src="../../assets/img/100x100/img1.jpg" alt="Image Description">
</div>
<!-- Icon Block -->
<div class="media text-body font-size-1 mb-2">
<div class="min-w-3rem text-center mr-2">
<i class="fa fa-star"></i>
</div>
<div class="media-body">
4.87 Instructor rating
</div>
</div>
<!-- End Icon Block -->
<!-- Icon Block -->
<div class="media text-body font-size-1 mb-2">
<div class="min-w-3rem text-center mr-2">
<i class="fa fa-comments"></i>
</div>
<div class="media-body">
1,533 reviews
</div>
</div>
<!-- End Icon Block -->
<!-- Icon Block -->
<div class="media text-body font-size-1 mb-2">
<div class="min-w-3rem text-center mr-2">
<i class="fa fa-user"></i>
</div>
<div class="media-body">
23,912 students
</div>
</div>
<!-- End Icon Block -->
<!-- Icon Block -->
<div class="media text-body font-size-1 mb-2">
<div class="min-w-3rem text-center mr-2">
<i class="fa fa-play"></i>
</div>
<div class="media-body">
29 courses
</div>
</div>
<!-- End Icon Block -->
</div>
<div class="col-lg-8">
<!-- Info -->
<div class="mb-2">
<h4 class="h5 mb-1"><a href="author.html">Nataly Gaga</a></h4>
<span class="d-block font-size-1 font-weight-bold">Head of Data Science, Pierian Data Inc.</span>
</div>
<p>Nataly Gaga has a BS and MS in Mechanical Engineering from Santa Clara University and years of experience as a professional instructor and trainer for Data Science and programming. She has publications and patents in various fields such as microfluidics, materials science, and data science technologies.</p>
<!-- End Info -->
</div>
</div>
</div>
<!-- End Author -->