Moved Inst. and Inv. buttons and fixed dropdown size

This commit is contained in:
FrederikBaerentsen 2024-11-21 11:02:49 +01:00
parent 1993db13c3
commit 0455684607
2 changed files with 33 additions and 18 deletions

View File

@ -176,11 +176,12 @@ background-color: white;
max-width: 90%; max-width: 90%;
max-height: 90%; max-height: 90%;
} }
</style> </style>
</head> </head>
<body> <body>
<nav class="navbar is-dark is-fixed-top" role="navigation" aria-label="main navigation"> <nav class="navbar is-dark is-fixed-top is-size-6" role="navigation" aria-label="main navigation">
<div class="navbar-brand"> <div class="navbar-brand">
<a class="navbar-item" href="/"> <a class="navbar-item" href="/">
Home Home

View File

@ -12,6 +12,20 @@
<style> <style>
.dropdown-menu {
width: max-content; /* Remove default width */
overflow-wrap: break-word;
}
.dropdown.is-right .dropdown-menu {
right: 0; /* Align dropdown to the right of the trigger */
left: auto;
}
.dropdown.is-left .dropdown-menu {
left: 0; /* Align dropdown to the left of the trigger */
right: auto;
}
.grid-container { .grid-container {
display: grid; display: grid;
/* grid-template-columns: repeat(auto-fit, minmax(10%, 23%)); /* Between 33% and 50% width */ /* grid-template-columns: repeat(auto-fit, minmax(10%, 23%)); /* Between 33% and 50% width */
@ -79,10 +93,11 @@
.search-container { .search-container {
padding: 10px; padding: 10px;
} }
</style> </style>
</head> </head>
<body> <body>
<nav class="navbar is-dark is-fixed-top" role="navigation" aria-label="main navigation"> <nav class="navbar is-dark is-fixed-top is-size-6" role="navigation" aria-label="main navigation">
<div class="navbar-brand"> <div class="navbar-brand">
<a class="navbar-item" href="/"> <a class="navbar-item" href="/">
Home Home
@ -267,37 +282,29 @@
</div> </div>
</div> </div>
</div> </div>
<footer class="card-footer" style=""> <footer class="card-footer" style="width:95%;">
<p class="card-footer-item"> <p class="card-footer-item"style="">
<span> <span>
<span class="is-size-7">{{ i[11] }}</span> <span class="is-size-7">{{ i[11] }}</span>
</span> </span>
</p> </p>
<p class="card-footer-item">
<span>
<a class="is-size-6" style="color: #363636;" href="/{{ i[0] }}/{{ i[11] }}">Inv.</a>
</span>
</p>
{% set ns = namespace(found=false) %} {% set ns = namespace(found=false) %}
{% for file in files %} {% for file in files %}
{% if ns.found is sameas false and file.startswith(i[0]) %} {% if ns.found is sameas false and file.startswith(i[0]) %}
<div class="card-footer-item dropdown"> <div class="card-footer-item dropdown">
<div class="dropdown-trigger" style="width:100%;"> <div class="dropdown-trigger">
<button class="is-size-6" style="display: flex;width: 100%;justify-content: space-between;" aria-haspopup="true" aria-controls="dropdown-menu3"> <button class="is-size-6" aria-haspopup="true" aria-controls="dropdown-menu3">
<span >Instructions</span> <span>
<span class="icon is-small"> <a class="is-size-6" style="color: #363636;">Inst.</a>
<i class="fas fa-angle-down" aria-hidden="true"></i> </span>
</span>
</button> </button>
</div> </div>
<div class="dropdown-menu" id="dropdown-menu3" role="menu"> <div class="dropdown-menu" id="dropdown-menu3" role="menu">
<div class="dropdown-content"> <div class="dropdown-content" style="width:max-content;">
<!-- <a class="js-modal-trigger is-size-6" style="color: #363636;" data-id="{{ i[0] }}" data-target="modal-inst">Inst.</a> --> <!-- <a class="js-modal-trigger is-size-6" style="color: #363636;" data-id="{{ i[0] }}" data-target="modal-inst">Inst.</a> -->
{% for x in files %} {% for x in files %}
{% if x.startswith(i[0]) %} {% if x.startswith(i[0]) %}
@ -311,6 +318,13 @@
{% set ns.found = true %} {% set ns.found = true %}
{% endif %} {% endif %}
{% endfor %} {% endfor %}
<p class="card-footer-item" style="">
<span>
<a class="is-size-6" style="color: #363636;" href="/{{ i[0] }}/{{ i[11] }}">Inv.</a>
</span>
</p>
</footer> </footer>
</div> </div>