Parcourir la source

html: separated templates

Nikola Kotur il y a 10 ans
Parent
commit
67ef66bd4e
4 fichiers modifiés avec 48 ajouts et 61 suppressions
  1. 2 8
      templates/base.html
  2. 3 1
      templates/footer.html
  3. 17 1
      templates/header.html
  4. 26 51
      templates/home.html

+ 2 - 8
templates/base.html

@@ -20,17 +20,11 @@
   </head>
   <body>
 
-    <header>
+    <div class="container">
       {% include "header.html" %}
-    </header>
-
-    <div id="main" role="main">
       {% block main %}{% endblock %}
-    </div>
-
-    <footer>
       {% include "footer.html" %}
-    </footer>
+    </div>
 
     <!-- jQuery (necessary for Bootstrap's JavaScript plugins) -->
     <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>

+ 3 - 1
templates/footer.html

@@ -1 +1,3 @@
-<!-- Footer -->
+<div class="footer">
+  <p>&copy; Phosic 2014</p>
+</div>

+ 17 - 1
templates/header.html

@@ -1 +1,17 @@
-<!-- Header -->
+<div class="header">
+  <ul class="nav nav-pills pull-right">
+    <li class="active"><a href="#">Home</a></li>
+    <li><a href="#">About</a></li>
+    <li><a href="#">Contact</a></li>
+  </ul>
+  <h3 class="text-muted">Phosic</h3>
+</div>
+
+<div class="jumbotron">
+  <h1>Make video!</h1>
+  <p class="lead">
+    This website lets you join MP3 song and a picture, for  free! Just
+    fill the form below and we will mail you the download link  when our
+    robots finish creating your video.
+  </p>
+</div>

+ 26 - 51
templates/home.html

@@ -6,64 +6,39 @@
 
 {% block main %}
 
-    <div class="container">
-      <div class="header">
-        <ul class="nav nav-pills pull-right">
-          <li class="active"><a href="#">Home</a></li>
-          <li><a href="#">About</a></li>
-          <li><a href="#">Contact</a></li>
-        </ul>
-        <h3 class="text-muted">Phosic</h3>
+<div class="row marketing">
+  <div class="col-lg-12">
+    <form class="form-horizontal" role="form">
+      <div class="form-group">
+        <label for="inputEmail3" class="col-sm-2 control-label">Email</label>
+        <div class="col-sm-10">
+          <input type="email" class="form-control" id="inputEmail3" placeholder="Email">
+          <span class="help-block">We will send you download link here, nothing more.</span>
+        </div>
       </div>
 
-      <div class="jumbotron">
-        <h1>Make video!</h1>
-        <p class="lead">
-          This website lets you join MP3 song and a picture, for  free! Just
-          fill the form below and we will mail you the download link  when our
-          robots finish creating your video.
-        </p>
+      <div class="form-group">
+        <label for="mp3File" class="col-sm-2 control-label">MP3</label>
+        <div class="col-sm-10">
+            <input type="file" id="mp3File">
+        </div>
       </div>
 
-      <div class="row marketing">
-        <div class="col-lg-12">
-            <form class="form-horizontal" role="form">
-              <div class="form-group">
-                <label for="inputEmail3" class="col-sm-2 control-label">Email</label>
-                <div class="col-sm-10">
-                  <input type="email" class="form-control" id="inputEmail3" placeholder="Email">
-                  <span class="help-block">We will send you download link here, nothing more.</span>
-                </div>
-              </div>
-
-              <div class="form-group">
-                <label for="mp3File" class="col-sm-2 control-label">MP3</label>
-                <div class="col-sm-10">
-                    <input type="file" id="mp3File">
-                </div>
-              </div>
-
-              <div class="form-group">
-                <label for="picFile" class="col-sm-2 control-label">Picture</label>
-                <div class="col-sm-10">
-                    <input type="file" id="picFile">
-                </div>
-              </div>
-
-              <div class="form-group">
-                <span class="col-sm-2">&nbsp</span>
-                <div class="col-sm-10">
-                  <button type="submit" class="btn btn-default">Submit</button>
-                </div>
-              </div>
-            </form>
+      <div class="form-group">
+        <label for="picFile" class="col-sm-2 control-label">Picture</label>
+        <div class="col-sm-10">
+            <input type="file" id="picFile">
         </div>
       </div>
 
-      <div class="footer">
-        <p>&copy; Company 2014</p>
+      <div class="form-group">
+        <span class="col-sm-2">&nbsp</span>
+        <div class="col-sm-10">
+          <button type="submit" class="btn btn-default">Submit</button>
+        </div>
       </div>
-
-    </div> <!-- /container -->
+    </form>
+  </div>
+</div>
 
 {% endblock %}