Compare commits

...

2 Commits

Author SHA1 Message Date
805363eac5 Trying to move navigation into sidebar. 2020-08-05 19:54:13 +02:00
f9851071ed css 2020-08-05 19:52:00 +02:00
2 changed files with 20 additions and 21 deletions

View File

@ -280,7 +280,8 @@ body {
.LP-Menu--sidebar .LP-Menu__List .LP-Menu__Item:hover { .LP-Menu--sidebar .LP-Menu__List .LP-Menu__Item:hover {
border-right: 2px solid #C09F80; border-right: 2px solid #C09F80;
position: relative; position: relative;
background-color: #D7CEC7; } background-color: #D7CEC7;
color: #76323F; }
@media (max-width: 750px) { @media (max-width: 750px) {
.LP-Menu:not(.LP-Menu--sidebar) .LP-Menu__List { .LP-Menu:not(.LP-Menu--sidebar) .LP-Menu__List {
@ -516,15 +517,16 @@ body {
padding: 0; } } padding: 0; } }
.LP-Main { .LP-Main {
display: flex; display: table;
flex-direction: row-reverse; flex-direction: row-reverse;
height: calc(100% - 61px); } height: calc(100% - 61px); }
.LP-Main .LP-Main__Content { .LP-Main .LP-Main__Content {
flex-grow: 1; display: table-cell;
width: calc(100% -300px); width: calc(100% -300px);
min-height: 1px; } min-height: 1px;
padding: 25px; }
.LP-Main .LP-Main__Sidebar { .LP-Main .LP-Main__Sidebar {
flex-shrink: 0; display: table-cell;
width: 250px; width: 250px;
flex-grow: 0; flex-grow: 0;
height: 100%; } height: 100%; }

View File

@ -25,30 +25,27 @@
Hi {{ user.username }}! Hi {{ user.username }}!
<a class="LP-Link" href="{% url 'logout' %}"><span class="LP-Link__Text">logout</span></a> <a class="LP-Link" href="{% url 'logout' %}"><span class="LP-Link__Text">logout</span></a>
{% else %} {% else %}
Du bist nicht eingeloggt. You are not logged in.
<a class="LP-Link" href="{% url 'login' %}"><span class="LP-Link__Text">login</span></a> | <a class="LP-Link" href="{% url 'login' %}"><span class="LP-Link__Text">login</span></a> |
<a class="LP-Link" href="{% url 'signup' %}"><span class="LP-Link__Text">signup</span></a> <a class="LP-Link" href="{% url 'signup' %}"><span class="LP-Link__Text">signup</span></a>
{% endif %} {% endif %}
</span> </span>
</div> </div>
<div class="LP-Header__Navigation"> </header>
<nav class="LP-Menu LP-Menu"> <article class="LP-Main">
<section class="LP-Main__Sidebar">
<nav class="LP-Menu LP-Menu--sidebar">
<ul class="LP-Menu__List"> <ul class="LP-Menu__List">
<li class="LP-Menu__Item"><a href="/" class="LP-Link"> <li class="LP-Menu__Item"><a href="/" class="LP-Link"><span class="LP-Link__Text">Home</span></a></li>
<span class="LP-Link__Text">Home</span></a></li> <li class="LP-Menu__Item"><a href="" class="LP-Link"><span class="LP-Link__Text">About</span></a></li>
<li class="LP-Menu__Item"><a href="" class="LP-Link"> <li class="LP-Menu__Item"><a href="" class="LP-Link"><span class="LP-Link__Text">Contact</span></a></li>
<span class="LP-Link__Text">About</span></a></li>
<li class="LP-Menu__Item"><a href="" class="LP-Link">
<span class="LP-Link__Text">Contact</span></a></li>
</ul> </ul>
</nav> </nav>
</div> </section>
</header> <section class="LP-Main__Content">
{% block maincontent %}
<article class="LP-MainContainer"> {% endblock maincontent %}
{% block maincontent %} </section>
{% endblock maincontent %}
</article> </article>
</body> </body>
</html> </html>