Skip to content
Snippets Groups Projects

Change Layout of the base template

Merged Change Layout of the base template
develop into main
Merged
Tobias Mievesrequested to merge
develop into main
Compare
and
3 files
+ 83
− 72
Compare changes
  • Side-by-side
  • Inline

Files

templates/base.html
+ 80
− 70
@@ -2,80 +2,90 @@
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>{% block title %}Core{% endblock %}</title>
<link href="{% static 'core/css/output.css' %}" rel="stylesheet" type="text/css">
{# <meta http-equiv="refresh" content="10">#}
{% block head %}{% endblock %}
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>{% block title %}Core{% endblock %}</title>
<link href="{% static 'core/css/output.css' %}" rel="stylesheet" type="text/css">
{#<meta http-equiv="refresh" content="10">#}
{% block head %}{% endblock %}
</head>
<body>
<div class="navbar shadow-lg bg-neutral text-neutral-content rounded-box max-h-24 mb-3.5">
<div class="flex-none lg:hidden">
<label for="my-drawer-3" class="btn btn-square btn-ghost">
<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24"
class="inline-block w-6 h-6 stroke-current">
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
d="M4 6h16M4 12h16M4 18h16"></path>
</svg>
</label>
</div>
<div class="flex-1 px-2 mx-2 navbar-start">
<a href="{% url 'home_view' %}" class="text-lg font-bold align-middle">
{% block home_logo %}DaisyUI{% endblock %}
</a>
</div>
<div class="flex-none gap-2">
{% block navbar_extra %}
<div class="form-control">
<input type="text" placeholder="Search" class="input input-bordered"/>
</div>
{% endblock %}
<div class="dropdown dropdown-end">
{% block account_picture %}
<label tabindex="0" class="btn btn-ghost btn-circle avatar">
<div class="w-10 rounded-full">
<img src="https://placeimg.com/80/80/people"/>
</div>
</label>
{% endblock %}
<ul tabindex="0"
class="mt-3 p-2 shadow menu menu-compact dropdown-content bg-base-100 text-base-content rounded-box w-52">
{% block account_dropdown_list %}
<li>
<a href="{% url 'password_change' %}">Passwort ändern</a>
</li>
<li>
<a href="{% url 'logout' %}">{{ user.username }} abmelden</a>
</li>
{% endblock %}
</ul>
</div>
</div>
</div>
<div class="drawer drawer-mobile pt-20" style="margin-top:-5rem;">
<input id="my-drawer-3" type="checkbox" class="drawer-toggle"/>
<div class="drawer-content flex flex-col">
<!-- Navbar -->
<div class="drawer">
<input id="drawer" type="checkbox" class="drawer-toggle"/>
<div class="drawer-content flex flex-col">
<!-- Navbar -->
<div class="navbar w-full bg-neutral text-neutral-content rounded-box">
<div class="flex-none lg:hidden">
<label for="drawer" class="btn btn-square btn-ghost">
<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24"
class="inline-block w-6 h-6 stroke-current">
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
d="M4 6h16M4 12h16M4 18h16"></path>
</svg>
</label>
</div>
<div class="flex-1 px-2 mx-2">
<a href="{% url 'home_view' %}" class="text-lg font-bold align-middle">
{% block home_logo %}DaisyUI{% endblock %}
</a>
</div>
<div class="flex-none hidden lg:block">
<ul class="menu menu-horizontal">
{% block navbar_links %}
<li><a>Item 1</a></li>
<li tabindex="0">
<details>
<summary>Parent</summary>
<ul class="p-2">
<li><a>Submenu 1</a></li>
<li><a>Submenu 2</a></li>
</ul>
</details>
</li>
<li><a>Item 3</a></li>
{% endblock %}
</ul>
</div>
<div class="dropdown dropdown-end">
{% block account_picture %}
<label tabindex="0" class="btn btn-ghost btn-circle avatar">
<div class="w-10 rounded-full">
<img src="https://placeimg.com/80/80/people"/>
</div>
</label>
{% endblock %}
<ul tabindex="0"
class="mt-3 p-2 shadow menu menu-compact dropdown-content bg-base-100 text-base-content rounded-box w-52">
{% block account_dropdown_list %}
<li>
<a href="{% url 'password_change' %}">Passwort ändern</a>
</li>
<li>
<a href="{% url 'logout' %}">{{ user.username }} abmelden</a>
</li>
{% endblock %}
</ul>
</div>
</div>
<!-- Page content here -->
<main class="p-4 w-full">
{% block content %}
Content
{% endblock %}
</main>
</div>
<div class="drawer-side">
<label for="drawer" class="drawer-overlay"></label>
<ul class="menu p-4 w-80 min-h-full bg-base-200">
{% block sidebar_links %}
<li><a>Sidebar Item 1</a></li>
<li><a>Sidebar Item 2</a></li>
{% endblock %}
<!-- Page content here -->
<main>
<div class="p-4 mb-20 lg:mb-0">
{% block content %}
{% endblock %}
</div>
</main>
</div>
<div class="drawer-side shadow-lg rounded-box lg:ml-4">
<label for="my-drawer-3" class="drawer-overlay"></label>
<ul class="menu p-4 w-fit m-w-xs mb-20 lg:mb-0 bg-base-100">
{% block sidebar_list %}
<li><a>Sidebar Item 1</a></li>
<li><a>Sidebar Item 2</a></li>
{% endblock %}
</ul>
</ul>
</div>
</div>
</div>
</body>
</html>
\ No newline at end of file