corbz/PYRSS-Website
corbz/PYRSS-Website
1
0
Fork 0
Code Issues 21 Pull Requests Actions Releases 1 Wiki Activity

improve server tabs on mobile screens
All checks were successful
Build and Push Docker Image / build (push) Successful in 15s
Details

Browse Source
This commit is contained in:
Corban-Lee Jones 2024-10-10 16:36:23 +01:00
parent 048e293fb2
commit 0b153d14bc
2 changed files with 33 additions and 49 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
apps/home/static/home/css/index.css
View File

@ -88,10 +88,6 @@
/* Server Tabs */ /* Server Tabs */
#serverTabs .nav-item:not(:last-child) {
margin-right: 1rem;
}
#serverTabs .nav-item .nav-link:hover:not(.active) { #serverTabs .nav-item .nav-link:hover:not(.active) {
background-color: var(--bs-secondary-bg); background-color: var(--bs-secondary-bg);
} }

78
apps/home/templates/home/index.html
View File

@ -57,58 +57,46 @@
</div> </div>
<div class="col-12 bg-body-tertiary"> <div class="col-12 bg-body-tertiary">
<ul id="serverTabs" class="nav nav-pills py-3 text-start px-sm-3" role="tablist"> <div class="row py-3 px-sm-3">
<li class="nav-item me-auto"> <div class="col-sm-4 col-xxl-3 mb-4 mb-sm-0">
<div class="d-flex align-items-center"> <div class="d-flex align-items-center">
<img class="resolve-to-server-icon rounded-1 me-3 text-center" width="40"> <img class="resolve-to-server-icon rounded-1 me-3 text-center" width="40">
<div> <div>
<h5 class="resolve-to-server-name mb-0"></h5> <h5 class="resolve-to-server-name mb-0"></h5>
<h6 class="resolve-to-server-id small mb-0 text-body-secondary"></h6> <h6 class="resolve-to-server-id small mb-0"></h6>
</div> </div>
</div> </div>
</li> </div>
<li class="nav-item" role="presentation"> <div class="col-sm-8 col-xxl-9">
<button id="subscriptionsTab" class="nav-link rounded-1" data-bs-toggle="tab" data-bs-target="#subscriptionsTabPane" type="button" aria-controls="subscriptionsTabPane" aria-selected="false"> <ul class="nav nav-pills justify-content-sm-end" role="tablist">
<i class="bi bi-layers"></i> <li class="nav-item me-1 me-lg-3" role="presentation">
<span class="ms-2 d-none d-md-inline">Subscriptions</span> <button id="subscriptionsTab" class="nav-link rounded-1" data-bs-toggle="tab" data-bs-target="#subscriptionsTabPane" type="button" aria-controls="subscriptionsTabPane" aria-selected="false">
</button> <i class="bi bi-layers"></i>
</li> <span class="ms-2 d-none d-lg-inline">Subscriptions</span>
<li class="nav-item" role="presentation"> </button>
<button id="filtersTab" class="nav-link rounded-1" data-bs-toggle="tab" data-bs-target="#filtersTabPane" type="button" aria-controls="filtersTabPane" aria-selected="false"> </li>
<i class="bi bi-funnel"></i> <li class="nav-item me-1 me-lg-3" role="presentation">
<span class="ms-2 d-none d-md-inline">Content Filters</span> <button id="filtersTab" class="nav-link rounded-1" data-bs-toggle="tab" data-bs-target="#filtersTabPane" type="button" aria-controls="filtersTabPane" aria-selected="false">
</button> <i class="bi bi-funnel"></i>
</li> <span class="ms-2 d-none d-lg-inline">Content Filters</span>
<li class="nav-item" role="presentation"> </button>
<button id="stylesTab" class="nav-link rounded-1" data-bs-toggle="tab" data-bs-target="#stylesTabPane" type="button" aria-controls="stylesTabPane" aria-selected="false"> </li>
<i class="bi bi-border-style"></i> <li class="nav-item me-1 me-lg-3" role="presentation">
<span class="ms-2 d-none d-md-inline">Message Styles</span> <button id="stylesTab" class="nav-link rounded-1" data-bs-toggle="tab" data-bs-target="#stylesTabPane" type="button" aria-controls="stylesTabPane" aria-selected="false">
</button> <i class="bi bi-border-style"></i>
</li> <span class="ms-2 d-none d-lg-inline">Message Styles</span>
<li class="nav-item me-0" role="presentation"> </button>
<button id="contentTab" class="nav-link rounded-1" data-bs-toggle="tab" data-bs-target="#contentTabPane" type="button" aria-controls="contentTabPane" aria-selected="false"> </li>
<i class="bi bi-archive"></i> <li class="nav-item me-0" role="presentation">
<span class="ms-2 d-none d-md-inline">Tracked Content</span> <button id="contentTab" class="nav-link rounded-1" data-bs-toggle="tab" data-bs-target="#contentTabPane" type="button" aria-controls="contentTabPane" aria-selected="false">
</button> <i class="bi bi-archive"></i>
</li> <span class="ms-2 d-none d-lg-inline">Tracked Content</span>
<li class="nav-item d-none"> </button>
<div class="dropdown"> </li>
<button class="nav-link rounded-1 dropdown-toggle" type="button" data-bs-toggle="dropdown" data-bs-auto-close="outside"> </ul>
<i class="bi bi-gear"></i> </div>
</button> </div>
<ul class="dropdown-menu rounded-1">
<li>
<button type="button" class="dropdown-item py-2">
<i class="bi bi-trash3"></i>
<span class="ms-2">Delete Server Data</span>
</button>
</li>
</ul>
</div>
</li>
</ul>
</div> </div>
<div class="col-12"> <div class="col-12">
<div id="serverTabContent" class="tab-content"> <div id="serverTabContent" class="tab-content">
<div id="subscriptionsTabPane" class="tab-pane fade" role="tabpanel" aria-labelledby="subscriptionsTab" tabindex="0"> <div id="subscriptionsTabPane" class="tab-pane fade" role="tabpanel" aria-labelledby="subscriptionsTab" tabindex="0">