Kaynağa Gözat

[Refs #2][add] responsive submit form
[add] Link to post on index

isundil 9 yıl önce
ebeveyn
işleme
4c2fe28415
3 değiştirilmiş dosya ile 14 ekleme ve 1 silme
  1. 3 0
      src/templates/bonjour.php
  2. 5 1
      src/templates/post.php
  3. 6 0
      www/css/style.css

+ 3 - 0
src/templates/bonjour.php

@@ -41,4 +41,7 @@ $yymmddStr = $yymmddDT->format("d ")
         </div>
     </footer>
 </div></div>
+<footer class="page-footer">
+    <a href="/post">Envoyer votre Flammenkuchen !</a>
+</footer>
 </body></html>

+ 5 - 1
src/templates/post.php

@@ -1,4 +1,8 @@
 <?php require ("header.php"); ?><title>Share a flamm</title><script src="/js/scripts_post.js"></script></head><body>
+<header>
+    <h1><a href="/">Bonjour Flammenkuchen !</a></h1>
+    <p>Tous les jours, un peu plus de lardons !!</p>
+</header>
 <?php $disabled = "";
 if ($msg !== null)
 {
@@ -23,6 +27,6 @@ if ($msg !== null)
             <input type="file" name="img" <?php echo $disabled; ?>/>
         </label>
     </div>
-    <input type="submit" <?php echo $disabled; ?>>
+    <div class="input-group"><input type="submit" <?php echo $disabled; ?>></div>
 </form>
 </body></html>

+ 6 - 0
www/css/style.css

@@ -8,7 +8,9 @@
 * { margin: 0; padding: 0; font-size: 1.05em; }
 body { margin: 50px 100px; }
 header { margin-bottom: 50px; }
+header a { font-style: normal; color: black; padding: 0; }
 footer { margin-top: 50px; }
+footer.page-footer { clear: both; padding-top: 75px; text-align: center; }
 h1 { display: inline-block; padding: 25px; margin: 10px 0; background-color: #D3B3A5; color: black; font-weight: bold; font-size: 2.5rem; font-family: bacon; }
 h2 { color: #D3B3A5; font-weight: bold; font-size: 1.7rem; font-family: bacon; }
 h3 { color: #EDD6CB; font-weight: bold; font-size: 1.25rem; font-family: bacon; }
@@ -23,10 +25,14 @@ img { max-width: 100%; }
 .article-footer { text-align: center; }
 
 .alert { background: #EDD6CB; border: 1px solid #D3B3A5; margin: 0 0 30px 0; padding: 10px 25px; border-radius: 5px; }
+.input-group { margin: 10px 0; }
 .input-group span { display: inline-block; width: 250px; }
+input[type="submit"] { display: inline-block; margin: 10px 0; padding: 10px; border: none; background-color: #D3B3A5; color: white; font-family: bacon; }
 
 @media screen and (max-width: 1024px) {
     body { margin: 0 10px 50px 10px; text-align: center; }
     .section { display: block; width: 100%; margin: 15px 0; float: none; }
+    .input-group { text-align: left; }
+    .input-group span { width: 100%; }
 }