donate: Replace payment icons by font

Signed-off-by: Michael Tremer <michael.tremer@ipfire.org>

diff --git a/Makefile.am b/Makefile.am
index 43033d44102b2a61cf3a647db53e850cc7c57967..3980d5183a7c55a6c4a63e8e0e35c9e3e7ebde1c 100644 (file)
--- a/Makefile.am
+++ b/Makefile.am
@@ -246,27 +246,20 @@ static_fonts_DATA = \
        src/font-awesome/web-fonts-with-css/webfonts/fa-solid-900.svg \
        src/font-awesome/web-fonts-with-css/webfonts/fa-solid-900.ttf \
        src/font-awesome/web-fonts-with-css/webfonts/fa-solid-900.woff \
-       src/font-awesome/web-fonts-with-css/webfonts/fa-solid-900.woff2
+       src/font-awesome/web-fonts-with-css/webfonts/fa-solid-900.woff2 \
+       \
+       src/payment-font/fonts/paymentfont-webfont.eot \
+       src/payment-font/fonts/paymentfont-webfont.svg \
+       src/payment-font/fonts/paymentfont-webfont.ttf \
+       src/payment-font/fonts/paymentfont-webfont.woff
 
 static_fontsdir = $(staticdir)/fonts
 
 static_images_DATA = \
-       src/static/img/amex.png \
-       src/static/img/amex@2x.png \
-       src/static/img/amex@3x.png \
        src/static/img/appliance-pro.png \
        src/static/img/default-avatar.jpg \
        src/static/img/ipfire-tux.png \
-       src/static/img/lightningwirelabs-logo.svg \
-       src/static/img/mastercard.png \
-       src/static/img/mastercard@2x.png \
-       src/static/img/mastercard@3x.png \
-       src/static/img/paypal.png \
-       src/static/img/paypal@2x.png \
-       src/static/img/paypal@3x.png \
-       src/static/img/visa.png \
-       src/static/img/visa@2x.png \
-       src/static/img/visa@3x.png
+       src/static/img/lightningwirelabs-logo.svg
 
 static_imagesdir = $(staticdir)/img
 

diff --git a/src/scss/_icons.scss b/src/scss/_icons.scss
index d95c525bcfdf3be1f21d9d69b5ded1087f9ebefc..940e16e97297cbce5468329de2a596ccae41d427 100644 (file)
--- a/src/scss/_icons.scss
+++ b/src/scss/_icons.scss
@@ -7,3 +7,11 @@ $fa-font-base-size:                    $font-size-base;
 @import "../font-awesome/web-fonts-with-css/scss/solid";
 @import "../font-awesome/web-fonts-with-css/scss/regular";
 @import "../font-awesome/web-fonts-with-css/scss/brands";
+
+// PaymentFont
+
+$pf-font-path:              "fonts";
+
+$pf-font-size-base:         $font-size-base;
+
+@import "../payment-font/sass/paymentfont";

diff --git a/src/static/img/amex.png b/src/static/img/amex.png
deleted file mode 100644 (file)
index 6c36bf4..0000000
Binary files a/src/static/img/amex.png and /dev/null differ

diff --git a/src/static/img/amex@2x.png b/src/static/img/amex@2x.png
deleted file mode 100644 (file)
index 104a5da..0000000
Binary files a/src/static/img/amex@2x.png and /dev/null differ

diff --git a/src/static/img/amex@3x.png b/src/static/img/amex@3x.png
deleted file mode 100644 (file)
index 27d7747..0000000
Binary files a/src/static/img/amex@3x.png and /dev/null differ

diff --git a/src/static/img/mastercard.png b/src/static/img/mastercard.png
deleted file mode 100644 (file)
index 9ca8772..0000000
Binary files a/src/static/img/mastercard.png and /dev/null differ

diff --git a/src/static/img/mastercard@2x.png b/src/static/img/mastercard@2x.png
deleted file mode 100644 (file)
index bd2132f..0000000
Binary files a/src/static/img/mastercard@2x.png and /dev/null differ

diff --git a/src/static/img/mastercard@3x.png b/src/static/img/mastercard@3x.png
deleted file mode 100644 (file)
index dfdef22..0000000
Binary files a/src/static/img/mastercard@3x.png and /dev/null differ

diff --git a/src/static/img/paypal.png b/src/static/img/paypal.png
deleted file mode 100644 (file)
index 112fcdb..0000000
Binary files a/src/static/img/paypal.png and /dev/null differ

