Remove header and move media area to top

tamamu · tamamu · commit 1fe4ce482750 · 2017-11-13T17:51:50.000+09:00
diff --git a/templates/exercise.html b/templates/exercise.html
@@ -1,4 +1,4 @@
-{% extends "default.html" %}
+{% extends "noheader.html" %}
 {% block title %}{{ question.data.name }} - Lisp Tutor{% endblock %}
 {% block head %}
   <link rel="stylesheet" href="/static/codemirror.css">
@@ -42,16 +42,16 @@
     </div>
     <button class="modal-close is-large" aria-label="close"></button>
   </div>
+  <style>
+    #media-area{position:relative;padding-top:56.25%;margin-bottom:24px;}
+    #media-area .media{position:absolute;top:0;right:0;width:100% !important;height:100% !important;}
+  </style>
   <section class="section" style="flex: 1;">
     <div class="columns is-centered">
       <div class="column is-8">
+        <div id="media-area"></div>
         <div id="desc-area" class="box">
-          <style>
-            #media-area{position:relative;width:100%;padding-top:56.25%;}
-            #media-area .media{position:absolute;top:0;right:0;width:100% !important;height:100% !important;}
-          </style>
           <div id="title" class="content"></div>
-          <div id="media-area"></div>
           <div id="description" class="content"></div>
         </div>
         <div id="quest-area" class="box">
diff --git a/templates/noheader.html b/templates/noheader.html
@@ -0,0 +1,29 @@
+<!DOCTYPE html>
+<html>
+<head>
+  <meta charset="UTF-8">
+  <meta name="viewport" content="width=device-width, initial-scale=1">
+  <title>{% block title %}{% endblock %}</title>
+  <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css">
+  <link rel="stylesheet" href="/static/bulma.css">
+  {% block head %}{% endblock %}
+</head>
+<body style="display: flex; flex-direction: column; min-height: 100vh;">
+  {% block content %}{% endblock%}
+  <footer class="footer">
+    <div class="container">
+      <div class="content has-text-centered">
+        <p>
+          <strong>Lisp Tutor</strong> by <a href="https://github.com/tamamu">Eddie</a>. The source code is licensed
+          <a href="http://opensource.org/licenses/mit-license.php">MIT</a>.
+        </p>
+        <p>
+          <a class="icon" href="https://github.com/tamamu/cl-exercise">
+            <i class="fa fa-github"></i>
+          </a>
+        </p>
+      </div>
+    </div>
+  </footer>
+</body>
+</html>
