adding the meta viewport tag means more css elements need to be adjusted; leaving this for when there is more time

This commit is contained in:
Your Name 2021-02-10 11:46:58 +01:00
parent bd3aa53854
commit dc13630964
2 changed files with 32 additions and 6 deletions

View File

@ -227,8 +227,6 @@ p {
word-break: break-word; word-break: break-word;
} }
/* Layout phone */
@media (max-width:770px) { @media (max-width:770px) {
nav#menu li { nav#menu li {
width: 50vw; width: 50vw;
@ -247,7 +245,6 @@ p {
} }
/* Layout tablet */
@media (max-width:1024px) { @media (max-width:1024px) {
body { body {
margin-left: 13vw; margin-left: 13vw;
@ -256,4 +253,32 @@ p {
nav#menu li { nav#menu li {
height: 14vw; height: 14vw;
} }
} */
/* @media (max-width:770px) {
nav#menu li {
width: 50vw;
height: 24vw;
font-size: 2em;
margin: 1em 0.1em;
}
header#banner h1 {
font-size: 10vw;
}
body{
margin-left: 9.4vw;
}
} }
@media (max-width:1024px) {
body {
margin-left: 13vw;
}
nav#menu li {
height: 14vw;
}
} */

View File

@ -6,15 +6,16 @@
<meta charset="utf-8" /> <meta charset="utf-8" />
<meta name="generator" content="Pelican" /> <meta name="generator" content="Pelican" />
<link rel="stylesheet" type="text/css" href="{{ SITEURL }}/{{ THEME_STATIC_DIR }}/css/{{ CSS_FILE }}" /> <link rel="stylesheet" type="text/css" href="{{ SITEURL }}/{{ THEME_STATIC_DIR }}/css/{{ CSS_FILE }}" />
<!-- <meta name="viewport" content="width=device-width, initial-scale=1"> -->
{% endblock head %} {% endblock head %}
</head> </head>
<body id="index" class="home"> <body id="index" class="home">
<header id="banner" class="body"> <header id="banner" class="body">
<h1><a href="{{ SITEURL }}/">{{ SITENAME }}{% if SITESUBTITLE %} <strong>{{ SITESUBTITLE }}</strong>{% endif %}</a></h1> <h1><a href="{{ SITEURL }}/">{{ SITENAME }}{% if SITESUBTITLE %} <strong>{{ SITESUBTITLE }}</strong>{% endif %}</a></h1>
</header> </header>
<nav id="menu"><ul> <nav id="menu"><ul>
{% for title, link in MENUITEMS %} {% for title, link in MENUITEMS %}
<a href="{{ link }}"><li>{{ title }}</li></a> <a href="{{ link }}"><li>{{ title }}</li></a>
@ -35,7 +36,7 @@
{% block content %} {% block content %}
{% endblock %} {% endblock %}
</section> </section>
<footer id="contentinfo" class="body"> <footer id="contentinfo" class="body">
<hr> <hr>
</footer> </footer>