Initial commit
diff --git a/assets/css/stripe-styles.scss b/assets/css/stripe-styles.scss
new file mode 100644
index 0000000..b8ecfe9
--- /dev/null
+++ b/assets/css/stripe-styles.scss
@@ -0,0 +1,268 @@
+// TODO: Refactor this file to use SCSS syntax.
+.wc-stripe-elements-field,
+.wc-stripe-iban-element-field {
+ border: 1px solid #ddd;
+ margin: 5px 0;
+ padding: 5px;
+ background-color: #fff;
+ outline: 0;
+}
+#payment .methods li.woocommerce-SavedPaymentMethods-token label {
+ display: inline;
+}
+#payment .methods li.woocommerce-SavedPaymentMethods-new label {
+ display: inline;
+}
+
+.woocommerce-checkout #payment ul.payment_methods li img.stripe-icon,
+#add_payment_method #payment ul.payment_methods li img.stripe-icon {
+ max-width: 40px;
+ padding-left: 3px;
+ margin: 0;
+}
+
+.woocommerce-checkout #payment ul.payment_methods li img.stripe-bancontact-icon,
+#add_payment_method #payment ul.payment_methods li img.stripe-bancontact-icon {
+ max-height: 65px;
+ max-width: 45px;
+}
+
+.woocommerce-checkout #payment ul.payment_methods li img.stripe-ideal-icon,
+#add_payment_method #payment ul.payment_methods li img.stripe-ideal-icon {
+ max-height: 35px;
+}
+
+.woocommerce-checkout #payment ul.payment_methods li img.stripe-p24-icon,
+#add_payment_method #payment ul.payment_methods li img.stripe-p24-icon {
+ max-width: 65px;
+}
+
+.woocommerce-checkout #payment ul.payment_methods li img.stripe-alipay-icon,
+#add_payment_method #payment ul.payment_methods li img.stripe-alipay-icon {
+ max-width: 50px;
+}
+
+.woocommerce-checkout #payment ul.payment_methods li img.stripe-sofort-icon,
+#add_payment_method #payment ul.payment_methods li img.stripe-sofort-icon {
+ max-width: 55px;
+}
+
+.woocommerce-checkout #payment ul.payment_methods li img.stripe-sepa-icon,
+#add_payment_method #payment ul.payment_methods li img.stripe-sepa-icon {
+ max-width: 50px;
+}
+
+.woocommerce-checkout #payment ul.payment_methods li img.stripe-multibanco-icon,
+#add_payment_method #payment ul.payment_methods li img.stripe-multibanco-icon {
+ max-height: 30px;
+}
+
+.woocommerce-checkout #payment ul.payment_methods li img.stripe-eps-icon,
+#add_payment_method #payment ul.payment_methods li img.stripe-eps-icon {
+ max-height: 30px;
+}
+
+.woocommerce-checkout #payment ul.payment_methods li img.stripe-giropay-icon,
+#add_payment_method #payment ul.payment_methods li img.stripe-giropay-icon {
+ max-width: 50px;
+}
+
+.woocommerce-checkout #payment ul.payment_methods li .stripe-credit-card-brand,
+#add_payment_method #payment ul.payment_methods li .stripe-credit-card-brand {
+ position: absolute;
+ top: 50%;
+ margin-top: -10px;
+ right: 10px;
+ background: no-repeat url( '../images/credit-card.svg' );
+ display: block;
+ width: 30px;
+ height: 24px;
+}
+
+.woocommerce-checkout #payment ul.payment_methods li .stripe-visa-brand,
+#add_payment_method #payment ul.payment_methods li .stripe-visa-brand {
+ position: absolute;
+ top: 50%;
+ margin-top: -10px;
+ right: 10px;
+ background: no-repeat url( '../images/visa.svg' );
+ display: block;
+ width: 30px;
+ height: 24px;
+}
+
+.woocommerce-checkout #payment ul.payment_methods li .stripe-amex-brand,
+#add_payment_method #payment ul.payment_methods li .stripe-amex-brand {
+ position: absolute;
+ top: 50%;
+ margin-top: -10px;
+ right: 10px;
+ background: no-repeat url( '../images/amex.svg' );
+ display: block;
+ width: 30px;
+ height: 24px;
+}
+
+.woocommerce-checkout #payment ul.payment_methods li .stripe-diners-brand,
+#add_payment_method #payment ul.payment_methods li .stripe-diners-brand {
+ position: absolute;
+ top: 50%;
+ margin-top: -10px;
+ right: 10px;
+ background: no-repeat url( '../images/diners.svg' );
+ display: block;
+ width: 30px;
+ height: 24px;
+}
+
+.woocommerce-checkout #payment ul.payment_methods li .stripe-discover-brand,
+#add_payment_method #payment ul.payment_methods li .stripe-discover-brand {
+ position: absolute;
+ top: 50%;
+ margin-top: -10px;
+ right: 10px;
+ background: no-repeat url( '../images/discover.svg' );
+ display: block;
+ width: 30px;
+ height: 24px;
+}
+
+.woocommerce-checkout #payment ul.payment_methods li .stripe-jcb-brand,
+#add_payment_method #payment ul.payment_methods li .stripe-jcb-brand {
+ position: absolute;
+ top: 50%;
+ margin-top: -10px;
+ right: 10px;
+ background: no-repeat url( '../images/jcb.svg' );
+ display: block;
+ width: 30px;
+ height: 24px;
+}
+
+.woocommerce-checkout #payment ul.payment_methods li .stripe-maestro-brand,
+#add_payment_method #payment ul.payment_methods li .stripe-maestro-brand {
+ position: absolute;
+ top: 50%;
+ margin-top: -10px;
+ right: 10px;
+ background: no-repeat url( '../images/maestro.svg' );
+ display: block;
+ width: 30px;
+ height: 24px;
+}
+
+.woocommerce-checkout #payment ul.payment_methods li .stripe-mastercard-brand,
+#add_payment_method #payment ul.payment_methods li .stripe-mastercard-brand {
+ position: absolute;
+ top: 50%;
+ margin-top: -10px;
+ right: 10px;
+ background: no-repeat url( '../images/mastercard.svg' );
+ display: block;
+ width: 30px;
+ height: 24px;
+}
+
+.woocommerce-checkout #payment ul.payment_methods .stripe-card-group,
+#add_payment_method #payment ul.payment_methods .stripe-card-group {
+ position: relative;
+}
+
+.woocommerce-SavedPaymentMethods-token
+ .stripe-source-errors
+ .woocommerce-error {
+ margin-top: 1em;
+ margin-bottom: 2em;
+}
+
+#wc-stripe-custom-button {
+ display: block;
+ width: 100%;
+}
+
+.woocommerce-checkout #payment #stripe_boleto_tax_id {
+ width: 100%;
+}
+
+.gpay-button {
+ background-origin: content-box;
+ background-position: center center;
+ background-repeat: no-repeat;
+ background-size: contain;
+ border: 0;
+ border-radius: 4px;
+ cursor: pointer;
+ height: 40px;
+ min-height: 40px;
+ padding: 11px 24px;
+ width: 100%;
+
+ &.light {
+ // account for button box-shadow when setting width
+ width: calc( 100% - 3px );
+ background-color: #fff;
+
+ // Add vertical margin to make box-shadow visible in blocks.
+ margin: 2px 0 3px 0;
+
+ &:active {
+ background-color: #fff;
+ }
+ &:hover {
+ background-color: #f8f8f8;
+ }
+ &:focus {
+ box-shadow: #e8e8e8 0 1px 1px 0, #e8e8e8 0 1px 3px;
+ outline: 0;
+ }
+ }
+
+ &.light-outline {
+ // account for button box-shadow when setting width
+ width: calc( 100% - 3px );
+ background-color: #fff;
+
+ // The box-shadow forms the outline and as such is always on.
+ box-shadow: rgba( 60, 64, 67, 0.3 ) 0px 1px 1px 0,
+ rgba( 60, 64, 67, 0.15 ) 0 1px 3px 1px;
+
+ // Add vertical margin to make box-shadow visible in blocks.
+ margin: 2px 0 3px 0;
+
+ &:active {
+ background-color: #fff;
+ }
+ &:hover {
+ background-color: #f8f8f8;
+ }
+ &:focus {
+ box-shadow: #e8e8e8 0 1px 1px 0, #e8e8e8 0 1px 3px;
+ outline: 0;
+ }
+ }
+
+ &.dark {
+ background-color: #000;
+ padding: 12px 24px 10px;
+ &:active {
+ background-color: #5f6368;
+ }
+ &:hover {
+ background-color: #3c4043;
+ }
+ &:focus {
+ box-shadow: #5f6368 0 1px 1px 0, #5f6368 0 1px 3px;
+ outline: 0;
+ }
+ }
+
+ &.short {
+ &.light,
+ &.light-outline {
+ background-image: url( https://www.gstatic.com/instantbuy/svg/light_gpay.svg );
+ }
+ &.dark {
+ background-image: url( https://www.gstatic.com/instantbuy/svg/dark_gpay.svg );
+ }
+ }
+}