first init
This commit is contained in:
481
resources/views/ui/tabs.blade.php
Executable file
481
resources/views/ui/tabs.blade.php
Executable file
@@ -0,0 +1,481 @@
|
||||
@extends('layouts.vertical', ['subtitle' => 'Nav Tabs'])
|
||||
|
||||
@section('content')
|
||||
|
||||
@include('layouts.partials/page-title', ['title' => 'Base UI', 'subtitle' => 'Nav Tabs'])
|
||||
|
||||
<!-- start tabs -->
|
||||
<div class="row">
|
||||
<div class="col-lg-6">
|
||||
<div class="card">
|
||||
<div class="card-header">
|
||||
<h5 class="card-title">
|
||||
Nav Tabs
|
||||
</h5>
|
||||
<p class="card-subtitle">Use the <code>.nav-tabs</code> class to generate a tabbed interface.</p>
|
||||
</div>
|
||||
<div class="card-body">
|
||||
<ul class="nav nav-tabs">
|
||||
<li class="nav-item">
|
||||
<a href="#home" data-bs-toggle="tab" aria-expanded="false" class="nav-link">
|
||||
<span class="d-block d-sm-none"><i class="bx bx-home"></i></span>
|
||||
<span class="d-none d-sm-block">Home</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<a href="#profile" data-bs-toggle="tab" aria-expanded="true" class="nav-link active">
|
||||
<span class="d-block d-sm-none"><i class="bx bx-user"></i></span>
|
||||
<span class="d-none d-sm-block">Profile</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<a href="#messages" data-bs-toggle="tab" aria-expanded="false" class="nav-link">
|
||||
<span class="d-block d-sm-none"><i class="bx bx-envelope"></i></span>
|
||||
<span class="d-none d-sm-block">Messages</span>
|
||||
</a>
|
||||
</li>
|
||||
</ul>
|
||||
<div class="tab-content text-muted">
|
||||
<div class="tab-pane" id="home">
|
||||
<p class="mb-0">Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium
|
||||
doloremque laudantium,
|
||||
totam rem aperiam, eaque ipsa quae ab illo inventore veritatis et quasi architecto beatae
|
||||
vitae dicta sunt explicabo.
|
||||
Nemo enim ipsam voluptatem quia voluptas sit aspernatur aut odit aut fugit, sed quia
|
||||
consequuntur magni dolores eos qui
|
||||
ratione voluptatem sequi nesciunt. Neque porro quisquam est, qui dolorem ipsum quia dolor
|
||||
sit amet, consectetur, adipisci
|
||||
velit, sed quia non numquam eius modi tempora incidunt ut labore et dolore magnam aliquam
|
||||
quaerat voluptatem?
|
||||
</p>
|
||||
</div>
|
||||
<div class="tab-pane show active" id="profile">
|
||||
<p class="mb-0">Li Europan lingues es membres del sam familie. Lor separat existentie es un
|
||||
myth. Por scientie, musica, sport etc,
|
||||
litot Europa usa li sam vocabular. Li lingues differe solmen in li grammatica, li
|
||||
pronunciation e li plu commun vocabules.
|
||||
Omnicos directe al desirabilite de un nov lingua franca: On refusa continuar payar custosi
|
||||
traductores. At solmen va esser
|
||||
necessi far uniform grammatica, pronunciation e plu sommun paroles. Ma quande lingues
|
||||
coalesce, li grammatica del resultant
|
||||
lingue es plu simplic e regulari quam ti del coalescent lingues. Li nov lingua franca va
|
||||
esser plu simplic e regulari quam
|
||||
li existent Europan lingues.
|
||||
</p>
|
||||
</div>
|
||||
<div class="tab-pane" id="messages">
|
||||
<p class="mb-0">Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium
|
||||
doloremque laudantium,
|
||||
totam rem aperiam, eaque ipsa quae ab illo inventore veritatis et quasi architecto beatae
|
||||
vitae dicta sunt explicabo.
|
||||
Nemo enim ipsam voluptatem quia voluptas sit aspernatur aut odit aut fugit, sed quia
|
||||
consequuntur magni dolores eos qui
|
||||
ratione voluptatem sequi nesciunt. Neque porro quisquam est, qui dolorem ipsum quia dolor
|
||||
sit amet, consectetur, adipisci
|
||||
velit, sed quia non numquam eius modi tempora incidunt ut labore et dolore magnam aliquam
|
||||
quaerat voluptatem?
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="col-lg-6">
|
||||
<div class="card">
|
||||
<div class="card-header">
|
||||
<h5 class="card-title">
|
||||
Tabs Justified
|
||||
</h5>
|
||||
<p class="card-subtitle">Using class <code>.nav-justified</code>, you can force your tabs menu items to
|
||||
use the full available width.</p>
|
||||
</div>
|
||||
<div class="card-body">
|
||||
<ul class="nav nav-tabs nav-justified">
|
||||
<li class="nav-item">
|
||||
<a href="#homeTabsJustified" data-bs-toggle="tab" aria-expanded="false" class="nav-link">
|
||||
<span class="d-block d-sm-none"><i class="bx bx-home"></i></span>
|
||||
<span class="d-none d-sm-block">Home</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<a href="#profileTabsJustified" data-bs-toggle="tab" aria-expanded="true"
|
||||
class="nav-link active">
|
||||
<span class="d-block d-sm-none"><i class="bx bx-user"></i></span>
|
||||
<span class="d-none d-sm-block">Profile</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<a href="#messagesTabsJustified" data-bs-toggle="tab" aria-expanded="false" class="nav-link">
|
||||
<span class="d-block d-sm-none"><i class="bx bx-envelope"></i></span>
|
||||
<span class="d-none d-sm-block">Messages</span>
|
||||
</a>
|
||||
</li>
|
||||
</ul>
|
||||
<div class="tab-content pt-2 text-muted">
|
||||
<div class="tab-pane" id="homeTabsJustified">
|
||||
<p class="mb-0">Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium
|
||||
doloremque laudantium,
|
||||
totam rem aperiam, eaque ipsa quae ab illo inventore veritatis et quasi architecto beatae
|
||||
vitae dicta sunt explicabo.
|
||||
Nemo enim ipsam voluptatem quia voluptas sit aspernatur aut odit aut fugit, sed quia
|
||||
consequuntur magni dolores eos qui
|
||||
ratione voluptatem sequi nesciunt. Neque porro quisquam est, qui dolorem ipsum quia dolor
|
||||
sit amet, consectetur, adipisci
|
||||
velit, sed quia non numquam eius modi tempora incidunt ut labore et dolore magnam aliquam
|
||||
quaerat voluptatem?
|
||||
</p>
|
||||
</div>
|
||||
<div class="tab-pane show active" id="profileTabsJustified">
|
||||
<p class="mb-0">Li Europan lingues es membres del sam familie. Lor separat existentie es un
|
||||
myth. Por scientie, musica, sport etc,
|
||||
litot Europa usa li sam vocabular. Li lingues differe solmen in li grammatica, li
|
||||
pronunciation e li plu commun vocabules.
|
||||
Omnicos directe al desirabilite de un nov lingua franca: On refusa continuar payar custosi
|
||||
traductores. At solmen va esser
|
||||
necessi far uniform grammatica, pronunciation e plu sommun paroles. Ma quande lingues
|
||||
coalesce, li grammatica del resultant
|
||||
lingue es plu simplic e regulari quam ti del coalescent lingues. Li nov lingua franca va
|
||||
esser plu simplic e regulari quam
|
||||
li existent Europan lingues.
|
||||
</p>
|
||||
</div>
|
||||
<div class="tab-pane" id="messagesTabsJustified">
|
||||
<p class="mb-0">Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium
|
||||
doloremque laudantium,
|
||||
totam rem aperiam, eaque ipsa quae ab illo inventore veritatis et quasi architecto beatae
|
||||
vitae dicta sunt explicabo.
|
||||
Nemo enim ipsam voluptatem quia voluptas sit aspernatur aut odit aut fugit, sed quia
|
||||
consequuntur magni dolores eos qui
|
||||
ratione voluptatem sequi nesciunt. Neque porro quisquam est, qui dolorem ipsum quia dolor
|
||||
sit amet, consectetur, adipisci
|
||||
velit, sed quia non numquam eius modi tempora incidunt ut labore et dolore magnam aliquam
|
||||
quaerat voluptatem?
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="col-lg-6">
|
||||
<div class="card">
|
||||
<div class="card-header">
|
||||
<h5 class="card-title">
|
||||
Nav Pills
|
||||
</h5>
|
||||
<p class="card-subtitle">Use the <code>.nav-pills</code> class to generate a pilled interface.</p>
|
||||
</div>
|
||||
<div class="card-body">
|
||||
<ul class="nav nav-pills">
|
||||
<li class="nav-item">
|
||||
<a href="#homePill" data-bs-toggle="tab" aria-expanded="false" class="nav-link">
|
||||
<span class="d-block d-sm-none"><i class="bx bx-home"></i></span>
|
||||
<span class="d-none d-sm-block">Home</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<a href="#profilePill" data-bs-toggle="tab" aria-expanded="true" class="nav-link active">
|
||||
<span class="d-block d-sm-none"><i class="bx bx-user"></i></span>
|
||||
<span class="d-none d-sm-block">Profile</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<a href="#messagesPill" data-bs-toggle="tab" aria-expanded="false" class="nav-link">
|
||||
<span class="d-block d-sm-none"><i class="bx bx-envelope"></i></span>
|
||||
<span class="d-none d-sm-block">Messages</span>
|
||||
</a>
|
||||
</li>
|
||||
</ul>
|
||||
<div class="tab-content pt-2 text-muted">
|
||||
<div class="tab-pane" id="homePill">
|
||||
<p class="mb-0">Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium
|
||||
doloremque laudantium,
|
||||
totam rem aperiam, eaque ipsa quae ab illo inventore veritatis et quasi architecto beatae
|
||||
vitae dicta sunt explicabo.
|
||||
Nemo enim ipsam voluptatem quia voluptas sit aspernatur aut odit aut fugit, sed quia
|
||||
consequuntur magni dolores eos qui
|
||||
ratione voluptatem sequi nesciunt. Neque porro quisquam est, qui dolorem ipsum quia dolor
|
||||
sit amet, consectetur, adipisci
|
||||
velit, sed quia non numquam eius modi tempora incidunt ut labore et dolore magnam aliquam
|
||||
quaerat voluptatem?
|
||||
</p>
|
||||
</div>
|
||||
<div class="tab-pane show active" id="profilePill">
|
||||
<p class="mb-0">Li Europan lingues es membres del sam familie. Lor separat existentie es un
|
||||
myth. Por scientie, musica, sport etc,
|
||||
litot Europa usa li sam vocabular. Li lingues differe solmen in li grammatica, li
|
||||
pronunciation e li plu commun vocabules.
|
||||
Omnicos directe al desirabilite de un nov lingua franca: On refusa continuar payar custosi
|
||||
traductores. At solmen va esser
|
||||
necessi far uniform grammatica, pronunciation e plu sommun paroles. Ma quande lingues
|
||||
coalesce, li grammatica del resultant
|
||||
lingue es plu simplic e regulari quam ti del coalescent lingues. Li nov lingua franca va
|
||||
esser plu simplic e regulari quam
|
||||
li existent Europan lingues.
|
||||
</p>
|
||||
</div>
|
||||
<div class="tab-pane" id="messagesPill">
|
||||
<p class="mb-0">Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium
|
||||
doloremque laudantium,
|
||||
totam rem aperiam, eaque ipsa quae ab illo inventore veritatis et quasi architecto beatae
|
||||
vitae dicta sunt explicabo.
|
||||
Nemo enim ipsam voluptatem quia voluptas sit aspernatur aut odit aut fugit, sed quia
|
||||
consequuntur magni dolores eos qui
|
||||
ratione voluptatem sequi nesciunt. Neque porro quisquam est, qui dolorem ipsum quia dolor
|
||||
sit amet, consectetur, adipisci
|
||||
velit, sed quia non numquam eius modi tempora incidunt ut labore et dolore magnam aliquam
|
||||
quaerat voluptatem?
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="col-lg-6">
|
||||
<div class="card">
|
||||
<div class="card-header">
|
||||
<h5 class="card-title">
|
||||
Pills Justified
|
||||
</h5>
|
||||
<p class="card-subtitle">Using class <code>.nav-justified</code>, you can force your pills menu items
|
||||
to use the full available width.</p>
|
||||
</div>
|
||||
<div class="card-body">
|
||||
<div class="d-flex flex-wrap gap-2">
|
||||
<ul class="nav nav-pills nav-justified p-1">
|
||||
<li class="nav-item">
|
||||
<a href="#homePillJustified" data-bs-toggle="tab" aria-expanded="false"
|
||||
class="nav-link">
|
||||
<span class="d-block d-sm-none"><i class="bx bx-home"></i></span>
|
||||
<span class="d-none d-sm-block">Home</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<a href="#profilePillJustified" data-bs-toggle="tab" aria-expanded="true"
|
||||
class="nav-link active">
|
||||
<span class="d-block d-sm-none"><i class="bx bx-user"></i></span>
|
||||
<span class="d-none d-sm-block">Profile</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<a href="#messagesPillJustified" data-bs-toggle="tab" aria-expanded="false"
|
||||
class="nav-link">
|
||||
<span class="d-block d-sm-none"><i class="bx bx-envelope"></i></span>
|
||||
<span class="d-none d-sm-block">Messages</span>
|
||||
</a>
|
||||
</li>
|
||||
</ul>
|
||||
<div class="tab-content pt-2 text-muted">
|
||||
<div class="tab-pane" id="homePillJustified">
|
||||
<p class="mb-0">Sed ut perspiciatis unde omnis iste natus error sit voluptatem
|
||||
accusantium doloremque laudantium,
|
||||
totam rem aperiam, eaque ipsa quae ab illo inventore veritatis et quasi architecto
|
||||
beatae vitae dicta sunt explicabo.
|
||||
Nemo enim ipsam voluptatem quia voluptas sit aspernatur aut odit aut fugit, sed quia
|
||||
consequuntur magni dolores eos qui
|
||||
ratione voluptatem sequi nesciunt. Neque porro quisquam est, qui dolorem ipsum quia
|
||||
dolor sit amet, consectetur, adipisci
|
||||
velit, sed quia non numquam eius modi tempora incidunt ut labore et dolore magnam
|
||||
aliquam quaerat voluptatem?
|
||||
</p>
|
||||
</div>
|
||||
<div class="tab-pane show active" id="profilePillJustified">
|
||||
<p class="mb-0">Li Europan lingues es membres del sam familie. Lor separat existentie es
|
||||
un myth. Por scientie, musica, sport etc,
|
||||
litot Europa usa li sam vocabular. Li lingues differe solmen in li grammatica, li
|
||||
pronunciation e li plu commun vocabules.
|
||||
Omnicos directe al desirabilite de un nov lingua franca: On refusa continuar payar
|
||||
custosi traductores. At solmen va esser
|
||||
necessi far uniform grammatica, pronunciation e plu sommun paroles. Ma quande lingues
|
||||
coalesce, li grammatica del resultant
|
||||
lingue es plu simplic e regulari quam ti del coalescent lingues. Li nov lingua franca va
|
||||
esser plu simplic e regulari quam
|
||||
li existent Europan lingues.
|
||||
</p>
|
||||
</div>
|
||||
<div class="tab-pane" id="messagesPillJustified">
|
||||
<p class="mb-0">Sed ut perspiciatis unde omnis iste natus error sit voluptatem
|
||||
accusantium doloremque laudantium,
|
||||
totam rem aperiam, eaque ipsa quae ab illo inventore veritatis et quasi architecto
|
||||
beatae vitae dicta sunt explicabo.
|
||||
Nemo enim ipsam voluptatem quia voluptas sit aspernatur aut odit aut fugit, sed quia
|
||||
consequuntur magni dolores eos qui
|
||||
ratione voluptatem sequi nesciunt. Neque porro quisquam est, qui dolorem ipsum quia
|
||||
dolor sit amet, consectetur, adipisci
|
||||
velit, sed quia non numquam eius modi tempora incidunt ut labore et dolore magnam
|
||||
aliquam quaerat voluptatem?
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="col-lg-6">
|
||||
<div class="card">
|
||||
<div class="card-header">
|
||||
<h5 class="card-title">
|
||||
Tabs Vertical Left
|
||||
</h5>
|
||||
<p class="card-subtitle"> You can stack your navigation by changing the flex item direction with the
|
||||
<code>.flex-column</code> utility.
|
||||
</p>
|
||||
</div>
|
||||
<div class="card-body">
|
||||
<div class="row">
|
||||
<div class="col-sm-3 mb-2 mb-sm-0">
|
||||
<div class="nav flex-column nav-pills" id="vl-pills-tab" role="tablist"
|
||||
aria-orientation="vertical">
|
||||
<a class="nav-link active show" id="vl-pills-home-tab" data-bs-toggle="pill"
|
||||
href="#vl-pills-home" role="tab" aria-controls="vl-pills-home"
|
||||
aria-selected="true">
|
||||
<span>Home</span>
|
||||
</a>
|
||||
<a class="nav-link" id="vl-pills-profile-tab" data-bs-toggle="pill"
|
||||
href="#vl-pills-profile" role="tab" aria-controls="vl-pills-profile"
|
||||
aria-selected="false">
|
||||
<span>Profile</span>
|
||||
</a>
|
||||
<a class="nav-link" id="vl-pills-settings-tab" data-bs-toggle="pill"
|
||||
href="#vl-pills-settings" role="tab" aria-controls="vl-pills-settings"
|
||||
aria-selected="false">
|
||||
<span>Settings</span>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="col-sm-9">
|
||||
<div class="tab-content pt-0" id="vl-pills-tabContent">
|
||||
<div class="tab-pane fade active show" id="vl-pills-home" role="tabpanel"
|
||||
aria-labelledby="vl-pills-home-tab">
|
||||
<p class="mb-0">
|
||||
Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium
|
||||
doloremque
|
||||
laudantium, totam rem aperiam, eaque ipsa quae ab illo inventore veritatis et quasi
|
||||
architecto beatae vitae dicta sunt explicabo. Nemo enim ipsam voluptatem quia
|
||||
voluptas
|
||||
sit aspernatur aut odit aut fugit, sed quia consequuntur magni dolores eos qui
|
||||
ratione
|
||||
voluptatem sequi nesciunt.
|
||||
</p>
|
||||
</div>
|
||||
<div class="tab-pane fade" id="vl-pills-profile" role="tabpanel"
|
||||
aria-labelledby="vl-pills-profile-tab">
|
||||
<p class="mb-0">
|
||||
Li Europan lingues es membres del sam familie. Lor separat existentie es un myth.
|
||||
Por scientie, musica, sport etc, litot Europa usa li sam vocabular. Li lingues
|
||||
differe
|
||||
solmen in li grammatica, li pronunciation e li plu commun vocabules. Omnicos directe
|
||||
al desirabilite de un nov lingua franca: On refusa continuar payar custosi
|
||||
traductores.
|
||||
At solmen va esser necessi far uniform.
|
||||
</p>
|
||||
</div>
|
||||
<div class="tab-pane fade" id="vl-pills-settings" role="tabpanel"
|
||||
aria-labelledby="vl-pills-settings-tab">
|
||||
<p class="mb-0">
|
||||
Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium
|
||||
doloremque
|
||||
laudantium, totam rem aperiam, eaque ipsa quae ab illo inventore veritatis et quasi
|
||||
architecto beatae vitae dicta sunt explicabo. Nemo enim ipsam voluptatem quia
|
||||
voluptas
|
||||
sit aspernatur aut odit aut fugit, sed quia consequuntur magni dolores eos qui
|
||||
ratione
|
||||
voluptatem sequi nesciunt.
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="col-lg-6">
|
||||
<div class="card">
|
||||
<div class="card-header">
|
||||
<h5 class="card-title">
|
||||
Tabs Vertical Right
|
||||
</h5>
|
||||
<p class="card-subtitle"> You can stack your navigation by changing the flex item direction with the
|
||||
<code>.flex-column</code> utility.
|
||||
</p>
|
||||
</div>
|
||||
<div class="card-body">
|
||||
|
||||
<div class="row">
|
||||
<div class="col-sm-9 mb-2 mb-sm-0">
|
||||
<div class="tab-content pt-0" id="vr-pills-tabContent">
|
||||
<div class="tab-pane fade active show" id="vr-pills-home" role="tabpanel"
|
||||
aria-labelledby="vr-pills-home-tab">
|
||||
<p class="mb-0">
|
||||
Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium
|
||||
doloremque
|
||||
laudantium, totam rem aperiam, eaque ipsa quae ab illo inventore veritatis et quasi
|
||||
architecto beatae vitae dicta sunt explicabo. Nemo enim ipsam voluptatem quia
|
||||
voluptas
|
||||
sit aspernatur aut odit aut fugit, sed quia consequuntur magni dolores eos qui
|
||||
ratione
|
||||
voluptatem sequi nesciunt.
|
||||
</p>
|
||||
</div>
|
||||
<div class="tab-pane fade" id="vr-pills-profile" role="tabpanel"
|
||||
aria-labelledby="vr-pills-profile-tab">
|
||||
<p class="mb-0">
|
||||
Li Europan lingues es membres del sam familie. Lor separat existentie es un myth.
|
||||
Por scientie, musica, sport etc, litot Europa usa li sam vocabular. Li lingues
|
||||
differe
|
||||
solmen in li grammatica, li pronunciation e li plu commun vocabules. Omnicos directe
|
||||
al desirabilite de un nov lingua franca: On refusa continuar payar custosi
|
||||
traductores.
|
||||
At solmen va esser necessi far uniform.
|
||||
</p>
|
||||
</div>
|
||||
<div class="tab-pane fade" id="vr-pills-settings" role="tabpanel"
|
||||
aria-labelledby="vr-pills-settings-tab">
|
||||
<p class="mb-0">
|
||||
Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium
|
||||
doloremque
|
||||
laudantium, totam rem aperiam, eaque ipsa quae ab illo inventore veritatis et quasi
|
||||
architecto beatae vitae dicta sunt explicabo. Nemo enim ipsam voluptatem quia
|
||||
voluptas
|
||||
sit aspernatur aut odit aut fugit, sed quia consequuntur magni dolores eos qui
|
||||
ratione
|
||||
voluptatem sequi nesciunt.
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-sm-3">
|
||||
<div class="nav flex-column nav-pills" id="vr-pills-tab" role="tablist"
|
||||
aria-orientation="vertical">
|
||||
<a class="nav-link active show" id="vr-pills-home-tab" data-bs-toggle="pill"
|
||||
href="#vr-pills-home" role="tab" aria-controls="vr-pills-home"
|
||||
aria-selected="true">
|
||||
<span>Home</span>
|
||||
</a>
|
||||
<a class="nav-link" id="vr-pills-profile-tab" data-bs-toggle="pill"
|
||||
href="#vr-pills-profile" role="tab" aria-controls="vr-pills-profile"
|
||||
aria-selected="false">
|
||||
<span>Profile</span>
|
||||
</a>
|
||||
<a class="nav-link" id="vr-pills-settings-tab" data-bs-toggle="pill"
|
||||
href="#vr-pills-settings" role="tab" aria-controls="vr-pills-settings"
|
||||
aria-selected="false">
|
||||
<span>Settings</span>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div> <!-- end card body -->
|
||||
</div> <!-- end card -->
|
||||
</div> <!-- end col -->
|
||||
</div> <!-- end row -->
|
||||
<!-- end tabs -->
|
||||
@endsection
|
||||
Reference in New Issue
Block a user