diff --git a/package.json b/package.json index 7823f0a22..b6cce9141 100644 --- a/package.json +++ b/package.json @@ -139,6 +139,14 @@ "path": "./dist/css/tabler-flags.min.css", "maxSize": "2 kB" }, + { + "path": "./dist/css/tabler-payments.css", + "maxSize": "2 kB" + }, + { + "path": "./dist/css/tabler-payments.min.css", + "maxSize": "2 kB" + }, { "path": "./dist/js/tabler.js", "maxSize": "2 kB" diff --git a/pages/_data/docs.yml b/pages/_data/docs.yml index c2e34619e..48266936c 100644 --- a/pages/_data/docs.yml +++ b/pages/_data/docs.yml @@ -16,6 +16,7 @@ - page: form-helpers - page: input-mask - page: progress +- page: payments - page: ribbons - page: spinners - page: steps diff --git a/pages/_data/payments.yml b/pages/_data/payments.yml new file mode 100644 index 000000000..42b2b1a4f --- /dev/null +++ b/pages/_data/payments.yml @@ -0,0 +1,216 @@ +- name: "2checkout Dark" + payment: "2checkout-dark" +- name: "2checkout" + payment: "2checkout" +- name: "Alipay Dark" + payment: "alipay-dark" +- name: "Alipay" + payment: "alipay" +- name: "Amazon Dark" + payment: "amazon-dark" +- name: "Amazon" + payment: "amazon" +- name: "Americanexpress Dark" + payment: "americanexpress-dark" +- name: "Americanexpress" + payment: "americanexpress" +- name: "Applepay Dark" + payment: "applepay-dark" +- name: "Applepay" + payment: "applepay" +- name: "Bancontact Dark" + payment: "bancontact-dark" +- name: "Bancontact" + payment: "bancontact" +- name: "Bitcoin Dark" + payment: "bitcoin-dark" +- name: "Bitcoin" + payment: "bitcoin" +- name: "Bitpay Dark" + payment: "bitpay-dark" +- name: "Bitpay" + payment: "bitpay" +- name: "Cirrus Dark" + payment: "cirrus-dark" +- name: "Cirrus" + payment: "cirrus" +- name: "Clickandbuy Dark" + payment: "clickandbuy-dark" +- name: "Clickandbuy" + payment: "clickandbuy" +- name: "Coinkite Dark" + payment: "coinkite-dark" +- name: "Coinkite" + payment: "coinkite" +- name: "Dinersclub Dark" + payment: "dinersclub-dark" +- name: "Dinersclub" + payment: "dinersclub" +- name: "Directdebit Dark" + payment: "directdebit-dark" +- name: "Directdebit" + payment: "directdebit" +- name: "Discover Dark" + payment: "discover-dark" +- name: "Discover" + payment: "discover" +- name: "Dwolla Dark" + payment: "dwolla-dark" +- name: "Dwolla" + payment: "dwolla" +- name: "Ebay Dark" + payment: "ebay-dark" +- name: "Ebay" + payment: "ebay" +- name: "Eway Dark" + payment: "eway-dark" +- name: "Eway" + payment: "eway" +- name: "Giropay Dark" + payment: "giropay-dark" +- name: "Giropay" + payment: "giropay" +- name: "Googlewallet Dark" + payment: "googlewallet-dark" +- name: "Googlewallet" + payment: "googlewallet" +- name: "Ingenico Dark" + payment: "ingenico-dark" +- name: "Ingenico" + payment: "ingenico" +- name: "Jcb Dark" + payment: "jcb-dark" +- name: "Jcb" + payment: "jcb" +- name: "Klarna Dark" + payment: "klarna-dark" +- name: "Klarna" + payment: "klarna" +- name: "Laser Dark" + payment: "laser-dark" +- name: "Laser" + payment: "laser" +- name: "Maestro Dark" + payment: "maestro-dark" +- name: "Maestro" + payment: "maestro" +- name: "Mastercard Dark" + payment: "mastercard-dark" +- name: "Mastercard" + payment: "mastercard" +- name: "Monero Dark" + payment: "monero-dark" +- name: "Monero" + payment: "monero" +- name: "Neteller Dark" + payment: "neteller-dark" +- name: "Neteller" + payment: "neteller" +- name: "Ogone Dark" + payment: "ogone-dark" +- name: "Ogone" + payment: "ogone" +- name: "Okpay Dark" + payment: "okpay-dark" +- name: "Okpay" + payment: "okpay" +- name: "Paybox Dark" + payment: "paybox-dark" +- name: "Paybox" + payment: "paybox" +- name: "Paymill Dark" + payment: "paymill-dark" +- name: "Paymill" + payment: "paymill" +- name: "Payone Dark" + payment: "payone-dark" +- name: "Payone" + payment: "payone" +- name: "Payoneer Dark" + payment: "payoneer-dark" +- name: "Payoneer" + payment: "payoneer" +- name: "Paypal Dark" + payment: "paypal-dark" +- name: "Paypal" + payment: "paypal" +- name: "Paysafecard Dark" + payment: "paysafecard-dark" +- name: "Paysafecard" + payment: "paysafecard" +- name: "Payu Dark" + payment: "payu-dark" +- name: "Payu" + payment: "payu" +- name: "Payza Dark" + payment: "payza-dark" +- name: "Payza" + payment: "payza" +- name: "Ripple Dark" + payment: "ripple-dark" +- name: "Ripple" + payment: "ripple" +- name: "Sage Dark" + payment: "sage-dark" +- name: "Sage" + payment: "sage" +- name: "Sepa Dark" + payment: "sepa-dark" +- name: "Sepa" + payment: "sepa" +- name: "Shopify Dark" + payment: "shopify-dark" +- name: "Shopify" + payment: "shopify" +- name: "Skrill Dark" + payment: "skrill-dark" +- name: "Skrill" + payment: "skrill" +- name: "Solo Dark" + payment: "solo-dark" +- name: "Solo" + payment: "solo" +- name: "Square Dark" + payment: "square-dark" +- name: "Square" + payment: "square" +- name: "Stripe Dark" + payment: "stripe-dark" +- name: "Stripe" + payment: "stripe" +- name: "Switch Dark" + payment: "switch-dark" +- name: "Switch" + payment: "switch" +- name: "Ukash Dark" + payment: "ukash-dark" +- name: "Ukash" + payment: "ukash" +- name: "Unionpay Dark" + payment: "unionpay-dark" +- name: "Unionpay" + payment: "unionpay" +- name: "Verifone Dark" + payment: "verifone-dark" +- name: "Verifone" + payment: "verifone" +- name: "Verisign Dark" + payment: "verisign-dark" +- name: "Verisign" + payment: "verisign" +- name: "Visa Dark" + payment: "visa-dark" +- name: "Visa" + payment: "visa" +- name: "Webmoney Dark" + payment: "webmoney-dark" +- name: "Webmoney" + payment: "webmoney" +- name: "Westernunion Dark" + payment: "westernunion-dark" +- name: "Westernunion" + payment: "westernunion" +- name: "Worldpay Dark" + payment: "worldpay-dark" +- name: "Worldpay" + payment: "worldpay" \ No newline at end of file diff --git a/pages/_docs/payments.md b/pages/_docs/payments.md new file mode 100644 index 000000000..b9ce0f697 --- /dev/null +++ b/pages/_docs/payments.md @@ -0,0 +1,36 @@ +--- +title: Payments +menu: docs.payments +plugin: payments +--- + +### Payment + +{% example %} +{% include ui/payment.html payment="shopify"%} +{% include ui/payment.html%} +{% include ui/payment.html payment="paypal"%} +{% endexample %} + +### Payment sizes + +Using Bootstrap’s typical naming structure, you can create a standard payment, or scale it up to different sizes based on what’s needed. + +{% example %} +{% include ui/payment.html payment="shopify" size="xl"%} +{% include ui/payment.html size="lg"%} +{% include ui/payment.html payment="paypal" size="md"%} +{% include ui/payment.html payment="amazon"%} +{% endexample %} + +### Types + +
| {% include ui/payment.html payment=payment.payment %} | +{{ payment.payment }} |
+ {{ payment.name }} | +