Update note about rate limit in faucet page

assets/css/app.scss

@@ -52,4 +52,39 @@
       95%  {opacity: 1;}
       100% {opacity: 0;}
     }
-}
+}
+
+.note{
+  opacity: .9;
+}
+// colors
+.text-primary{
+  color: $primary;
+}
+.text-secondary{
+  color: $gray;
+}
+.text-success{
+  color: $success;
+}
+.text-danger{
+  color: $danger;
+}
+.text-warning{
+  color: $warning;
+}
+.text-info{
+  color: $info;
+}
+.text-light{
+  color: $light;
+}
+.text-dark{
+  color: $dark;
+}
+.text-muted{
+  color: $gray;
+}
+.text-white{
+  color: $white;
+}

assets/css/variables.scss

@@ -12,4 +12,26 @@ $navbar-item-hover-background-color: transparent;
 
 $card-header-background-color: #fff;
 
-$modal-background-background-color: #0a0a0a61;
+$modal-background-background-color: #0a0a0a61;
+
+//color variables
+$blue: #007bff;
+$indigo: #6610f2;
+$purple: #6f42c1;
+$pink: #e83e8c;
+$red: #dc3545;
+$orange: #fd7e14;
+$yellow: #ffc107;
+$green: #28a745;
+$teal: #20c997;
+$cyan: #17a2b8;
+$white: #fff;
+$gray: #6c757d;
+$gray-dark: #343a40;
+$secondary: #6c757d;
+$success: #28a745;
+$info: #17a2b8;
+$warning: #ffc107;
+$danger: #dc3545;
+$light: #f8f9fa;
+$dark: #343a40;

lib/archethic_web/templates/faucet/index.html.eex

@@ -24,6 +24,9 @@
           </button>
         </div>
       </form>
+      <div>
+        <small class="text-warning note" > <b>NOTE : </b> <%= faucet_rate_limit_message() %></small>
+      </div>
       <br>
             Don't have a wallet address? Learn how to create a new one!
             <br>

lib/archethic_web/views/faucet_view.ex

@@ -1,3 +1,10 @@
 defmodule ArchEthicWeb.FaucetView do
   use ArchEthicWeb, :view
+
+  def faucet_rate_limit_message() do
+    rate_limit = Application.get_env(:archethic, :faucet_rate_limit)
+    expiry = Application.get_env(:archethic, :faucet_rate_limit_expiry, 0)
+
+    "Allowed only #{rate_limit} transactions for the period of #{ArchEthic.Utils.seconds_to_human_readable(expiry / 1000)}"
+  end
 end