add all changes

This commit is contained in:
j 2021-10-12 16:20:58 +01:00
parent 3b2b6ccefd
commit a1a759a88f
3 changed files with 24 additions and 31 deletions

View file

@ -6,11 +6,8 @@
padding-left: 16px; padding-left: 16px;
padding-top: 16px; padding-top: 16px;
@media screen and (max-width: 799px) { @media screen and (max-width: 799px) {
overflow: hidden; padding-left: 0;
z-index: 100; padding-right: 0;
height: initial;
padding-left: initial;
padding-top: initial;
} }
nav { nav {
@ -18,9 +15,10 @@
text-align: right; text-align: right;
margin-right: 16px; margin-right: 16px;
@media screen and (max-width: 799px) { @media screen and (max-width: 799px) {
display: none; text-align: center;
text-align: initial; width: 100%;
margin-right: initial; margin-right: 0;
margin-top: 16px;
} }
} }
@ -28,25 +26,21 @@
color: white; color: white;
text-decoration: none; text-decoration: none;
font-size: 17px; font-size: 17px;
@media screen and (max-width: 799px) {
padding: 14px 16px;
display: block;
}
&.icon {
display: none;
@media screen and (max-width: 799px) {
display: block;
position: absolute;
right: 0;
top: 0;
}
}
&:hover { &:hover {
background-color: #ddd; background-color: #ddd;
color: black; color: black;
} }
@media screen and (max-width: 799px) {
&.title {
display: block;
text-align: center;
}
div {
display: inline-block;
}
}
} }

View file

@ -1,6 +1,6 @@
@import "partials/reset"; @import "partials/reset";
@import "partials/layout"; @import "partials/layout";
@import "partials/burger"; @import "partials/menu";
@import "partials/film"; @import "partials/film";
@import "partials/text"; @import "partials/text";
@import "partials/ascroll"; @import "partials/ascroll";

View file

@ -13,24 +13,23 @@
</head> </head>
<body> <body>
<div class="topnav"> <div class="topnav">
<a href="/polis" class="active"> <a href="/polis" class="title">
<div>
Phantas.ma/polis<span class="hide-mobile">: Looking Back to the Future</span> Phantas.ma/polis<span class="hide-mobile">: Looking Back to the Future</span>
<br> </div>
未竟之城:回顧未來 <div>
未竟之城<span class="hide-mobile">:回顧未來</span>
</div>
</a> </a>
<nav> <nav>
<a href="{% url 'films'%}">films - 影片</a> <a href="{% url 'films'%}">films - 影片</a>
<a href="{% url 'texts' %}">assemblies - </a> <a href="{% url 'texts' %}">assemblies - 组件</a>
<a href="{% url 'about' %}">about - 關於</a> <a href="{% url 'about' %}">about - 關於</a>
</nav> </nav>
<a class="icon">
<svg height="32px" style="enable-background:new 0 0 32 32;" version="1.1" viewBox="0 0 32 32" width="32px" xml:space="preserve" xmlns="http://www.w3.org/2000/svg"><path d="M4,10h24c1.104,0,2-0.896,2-2s-0.896-2-2-2H4C2.896,6,2,6.896,2,8S2.896,10,4,10z M28,14H4c-1.104,0-2,0.896-2,2 s0.896,2,2,2h24c1.104,0,2-0.896,2-2S29.104,14,28,14z M28,22H4c-1.104,0-2,0.896-2,2s0.896,2,2,2h24c1.104,0,2-0.896,2-2 S29.104,22,28,22z"/></svg>
</a>
</div> </div>
<main> <main>
{% block main %}{% endblock main %} {% block main %}{% endblock main %}
</main> </main>
{% block end %}{% endblock end %} {% block end %}{% endblock end %}
<script src="{% static 'js/menu.js' %}"></script>
</body> </body>
</html> </html>