diff --git a/src/static/squarepay.css b/src/static/squarepay.css index 44080ce36be3a1d58897f12749acabc6f7a16d79..234267b71647b22809731e2b0845aeae05946134 100644 --- a/src/static/squarepay.css +++ b/src/static/squarepay.css @@ -9,114 +9,6 @@ button { border: 0; } -hr { - height: 1px; - border: 0; - background-color: #CCC; -} - -fieldset { - margin: 0; - padding: 0; - border: 0; -} - -.label { - font-size: 14px; - font-weight: 500; - line-height: 24px; - letter-spacing: 0.5; - text-transform: uppercase; -} - -.half { - float: left; - width: calc((100% - 16px) / 2); - padding: 0; - margin-right: 16px; -} - -.half:last-of-type { - margin-right: 0; -} - -/* Define how SqPaymentForm iframes should look */ -.sq-input, -#sq-expiration-date, #sq-card-number, #sq-cvv { - box-sizing: border-box; - border: 1px solid #E0E2E3; - border-radius: 4px; - outline-offset: -2px; - /*display: inline-block;*/ - height: 56px; - -webkit-transition: border-color .2s ease-in-out, background .2s ease-in-out; - -moz-transition: border-color .2s ease-in-out, background .2s ease-in-out; - -ms-transition: border-color .2s ease-in-out, background .2s ease-in-out; - transition: border-color .2s ease-in-out, background .2s ease-in-out; -} - -div#sq-expiration-date, div#sq-card-number, div#sq-cvv { - background-color: #f2f2f2; -} - -/* Define how SqPaymentForm iframes should look when they have focus */ -.sq-input--focus { - border: 1px solid #4A90E2; - background-color: rgba(74,144,226,0.02); -} - - -/* Define how SqPaymentForm iframes should look when they contain invalid values */ -.sq-input--error { - border: 1px solid #E02F2F; - background-color: rgba(244,47,47,0.02); -} - -#sq-card-number { - margin-bottom: 16px; -} - -/* Customize the "Pay with Credit Card" button */ -.button-credit-card { - width: 100%; - height: 56px; - margin-top: 10px; - background: #ccf; - border-radius: 4px; - cursor: default; - display: block; - color: #FFFFFF; - font-size: 16px; - line-height: 24px; - font-weight: 700; - letter-spacing: 0; - text-align: center; - -} -.button-credit-card:enabled { - width: 100%; - height: 56px; - margin-top: 10px; - background: #4A90E2; - border-radius: 4px; - cursor: pointer; - display: block; - color: #FFFFFF; - font-size: 16px; - line-height: 24px; - font-weight: 700; - letter-spacing: 0; - text-align: center; - -webkit-transition: background .2s ease-in-out; - -moz-transition: background .2s ease-in-out; - -ms-transition: background .2s ease-in-out; - transition: background .2s ease-in-out; -} - -.button-credit-card:hover:enabled { - background-color: #4281CB; -} - .payment-info { float: left; margin: 20px auto; @@ -149,14 +41,6 @@ div#sq-expiration-date, div#sq-card-number, div#sq-cvv { min-width: 300px; } - .buyer-inputs { - display: flex; - gap: 20px; - justify-content: space-between; - border: none; - margin: 0; - padding: 0; - } #card-container { /* this height depends on the size of the container element */ @@ -165,10 +49,6 @@ div#sq-expiration-date, div#sq-card-number, div#sq-cvv { min-height: 90px; } - #gift-card-container { - margin-top: 45px; - min-height: 90px; - } @media screen and (max-width: 500px) { #card-container { @@ -176,47 +56,6 @@ div#sq-expiration-date, div#sq-card-number, div#sq-cvv { } } - #ach-button { - margin-top: 20px; - } - - #landing-page-layout { - width: 80%; - margin: 150px auto; - max-width: 1000px; - } - - #its-working { - color: #737373; - } - - #example-container { - width: 100%; - border: 1px solid #b3b3b3; - padding: 48px; - margin: 32px 0; - border-radius: 12px; - } - - #example-list { - display: flex; - flex-direction: column; - gap: 15px; - } - - #customer-input { - margin-bottom: 40px; - } - - #card-input { - margin-top: 0; - margin-bottom: 40px; - } - - h3 { - margin: 0; - } - p { line-height: 24px; }