diff --git a/src/static/img/paypal@2x.png b/src/static/img/paypal@2x.png
deleted file mode 100644 (file)
index 345891e..0000000
Binary files a/src/static/img/paypal@2x.png and /dev/null differ

diff --git a/src/static/img/paypal@3x.png b/src/static/img/paypal@3x.png
deleted file mode 100644 (file)
index 21ca749..0000000
Binary files a/src/static/img/paypal@3x.png and /dev/null differ

diff --git a/src/static/img/visa.png b/src/static/img/visa.png
deleted file mode 100644 (file)
index 4dc8bbe..0000000
Binary files a/src/static/img/visa.png and /dev/null differ

diff --git a/src/static/img/visa@2x.png b/src/static/img/visa@2x.png
deleted file mode 100644 (file)
index f84d83c..0000000
Binary files a/src/static/img/visa@2x.png and /dev/null differ

diff --git a/src/static/img/visa@3x.png b/src/static/img/visa@3x.png
deleted file mode 100644 (file)
index add2261..0000000
Binary files a/src/static/img/visa@3x.png and /dev/null differ

diff --git a/src/templates/donate.html b/src/templates/donate.html
index c82fc9c6f272ca474d72f22bcde37ccec3e43638..87338f64fbfe515e046cfc3ebd9dca601e5fc088 100644 (file)
--- a/src/templates/donate.html
+++ b/src/templates/donate.html
@@ -177,52 +177,18 @@
                                                                                                </div>
                                                                                        </div>
                                                                                </div>
-                                                                       </div>
-                                                               </div>
 
-                                                               <div class="row mb-5">
-                                                                       <div class="col text-center">
                                                                                <input type="submit" class="btn btn-primary btn-lg"
                                                                                        id="donate" value="{{ _("Donate Now") }}">
                                                                        </div>
                                                                </div>
 
                                                                <div class="row">
-                                                                       <div class="col d-flex justify-content-center">
-                                                                               <picture>
-                                                                                       <source srcset="{{ static_url("img/amex.png") }},
-                                                                                               {{ static_url("img/amex@2x.png") }} 2x,
-                                                                                               {{ static_url("img/amex@3x.png") }} 3x">
-                                                                                       <img src="{{ static_url("img/amex.png") }}"
-                                                                                               srcset="{{ static_url("img/amex.png") }},
-                                                                                               {{ static_url("img/amex@2x.png") }} 2x,
-                                                                                               {{ static_url("img/amex@3x.png") }} 3x"
-                                                                                               alt="Amex" class="m-xl-2">
-                                                                               </picture>
-
-                                                                               <picture>
-                                                                                       <source srcset="{{ static_url("img/mastercard.png") }},
-                                                                                               {{ static_url("img/mastercard@2x.png") }} 2x,
-                                                                                               {{ static_url("img/mastercard@3x.png") }} 3x">
-                                                                                       <img src="{{ static_url("img/mastercard.png") }}"
-                                                                                               srcset="{{ static_url("img/mastercard.png") }},
-                                                                                               {{ static_url("img/mastercard@2x.png") }} 2x,
-                                                                                               {{ static_url("img/mastercard@3x.png") }} 3x"
-                                                                                               alt="Mastercard" class="m-xl-2">
-                                                                               </picture>
-
-                                                                               <picture>
-                                                                                       <source srcset="{{ static_url("img/visa.png") }},
-                                                                                               {{ static_url("img/visa@2x.png") }} 2x,
-                                                                                               {{ static_url("img/visa@3x.png") }} 3x">
-                                                                                       <img src="{{ static_url("img/visa.png") }}"
-                                                                                               srcset="{{ static_url("img/visa.png") }},
-                                                                                               {{ static_url("img/visa@2x.png") }} 2x,
-                                                                                               {{ static_url("img/visa@3x.png") }} 3x"
-                                                                                               alt="Visa" class="m-xl-2">
-                                                                               </picture>
-
-                                                                               <!-- XXX insert SEPA logo -->
+                                                                       <div class="col d-flex justify-content-around text-muted">
+                                                                               <span class="pf pf-2x pf-american-express"></span>
+                                                                               <span class="pf pf-2x pf-mastercard-alt"></span>
+                                                                               <span class="pf pf-2x pf-visa"></span>
+                                                                               <span class="pf pf-2x pf-sepa"></span>
                                                                        </div>
                                                                </div>