PlexSheep
/
wooly-vault
generated from PlexSheep/rs-base
1
0
Fork 0
Code Issues 9 Pull Requests Actions Packages Projects Releases Wiki Activity

feat(meta): meta interface sidebar is now responsive #15
cargo devel CI / cargo CI (push) Has been cancelled Details

This commit is contained in:
Christoph J. Scherr 2024-09-11 22:43:09 +02:00
parent d74b8d7e66
commit 30c8e2272f
2 changed files with 23 additions and 22 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

41
data/www/base.html
View File

@ -110,16 +110,18 @@
</ul> </ul>
</div> </div>
<div class="container-fluid"> <!-- basically everything but with some margin -->
<div class="row"> <div class="d-flex flex-nowrap m-0 container-fluid border-collapse" style="min-height: 90vh;">
<div class="row mb-0 border-collapse">
<!-- side panel --> <!-- side panel -->
<div class="d-flex flex-column flex-shrink-0 p-3 border-end" style="width: 280px;"> <div class="col-sm-2 border-end border-collapse pt-2" style="min-width: 26vw;">
<a href="/" <a href="/"
class="d-flex align-items-center mb-3 mb-md-0 me-md-auto text-decoration-none text-body-emphasis"> class="d-flex align-items-center mb-3 mb-md-0 me-md-auto text-decoration-none text-body-emphasis">
<svg class="bi pe-none me-2" width="40" height="32"> <svg class="bi pe-none me-2" width="40" height="32">
<use xlink:href="#vault"></use> <use xlink:href="#vault"></use>
</svg> </svg>
<span class="fs-4">{{app_name}}</span> <span class="fs-4">{{app_name}}</span>
{% block header_ext %}{% endblock %}
</a> </a>
<hr> <hr>
<ul class="nav nav-pills flex-column mb-auto"> <ul class="nav nav-pills flex-column mb-auto">
@ -168,32 +170,23 @@
</div> </div>
</div> </div>
<!-- basically everything but with some margin --> <div class="col ms-3 mt-4">
<div class="col-lg-8 mx-auto p-4 py-md-5"> <main class="d-flex flex-nowrap">
<header class="d-flex align-items-center pb-3 mb-5 border-bottom"> <!-- real content -->
<div class="col-md-3 col-12 col-md-auto"> <div class="container-fluid">
<a href="/" class="d-flex align-items-center text-body-emphasis text-decoration-none"> {% block main %}{% endblock %}
<svg class="bi me-2" width="40" height="32"> </div>
<use xlink:href="#vault" /> </main>
</svg> </div>
<span class="fs-4">{{app_name}}</span>
</a>
</div> </div>
{% block header_ext %}{% endblock %}
</header>
<main> </div>
{% block main %}{% endblock %}
</main> <footer class="pt-2 pb-2 text-body-secondary text-center border-top
<footer class="pt-5 my-5 text-body-secondary border-top"> border-collapse">
Created by {{ author }} &copy; {{year}} Created by {{ author }} &copy; {{year}}
</footer> </footer>
</div>
</div>
</div>
<script src="https://getbootstrap.com/docs/5.3/dist/js/bootstrap.bundle.min.js" <script src="https://getbootstrap.com/docs/5.3/dist/js/bootstrap.bundle.min.js"
integrity="sha384-YvpcrYf0tY3lHB60NNkmXc5s9fDVZLESaAA55NDzOxhy9GkcIdslK1eN7N6jIeHz" integrity="sha384-YvpcrYf0tY3lHB60NNkmXc5s9fDVZLESaAA55NDzOxhy9GkcIdslK1eN7N6jIeHz"
crossorigin="anonymous"></script> crossorigin="anonymous"></script>

8
data/www/styles.css
View File

@ -1,3 +1,11 @@
body {
border-collapse: collapse;
}
.border-collapse {
border-collapse: collapse;
}
.bd-placeholder-img { .bd-placeholder-img {
font-size: 1.125rem; font-size: 1.125rem;
text-anchor: middle; text-anchor: middle;