123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338 |
- <template>
- <main class="p-5">
- <h1 class="my-3 text-4xl font-medium">
- Featured Builders
- </h1>
- <!-- Page Section -->
- <section class="">
- <div class="">
- <!-- Default box -->
- <div class="card card-solid">
- <div class="card-body pb-0">
- <div class="row d-flex align-items-stretch">
- <div class="col-12 col-sm-6 col-md-4 d-flex align-items-stretch">
- <div class="card bg-light">
- <div class="card-header border-bottom-0">
- Lead Developer
- </div>
- <div class="card-body pt-0">
- <div class="row">
- <div class="col-7">
- <h2 class="lead"><b>0xShomari</b></h2>
- <p class="text-sm"><b>About: </b> Web Designer / UX / Graphic Artist / Coffee Lover </p>
- <ul class="ml-4 mb-0 fa-ul text-muted">
- <li class="small"><span class="fa-li"><i class="fas fa-lg fa-building"></i></span> Address: Demo Street 123, Demo City 04312, NJ</li>
- <li class="small"><span class="fa-li"><i class="fas fa-lg fa-phone"></i></span> Phone #: + 800 - 12 12 23 52</li>
- </ul>
- </div>
- <div class="col-5 text-center">
- <img src="@/assets/img/user1-128x128.jpg" alt="" class="img-circle img-fluid">
- </div>
- </div>
- </div>
- <div class="card-footer">
- <div class="text-right">
- <a href="#" class="btn btn-sm bg-teal">
- <i class="fas fa-comments"></i>
- </a>
- <a href="#" class="btn btn-sm btn-primary">
- <i class="fas fa-user"></i> View Profile
- </a>
- </div>
- </div>
- </div>
- </div>
- <div class="col-12 col-sm-6 col-md-4 d-flex align-items-stretch">
- <div class="card bg-light">
- <div class="card-header border-bottom-0">
- Digital Strategist
- </div>
- <div class="card-body pt-0">
- <div class="row">
- <div class="col-7">
- <h2 class="lead"><b>Nicole Pearson</b></h2>
- <p class="text-sm"><b>About: </b> Web Designer / UX / Graphic Artist / Coffee Lover </p>
- <ul class="ml-4 mb-0 fa-ul text-muted">
- <li class="small"><span class="fa-li"><i class="fas fa-lg fa-building"></i></span> Address: Demo Street 123, Demo City 04312, NJ</li>
- <li class="small"><span class="fa-li"><i class="fas fa-lg fa-phone"></i></span> Phone #: + 800 - 12 12 23 52</li>
- </ul>
- </div>
- <div class="col-5 text-center">
- <img src="@/assets/img/user2-160x160.jpg" alt="" class="img-circle img-fluid">
- </div>
- </div>
- </div>
- <div class="card-footer">
- <div class="text-right">
- <a href="#" class="btn btn-sm bg-teal">
- <i class="fas fa-comments"></i>
- </a>
- <a href="#" class="btn btn-sm btn-primary">
- <i class="fas fa-user"></i> View Profile
- </a>
- </div>
- </div>
- </div>
- </div>
- <div class="col-12 col-sm-6 col-md-4 d-flex align-items-stretch">
- <div class="card bg-light">
- <div class="card-header border-bottom-0">
- Digital Strategist
- </div>
- <div class="card-body pt-0">
- <div class="row">
- <div class="col-7">
- <h2 class="lead"><b>Nicole Pearson</b></h2>
- <p class="text-sm"><b>About: </b> Web Designer / UX / Graphic Artist / Coffee Lover </p>
- <ul class="ml-4 mb-0 fa-ul text-muted">
- <li class="small"><span class="fa-li"><i class="fas fa-lg fa-building"></i></span> Address: Demo Street 123, Demo City 04312, NJ</li>
- <li class="small"><span class="fa-li"><i class="fas fa-lg fa-phone"></i></span> Phone #: + 800 - 12 12 23 52</li>
- </ul>
- </div>
- <div class="col-5 text-center">
- <img src="@/assets/img/user1-128x128.jpg" alt="" class="img-circle img-fluid">
- </div>
- </div>
- </div>
- <div class="card-footer">
- <div class="text-right">
- <a href="#" class="btn btn-sm bg-teal">
- <i class="fas fa-comments"></i>
- </a>
- <a href="#" class="btn btn-sm btn-primary">
- <i class="fas fa-user"></i> View Profile
- </a>
- </div>
- </div>
- </div>
- </div>
- <div class="col-12 col-sm-6 col-md-4 d-flex align-items-stretch">
- <div class="card bg-light">
- <div class="card-header border-bottom-0">
- Digital Strategist
- </div>
- <div class="card-body pt-0">
- <div class="row">
- <div class="col-7">
- <h2 class="lead"><b>Nicole Pearson</b></h2>
- <p class="text-sm"><b>About: </b> Web Designer / UX / Graphic Artist / Coffee Lover </p>
- <ul class="ml-4 mb-0 fa-ul text-muted">
- <li class="small"><span class="fa-li"><i class="fas fa-lg fa-building"></i></span> Address: Demo Street 123, Demo City 04312, NJ</li>
- <li class="small"><span class="fa-li"><i class="fas fa-lg fa-phone"></i></span> Phone #: + 800 - 12 12 23 52</li>
- </ul>
- </div>
- <div class="col-5 text-center">
- <img src="@/assets/img/user2-160x160.jpg" alt="" class="img-circle img-fluid">
- </div>
- </div>
- </div>
- <div class="card-footer">
- <div class="text-right">
- <a href="#" class="btn btn-sm bg-teal">
- <i class="fas fa-comments"></i>
- </a>
- <a href="#" class="btn btn-sm btn-primary">
- <i class="fas fa-user"></i> View Profile
- </a>
- </div>
- </div>
- </div>
- </div>
- <div class="col-12 col-sm-6 col-md-4 d-flex align-items-stretch">
- <div class="card bg-light">
- <div class="card-header border-bottom-0">
- Digital Strategist
- </div>
- <div class="card-body pt-0">
- <div class="row">
- <div class="col-7">
- <h2 class="lead"><b>Nicole Pearson</b></h2>
- <p class="text-sm"><b>About: </b> Web Designer / UX / Graphic Artist / Coffee Lover </p>
- <ul class="ml-4 mb-0 fa-ul text-muted">
- <li class="small"><span class="fa-li"><i class="fas fa-lg fa-phone"></i></span> Phone #: + 800 - 12 12 23 52</li>
- </ul>
- </div>
- <div class="col-5 text-center">
- <img src="@/assets/img/user1-128x128.jpg" alt="" class="img-circle img-fluid">
- </div>
- </div>
- </div>
- <div class="card-footer">
- <div class="text-right">
- <a href="#" class="btn btn-sm bg-teal">
- <i class="fas fa-comments"></i>
- </a>
- <a href="#" class="btn btn-sm btn-primary">
- <i class="fas fa-user"></i> View Profile
- </a>
- </div>
- </div>
- </div>
- </div>
- <div class="col-12 col-sm-6 col-md-4 d-flex align-items-stretch">
- <div class="card bg-light">
- <div class="card-header border-bottom-0">
- Digital Strategist
- </div>
- <div class="card-body pt-0">
- <div class="row">
- <div class="col-7">
- <h2 class="lead"><b>Nicole Pearson</b></h2>
- <p class="text-sm"><b>About: </b> Web Designer / UX / Graphic Artist / Coffee Lover </p>
- <ul class="ml-4 mb-0 fa-ul text-muted">
- <li class="small"><span class="fa-li"><i class="fas fa-lg fa-building"></i></span> Address: Demo Street 123, Demo City 04312, NJ</li>
- <li class="small"><span class="fa-li"><i class="fas fa-lg fa-phone"></i></span> Phone #: + 800 - 12 12 23 52</li>
- </ul>
- </div>
- <div class="col-5 text-center">
- <img src="@/assets/img/user1-128x128.jpg" alt="" class="img-circle img-fluid">
- </div>
- </div>
- </div>
- <div class="card-footer">
- <div class="text-right">
- <a href="#" class="btn btn-sm bg-teal">
- <i class="fas fa-comments"></i>
- </a>
- <a href="#" class="btn btn-sm btn-primary">
- <i class="fas fa-user"></i> View Profile
- </a>
- </div>
- </div>
- </div>
- </div>
- <div class="col-12 col-sm-6 col-md-4 d-flex align-items-stretch">
- <div class="card bg-light">
- <div class="card-header border-bottom-0">
- Digital Strategist
- </div>
- <div class="card-body pt-0">
- <div class="row">
- <div class="col-7">
- <h2 class="lead"><b>Nicole Pearson</b></h2>
- <p class="text-sm"><b>About: </b> Web Designer / UX / Graphic Artist / Coffee Lover </p>
- <ul class="ml-4 mb-0 fa-ul text-muted">
- <li class="small"><span class="fa-li"><i class="fas fa-lg fa-building"></i></span> Address: Demo Street 123, Demo City 04312, NJ</li>
- </ul>
- </div>
- <div class="col-5 text-center">
- <img src="@/assets/img/user1-128x128.jpg" alt="" class="img-circle img-fluid">
- </div>
- </div>
- </div>
- <div class="card-footer">
- <div class="text-right">
- <a href="#" class="btn btn-sm bg-teal">
- <i class="fas fa-comments"></i>
- </a>
- <a href="#" class="btn btn-sm btn-primary">
- <i class="fas fa-user"></i> View Profile
- </a>
- </div>
- </div>
- </div>
- </div>
- <div class="col-12 col-sm-6 col-md-4 d-flex align-items-stretch">
- <div class="card bg-light">
- <div class="card-header border-bottom-0">
- Digital Strategist
- </div>
- <div class="card-body pt-0">
- <div class="row">
- <div class="col-7">
- <h2 class="lead"><b>Nicole Pearson</b></h2>
- <p class="text-sm"><b>About: </b> Web Designer / UX / Graphic Artist / Coffee Lover </p>
- <ul class="ml-4 mb-0 fa-ul text-muted">
- <li class="small"><span class="fa-li"><i class="fas fa-lg fa-building"></i></span> Address: Demo Street 123, Demo City 04312, NJ</li>
- <li class="small"><span class="fa-li"><i class="fas fa-lg fa-phone"></i></span> Phone #: + 800 - 12 12 23 52</li>
- </ul>
- </div>
- <div class="col-5 text-center">
- <img src="@/assets/img/user1-128x128.jpg" alt="" class="img-circle img-fluid">
- </div>
- </div>
- </div>
- <div class="card-footer">
- <div class="text-right">
- <a href="#" class="btn btn-sm bg-teal">
- <i class="fas fa-comments"></i>
- </a>
- <a href="#" class="btn btn-sm btn-primary">
- <i class="fas fa-user"></i> View Profile
- </a>
- </div>
- </div>
- </div>
- </div>
- <div class="col-12 col-sm-6 col-md-4 d-flex align-items-stretch">
- <div class="card bg-light">
- <div class="card-header border-bottom-0">
- Digital Strategist
- </div>
- <div class="card-body pt-0">
- <div class="row">
- <div class="col-7">
- <h2 class="lead"><b>Nicole Pearson</b></h2>
- <p class="text-sm"><b>About: </b> Web Designer / UX / Graphic Artist / Coffee Lover </p>
- <ul class="ml-4 mb-0 fa-ul text-muted">
- <li class="small"><span class="fa-li"><i class="fas fa-lg fa-building"></i></span> Address: Demo Street 123, Demo City 04312, NJ</li>
- <li class="small"><span class="fa-li"><i class="fas fa-lg fa-phone"></i></span> Phone #: + 800 - 12 12 23 52</li>
- </ul>
- </div>
- <div class="col-5 text-center">
- <img src="@/assets/img/user2-160x160.jpg" alt="" class="img-circle img-fluid">
- </div>
- </div>
- </div>
- <div class="card-footer">
- <div class="text-right">
- <a href="#" class="btn btn-sm bg-teal">
- <i class="fas fa-comments"></i>
- </a>
- <a href="#" class="btn btn-sm btn-primary">
- <i class="fas fa-user"></i> View Profile
- </a>
- </div>
- </div>
- </div>
- </div>
- </div>
- </div>
- <!-- /.card-body -->
- <div class="card-footer">
- <nav aria-label="Contacts Page Navigation">
- <ul class="pagination justify-content-center m-0">
- <li class="page-item active"><a class="page-link" href="#">1</a></li>
- <li class="page-item"><a class="page-link" href="#">2</a></li>
- <li class="page-item"><a class="page-link" href="#">3</a></li>
- <li class="page-item"><a class="page-link" href="#">4</a></li>
- <li class="page-item"><a class="page-link" href="#">5</a></li>
- <li class="page-item"><a class="page-link" href="#">6</a></li>
- <li class="page-item"><a class="page-link" href="#">7</a></li>
- <li class="page-item"><a class="page-link" href="#">8</a></li>
- </ul>
- </nav>
- </div>
- <!-- /.card-footer -->
- </div>
- <!-- /.card -->
- </div>
- </section>
- </main>
- </template>
- <script>
- export default {
- methods: {
- openProfile(_profileId) {
- this.$router.push(`/profile/${_profileId}`)
- },
- openProject(_projectId) {
- this.$router.push(`/projects/${_projectId}`)
- },
- }
- }
- </script>
|