]> nos-oignons.net Git - website.git/commitdiff
Ajout de la barre de progression.
authoropi <opi@no-log.org>
Fri, 5 Dec 2014 16:51:00 +0000 (17:51 +0100)
committeropi <opi@no-log.org>
Tue, 9 Dec 2014 16:19:50 +0000 (17:19 +0100)
Donnez.html
assets/progress_bar.png [new file with mode: 0644]
local.css

index f8ed75ba81afc97e4cb9af6ff65b3f88a3d00393..2c415d04080c411142c040fcb73e76ac08cdf645 100644 (file)
@@ -8,6 +8,20 @@
   de 10 € couvre donc une journée de fonctionnement d'un relai.
 </p>
 
+<h3>État de la trésorerie</h3>
+<div class="half-section section-progress-bar">
+  <div class="progress-bar-wrapper">
+    <div class="progress-bar" style="width: 50%;"></div>
+  </div>
+</div>
+<div class="half-section section-progress-text">
+  <p>
+    Un oignon correspond à 1 mois de fonctionnement.
+    <br />
+    Au dela de 6 mois, nous essayons de mettre en place un nouveau relai.
+  </p>
+</div>
+
 <h3>Par carte bleue</h3>
 
 <p>
 
 <div class="paypal-donation">
   <h4>Don mensuel</h4>
-  <form action="https://www.paypal.com/cgi-bin/webscr" method="post" target="_top">  
+  <form action="https://www.paypal.com/cgi-bin/webscr" method="post" target="_top">
     <input type="hidden" name="cmd" value="_s-xclick" />
     <input type="hidden" name="hosted_button_id" value="HXJ9BDH45MVSL" />
     <input type="hidden" name="on0" value="Choisissez le montant de votre don mensuel" />
diff --git a/assets/progress_bar.png b/assets/progress_bar.png
new file mode 100644 (file)
index 0000000..cfc6035
Binary files /dev/null and b/assets/progress_bar.png differ
index cdc9b535db2bb61e60082bc72c4e7016ba0159f7..28b9137877d7ff6ba6d4197eee3c539196504fe6 100644 (file)
--- a/local.css
+++ b/local.css
@@ -350,6 +350,13 @@ thead td {
 #content .footnotes {
        font-size: 80%;
 }
+
+.half-section {
+  display: inline-block;
+  vertical-align: top;
+  width: 49.5%;
+}
+
 /* #content }}} */
 
 /* Paypal donation forms */
@@ -373,6 +380,23 @@ thead td {
 }
 
 
+/* Progress bar */
+.progress-bar-wrapper {
+  margin-top: 1em;
+  height: 85px;
+  width: 300px;
+  background: lightGrey url(assets/progress_bar.png) top left repeat-x;
+  border: 1px solid #ccc;
+}
+.progress-bar-wrapper .progress-bar {
+  height: 85px;
+  background: grey url(assets/progress_bar.png) bottom left repeat-x;
+}
+.section-progress-text {
+  width: 47.5%;
+  padding-left: 2%;
+}
+
 
 /* {{{ .inlinepage */
 
@@ -517,4 +541,3 @@ thead td {
        }
 }
 /* @media print }}} */
-