mirror of
https://codeberg.org/rimu/pyfedi
synced 2025-01-23 19:36:56 -08:00
make tabs work responsive
This commit is contained in:
parent
e2c2d9b503
commit
742ff2f46e
4 changed files with 27 additions and 16 deletions
|
@ -1288,4 +1288,15 @@ fieldset legend {
|
||||||
max-width: 100%;
|
max-width: 100%;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@media (orientation: portrait) {
|
||||||
|
.flex-sm-fill.text-sm-center.nav-link.active{
|
||||||
|
border-bottom: var(--bs-nav-tabs-border-width) solid var(--bs-border-color);
|
||||||
|
border-bottom-right-radius: var(--bs-nav-tabs-border-radius);
|
||||||
|
border-bottom-left-radius: var(--bs-nav-tabs-border-radius);
|
||||||
|
}
|
||||||
|
.card-header-tabs {
|
||||||
|
margin-bottom:8px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
/*# sourceMappingURL=structure.css.map */
|
/*# sourceMappingURL=structure.css.map */
|
||||||
|
|
|
@ -16,18 +16,18 @@
|
||||||
<li class="breadcrumb-item active">{{ _('Edit profile') }}</li>
|
<li class="breadcrumb-item active">{{ _('Edit profile') }}</li>
|
||||||
</ol>
|
</ol>
|
||||||
</nav>
|
</nav>
|
||||||
<ul class="nav nav-tabs card-header-tabs">
|
<ul class="nav nav-tabs flex-column flex-sm-row card-header-tabs">
|
||||||
<li class="nav-item">
|
<li class="nav-item">
|
||||||
<a class="nav-link" href="/user/settings">Basic</a>
|
<a class="flex-sm-fill text-sm-center nav-link" href="/user/settings">Basic</a>
|
||||||
</li>
|
</li>
|
||||||
<li class="nav-item">
|
<li class="nav-item">
|
||||||
<a class="nav-link" href="/user/settings/filters">Blocks & Filters</a>
|
<a class="flex-sm-fill text-sm-center nav-link" href="/user/settings/filters">Blocks & Filters</a>
|
||||||
</li>
|
</li>
|
||||||
<li class="nav-item">
|
<li class="nav-item">
|
||||||
<a class="nav-link active" href="/u/{{ current_user.user_name }}/profile">Profile</a>
|
<a class="flex-sm-fill text-sm-center nav-link active" href="/u/{{ current_user.user_name }}/profile">Profile</a>
|
||||||
</li>
|
</li>
|
||||||
<li class="nav-item">
|
<li class="nav-item">
|
||||||
<a class="nav-link disabled" href="#">Other</a>
|
<a class="flex-sm-fill text-sm-center nav-link disabled" href="#">Other</a>
|
||||||
</li>
|
</li>
|
||||||
</ul>
|
</ul>
|
||||||
</div>
|
</div>
|
||||||
|
|
|
@ -10,25 +10,25 @@
|
||||||
|
|
||||||
<div class="card" style="max-width:unset;">
|
<div class="card" style="max-width:unset;">
|
||||||
<div class="card-header">
|
<div class="card-header">
|
||||||
<nav aria-label="breadcrumb" id="breadcrumb_nav" title="Navigation">
|
<nav class="mb-2" aria-label="breadcrumb" id="breadcrumb_nav" title="Navigation">
|
||||||
<ol class="breadcrumb">
|
<ol class="breadcrumb">
|
||||||
<li class="breadcrumb-item"><a href="/">{{ _('Home') }}</a></li>
|
<li class="breadcrumb-item"><a href="/">{{ _('Home') }}</a></li>
|
||||||
<li class="breadcrumb-item"><a href="/u/{{ user.link() }}">{{ user.display_name() }}</a></li>
|
<li class="breadcrumb-item"><a href="/u/{{ user.link() }}">{{ user.display_name() }}</a></li>
|
||||||
<li class="breadcrumb-item active">{{ _('Change settings') }}</li>
|
<li class="breadcrumb-item active">{{ _('Change settings') }}</li>
|
||||||
</ol>
|
</ol>
|
||||||
</nav>
|
</nav>
|
||||||
<ul class="nav nav-tabs card-header-tabs">
|
<ul class="nav nav-tabs flex-column flex-sm-row card-header-tabs">
|
||||||
<li class="nav-item">
|
<li class="nav-item">
|
||||||
<a class="nav-link active" href="/user/settings">Basic</a>
|
<a class="flex-sm-fill text-sm-center nav-link active" href="/user/settings">Basic</a>
|
||||||
</li>
|
</li>
|
||||||
<li class="nav-item">
|
<li class="nav-item">
|
||||||
<a class="nav-link" href="/user/settings/filters">Blocks & Filters</a>
|
<a class="flex-sm-fill text-sm-center nav-link" href="/user/settings/filters">Blocks & Filters</a>
|
||||||
</li>
|
</li>
|
||||||
<li class="nav-item">
|
<li class="nav-item">
|
||||||
<a class="nav-link" href="/u/{{ current_user.user_name }}/profile">Profile</a>
|
<a class="flex-sm-fill text-sm-center nav-link" href="/u/{{ current_user.user_name }}/profile">Profile</a>
|
||||||
</li>
|
</li>
|
||||||
<li class="nav-item">
|
<li class="nav-item">
|
||||||
<a class="nav-link disabled" href="#">Other</a>
|
<a class="flex-sm-fill text-sm-center nav-link disabled" href="#">Other</a>
|
||||||
</li>
|
</li>
|
||||||
</ul>
|
</ul>
|
||||||
</div>
|
</div>
|
||||||
|
|
|
@ -17,18 +17,18 @@
|
||||||
<li class="breadcrumb-item active">{{ _('Filters') }}</li>
|
<li class="breadcrumb-item active">{{ _('Filters') }}</li>
|
||||||
</ol>
|
</ol>
|
||||||
</nav>
|
</nav>
|
||||||
<ul class="nav nav-tabs card-header-tabs">
|
<ul class="nav nav-tabs flex-column flex-sm-row card-header-tabs">
|
||||||
<li class="nav-item">
|
<li class="nav-item">
|
||||||
<a class="nav-link" href="/user/settings">Basic</a>
|
<a class="flex-sm-fill text-sm-center nav-link" href="/user/settings">Basic</a>
|
||||||
</li>
|
</li>
|
||||||
<li class="nav-item">
|
<li class="nav-item">
|
||||||
<a class="nav-link active" href="/user/settings/filters">Blocks & Filters</a>
|
<a class="flex-sm-fill text-sm-center nav-link active" href="/user/settings/filters">Blocks & Filters</a>
|
||||||
</li>
|
</li>
|
||||||
<li class="nav-item">
|
<li class="nav-item">
|
||||||
<a class="nav-link" href="/u/{{ current_user.user_name }}/profile">Profile</a>
|
<a class="flex-sm-fill text-sm-center nav-link" href="/u/{{ current_user.user_name }}/profile">Profile</a>
|
||||||
</li>
|
</li>
|
||||||
<li class="nav-item">
|
<li class="nav-item">
|
||||||
<a class="nav-link disabled" href="#">Other</a>
|
<a class="flex-sm-fill text-sm-center nav-link disabled" href="#">Other</a>
|
||||||
</li>
|
</li>
|
||||||
</ul>
|
</ul>
|
||||||
</div>
|
</div>
|
||||||
|
|
Loading…
Add table
Reference in a new issue