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

3 years ago · dc13630964
2 changed files with 32 additions and 6 deletions
--- a/themes/default/static/css/main.css
+++ b/themes/default/static/css/main.css
@ -227,8 +227,6 @@ p {
 	word-break: break-word;
 }

-
-/* Layout phone */
@media (max-width:770px) {
 	nav#menu li {
 		width: 50vw;
@ -247,7 +245,6 @@ p {

 }

-/* Layout tablet */
@media (max-width:1024px) {
 	body {
 		margin-left: 13vw;
@ -256,4 +253,32 @@ p {
 		nav#menu li {
 			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;
+		}
+} */
--- a/themes/default/templates/base.html
+++ b/themes/default/templates/base.html
@ -6,15 +6,16 @@
 	<meta charset="utf-8" />
 	<meta name="generator" content="Pelican" />
 	<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 %}
 </head>

-<body id="index" class="home"> 
+<body id="index" class="home">

 	<header id="banner" class="body">
 		<h1><a href="{{ SITEURL }}/">{{ SITENAME }}{% if SITESUBTITLE %} <strong>{{ SITESUBTITLE }}</strong>{% endif %}</a></h1>
 	</header>
-	
+
 	<nav id="menu"><ul>
 	{% for title, link in MENUITEMS %}
 		<a href="{{ link }}"><li>{{ title }}</li></a>
@ -35,7 +36,7 @@
 	{% block content %}
 	{% endblock %}
 	</section>
-	
+
 	<footer id="contentinfo" class="body">
 		<hr>
 	</footer>