Skip to content
Projects
Groups
Snippets
Help
Loading...
Help
Support
Keyboard shortcuts
?
Submit feedback
Contribute to GitLab
Sign in
Toggle navigation
A
Adyen Magento2
Project overview
Project overview
Details
Activity
Releases
Repository
Repository
Files
Commits
Branches
Tags
Contributors
Graph
Compare
Issues
0
Issues
0
List
Boards
Labels
Milestones
Merge Requests
0
Merge Requests
0
CI / CD
CI / CD
Pipelines
Jobs
Schedules
Analytics
Analytics
CI / CD
Repository
Value Stream
Wiki
Wiki
Snippets
Snippets
Members
Members
Collapse sidebar
Close sidebar
Activity
Graph
Create a new issue
Jobs
Commits
Issue Boards
Open sidebar
Shared Libs
Adyen Magento2
Commits
77373c29
Commit
77373c29
authored
Jul 05, 2019
by
cyattilakiss
Committed by
GitHub
Jul 05, 2019
Browse files
Options
Browse Files
Download
Plain Diff
Merge pull request #474 from Adyen/PW-1368
PW-1368 Upgrade components version to 3.0.0
parents
a2a393c6
57e7dcc3
Changes
10
Hide whitespace changes
Inline
Side-by-side
Showing
10 changed files
with
1584 additions
and
1425 deletions
+1584
-1425
Block/Form/Cc.php
Block/Form/Cc.php
+2
-2
Helper/Data.php
Helper/Data.php
+5
-7
Model/Ui/AdyenCcConfigProvider.php
Model/Ui/AdyenCcConfigProvider.php
+1
-1
Model/Ui/AdyenOneclickConfigProvider.php
Model/Ui/AdyenOneclickConfigProvider.php
+1
-1
view/adminhtml/templates/form/cc.phtml
view/adminhtml/templates/form/cc.phtml
+10
-6
view/adminhtml/web/css/order_create_styles.css
view/adminhtml/web/css/order_create_styles.css
+546
-381
view/frontend/web/css/styles.css
view/frontend/web/css/styles.css
+994
-991
view/frontend/web/js/view/payment/method-renderer/adyen-cc-method.js
...nd/web/js/view/payment/method-renderer/adyen-cc-method.js
+10
-14
view/frontend/web/js/view/payment/method-renderer/adyen-hpp-method.js
...d/web/js/view/payment/method-renderer/adyen-hpp-method.js
+9
-9
view/frontend/web/js/view/payment/method-renderer/adyen-oneclick-method.js
.../js/view/payment/method-renderer/adyen-oneclick-method.js
+6
-13
No files found.
Block/Form/Cc.php
View file @
77373c29
...
@@ -87,9 +87,9 @@ class Cc extends \Magento\Payment\Block\Form\Cc
...
@@ -87,9 +87,9 @@ class Cc extends \Magento\Payment\Block\Form\Cc
/**
/**
* @return string
* @return string
*/
*/
public
function
getCheckout
ContextUrl
()
public
function
getCheckout
Environment
()
{
{
return
$this
->
adyenHelper
->
getCheckout
ContextUrl
(
$this
->
checkoutSession
->
getQuote
()
->
getStore
()
->
getId
());
return
$this
->
adyenHelper
->
getCheckout
Environment
(
$this
->
checkoutSession
->
getQuote
()
->
getStore
()
->
getId
());
}
}
/**
/**
...
...
Helper/Data.php
View file @
77373c29
...
@@ -33,10 +33,8 @@ class Data extends AbstractHelper
...
@@ -33,10 +33,8 @@ class Data extends AbstractHelper
const
MODULE_NAME
=
'adyen-magento2'
;
const
MODULE_NAME
=
'adyen-magento2'
;
const
TEST
=
'test'
;
const
TEST
=
'test'
;
const
LIVE
=
'live'
;
const
LIVE
=
'live'
;
const
CHECKOUT_CONTEXT_URL_LIVE
=
'https://checkoutshopper-live.adyen.com/checkoutshopper/'
;
const
CHECKOUT_COMPONENT_JS_LIVE
=
'https://checkoutshopper-live.adyen.com/checkoutshopper/sdk/3.0.0/adyen.js'
;
const
CHECKOUT_CONTEXT_URL_TEST
=
'https://checkoutshopper-test.adyen.com/checkoutshopper/'
;
const
CHECKOUT_COMPONENT_JS_TEST
=
'https://checkoutshopper-test.adyen.com/checkoutshopper/sdk/3.0.0/adyen.js'
;
const
CHECKOUT_COMPONENT_JS_LIVE
=
'https://checkoutshopper-live.adyen.com/checkoutshopper/sdk/2.5.0/adyen.js'
;
const
CHECKOUT_COMPONENT_JS_TEST
=
'https://checkoutshopper-test.adyen.com/checkoutshopper/sdk/2.5.0/adyen.js'
;
/**
/**
* @var \Magento\Framework\Encryption\EncryptorInterface
* @var \Magento\Framework\Encryption\EncryptorInterface
...
@@ -1549,13 +1547,13 @@ class Data extends AbstractHelper
...
@@ -1549,13 +1547,13 @@ class Data extends AbstractHelper
* @param int|null $storeId
* @param int|null $storeId
* @return string
* @return string
*/
*/
public
function
getCheckout
ContextUrl
(
$storeId
=
null
)
public
function
getCheckout
Environment
(
$storeId
=
null
)
{
{
if
(
$this
->
isDemoMode
(
$storeId
))
{
if
(
$this
->
isDemoMode
(
$storeId
))
{
return
self
::
CHECKOUT_CONTEXT_URL_
TEST
;
return
self
::
TEST
;
}
}
return
self
::
CHECKOUT_CONTEXT_URL_
LIVE
;
return
self
::
LIVE
;
}
}
/**
/**
...
...
Model/Ui/AdyenCcConfigProvider.php
View file @
77373c29
...
@@ -146,7 +146,7 @@ class AdyenCcConfigProvider implements ConfigProviderInterface
...
@@ -146,7 +146,7 @@ class AdyenCcConfigProvider implements ConfigProviderInterface
$config
[
'payment'
][
'adyenCc'
][
'icons'
]
=
$this
->
getIcons
();
$config
[
'payment'
][
'adyenCc'
][
'icons'
]
=
$this
->
getIcons
();
$config
[
'payment'
][
'adyenCc'
][
'originKey'
]
=
$this
->
_adyenHelper
->
getOriginKeyForBaseUrl
();
$config
[
'payment'
][
'adyenCc'
][
'originKey'
]
=
$this
->
_adyenHelper
->
getOriginKeyForBaseUrl
();
$config
[
'payment'
][
'adyenCc'
][
'checkout
Url'
]
=
$this
->
_adyenHelper
->
getCheckoutContextUrl
(
$this
->
storeManager
->
getStore
()
->
getId
());
$config
[
'payment'
][
'adyenCc'
][
'checkout
Environment'
]
=
$this
->
_adyenHelper
->
getCheckoutEnvironment
(
$this
->
storeManager
->
getStore
()
->
getId
());
// has installments by default false
// has installments by default false
$config
[
'payment'
][
'adyenCc'
][
'hasInstallments'
]
=
false
;
$config
[
'payment'
][
'adyenCc'
][
'hasInstallments'
]
=
false
;
...
...
Model/Ui/AdyenOneclickConfigProvider.php
View file @
77373c29
...
@@ -143,7 +143,7 @@ class AdyenOneclickConfigProvider implements ConfigProviderInterface
...
@@ -143,7 +143,7 @@ class AdyenOneclickConfigProvider implements ConfigProviderInterface
$config
[
'payment'
][
'adyenOneclick'
][
'methodCode'
]
=
self
::
CODE
;
$config
[
'payment'
][
'adyenOneclick'
][
'methodCode'
]
=
self
::
CODE
;
$config
[
'payment'
][
'adyenOneclick'
][
'originKey'
]
=
$this
->
_adyenHelper
->
getOriginKeyForBaseUrl
();
$config
[
'payment'
][
'adyenOneclick'
][
'originKey'
]
=
$this
->
_adyenHelper
->
getOriginKeyForBaseUrl
();
$config
[
'payment'
][
'adyenOneclick'
][
'checkout
Url'
]
=
$this
->
_adyenHelper
->
getCheckoutContextUrl
(
$this
->
_storeManager
->
getStore
()
->
getId
());
$config
[
'payment'
][
'adyenOneclick'
][
'checkout
Environment'
]
=
$this
->
_adyenHelper
->
getCheckoutEnvironment
(
$this
->
_storeManager
->
getStore
()
->
getId
());
$config
[
'payment'
][
'adyenOneclick'
][
'locale'
]
=
$this
->
_adyenHelper
->
getStoreLocale
(
$this
->
_storeManager
->
getStore
()
->
getId
());
$config
[
'payment'
][
'adyenOneclick'
][
'locale'
]
=
$this
->
_adyenHelper
->
getStoreLocale
(
$this
->
_storeManager
->
getStore
()
->
getId
());
$enableOneclick
=
$this
->
_adyenHelper
->
getAdyenAbstractConfigData
(
'enable_oneclick'
);
$enableOneclick
=
$this
->
_adyenHelper
->
getAdyenAbstractConfigData
(
'enable_oneclick'
);
...
...
view/adminhtml/templates/form/cc.phtml
View file @
77373c29
...
@@ -113,7 +113,7 @@ echo $code; ?>" style="display:none">
...
@@ -113,7 +113,7 @@ echo $code; ?>" style="display:none">
var
card
=
checkout
.
create
(
'
card
'
,
{
var
card
=
checkout
.
create
(
'
card
'
,
{
originKey
:
"
<?php
echo
$block
->
getCheckoutOriginKeys
();
?>
"
,
originKey
:
"
<?php
echo
$block
->
getCheckoutOriginKeys
();
?>
"
,
loadingContext
:
"
<?php
echo
$block
->
getCheckoutContextUrl
();
?>
"
,
environment
:
"
<?php
echo
$block
->
getCheckoutEnvironment
();
?>
"
,
type
:
'
card
'
,
type
:
'
card
'
,
groupTypes
:
ccTypes
,
groupTypes
:
ccTypes
,
hideCVC
:
hideCVC
,
hideCVC
:
hideCVC
,
...
@@ -122,13 +122,17 @@ echo $code; ?>" style="display:none">
...
@@ -122,13 +122,17 @@ echo $code; ?>" style="display:none">
// When the state is valid update the input fields
// When the state is valid update the input fields
if
(
state
.
isValid
)
{
if
(
state
.
isValid
)
{
// Here we enable the button if the component is now valid
// Here we enable the button if the component is now valid
jQuery
(
"
#
<?php
/* @noEscape */
echo
$code
;
?>
-number
"
).
val
(
state
.
data
.
encryptedCardNumber
);
jQuery
(
"
#
<?php
/* @noEscape */
echo
$code
;
?>
-number
"
).
val
(
state
.
data
.
paymentMethod
.
encryptedCardNumber
);
jQuery
(
"
#
<?php
/* @noEscape */
echo
$code
;
?>
-expiryMonth
"
).
val
(
state
.
data
.
encryptedExpiryMonth
);
jQuery
(
"
#
<?php
/* @noEscape */
echo
$code
;
?>
-expiryMonth
"
).
val
(
state
.
data
.
paymentMethod
.
encryptedExpiryMonth
);
jQuery
(
"
#
<?php
/* @noEscape */
echo
$code
;
?>
-expiryYear
"
).
val
(
state
.
data
.
encryptedExpiryYear
);
jQuery
(
"
#
<?php
/* @noEscape */
echo
$code
;
?>
-expiryYear
"
).
val
(
state
.
data
.
paymentMethod
.
encryptedExpiryYear
);
jQuery
(
"
#
<?php
/* @noEscape */
echo
$code
;
?>
-cvc
"
).
val
(
state
.
data
.
encryptedSecurityCode
);
jQuery
(
"
#
<?php
/* @noEscape */
echo
$code
;
?>
-cvc
"
).
val
(
state
.
data
.
paymentMethod
.
encryptedSecurityCode
);
jQuery
(
"
#
<?php
/* @noEscape */
echo
$code
;
?>
-cc_type
"
).
val
(
getCcCodeByAltCode
(
state
.
brand
));
}
}
},
},
onBrand
:
function
(
state
)
{
if
(
state
.
isValid
)
{
jQuery
(
"
#
<?php
/* @noEscape */
echo
$code
;
?>
-cc_type
"
).
val
(
getCcCodeByAltCode
(
state
.
brand
));
}
}
onError
:
function
()
{
onError
:
function
()
{
}
}
});
});
...
...
view/adminhtml/web/css/order_create_styles.css
View file @
77373c29
...
@@ -66,7 +66,43 @@
...
@@ -66,7 +66,43 @@
display
:
inline-block
;
display
:
inline-block
;
font-weight
:
bold
;
font-weight
:
bold
;
}
}
/* Checkout component Adyen styling start */
/* Checkout component Adyen v3.0.0 styling start */
.adyen-checkout__field
{
display
:
block
;
margin-bottom
:
16px
}
.adyen-checkout__field--error
input
{
border-color
:
#d10244
;
color
:
#d10244
}
.adyen-checkout__field
:last-child
{
margin-bottom
:
0
}
.adyen-checkout__helper-text
,
.adyen-checkout__label__text
{
color
:
#00112c
;
display
:
block
;
font-size
:
.81em
;
font-weight
:
400
;
line-height
:
13px
;
padding-bottom
:
8px
}
.adyen-checkout__helper-text
{
color
:
#687282
}
.adyen-checkout__label__text
{
transition
:
color
.2s
ease-out
}
.adyen-checkout__label--focused
.adyen-checkout__label__text
{
color
:
#06f
}
.adyen-checkout__error-text
{
align-items
:
center
;
color
:
#d10244
;
display
:
flex
;
font-size
:
.75em
;
font-weight
:
400
;
margin-top
:
4px
}
.adyen-checkout__spinner__wrapper
{
.adyen-checkout__spinner__wrapper
{
align-items
:
center
;
align-items
:
center
;
display
:
flex
;
display
:
flex
;
...
@@ -81,7 +117,7 @@
...
@@ -81,7 +117,7 @@
.adyen-checkout__spinner
{
.adyen-checkout__spinner
{
-webkit-animation
:
rotateSpinner
2s
infinite
linear
;
-webkit-animation
:
rotateSpinner
2s
infinite
linear
;
animation
:
rotateSpinner
2s
infinite
linear
;
animation
:
rotateSpinner
2s
infinite
linear
;
border
:
2px
solid
#0
0a3f
f
;
border
:
2px
solid
#0
6
f
;
border-radius
:
50%
;
border-radius
:
50%
;
border-top-color
:
transparent
;
border-top-color
:
transparent
;
height
:
43px
;
height
:
43px
;
...
@@ -119,260 +155,10 @@
...
@@ -119,260 +155,10 @@
transform
:
rotate
(
1turn
)
transform
:
rotate
(
1turn
)
}
}
}
}
.adyen-checkout__pay-button
{
background
:
#001b2b
;
border
:
0
;
border-radius
:
3px
;
box-shadow
:
0
3px
4px
rgba
(
0
,
15
,
45
,
.2
);
color
:
#fff
;
cursor
:
pointer
;
font-size
:
1em
;
font-weight
:
700
;
height
:
48px
;
padding
:
15px
;
transition
:
background
.3s
ease-out
;
width
:
100%
}
.adyen-checkout__pay-button
:disabled
{
-moz-user-select
:
all
;
-ms-user-select
:
all
;
-webkit-user-select
:
all
;
background
:
#e6e9eb
;
box-shadow
:
none
;
cursor
:
not-allowed
;
user-select
:
all
}
.adyen-checkout__pay-button--loading
{
-moz-user-select
:
none
;
-ms-user-select
:
none
;
-webkit-user-select
:
none
;
background
:
#4c5f6b
;
box-shadow
:
none
;
outline
:
0
;
pointer-events
:
none
;
user-select
:
none
}
.adyen-checkout__pay-button
.adyen-checkout__spinner
{
border-color
:
transparent
#fff
#fff
;
border-width
:
3px
}
.adyen-checkout__pay-button__content
{
align-items
:
center
;
display
:
flex
;
justify-content
:
center
}
.adyen-checkout__payment-method
{
background
:
#fff
;
border
:
1px
solid
#edf0f3
;
cursor
:
pointer
;
margin-top
:
-1px
;
position
:
relative
;
transition
:
opacity
.3s
ease-out
;
width
:
100%
}
.adyen-checkout__payment-method
:focus
{
outline
:
0
}
.adyen-checkout__payment-method--selected
+
.adyen-checkout__payment-method
,
.adyen-checkout__payment-method
:first-child
{
border-top-left-radius
:
3px
;
border-top-right-radius
:
3px
;
margin-top
:
0
}
.adyen-checkout__payment-method--next-selected
{
border-bottom-left-radius
:
3px
;
border-bottom-right-radius
:
3px
}
.adyen-checkout__payment-method--loading
{
opacity
:
.2
}
.adyen-checkout__payment-method--selected.adyen-checkout__payment-method--loading
{
opacity
:
.9
}
.adyen-checkout__payment-method--disabling
{
opacity
:
.5
}
.adyen-checkout__payment-method__header
{
align-items
:
center
;
color
:
#00202e
;
display
:
flex
;
font-size
:
16px
;
font-weight
:
400
;
padding
:
16px
;
position
:
relative
;
transition
:
background
.1s
ease-out
;
width
:
100%
}
.adyen-checkout__payment-method__surcharge
{
color
:
#687282
;
margin-left
:
5px
}
.adyen-checkout__payment-method--selected
{
background
:
#f7f8f9
;
border
:
1px
solid
#d4d9db
;
border-radius
:
3px
;
cursor
:
default
;
margin
:
8px
0
;
transition
:
margin
.15s
cubic-bezier
(
.4
,
0
,
.2
,
1
)
0ms
,
opacity
.3s
ease-out
}
.adyen-checkout__payment-method--selected
.adyen-checkout__payment-method__header
{
font-weight
:
500
}
.adyen-checkout__payment-method__details
{
padding
:
0
16px
16px
}
.adyen-checkout__payment-method__details__content
{
padding
:
6px
0
24px
}
.adyen-checkout__payment-method__image__wrapper
{
height
:
26px
;
position
:
relative
}
.adyen-checkout__payment-method__image__wrapper
:after
{
border
:
1px
solid
rgba
(
0
,
27
,
43
,
.17
);
border-radius
:
3px
;
content
:
""
;
height
:
100%
;
left
:
0
;
position
:
absolute
;
top
:
0
;
width
:
100%
}
.adyen-checkout__payment-method__image
{
border-radius
:
3px
}
.adyen-checkout__payment-method__disable_oneclick
{
background-color
:
transparent
;
border
:
none
;
color
:
#687282
;
cursor
:
pointer
;
display
:
block
;
font-size
:
13px
;
padding
:
0
;
position
:
absolute
;
right
:
70px
;
text-decoration
:
underline
}
.adyen-checkout__payment-method__disable_oneclick
:focus
{
color
:
#00a3ff
;
outline
:
0
}
.adyen-checkout__payment-method__disable-confirmation
{
align-items
:
center
;
background
:
#e6e9eb
;
color
:
#001b2b
;
display
:
flex
;
font-size
:
15px
;
justify-content
:
space-between
;
margin-bottom
:
10px
;
padding
:
8px
16px
}
.adyen-checkout__payment-method__disable-confirmation__buttons
{
display
:
flex
}
.adyen-checkout__payment-method__disable-confirmation__button
{
border
:
1px
solid
transparent
;
border-radius
:
3px
;
cursor
:
pointer
;
font-size
:
13px
;
line-height
:
15px
;
margin
:
0
0
0
8px
;
padding
:
8px
}
.adyen-checkout__payment-method__disable-confirmation__button--remove
{
background
:
#d10244
;
border-color
:
#d10244
;
color
:
#fff
}
.adyen-checkout__payment-method__disable-confirmation__button--cancel
{
background
:
transparent
;
border-color
:
#001b2b
;
color
:
#001b2b
}
.adyen-checkout__payment-method__radio
{
background-color
:
#fff
;
border
:
1px
solid
#b9c4c9
;
border-radius
:
50%
;
box-shadow
:
inset
0
1px
3px
rgba
(
0
,
27
,
43
,
.15
);
height
:
18px
;
position
:
absolute
;
right
:
20px
;
transition
:
border-color
.3s
ease-out
;
width
:
18px
}
.adyen-checkout__payment-method__radio
:after
{
-webkit-transform
:
translateY
(
-50%
)
scale
(
0
);
background-color
:
#fff
;
border-radius
:
50%
;
box-shadow
:
0
1px
1px
rgba
(
0
,
15
,
45
,
.25
);
content
:
""
;
display
:
block
;
height
:
6px
;
left
:
0
;
margin
:
0
auto
;
position
:
absolute
;
right
:
0
;
top
:
50%
;
transform
:
translateY
(
-50%
)
scale
(
0
);
transition
:
-webkit-transform
.3s
ease-out
;
transition
:
transform
.3s
ease-out
;
transition
:
transform
.3s
ease-out
,
-webkit-transform
.3s
ease-out
;
width
:
6px
}
.adyen-checkout__payment-method__radio
:hover
{
border-color
:
#00a3ff
;
cursor
:
pointer
}
.adyen-checkout__payment-method__radio--selected
{
background-color
:
#00a3ff
;
border
:
0
solid
transparent
;
box-shadow
:
inset
0
1px
2px
rgba
(
0
,
0
,
0
,
.26
);
transition
:
all
.3s
ease-out
}
.adyen-checkout__payment-method__radio--selected
:after
{
-webkit-transform
:
translateY
(
-50%
)
scale
(
1
);
transform
:
translateY
(
-50%
)
scale
(
1
)
}
.adyen-checkout__field
{
display
:
block
;
margin-bottom
:
16px
}
.adyen-checkout__field--error
input
{
border-color
:
#d81b4a
;
color
:
#d81b4a
}
.adyen-checkout__field
:last-child
{
margin-bottom
:
0
}
.adyen-checkout__helper-text
,
.adyen-checkout__label__text
{
color
:
#001b2b
;
display
:
block
;
font-size
:
13px
;
font-weight
:
400
;
line-height
:
13px
;
padding-bottom
:
8px
}
.adyen-checkout__helper-text
{
color
:
#687282
}
.adyen-checkout__label__text
{
transition
:
color
.2s
ease-out
}
.adyen-checkout__label--focused
.adyen-checkout__label__text
{
color
:
#07b
}
.adyen-checkout__error-text
,
.adyen-checkout__label__text--error
{
align-items
:
center
;
color
:
#d0021b
;
display
:
flex
;
font-size
:
12px
;
font-weight
:
400
;
margin-top
:
4px
}
.adyen-checkout__icon
svg
{
.adyen-checkout__icon
svg
{
fill
:
currentColor
fill
:
currentColor
}
}
.adyen-checkout__open-invoice
.adyen-checkout__input-
-
wrapper--socialSecurityNumber
+
.adyen-checkout__error-text
{
.adyen-checkout__open-invoice
.adyen-checkout__input-wrapper--socialSecurityNumber
+
.adyen-checkout__error-text
{
max-width
:
380px
max-width
:
380px
}
}
.adyen-checkout__radio_group
+
.adyen-checkout-input__inline-validation
{
.adyen-checkout__radio_group
+
.adyen-checkout-input__inline-validation
{
...
@@ -384,7 +170,7 @@
...
@@ -384,7 +170,7 @@
}
}
.adyen-checkout__radio_group__label
{
.adyen-checkout__radio_group__label
{
display
:
block
;
display
:
block
;
font-size
:
13px
;
font-size
:
.81em
;
font-weight
:
400
;
font-weight
:
400
;
line-height
:
16px
;
line-height
:
16px
;
margin-bottom
:
8px
;
margin-bottom
:
8px
;
...
@@ -423,12 +209,12 @@
...
@@ -423,12 +209,12 @@
width
:
6px
width
:
6px
}
}
.adyen-checkout__radio_group__label
:hover
{
.adyen-checkout__radio_group__label
:hover
{
border-color
:
#0
0a3f
f
;
border-color
:
#0
6
f
;
cursor
:
pointer
cursor
:
pointer
}
}
.adyen-checkout__radio_group__input
:checked
+
.adyen-checkout__radio_group__label
:before
,
.adyen-checkout__radio_group__label--selected
{
.adyen-checkout__radio_group__input
:checked
+
.adyen-checkout__radio_group__label
:before
,
.adyen-checkout__radio_group__label--selected
{
background-color
:
#0
0a3f
f
;
background-color
:
#0
6
f
;
border
:
0
solid
transparent
;
border
:
0
;
box-shadow
:
inset
0
1px
2px
rgba
(
0
,
0
,
0
,
.26
);
box-shadow
:
inset
0
1px
2px
rgba
(
0
,
0
,
0
,
.26
);
transition
:
all
.3s
ease-out
transition
:
all
.3s
ease-out
}
}
...
@@ -442,7 +228,7 @@
...
@@ -442,7 +228,7 @@
.adyen-checkout__checkbox
{
.adyen-checkout__checkbox
{
display
:
block
display
:
block
}
}
.adyen-checkout__checkbox
>
input
[
type
=
checkbox
]
{
.adyen-checkout__checkbox
__input
{
opacity
:
0
;
opacity
:
0
;
pointer-events
:
none
;
pointer-events
:
none
;
position
:
absolute
position
:
absolute
...
@@ -451,10 +237,10 @@
...
@@ -451,10 +237,10 @@
-moz-user-select
:
none
;
-moz-user-select
:
none
;
-ms-user-select
:
none
;
-ms-user-select
:
none
;
-webkit-user-select
:
none
;
-webkit-user-select
:
none
;
color
:
#001
b2b
;
color
:
#001
12c
;
cursor
:
pointer
;
cursor
:
pointer
;
display
:
inline-block
;
display
:
inline-block
;
font-size
:
13px
;
font-size
:
.81em
;
font-weight
:
400
;
font-weight
:
400
;
line-height
:
16px
;
line-height
:
16px
;
padding-left
:
24px
;
padding-left
:
24px
;
...
@@ -496,19 +282,19 @@
...
@@ -496,19 +282,19 @@
width
:
16px
;
width
:
16px
;
z-index
:
0
z-index
:
0
}
}
.adyen-checkout__checkbox__input--invalid
+
.adyen-checkout__checkbox__label
:after
{
border
:
1px
solid
#d10244
}
.adyen-checkout__checkbox__input
:checked
+
.adyen-checkout__checkbox__label
:after
{
.adyen-checkout__checkbox__input
:checked
+
.adyen-checkout__checkbox__label
:after
{
background-color
:
#0
0a3f
f
;
background-color
:
#0
6
f
;
border
:
1px
solid
#0
0a3f
f
border
:
1px
solid
#0
6
f
}
}
.adyen-checkout__checkbox__input
:focus
+
span
:after
{
.adyen-checkout__checkbox__input
:focus
+
span
:after
{
border
:
1px
solid
#00a3ff
;
border
:
1px
solid
#06f
;
box-shadow
:
0
0
0
2px
#91d7ff
box-shadow
:
0
0
0
2px
#99c2ff
}
.adyen-checkout__checkbox__input.adyen-checkout__checkbox__input--invalid
+
.adyen-checkout__checkbox__label
:after
{
border
:
1px
solid
#d10244
}
}
.adyen-checkout__dropdown
{
.adyen-checkout__dropdown
{
font-size
:
1
6px
;
font-size
:
1
em
;
max-width
:
100%
;
max-width
:
100%
;
width
:
200px
width
:
200px
}
}
...
@@ -521,8 +307,8 @@
...
@@ -521,8 +307,8 @@
.adyen-checkout__dropdown__button
{
.adyen-checkout__dropdown__button
{
background
:
#fff
;
background
:
#fff
;
border
:
1px
solid
#b9c4c9
;
border
:
1px
solid
#b9c4c9
;
border-radius
:
3
px
;
border-radius
:
6
px
;
font-size
:
1
6px
;
font-size
:
1
em
;
height
:
40px
;
height
:
40px
;
line-height
:
20px
;
line-height
:
20px
;
outline
:
0
;
outline
:
0
;
...
@@ -532,16 +318,16 @@
...
@@ -532,16 +318,16 @@
}
}
.adyen-checkout__dropdown__button__icon
{
.adyen-checkout__dropdown__button__icon
{
margin-right
:
8px
;
margin-right
:
8px
;
max-height
:
2
0
px
;
max-height
:
2
6
px
;
max-width
:
32
px
max-width
:
40
px
}
}
.adyen-checkout__dropdown__button--active
,
.adyen-checkout__dropdown__button
:active
,
.adyen-checkout__dropdown__button
:focus
{
.adyen-checkout__dropdown__button--active
,
.adyen-checkout__dropdown__button
:active
,
.adyen-checkout__dropdown__button
:focus
{
border-color
:
#0
0a3f
f
;
border-color
:
#0
6
f
;
box-shadow
:
0
0
0
2px
#9
1d7
ff
box-shadow
:
0
0
0
2px
#9
9c2
ff
}
}
.adyen-checkout__dropdown__button--readonly
,
.adyen-checkout__dropdown__button--readonly.adyen-checkout__dropdown__button--active
{
.adyen-checkout__dropdown__button--readonly
,
.adyen-checkout__dropdown__button--readonly.adyen-checkout__dropdown__button--active
{
background
:
#e6e9eb
;
background
:
#e6e9eb
;
color
:
#001
b2b
;
color
:
#001
12c
;
cursor
:
not-allowed
cursor
:
not-allowed
}
}
.adyen-checkout__dropdown__button--invalid
{
.adyen-checkout__dropdown__button--invalid
{
...
@@ -553,21 +339,19 @@
...
@@ -553,21 +339,19 @@
white-space
:
nowrap
white-space
:
nowrap
}
}
.adyen-checkout__dropdown__list
{
.adyen-checkout__dropdown__list
{
border-radius
:
3
px
;
border-radius
:
6
px
;
box-shadow
:
0
2px
7px
rgba
(
0
,
15
,
45
,
.3
);
box-shadow
:
0
2px
7px
rgba
(
0
,
15
,
45
,
.3
);
margin-top
:
2px
;
margin-top
:
2px
;
max-height
:
360px
;
z-index
:
2
z-index
:
2
}
}
.adyen-checkout__dropdown__list.adyen-checkout__dropdown__list--active
{
-webkit-animation
:
expand
.1s
ease-out
;
animation
:
expand
.1s
ease-out
}
.adyen-checkout__dropdown__element
{
.adyen-checkout__dropdown__element
{
-ms-hyphens
:
auto
;
-ms-hyphens
:
auto
;
-webkit-hyphens
:
auto
;
-webkit-hyphens
:
auto
;
border
:
1px
solid
transparent
;
border
:
1px
solid
transparent
;
border-bottom-color
:
#e6e9eb
;
border-bottom-color
:
#e6e9eb
;
cursor
:
pointer
;
cursor
:
pointer
;
font-size
:
.81em
;
hyphens
:
auto
;
hyphens
:
auto
;
line-height
:
20px
;
line-height
:
20px
;
outline
:
0
;
outline
:
0
;
...
@@ -579,38 +363,24 @@
...
@@ -579,38 +363,24 @@
border-bottom
:
0
border-bottom
:
0
}
}
.adyen-checkout__dropdown__element
:active
,
.adyen-checkout__dropdown__element
:focus
,
.adyen-checkout__dropdown__element
:hover
{
.adyen-checkout__dropdown__element
:active
,
.adyen-checkout__dropdown__element
:focus
,
.adyen-checkout__dropdown__element
:hover
{
background
:
#f0f2f4
background
:
rgba
(
230
,
233
,
235
,
.6
)
}
}
.adyen-checkout__dropdown__element
:active
,
.adyen-checkout__dropdown__element
:focus
{
.adyen-checkout__dropdown__element
:active
,
.adyen-checkout__dropdown__element
:focus
{
border-bottom-color
:
#0
0a3f
f
;
border-bottom-color
:
#0
6
f
;
border-top-color
:
#0
0a3f
f
border-top-color
:
#0
6
f
}
}
.adyen-checkout__dropdown__element__icon
{
.adyen-checkout__dropdown__element.adyen-checkout__dropdown__element--active
{
margin-right
:
8px
;
background
:
rgba
(
0
,
102
,
255
,
.1
)
max-height
:
20px
;
max-width
:
32px
}
}
@-webkit-keyframes
expand
{
.adyen-checkout__dropdown__element.adyen-checkout__dropdown__element--active
:active
,
.adyen-checkout__dropdown__element.adyen-checkout__dropdown__element--active
:focus
,
.adyen-checkout__dropdown__element.adyen-checkout__dropdown__element--active
:hover
{
0
%
{
background
:
rgba
(
0
,
102
,
255
,
.15
)
-webkit-transform
:
scaleY
(
0
);
transform
:
scaleY
(
0
)
}
to
{
-webkit-transform
:
scaleX
(
1
);
transform
:
scaleX
(
1
)
}
}
}
@keyframes
expand
{
.adyen-checkout__dropdown__element__icon
{
0
%
{
border-radius
:
3px
;
-webkit-transform
:
scaleY
(
0
);
margin-right
:
8px
;
transform
:
scaleY
(
0
)
max-height
:
26px
;
}
max-width
:
40px
to
{
-webkit-transform
:
scaleX
(
1
);
transform
:
scaleX
(
1
)
}
}
}
.adyen-checkout__dropdown
+
.adyen-checkout-input__inline-validation
{
.adyen-checkout__dropdown
+
.adyen-checkout-input__inline-validation
{
right
:
32px
right
:
32px
}
}
...
@@ -620,10 +390,11 @@
...
@@ -620,10 +390,11 @@
}
}
.adyen-checkout__select-list__item
{
.adyen-checkout__select-list__item
{
background
:
#fff
;
background
:
#fff
;
border-top
:
1px
solid
#b9c4c9
;
border
:
1px
solid
transparent
;
border-bottom-color
:
#e6e9eb
;
cursor
:
pointer
;
cursor
:
pointer
;
display
:
inline-block
;
display
:
inline-block
;
font-size
:
1
6px
;
font-size
:
1
em
;
line-height
:
20px
;
line-height
:
20px
;
outline
:
0
;
outline
:
0
;
padding
:
9px
;
padding
:
9px
;
...
@@ -633,20 +404,23 @@
...
@@ -633,20 +404,23 @@
border-top
:
0
border-top
:
0
}
}
.adyen-checkout__select-list__item
:active
,
.adyen-checkout__select-list__item
:focus
,
.adyen-checkout__select-list__item
:hover
{
.adyen-checkout__select-list__item
:active
,
.adyen-checkout__select-list__item
:focus
,
.adyen-checkout__select-list__item
:hover
{
background
:
rgba
(
145
,
215
,
255
,
.5
)
background
:
rgba
(
230
,
233
,
235
,
.6
)
}
}
.adyen-checkout__select-list__item--selected
{
.adyen-checkout__select-list__item--selected
{
background
:
rgba
(
145
,
215
,
255
,
.5
);
background
:
rgba
(
0
,
102
,
255
,
.1
);
font-weight
:
700
font-weight
:
500
}
.adyen-checkout__select-list__item--selected
:active
,
.adyen-checkout__select-list__item--selected
:focus
,
.adyen-checkout__select-list__item--selected
:hover
{
background
:
rgba
(
0
,
102
,
255
,
.15
)
}
}
.adyen-checkout__input
{
.adyen-checkout__input
{
background
:
#fff
;
background
:
#fff
;
border
:
1px
solid
#b9c4c9
;
border
:
1px
solid
#b9c4c9
;
border-radius
:
3
px
;
border-radius
:
6
px
;
color
:
#001
b2b
;
color
:
#001
12c
;
display
:
block
;
display
:
block
;
font-family
:
inherit
;
font-family
:
inherit
;
font-size
:
1
6px
;
font-size
:
1
em
;
height
:
40px
;
height
:
40px
;
outline
:
none
;
outline
:
none
;
padding
:
5px
8px
;
padding
:
5px
8px
;
...
@@ -657,11 +431,11 @@
...
@@ -657,11 +431,11 @@
.adyen-checkout__input
:required
{
.adyen-checkout__input
:required
{
box-shadow
:
none
box-shadow
:
none
}
}
.adyen-checkout__input-
-
wrapper
{
.adyen-checkout__input-wrapper
{
display
:
inline-block
;
display
:
inline-block
;
position
:
relative
position
:
relative
}
}
.adyen-checkout__input-
-
wrapper--block
{
.adyen-checkout__input-wrapper--block
{
display
:
block
display
:
block
}
}
.adyen-checkout-input__inline-validation
{
.adyen-checkout-input__inline-validation
{
...
@@ -674,41 +448,45 @@
...
@@ -674,41 +448,45 @@
width
:
16px
width
:
16px
}
}
.adyen-checkout-input__inline-validation--valid
{
.adyen-checkout-input__inline-validation--valid
{
color
:
#0
39450
color
:
#0
abf53
}
}
.adyen-checkout-input__inline-validation--invalid
{
.adyen-checkout-input__inline-validation--invalid
{
color
:
#d10244
color
:
#d10244
}
}
.adyen-checkout__input
.adyen-checkout__input
--small
{
.adyen-checkout__input--small
{
width
:
13
0
px
width
:
13
4
px
}
}
.adyen-checkout__input
.adyen-checkout__input
--large
{
.adyen-checkout__input--large
{
width
:
300px
width
:
300px
}
}
.adyen-checkout__input
.adyen-checkout__input
--invalid
{
.adyen-checkout__input--invalid
{
border-color
:
#d10244
border-color
:
#d10244
}
}
.adyen-checkout__input
.adyen-checkout__input
--valid
{
.adyen-checkout__input--valid
{
border-bottom-color
:
#0
4ba65
border-bottom-color
:
#0
abf53
}
}
.adyen-checkout__input--error
{
.adyen-checkout__input--error
{
border-color
:
#d
0021b
border-color
:
#d
10244
}
}
.adyen-checkout__input
::-webkit-input-placeholder
{
.adyen-checkout__input
::-webkit-input-placeholder
{
color
:
#90a2bd
;
color
:
#b9c4c9
;
font-weight
:
200
}
.adyen-checkout__input
:-ms-input-placeholder
{
color
:
#b9c4c9
;
font-weight
:
200
font-weight
:
200
}
}
.adyen-checkout__input
::-ms-input-placeholder
{
.adyen-checkout__input
::-ms-input-placeholder
{
color
:
#
90a2bd
;
color
:
#
b9c4c9
;
font-weight
:
200
font-weight
:
200
}
}
.adyen-checkout__input
::placeholder
{
.adyen-checkout__input
::placeholder
{
color
:
#
90a2bd
;
color
:
#
b9c4c9
;
font-weight
:
200
font-weight
:
200
}
}
.adyen-checkout__input--
active
,
.adyen-checkout__input
:active
,
.adyen-checkout__input
:focus
{
.adyen-checkout__input--
focus
,
.adyen-checkout__input
:active
,
.adyen-checkout__input
:focus
{
border
:
1px
solid
#0
0a3f
f
;
border
:
1px
solid
#0
6
f
;
box-shadow
:
0
0
0
2px
#9
1d7
ff
box-shadow
:
0
0
0
2px
#9
9c2
ff
}
}
.adyen-checkout__input
[
readonly
]
{
.adyen-checkout__input
[
readonly
]
{
background-color
:
#e6e9eb
;
background-color
:
#e6e9eb
;
...
@@ -725,7 +503,7 @@
...
@@ -725,7 +503,7 @@
.adyen-checkout__fieldset__title
{
.adyen-checkout__fieldset__title
{
color
:
#687282
;
color
:
#687282
;
display
:
block
;
display
:
block
;
font-size
:
11px
;
font-size
:
.68em
;
font-weight
:
700
;
font-weight
:
700
;
letter-spacing
:
1px
;
letter-spacing
:
1px
;
margin
:
0
;
margin
:
0
;
...
@@ -733,20 +511,20 @@
...
@@ -733,20 +511,20 @@
text-transform
:
uppercase
text-transform
:
uppercase
}
}
.adyen-checkout__fieldset--readonly
{
.adyen-checkout__fieldset--readonly
{
color
:
#001
b2b
;
color
:
#001
12c
;
font-size
:
13px
;
font-size
:
.81em
;
line-height
:
19px
;
line-height
:
19px
;
margin
:
0
margin
:
0
}
}
.adyen-checkout__open-invoice
.adyen-checkout__checkbox--consent-checkbox
{
.adyen-checkout__open-invoice
.adyen-checkout__checkbox--consent-checkbox
{
max-width
:
540px
max-width
:
540px
}
}
.adyen-checkout__open-invoice
.adyen-checkout__checkbox
+
.adyen-checkout__open-invoice
.adyen-checkout__fieldset
{
padding-top
:
30px
}
.adyen-checkout__open-invoice
.adyen-checkout__checkbox
{
.adyen-checkout__open-invoice
.adyen-checkout__checkbox
{
margin
:
0
0
20px
margin
:
0
0
20px
}
}
.adyen-checkout__link--more-information
{
font-size
:
.81em
}
.adyen-checkout__applepay__button
{
.adyen-checkout__applepay__button
{
height
:
40px
;
height
:
40px
;
width
:
240px
width
:
240px
...
@@ -770,7 +548,7 @@
...
@@ -770,7 +548,7 @@
}
}
.adyen-checkout__card__exp-cvc
.adyen-checkout__field
{
.adyen-checkout__card__exp-cvc
.adyen-checkout__field
{
margin-bottom
:
0
;
margin-bottom
:
0
;
margin-right
:
24
px
margin-right
:
32
px
}
}
.adyen-checkout__card-input
.adyen-checkout__store-details
{
.adyen-checkout__card-input
.adyen-checkout__store-details
{
margin-top
:
16px
margin-top
:
16px
...
@@ -778,20 +556,21 @@
...
@@ -778,20 +556,21 @@
.adyen-checkout__giropay__results
{
.adyen-checkout__giropay__results
{
background
:
#fff
;
background
:
#fff
;
border
:
1px
solid
#b9c4c9
;
border
:
1px
solid
#b9c4c9
;
border-radius
:
4
px
;
border-radius
:
6
px
;
max-height
:
140px
;
max-height
:
140px
;
min-height
:
100px
;
min-height
:
100px
;
min-width
:
300px
;
overflow-y
:
scroll
;
overflow-y
:
scroll
;
width
:
100%
width
:
100%
}
}
.adyen-checkout__giropay__no-results
{
.adyen-checkout__giropay__no-results
{
color
:
#687282
;
color
:
#687282
;
display
:
block
;
display
:
block
;
font-size
:
13px
;
font-size
:
.81em
;
padding
:
0
0
0
2px
padding
:
0
0
0
2px
}
}
.adyen-checkout__giropay__placeholder
{
.adyen-checkout__giropay__placeholder
{
color
:
#
90a2bd
;
color
:
#
b9c4c9
;
display
:
block
;
display
:
block
;
font-weight
:
200
;
font-weight
:
200
;
padding
:
0
0
0
2px
padding
:
0
0
0
2px
...
@@ -806,48 +585,139 @@
...
@@ -806,48 +585,139 @@
}
}
.adyen-checkout__giropay__loading-text
{
.adyen-checkout__giropay__loading-text
{
color
:
#687282
;
color
:
#687282
;
font-size
:
13px
;
font-size
:
.81em
;
line-height
:
16px
;
line-height
:
16px
;
vertical-align
:
middle
vertical-align
:
middle
}
}
.adyen-checkout__giropay__error
{
.adyen-checkout__giropay__error
{
color
:
#d0021b
;
color
:
#d10244
;
font-size
:
13px
font-size
:
.81em
}
.adyen-checkout__button
{
background
:
#00112c
;
border
:
0
;
border-radius
:
6px
;
box-shadow
:
0
3px
4px
rgba
(
0
,
15
,
45
,
.2
);
color
:
#fff
;
cursor
:
pointer
;
font-size
:
1em
;
font-weight
:
700
;
height
:
48px
;
margin
:
0
;
padding
:
15px
;
transition
:
background
.3s
ease-out
;
width
:
100%
}
.adyen-checkout__button
:disabled
{
-moz-user-select
:
all
;
-ms-user-select
:
all
;
-webkit-user-select
:
all
;
background
:
#e6e9eb
;
box-shadow
:
none
;
cursor
:
not-allowed
;
user-select
:
all
}
.adyen-checkout__button--loading
{
-moz-user-select
:
none
;
-ms-user-select
:
none
;
-webkit-user-select
:
none
;
background
:
#687282
;
box-shadow
:
none
;
outline
:
0
;
pointer-events
:
none
;
user-select
:
none
}
.adyen-checkout__button
.adyen-checkout__spinner
{
border-color
:
transparent
#fff
#fff
;
border-width
:
3px
}
.adyen-checkout__button__content
{
align-items
:
center
;
display
:
flex
;
justify-content
:
center
}
}
.adyen-checkout__phone-input
{
.adyen-checkout__phone-input
{
display
:
flex
display
:
flex
}
}
.adyen-checkout__phone-input__prefix
{
.adyen-checkout__phone-input__prefix
{
margin-bottom
:
0
;
margin-right
:
.5em
margin-right
:
.5em
}
}
.adyen-checkout__
phone-input
.adyen-checkout__field
{
.adyen-checkout__
input--phone-number
{
margin-bottom
:
0
margin-bottom
:
0
}
}
.adyen-checkout__iban-input__number
{
.adyen-checkout__iban-input__number
{
padding
:
5px
36px
5px
8px
;
padding
:
5px
36px
5px
8px
;
text-transform
:
uppercase
text-transform
:
uppercase
}
}
.adyen-checkout__wechatpay
{
.adyen-checkout__threeds2__challenge
,
.adyen-checkout__threeds2__challenge-container
{
background-color
:
transparent
;
box-sizing
:
border-box
;
display
:
block
;
overflow
:
auto
;
width
:
100%
}
.adyen-checkout__threeds2__challenge-container--01
{
height
:
400px
;
width
:
250px
}
.adyen-checkout__threeds2__challenge-container--02
{
height
:
400px
;
width
:
390px
}
.adyen-checkout__threeds2__challenge-container--03
{
height
:
600px
;
width
:
500px
}
.adyen-checkout__threeds2__challenge-container--04
{
height
:
400px
;
width
:
600px
}
.adyen-checkout__threeds2_challenge-container--05
{
height
:
100%
;
width
:
100%
}
.adyen-checkout__threeds2__challenge.adyen-checkout__threeds2__challenge--05
{
overflow
:
hidden
;
padding-top
:
56.25%
;
position
:
relative
}
.adyen-checkout__threeds2__challenge.adyen-checkout__threeds2__challenge--05
.adyen-checkout__iframe--threeDSIframe
{
border
:
0
;
height
:
100%
;
left
:
0
;
position
:
absolute
;
top
:
0
;
width
:
100%
}
.adyen-checkout__qr-loader
{
background
:
#fff
;
background
:
#fff
;
border
:
1px
solid
#dde1e3
;
border
:
1px
solid
#d4d9db
;
border-radius
:
3px
;
border-radius
:
6px
;
min-height
:
443px
;
padding
:
40px
;
padding
:
40px
;
text-align
:
center
text-align
:
center
}
}
.adyen-checkout__wechatpay__brand-logo
{
.adyen-checkout__qr-loader--app
{
height
:
20px
;
border
:
0
;
width
:
109px
border-radius
:
0
;
padding
:
0
}
.adyen-checkout__qr-loader__brand-logo
{
max-height
:
50px
;
width
:
110px
}
}
.adyen-checkout__
wechatpay
__subtitle
{
.adyen-checkout__
qr-loader
__subtitle
{
margin-top
:
32px
margin-top
:
32px
}
}
.adyen-checkout__
wechatpay__payment_amount
,
.adyen-checkout__wechatpay
__subtitle
{
.adyen-checkout__
qr-loader__payment_amount
,
.adyen-checkout__qr-loader
__subtitle
{
color
:
#001
b2b
;
color
:
#001
12c
;
font-size
:
1
6px
;
font-size
:
1
em
;
line-height
:
19px
line-height
:
19px
}
}
.adyen-checkout__wechatpay__progress
{
.adyen-checkout__qr-loader__payment_amount
{
font-weight
:
700
}
.adyen-checkout__qr-loader__progress
{
background
:
#d4d9db
;
background
:
#d4d9db
;
border-radius
:
25px
;
border-radius
:
25px
;
height
:
4px
;
height
:
4px
;
...
@@ -855,45 +725,339 @@
...
@@ -855,45 +725,339 @@
padding-right
:
3%
;
padding-right
:
3%
;
width
:
152px
width
:
152px
}
}
.adyen-checkout__
wechatpay__progress
>
span
{
.adyen-checkout__
qr-loader__percentage
{
background
:
#0
0a3f
f
;
background
:
#0
6
f
;
border-radius
:
25px
;
border-radius
:
25px
;
display
:
block
;
display
:
block
;
height
:
100%
height
:
100%
}
}
.adyen-checkout__
wechatpay
__countdown
{
.adyen-checkout__
qr-loader
__countdown
{
color
:
#687282
;
color
:
#687282
;
font-size
:
13px
font-size
:
.81em
}
}
.adyen-checkout__
wechatpay
.adyen-checkout__spinner__wrapper
{
.adyen-checkout__
qr-loader
>
.adyen-checkout__spinner__wrapper
{
margin
:
60px
0
margin
:
60px
0
}
}
.adyen-checkout__alert
{
.adyen-checkout__qr-loader__separator__label
{
align-items
:
flex-start
;
background
:
#fff
;
background-color
:
#00a3ff
;
border-radius
:
100%
;
border-radius
:
3px
;
color
:
#687282
;
color
:
#fff
;
display
:
inline-block
;
height
:
34px
;
line-height
:
34px
;
position
:
relative
;
width
:
34px
;
z-index
:
1
}
.adyen-checkout__qr-loader__separator__line
{
-webkit-transform
:
translateY
(
-17px
);
border-top
:
1px
solid
#d4d9db
;
display
:
block
;
transform
:
translateY
(
-17px
)
}
.adyen-checkout__button.adyen-checkout__button--qr-loader
{
display
:
block
;
text-decoration
:
none
}
.adyen-checkout__voucher-result
{
background
:
#fff
;
border
:
1px
solid
#d4d9db
;
border-radius
:
6px
;
box-sizing
:
border-box
;
padding
:
20px
16px
56px
;
text-align
:
center
}
.adyen-checkout__voucher-result__image
{
align-items
:
center
;
display
:
flex
;
display
:
flex
;
justify-content
:
center
;
margin-bottom
:
16px
;
width
:
100%
}
.adyen-checkout__voucher-result__image__wrapper
{
display
:
inline-block
;
padding
:
8px
;
width
:
120px
}
.adyen-checkout__voucher-result__image__wrapper
:nth-child
(
2
)
{
border-left
:
1px
solid
#d4d9db
}
.adyen-checkout__voucher-result__image__brand
,
.adyen-checkout__voucher-result__image__issuer
{
height
:
34px
}
.adyen-checkout__voucher-result__image__brand
{
height
:
60px
}
.adyen-checkout__voucher-result__introduction
{
color
:
#00112c
;
font-size
:
.81em
;
line-height
:
19px
;
margin
:
0
auto
;
max-width
:
400px
;
text-align
:
center
}
.adyen-checkout__voucher-result__amount
{
color
:
#00112c
;
font-size
:
1em
;
font-weight
:
700
;
margin
:
24px
auto
0
;
text-align
:
center
}
.adyen-checkout__voucher-result__surcharge
{
color
:
#687282
;
display
:
block
;
font-size
:
.81em
;
font-weight
:
400
;
line-height
:
19px
;
text-align
:
center
}
.adyen-checkout__voucher-result__code__label
{
-moz-user-select
:
none
;
-ms-user-select
:
none
;
-webkit-user-select
:
none
;
display
:
block
;
font-weight
:
400
;
left
:
0
;
margin
:
0
auto
;
position
:
absolute
;
right
:
0
;
top
:
-14px
;
user-select
:
none
;
width
:
auto
}
.adyen-checkout__voucher-result__code__label__text
{
background
:
#fff
;
color
:
#00112c
;
font-size
:
13px
;
padding
:
0
8px
}
.adyen-checkout__voucher-result__code
{
-moz-user-select
:
all
;
-ms-user-select
:
all
;
-webkit-user-select
:
all
;
border
:
1px
solid
#e6e9eb
;
border-radius
:
6px
;
color
:
#00112c
;
display
:
inline-block
;
font-size
:
1.5em
;
font-weight
:
700
;
letter-spacing
:
1px
;
line-height
:
19px
;
margin
:
20px
auto
16px
;
max-width
:
100%
;
min-width
:
200px
;
padding
:
28px
48px
24px
;
position
:
relative
;
text-align
:
center
;
user-select
:
all
;
width
:
300px
}
.adyen-checkout__voucher-result__details
{
list-style
:
none
;
margin
:
8px
auto
0
;
max-width
:
300px
;
padding
:
0
}
.adyen-checkout__voucher-result__details__item
{
color
:
#00112c
;
display
:
flex
;
font-size
:
.81em
;
justify-content
:
space-between
;
justify-content
:
space-between
;
line-height
:
1
;
margin-bottom
:
16px
;
margin
:
0
;
word-break
:
break-word
padding
:
12px
}
}
.adyen-checkout__
alert--error
{
.adyen-checkout__
voucher-result__details__item
:last-child
{
background-color
:
#d81b4a
margin-bottom
:
0
}
}
.adyen-checkout__alert--success
{
.adyen-checkout__voucher-result__details__label
{
background-color
:
#0abf53
max-width
:
50%
;
text-align
:
left
}
}
.adyen-checkout__alert--info
{
.adyen-checkout__voucher-result__details__value
{
background-color
:
#00a3ff
font-weight
:
700
;
max-width
:
50%
;
text-align
:
right
}
}
.adyen-checkout__sdk
,
.adyen-checkout__sdk
*,
.adyen-checkout__sdk
*
:before
,
.adyen-checkout__sdk
:after
{
.adyen-checkout__payment-method
{
box-sizing
:
border-box
background
:
#fff
;
border
:
1px
solid
#d4d9db
;
cursor
:
pointer
;
margin-top
:
-1px
;
position
:
relative
;
transition
:
opacity
.3s
ease-out
;
width
:
100%
}
.adyen-checkout__payment-method
:focus
{
outline
:
0
}
.adyen-checkout__payment-method--selected
+
.adyen-checkout__payment-method
,
.adyen-checkout__payment-method
:first-child
{
border-top-left-radius
:
6px
;
border-top-right-radius
:
6px
;
margin-top
:
0
}
}
.adyen-checkout__payment-methods-list
{
.adyen-checkout__payment-method--next-selected
,
.adyen-checkout__payment-method
:last-child
{
border-bottom-left-radius
:
6px
;
border-bottom-right-radius
:
6px
;
margin-bottom
:
0
}
.adyen-checkout__payment-method--loading
{
opacity
:
.2
}
.adyen-checkout__payment-method--selected.adyen-checkout__payment-method--loading
{
opacity
:
.9
}
.adyen-checkout__payment-method--disabling
{
opacity
:
.5
}
.adyen-checkout__payment-method__header
{
align-items
:
center
;
color
:
#00112c
;
display
:
flex
;
font-size
:
1em
;
font-weight
:
400
;
padding
:
16px
;
position
:
relative
;
transition
:
background
.1s
ease-out
;
width
:
100%
}
.adyen-checkout__payment-method__surcharge
{
color
:
#687282
;
margin-left
:
5px
}
.adyen-checkout__payment-method--selected
{
background
:
#f7f8f9
;
border
:
1px
solid
#d4d9db
;
border-radius
:
6px
;
cursor
:
default
;
margin
:
8px
0
;
transition
:
margin
.15s
cubic-bezier
(
.4
,
0
,
.2
,
1
)
0ms
,
opacity
.3s
ease-out
}
.adyen-checkout__payment-method__name--selected
{
font-weight
:
500
}
.adyen-checkout__payment-method__details
{
padding
:
0
16px
}
.adyen-checkout__payment-method__details__content
{
margin
:
6px
0
22px
}
.adyen-checkout__payment-method__image__wrapper
{
height
:
26px
;
position
:
relative
}
.adyen-checkout__payment-method__image__wrapper
:after
{
border
:
1px
solid
rgba
(
0
,
27
,
43
,
.17
);
border-radius
:
3px
;
content
:
""
;
height
:
100%
;
left
:
0
;
position
:
absolute
;
top
:
0
;
width
:
100%
}
.adyen-checkout__payment-method__image
{
border-radius
:
3px
border-radius
:
3px
}
}
.adyen-checkout__payment-method__disable-confirmation
{
align-items
:
center
;
background
:
#e6e9eb
;
color
:
#00112c
;
display
:
flex
;
font-size
:
.94em
;
justify-content
:
space-between
;
margin-bottom
:
10px
;
padding
:
8px
16px
}
.adyen-checkout__payment-method__disable-confirmation__buttons
{
display
:
flex
}
.adyen-checkout__payment-method__disable-confirmation__button
{
border
:
1px
solid
transparent
;
border-radius
:
6px
;
cursor
:
pointer
;
font-size
:
.81em
;
line-height
:
15px
;
margin
:
0
0
0
8px
;
padding
:
8px
}
.adyen-checkout__payment-method__disable-confirmation__button--remove
{
background
:
#d10244
;
border-color
:
#d10244
;
color
:
#fff
}
.adyen-checkout__payment-method__disable-confirmation__button--cancel
{
background
:
transparent
;
border-color
:
#00112c
;
color
:
#00112c
}
.adyen-checkout__payment-method__radio
{
background-color
:
#fff
;
border
:
1px
solid
#b9c4c9
;
border-radius
:
50%
;
box-shadow
:
inset
0
1px
3px
rgba
(
0
,
27
,
43
,
.15
);
height
:
18px
;
position
:
absolute
;
right
:
20px
;
transition
:
border-color
.3s
ease-out
;
width
:
18px
}
.adyen-checkout__payment-method__radio
:after
{
-webkit-transform
:
translateY
(
-50%
)
scale
(
0
);
background-color
:
#fff
;
border-radius
:
50%
;
box-shadow
:
0
1px
1px
rgba
(
0
,
15
,
45
,
.25
);
content
:
""
;
display
:
block
;
height
:
6px
;
left
:
0
;
margin
:
0
auto
;
position
:
absolute
;
right
:
0
;
top
:
50%
;
transform
:
translateY
(
-50%
)
scale
(
0
);
transition
:
-webkit-transform
.3s
ease-out
;
transition
:
transform
.3s
ease-out
;
transition
:
transform
.3s
ease-out
,
-webkit-transform
.3s
ease-out
;
width
:
6px
}
.adyen-checkout__payment-method__radio
:hover
{
border-color
:
#06f
;
cursor
:
pointer
}
.adyen-checkout__payment-method__radio--selected
{
background-color
:
#06f
;
border
:
0
;
box-shadow
:
inset
0
1px
2px
rgba
(
0
,
0
,
0
,
.26
);
transition
:
all
.3s
ease-out
}
.adyen-checkout__payment-method__radio--selected
:after
{
-webkit-transform
:
translateY
(
-50%
)
scale
(
1
);
transform
:
translateY
(
-50%
)
scale
(
1
)
}
.adyen-checkout__button--pay
{
margin-bottom
:
16px
}
.adyen-checkout__status
{
align-items
:
center
;
background-color
:
#fff
;
border
:
1px
solid
#d4d9db
;
border-radius
:
6px
;
color
:
#001b2b
;
display
:
flex
;
flex-direction
:
column
;
font-size
:
16px
;
height
:
350px
;
justify-content
:
center
;
margin
:
0
;
padding
:
32px
;
text-align
:
center
}
.adyen-checkout__status__icon
{
margin-bottom
:
24px
}
.adyen-checkout__dropin
,
.adyen-checkout__dropin
*,
.adyen-checkout__dropin
:after
,
.adyen-checkout__dropin
:before
{
box-sizing
:
border-box
}
.adyen-checkout__payment-methods-list--loading
{
.adyen-checkout__payment-methods-list--loading
{
-moz-user-select
:
none
;
-moz-user-select
:
none
;
-ms-user-select
:
none
;
-ms-user-select
:
none
;
...
@@ -902,9 +1066,10 @@
...
@@ -902,9 +1066,10 @@
user-select
:
none
user-select
:
none
}
}
.adyen-checkout__link
{
.adyen-checkout__link
{
color
:
#687282
;
color
:
#06f
;
font-size
:
13px
;
text-decoration
:
none
}
.adyen-checkout__link
:hover
{
text-decoration
:
underline
text-decoration
:
underline
}
}
/* Checkout component Adyen styling end */
/* Checkout component Adyen styling end */
view/frontend/web/css/styles.css
View file @
77373c29
...
@@ -209,1012 +209,1015 @@
...
@@ -209,1012 +209,1015 @@
}
}
/* Checkout component Adyen styling start */
/* Checkout component Adyen v3.0.0 styling start */
.adyen-checkout__spinner__wrapper
{
.adyen-checkout__field
{
align-items
:
center
;
display
:
block
;
display
:
flex
;
margin-bottom
:
16px
height
:
100%
;
}
justify-content
:
center
.adyen-checkout__field--error
input
{
}
border-color
:
#d10244
;
color
:
#d10244
.adyen-checkout__spinner__wrapper--inline
{
}
display
:
inline-block
;
.adyen-checkout__field
:last-child
{
height
:
auto
;
margin-bottom
:
0
margin-right
:
8px
}
}
.adyen-checkout__helper-text
,
.adyen-checkout__label__text
{
color
:
#00112c
;
.adyen-checkout__spinner
{
display
:
block
;
-webkit-animation
:
rotateSpinner
2s
infinite
linear
;
font-size
:
.81em
;
animation
:
rotateSpinner
2s
infinite
linear
;
font-weight
:
400
;
border
:
2px
solid
#00a3ff
;
line-height
:
13px
;
border-radius
:
50%
;
padding-bottom
:
8px
border-top-color
:
transparent
;
}
height
:
43px
;
.adyen-checkout__helper-text
{
width
:
43px
color
:
#687282
}
}
.adyen-checkout__label__text
{
.adyen-checkout__spinner--large
{
transition
:
color
.2s
ease-out
height
:
43px
;
}
width
:
43px
.adyen-checkout__label--focused
.adyen-checkout__label__text
{
}
color
:
#06f
}
.adyen-checkout__spinner--small
{
.adyen-checkout__error-text
{
height
:
16px
;
align-items
:
center
;
width
:
16px
color
:
#d10244
;
}
display
:
flex
;
font-size
:
.75em
;
.adyen-checkout__spinner--medium
{
font-weight
:
400
;
height
:
28px
;
margin-top
:
4px
width
:
28px
}
}
.adyen-checkout__spinner__wrapper
{
align-items
:
center
;
@-webkit-keyframes
rotateSpinner
{
display
:
flex
;
0
%
{
height
:
100%
;
-webkit-transform
:
rotate
(
0deg
);
justify-content
:
center
transform
:
rotate
(
0deg
)
}
.adyen-checkout__spinner__wrapper--inline
{
display
:
inline-block
;
height
:
auto
;
margin-right
:
8px
}
.adyen-checkout__spinner
{
-webkit-animation
:
rotateSpinner
2s
infinite
linear
;
animation
:
rotateSpinner
2s
infinite
linear
;
border
:
2px
solid
#06f
;
border-radius
:
50%
;
border-top-color
:
transparent
;
height
:
43px
;
width
:
43px
}
.adyen-checkout__spinner--large
{
height
:
43px
;
width
:
43px
}
.adyen-checkout__spinner--small
{
height
:
16px
;
width
:
16px
}
.adyen-checkout__spinner--medium
{
height
:
28px
;
width
:
28px
}
@-webkit-keyframes
rotateSpinner
{
0
%
{
-webkit-transform
:
rotate
(
0deg
);
transform
:
rotate
(
0deg
)
}
}
to
{
to
{
-webkit-transform
:
rotate
(
1turn
);
-webkit-transform
:
rotate
(
1turn
);
transform
:
rotate
(
1turn
)
transform
:
rotate
(
1turn
)
}
}
}
}
@keyframes
rotateSpinner
{
@keyframes
rotateSpinner
{
0
%
{
0
%
{
-webkit-transform
:
rotate
(
0deg
);
-webkit-transform
:
rotate
(
0deg
);
transform
:
rotate
(
0deg
)
transform
:
rotate
(
0deg
)
}
}
to
{
to
{
-webkit-transform
:
rotate
(
1turn
);
-webkit-transform
:
rotate
(
1turn
);
transform
:
rotate
(
1turn
)
transform
:
rotate
(
1turn
)
}
}
}
}
.adyen-checkout__icon
svg
{
.adyen-checkout__pay-button
{
fill
:
currentColor
background
:
#001b2b
;
}
border
:
0
;
.adyen-checkout__open-invoice
.adyen-checkout__input-wrapper--socialSecurityNumber
+
.adyen-checkout__error-text
{
border-radius
:
3px
;
max-width
:
380px
box-shadow
:
0
3px
4px
rgba
(
0
,
15
,
45
,
.2
);
}
color
:
#fff
;
.adyen-checkout__radio_group
+
.adyen-checkout-input__inline-validation
{
cursor
:
pointer
;
display
:
none
font-size
:
1em
;
}
font-weight
:
700
;
.adyen-checkout__radio_group__input
{
height
:
48px
;
opacity
:
0
;
padding
:
15px
;
position
:
absolute
transition
:
background
.3s
ease-out
;
}
width
:
100%
.adyen-checkout__radio_group__label
{
}
display
:
block
;
font-size
:
.81em
;
.adyen-checkout__pay-button
:disabled
{
font-weight
:
400
;
-moz-user-select
:
all
;
line-height
:
16px
;
-ms-user-select
:
all
;
margin-bottom
:
8px
;
-webkit-user-select
:
all
;
padding-bottom
:
0
;
background
:
#e6e9eb
;
padding-left
:
24px
;
box-shadow
:
none
;
position
:
relative
cursor
:
not-allowed
;
}
user-select
:
all
.adyen-checkout__radio_group__label
:before
{
}
background-color
:
#fff
;
border
:
1px
solid
#b9c4c9
;
.adyen-checkout__pay-button--loading
{
border-radius
:
50%
;
-moz-user-select
:
none
;
content
:
""
;
-ms-user-select
:
none
;
height
:
16px
;
-webkit-user-select
:
none
;
left
:
0
;
background
:
#4c5f6b
;
position
:
absolute
;
box-shadow
:
none
;
top
:
0
;
outline
:
0
;
transition
:
border-color
.3s
ease-out
;
pointer-events
:
none
;
width
:
16px
user-select
:
none
}
}
.adyen-checkout__radio_group__label
:after
{
-webkit-transform
:
scale
(
0
);
.adyen-checkout__pay-button
.adyen-checkout__spinner
{
background-color
:
#fff
;
border-color
:
transparent
#fff
#fff
;
border-radius
:
50%
;
border-width
:
3px
box-shadow
:
0
1px
1px
rgba
(
0
,
15
,
45
,
.25
);
}
content
:
""
;
display
:
block
;
.adyen-checkout__pay-button__content
{
height
:
6px
;
align-items
:
center
;
left
:
5px
;
display
:
flex
;
margin
:
0
auto
;
justify-content
:
center
position
:
absolute
;
}
top
:
5px
;
transform
:
scale
(
0
);
.adyen-checkout__payment-method
{
transition
:
-webkit-transform
.3s
ease-out
;
background
:
#fff
;
transition
:
transform
.3s
ease-out
;
border
:
1px
solid
#edf0f3
;
transition
:
transform
.3s
ease-out
,
-webkit-transform
.3s
ease-out
;
cursor
:
pointer
;
width
:
6px
margin-top
:
-1px
;
}
position
:
relative
;
.adyen-checkout__radio_group__label
:hover
{
transition
:
opacity
.3s
ease-out
;
border-color
:
#06f
;
width
:
100%
cursor
:
pointer
}
}
.adyen-checkout__radio_group__input
:checked
+
.adyen-checkout__radio_group__label
:before
,
.adyen-checkout__radio_group__label--selected
{
.adyen-checkout__payment-method
:focus
{
background-color
:
#06f
;
outline
:
0
border
:
0
;
}
box-shadow
:
inset
0
1px
2px
rgba
(
0
,
0
,
0
,
.26
);
transition
:
all
.3s
ease-out
.adyen-checkout__payment-method--selected
+
.adyen-checkout__payment-method
,
.adyen-checkout__payment-method
:first-child
{
}
border-top-left-radius
:
3px
;
.adyen-checkout__radio_group__input
:checked
+
.adyen-checkout__radio_group__label
:after
{
border-top-right-radius
:
3px
;
-webkit-transform
:
scale
(
1
);
margin-top
:
0
transform
:
scale
(
1
)
}
}
.adyen-checkout__radio_group__label.adyen-checkout__radio_group__label--invalid
:before
{
.adyen-checkout__payment-method--next-selected
{
border
:
1px
solid
#d10244
border-bottom-left-radius
:
3px
;
}
border-bottom-right-radius
:
3px
.adyen-checkout__checkbox
{
}
display
:
block
}
.adyen-checkout__payment-method--loading
{
.adyen-checkout__checkbox__input
{
opacity
:
.2
opacity
:
0
;
}
pointer-events
:
none
;
position
:
absolute
.adyen-checkout__payment-method--selected.adyen-checkout__payment-method--loading
{
}
opacity
:
.9
.adyen-checkout__checkbox__label
{
}
-moz-user-select
:
none
;
-ms-user-select
:
none
;
.adyen-checkout__payment-method--disabling
{
-webkit-user-select
:
none
;
opacity
:
.5
color
:
#00112c
;
}
cursor
:
pointer
;
display
:
inline-block
;
.adyen-checkout__payment-method__header
{
font-size
:
.81em
;
align-items
:
center
;
font-weight
:
400
;
color
:
#00202e
;
line-height
:
16px
;
display
:
flex
;
padding-left
:
24px
;
font-size
:
16px
;
position
:
relative
;
font-weight
:
400
;
user-select
:
none
padding
:
16px
;
}
position
:
relative
;
.adyen-checkout__checkbox__input
+
span
:before
{
transition
:
background
.1s
ease-out
;
-webkit-transform
:
rotate
(
37deg
);
width
:
100%
-webkit-transform-origin
:
100%
100%
;
}
border-color
:
transparent
#fff
#fff
transparent
;
border-radius
:
0
2px
1px
2px
;
.adyen-checkout__payment-method__surcharge
{
border-style
:
solid
;
color
:
#687282
;
border-width
:
1px
2px
2px
1px
;
margin-left
:
5px
content
:
""
;
}
height
:
11px
;
left
:
1px
;
.adyen-checkout__payment-method--selected
{
opacity
:
0
;
background
:
#f7f8f9
;
position
:
absolute
;
border
:
1px
solid
#d4d9db
;
top
:
2px
;
border-radius
:
3px
;
transform
:
rotate
(
37deg
);
cursor
:
default
;
transform-origin
:
100%
100%
;
margin
:
8px
0
;
transition
:
opacity
.2s
ease-out
;
transition
:
margin
.15s
cubic-bezier
(
.4
,
0
,
.2
,
1
)
0ms
,
opacity
.3s
ease-out
width
:
6px
;
}
z-index
:
1
}
.adyen-checkout__payment-method--selected
.adyen-checkout__payment-method__header
{
.adyen-checkout__checkbox__input
:checked
+
.adyen-checkout__checkbox__label
:before
{
font-weight
:
500
opacity
:
1
}
}
.adyen-checkout__checkbox__input
+
.adyen-checkout__checkbox__label
:after
{
.adyen-checkout__payment-method__details
{
background-color
:
#fff
;
padding
:
0
16px
16px
border
:
1px
solid
#b9c4c9
;
}
border-radius
:
3px
;
content
:
""
;
.adyen-checkout__payment-method__details__content
{
height
:
16px
;
padding
:
6px
0
24px
left
:
0
;
}
position
:
absolute
;
top
:
0
;
.adyen-checkout__payment-method__image__wrapper
{
transition
:
background
.15s
ease-out
,
border
.05s
ease-out
,
box-shadow
.1s
ease-out
;
height
:
26px
;
width
:
16px
;
position
:
relative
z-index
:
0
}
}
.adyen-checkout__checkbox__input--invalid
+
.adyen-checkout__checkbox__label
:after
{
.adyen-checkout__payment-method__image__wrapper
:after
{
border
:
1px
solid
#d10244
border
:
1px
solid
rgba
(
0
,
27
,
43
,
.17
);
}
border-radius
:
3px
;
.adyen-checkout__checkbox__input
:checked
+
.adyen-checkout__checkbox__label
:after
{
content
:
""
;
background-color
:
#06f
;
height
:
100%
;
border
:
1px
solid
#06f
left
:
0
;
}
position
:
absolute
;
.adyen-checkout__checkbox__input
:focus
+
span
:after
{
top
:
0
;
border
:
1px
solid
#06f
;
width
:
100%
box-shadow
:
0
0
0
2px
#99c2ff
}
}
.adyen-checkout__dropdown
{
.adyen-checkout__payment-method__image
{
font-size
:
1em
;
border-radius
:
3px
max-width
:
100%
;
}
width
:
200px
}
.adyen-checkout__payment-method__disable_oneclick
{
.adyen-checkout__dropdown--small
{
background-color
:
transparent
;
width
:
130px
border
:
none
;
}
color
:
#687282
;
.adyen-checkout__dropdown--large
{
cursor
:
pointer
;
width
:
300px
display
:
block
;
}
font-size
:
13px
;
.adyen-checkout__dropdown__button
{
padding
:
0
;
background
:
#fff
;
position
:
absolute
;
border
:
1px
solid
#b9c4c9
;
right
:
70px
;
border-radius
:
6px
;
text-decoration
:
underline
font-size
:
1em
;
}
height
:
40px
;
line-height
:
20px
;
.adyen-checkout__payment-method__disable_oneclick
:focus
{
outline
:
0
;
color
:
#00a3ff
;
padding
:
9px
20px
9px
8px
;
outline
:
0
transition
:
border
.2s
ease-out
,
box-shadow
.2s
ease-out
;
}
width
:
100%
}
.adyen-checkout__payment-method__disable-confirmation
{
.adyen-checkout__dropdown__button__icon
{
align-items
:
center
;
margin-right
:
8px
;
background
:
#e6e9eb
;
max-height
:
26px
;
color
:
#001b2b
;
max-width
:
40px
display
:
flex
;
}
font-size
:
15px
;
.adyen-checkout__dropdown__button--active
,
.adyen-checkout__dropdown__button
:active
,
.adyen-checkout__dropdown__button
:focus
{
justify-content
:
space-between
;
border-color
:
#06f
;
margin-bottom
:
10px
;
box-shadow
:
0
0
0
2px
#99c2ff
padding
:
8px
16px
}
}
.adyen-checkout__dropdown__button--readonly
,
.adyen-checkout__dropdown__button--readonly.adyen-checkout__dropdown__button--active
{
background
:
#e6e9eb
;
.adyen-checkout__payment-method__disable-confirmation__buttons
{
color
:
#00112c
;
display
:
flex
cursor
:
not-allowed
}
}
.adyen-checkout__dropdown__button--invalid
{
.adyen-checkout__payment-method__disable-confirmation__button
{
border-color
:
#d10244
border
:
1px
solid
transparent
;
}
border-radius
:
3px
;
.adyen-checkout__dropdown__button__text
{
cursor
:
pointer
;
overflow
:
hidden
;
font-size
:
13px
;
text-overflow
:
ellipsis
;
line-height
:
15px
;
white-space
:
nowrap
margin
:
0
0
0
8px
;
}
padding
:
8px
.adyen-checkout__dropdown__list
{
}
border-radius
:
6px
;
box-shadow
:
0
2px
7px
rgba
(
0
,
15
,
45
,
.3
);
.adyen-checkout__payment-method__disable-confirmation__button--remove
{
margin-top
:
2px
;
background
:
#d10244
;
max-height
:
360px
;
border-color
:
#d10244
;
z-index
:
2
color
:
#fff
}
}
.adyen-checkout__dropdown__element
{
-ms-hyphens
:
auto
;
.adyen-checkout__payment-method__disable-confirmation__button--cancel
{
-webkit-hyphens
:
auto
;
background
:
transparent
;
border
:
1px
solid
transparent
;
border-color
:
#001b2b
;
border-bottom-color
:
#e6e9eb
;
color
:
#001b2b
cursor
:
pointer
;
}
font-size
:
.81em
;
hyphens
:
auto
;
.adyen-checkout__payment-method__radio
{
line-height
:
20px
;
background-color
:
#fff
;
outline
:
0
;
border
:
1px
solid
#b9c4c9
;
padding
:
8px
;
border-radius
:
50%
;
transition
:
background
.2s
ease-out
,
border-color
.2s
ease-out
;
box-shadow
:
inset
0
1px
3px
rgba
(
0
,
27
,
43
,
.15
);
word-break
:
break-word
height
:
18px
;
}
position
:
absolute
;
.adyen-checkout__dropdown__element
:last-child
{
right
:
20px
;
border-bottom
:
0
transition
:
border-color
.3s
ease-out
;
}
width
:
18px
.adyen-checkout__dropdown__element
:active
,
.adyen-checkout__dropdown__element
:focus
,
.adyen-checkout__dropdown__element
:hover
{
}
background
:
rgba
(
230
,
233
,
235
,
.6
)
}
.adyen-checkout__payment-method__radio
:after
{
.adyen-checkout__dropdown__element
:active
,
.adyen-checkout__dropdown__element
:focus
{
-webkit-transform
:
translateY
(
-50%
)
scale
(
0
);
border-bottom-color
:
#06f
;
background-color
:
#fff
;
border-top-color
:
#06f
border-radius
:
50%
;
}
box-shadow
:
0
1px
1px
rgba
(
0
,
15
,
45
,
.25
);
.adyen-checkout__dropdown__element.adyen-checkout__dropdown__element--active
{
content
:
""
;
background
:
rgba
(
0
,
102
,
255
,
.1
)
display
:
block
;
}
height
:
6px
;
.adyen-checkout__dropdown__element.adyen-checkout__dropdown__element--active
:active
,
.adyen-checkout__dropdown__element.adyen-checkout__dropdown__element--active
:focus
,
.adyen-checkout__dropdown__element.adyen-checkout__dropdown__element--active
:hover
{
left
:
0
;
background
:
rgba
(
0
,
102
,
255
,
.15
)
margin
:
0
auto
;
}
position
:
absolute
;
.adyen-checkout__dropdown__element__icon
{
right
:
0
;
border-radius
:
3px
;
top
:
50%
;
margin-right
:
8px
;
transform
:
translateY
(
-50%
)
scale
(
0
);
max-height
:
26px
;
transition
:
-webkit-transform
.3s
ease-out
;
max-width
:
40px
transition
:
transform
.3s
ease-out
;
}
transition
:
transform
.3s
ease-out
,
-webkit-transform
.3s
ease-out
;
.adyen-checkout__dropdown
+
.adyen-checkout-input__inline-validation
{
width
:
6px
right
:
32px
}
}
.adyen-checkout__select-list
{
.adyen-checkout__payment-method__radio
:hover
{
margin
:
0
;
border-color
:
#00a3ff
;
padding
:
0
cursor
:
pointer
}
}
.adyen-checkout__select-list__item
{
background
:
#fff
;
.adyen-checkout__payment-method__radio--selected
{
border
:
1px
solid
transparent
;
background-color
:
#00a3ff
;
border-bottom-color
:
#e6e9eb
;
border
:
0
solid
transparent
;
cursor
:
pointer
;
box-shadow
:
inset
0
1px
2px
rgba
(
0
,
0
,
0
,
.26
);
display
:
inline-block
;
transition
:
all
.3s
ease-out
font-size
:
1em
;
}
line-height
:
20px
;
outline
:
0
;
.adyen-checkout__payment-method__radio--selected
:after
{
padding
:
9px
;
-webkit-transform
:
translateY
(
-50%
)
scale
(
1
);
width
:
100%
transform
:
translateY
(
-50%
)
scale
(
1
)
}
}
.adyen-checkout__select-list__item
:first-child
{
border-top
:
0
.adyen-checkout__field
{
}
display
:
block
;
.adyen-checkout__select-list__item
:active
,
.adyen-checkout__select-list__item
:focus
,
.adyen-checkout__select-list__item
:hover
{
margin-bottom
:
16px
background
:
rgba
(
230
,
233
,
235
,
.6
)
}
}
.adyen-checkout__select-list__item--selected
{
.adyen-checkout__field--error
input
{
background
:
rgba
(
0
,
102
,
255
,
.1
);
border-color
:
#d81b4a
;
font-weight
:
500
color
:
#d81b4a
}
}
.adyen-checkout__select-list__item--selected
:active
,
.adyen-checkout__select-list__item--selected
:focus
,
.adyen-checkout__select-list__item--selected
:hover
{
background
:
rgba
(
0
,
102
,
255
,
.15
)
.adyen-checkout__field
:last-child
{
}
margin-bottom
:
0
.adyen-checkout__input
{
}
background
:
#fff
;
border
:
1px
solid
#b9c4c9
;
.adyen-checkout__helper-text
,
.adyen-checkout__label__text
{
border-radius
:
6px
;
color
:
#001b2b
;
color
:
#00112c
;
display
:
block
;
display
:
block
;
font-size
:
13px
;
font-family
:
inherit
;
font-weight
:
400
;
font-size
:
1em
;
line-height
:
13px
;
height
:
40px
;
padding-bottom
:
8px
outline
:
none
;
}
padding
:
5px
8px
;
position
:
relative
;
.adyen-checkout__helper-text
{
transition
:
border
.2s
ease-out
,
box-shadow
.2s
ease-out
;
color
:
#687282
width
:
200px
}
}
.adyen-checkout__input
:required
{
.adyen-checkout__label__text
{
box-shadow
:
none
transition
:
color
.2s
ease-out
}
}
.adyen-checkout__input-wrapper
{
display
:
inline-block
;
.adyen-checkout__label--focused
.adyen-checkout__label__text
{
position
:
relative
color
:
#07b
}
}
.adyen-checkout__input-wrapper--block
{
display
:
block
.adyen-checkout__error-text
,
.adyen-checkout__label__text--error
{
}
align-items
:
center
;
.adyen-checkout-input__inline-validation
{
color
:
#d0021b
;
-webkit-transform
:
translateY
(
-50%
);
display
:
flex
;
height
:
16px
;
font-size
:
12px
;
position
:
absolute
;
font-weight
:
400
;
right
:
14px
;
margin-top
:
4px
top
:
50%
;
}
transform
:
translateY
(
-50%
);
width
:
16px
.adyen-checkout__icon
svg
{
}
fill
:
currentColor
.adyen-checkout-input__inline-validation--valid
{
}
color
:
#0abf53
}
.adyen-checkout__open-invoice
.adyen-checkout__input-wrapper--socialSecurityNumber
+
.adyen-checkout__error-text
{
.adyen-checkout-input__inline-validation--invalid
{
max-width
:
380px
color
:
#d10244
}
}
.adyen-checkout__input--small
{
.adyen-checkout__radio_group
+
.adyen-checkout-input__inline-validation
{
width
:
134px
display
:
none
}
}
.adyen-checkout__input--large
{
width
:
300px
.adyen-checkout__radio_group__input
{
}
opacity
:
0
;
.adyen-checkout__input--invalid
{
position
:
absolute
border-color
:
#d10244
}
}
.adyen-checkout__input--valid
{
.adyen-checkout__radio_group__label
{
border-bottom-color
:
#0abf53
display
:
block
;
}
font-size
:
13px
;
.adyen-checkout__input--error
{
font-weight
:
400
;
border-color
:
#d10244
line-height
:
16px
;
}
margin-bottom
:
8px
;
.adyen-checkout__input
::-webkit-input-placeholder
{
padding-bottom
:
0
;
color
:
#b9c4c9
;
padding-left
:
24px
;
font-weight
:
200
position
:
relative
}
}
.adyen-checkout__input
:-ms-input-placeholder
{
color
:
#b9c4c9
;
.adyen-checkout__radio_group__label
:before
{
font-weight
:
200
background-color
:
#fff
;
}
border
:
1px
solid
#b9c4c9
;
.adyen-checkout__input
::-ms-input-placeholder
{
border-radius
:
50%
;
color
:
#b9c4c9
;
content
:
""
;
font-weight
:
200
height
:
16px
;
}
left
:
0
;
.adyen-checkout__input
::placeholder
{
position
:
absolute
;
color
:
#b9c4c9
;
top
:
0
;
font-weight
:
200
transition
:
border-color
.3s
ease-out
;
}
width
:
16px
.adyen-checkout__input--focus
,
.adyen-checkout__input
:active
,
.adyen-checkout__input
:focus
{
}
border
:
1px
solid
#06f
;
box-shadow
:
0
0
0
2px
#99c2ff
.adyen-checkout__radio_group__label
:after
{
}
-webkit-transform
:
scale
(
0
);
.adyen-checkout__input
[
readonly
]
{
background-color
:
#fff
;
background-color
:
#e6e9eb
;
border-radius
:
50%
;
border-color
:
transparent
;
box-shadow
:
0
1px
1px
rgba
(
0
,
15
,
45
,
.25
);
color
:
#687282
;
content
:
""
;
cursor
:
default
display
:
block
;
}
height
:
6px
;
.adyen-checkout__fieldset
{
left
:
5px
;
color
:
#687282
;
margin
:
0
auto
;
display
:
block
;
position
:
absolute
;
padding-bottom
:
30px
;
top
:
5px
;
width
:
100%
transform
:
scale
(
0
);
}
transition
:
-webkit-transform
.3s
ease-out
;
.adyen-checkout__fieldset__title
{
transition
:
transform
.3s
ease-out
;
color
:
#687282
;
transition
:
transform
.3s
ease-out
,
-webkit-transform
.3s
ease-out
;
display
:
block
;
width
:
6px
font-size
:
.68em
;
}
font-weight
:
700
;
letter-spacing
:
1px
;
.adyen-checkout__radio_group__label
:hover
{
margin
:
0
;
border-color
:
#00a3ff
;
padding
:
0
0
20px
;
cursor
:
pointer
text-transform
:
uppercase
}
}
.adyen-checkout__fieldset--readonly
{
.adyen-checkout__radio_group__input
:checked
+
.adyen-checkout__radio_group__label
:before
,
.adyen-checkout__radio_group__label--selected
{
color
:
#00112c
;
background-color
:
#00a3ff
;
font-size
:
.81em
;
border
:
0
solid
transparent
;
line-height
:
19px
;
box-shadow
:
inset
0
1px
2px
rgba
(
0
,
0
,
0
,
.26
);
margin
:
0
transition
:
all
.3s
ease-out
}
.adyen-checkout__radio_group__input
:checked
+
.adyen-checkout__radio_group__label
:after
{
-webkit-transform
:
scale
(
1
);
transform
:
scale
(
1
)
}
.adyen-checkout__radio_group__label.adyen-checkout__radio_group__label--invalid
:before
{
border
:
1px
solid
#d10244
}
.adyen-checkout__checkbox
{
display
:
block
}
.adyen-checkout__checkbox
>
input
[
type
=
checkbox
]
{
opacity
:
0
;
pointer-events
:
none
;
position
:
absolute
}
.adyen-checkout__checkbox__label
{
-moz-user-select
:
none
;
-ms-user-select
:
none
;
-webkit-user-select
:
none
;
color
:
#001b2b
;
cursor
:
pointer
;
display
:
inline-block
;
font-size
:
13px
;
font-weight
:
400
;
line-height
:
16px
;
padding-left
:
24px
;
position
:
relative
;
user-select
:
none
}
.adyen-checkout__checkbox__input
+
span
:before
{
-webkit-transform
:
rotate
(
37deg
);
-webkit-transform-origin
:
100%
100%
;
border-color
:
transparent
#fff
#fff
transparent
;
border-radius
:
0
2px
1px
2px
;
border-style
:
solid
;
border-width
:
1px
2px
2px
1px
;
content
:
""
;
height
:
11px
;
left
:
1px
;
opacity
:
0
;
position
:
absolute
;
top
:
2px
;
transform
:
rotate
(
37deg
);
transform-origin
:
100%
100%
;
transition
:
opacity
.2s
ease-out
;
width
:
6px
;
z-index
:
1
}
.adyen-checkout__checkbox__input
:checked
+
.adyen-checkout__checkbox__label
:before
{
opacity
:
1
}
.adyen-checkout__checkbox__input
+
.adyen-checkout__checkbox__label
:after
{
background-color
:
#fff
;
border
:
1px
solid
#b9c4c9
;
border-radius
:
3px
;
content
:
""
;
height
:
16px
;
left
:
0
;
position
:
absolute
;
top
:
0
;
transition
:
background
.15s
ease-out
,
border
.05s
ease-out
,
box-shadow
.1s
ease-out
;
width
:
16px
;
z-index
:
0
}
.adyen-checkout__checkbox__input
:checked
+
.adyen-checkout__checkbox__label
:after
{
background-color
:
#00a3ff
;
border
:
1px
solid
#00a3ff
}
.adyen-checkout__checkbox__input
:focus
+
span
:after
{
border
:
1px
solid
#00a3ff
;
box-shadow
:
0
0
0
2px
#91d7ff
}
.adyen-checkout__checkbox__input.adyen-checkout__checkbox__input--invalid
+
.adyen-checkout__checkbox__label
:after
{
border
:
1px
solid
#d10244
}
.adyen-checkout__dropdown
{
font-size
:
16px
;
max-width
:
100%
;
width
:
200px
}
.adyen-checkout__dropdown--small
{
width
:
130px
}
.adyen-checkout__dropdown--large
{
width
:
300px
}
.adyen-checkout__dropdown__button
{
background
:
#fff
;
border
:
1px
solid
#b9c4c9
;
border-radius
:
3px
;
font-size
:
16px
;
height
:
40px
;
line-height
:
20px
;
outline
:
0
;
padding
:
9px
20px
9px
8px
;
transition
:
border
.2s
ease-out
,
box-shadow
.2s
ease-out
;
width
:
100%
}
.adyen-checkout__dropdown__button__icon
{
margin-right
:
8px
;
max-height
:
20px
;
max-width
:
32px
}
.adyen-checkout__dropdown__button--active
,
.adyen-checkout__dropdown__button
:active
,
.adyen-checkout__dropdown__button
:focus
{
border-color
:
#00a3ff
;
box-shadow
:
0
0
0
2px
#91d7ff
}
.adyen-checkout__dropdown__button--readonly
,
.adyen-checkout__dropdown__button--readonly.adyen-checkout__dropdown__button--active
{
background
:
#e6e9eb
;
color
:
#001b2b
;
cursor
:
not-allowed
}
.adyen-checkout__dropdown__button--invalid
{
border-color
:
#d10244
}
.adyen-checkout__dropdown__button__text
{
overflow
:
hidden
;
text-overflow
:
ellipsis
;
white-space
:
nowrap
}
.adyen-checkout__dropdown__list
{
border-radius
:
3px
;
box-shadow
:
0
2px
7px
rgba
(
0
,
15
,
45
,
.3
);
margin-top
:
2px
;
max-height
:
360px
;
z-index
:
2
}
.adyen-checkout__dropdown__element
{
-ms-hyphens
:
auto
;
-webkit-hyphens
:
auto
;
border
:
1px
solid
transparent
;
border-bottom-color
:
#e6e9eb
;
cursor
:
pointer
;
hyphens
:
auto
;
line-height
:
20px
;
outline
:
0
;
padding
:
8px
;
transition
:
background
.2s
ease-out
,
border-color
.2s
ease-out
;
word-break
:
break-word
}
.adyen-checkout__dropdown__element
:last-child
{
border-bottom
:
0
}
.adyen-checkout__dropdown__element
:active
,
.adyen-checkout__dropdown__element
:focus
,
.adyen-checkout__dropdown__element
:hover
{
background
:
#f0f2f4
}
.adyen-checkout__dropdown__element
:active
,
.adyen-checkout__dropdown__element
:focus
{
border-bottom-color
:
#00a3ff
;
border-top-color
:
#00a3ff
}
.adyen-checkout__dropdown__element__icon
{
margin-right
:
8px
;
max-height
:
20px
;
max-width
:
32px
}
.adyen-checkout__dropdown
+
.adyen-checkout-input__inline-validation
{
right
:
32px
}
.adyen-checkout__select-list
{
margin
:
0
;
padding
:
0
}
.adyen-checkout__select-list__item
{
background
:
#fff
;
border-top
:
1px
solid
#b9c4c9
;
cursor
:
pointer
;
display
:
inline-block
;
font-size
:
16px
;
line-height
:
20px
;
outline
:
0
;
padding
:
9px
;
width
:
100%
}
.adyen-checkout__select-list__item
:first-child
{
border-top
:
0
}
.adyen-checkout__select-list__item
:active
,
.adyen-checkout__select-list__item
:focus
,
.adyen-checkout__select-list__item
:hover
{
background
:
rgba
(
145
,
215
,
255
,
.5
)
}
.adyen-checkout__select-list__item--selected
{
background
:
rgba
(
145
,
215
,
255
,
.5
);
font-weight
:
700
}
.adyen-checkout__input
{
background
:
#fff
;
border
:
1px
solid
#b9c4c9
;
border-radius
:
3px
;
color
:
#001b2b
;
display
:
block
;
font-family
:
inherit
;
font-size
:
16px
;
height
:
40px
;
outline
:
none
;
padding
:
5px
8px
;
position
:
relative
;
transition
:
border
.2s
ease-out
,
box-shadow
.2s
ease-out
;
width
:
200px
}
.adyen-checkout__input
:required
{
box-shadow
:
none
}
.adyen-checkout__input-wrapper
{
display
:
inline-block
;
position
:
relative
}
.adyen-checkout__input-wrapper--block
{
display
:
block
}
.adyen-checkout-input__inline-validation
{
-webkit-transform
:
translateY
(
-50%
);
height
:
16px
;
position
:
absolute
;
right
:
14px
;
top
:
50%
;
transform
:
translateY
(
-50%
);
width
:
16px
}
.adyen-checkout-input__inline-validation--valid
{
color
:
#039450
}
.adyen-checkout-input__inline-validation--invalid
{
color
:
#d10244
}
.adyen-checkout__input.adyen-checkout__input--small
{
width
:
130px
}
.adyen-checkout__input.adyen-checkout__input--large
{
width
:
300px
}
.adyen-checkout__input.adyen-checkout__input--invalid
{
border-color
:
#d10244
}
.adyen-checkout__input.adyen-checkout__input--valid
{
border-bottom-color
:
#04ba65
}
.adyen-checkout__input--error
{
border-color
:
#d0021b
}
.adyen-checkout__input
::-webkit-input-placeholder
{
color
:
#90a2bd
;
font-weight
:
200
}
.adyen-checkout__input
:-ms-input-placeholder
{
color
:
#90a2bd
;
font-weight
:
200
}
.adyen-checkout__input
::-ms-input-placeholder
{
color
:
#90a2bd
;
font-weight
:
200
}
.adyen-checkout__input
::placeholder
{
color
:
#90a2bd
;
font-weight
:
200
}
.adyen-checkout__input--active
,
.adyen-checkout__input
:active
,
.adyen-checkout__input
:focus
{
border
:
1px
solid
#00a3ff
;
box-shadow
:
0
0
0
2px
#91d7ff
}
.adyen-checkout__input
[
readonly
]
{
background-color
:
#e6e9eb
;
border-color
:
transparent
;
color
:
#687282
;
cursor
:
default
}
.adyen-checkout__fieldset
{
color
:
#687282
;
display
:
block
;
padding-bottom
:
30px
;
width
:
100%
}
.adyen-checkout__fieldset__title
{
color
:
#687282
;
display
:
block
;
font-size
:
11px
;
font-weight
:
700
;
letter-spacing
:
1px
;
margin
:
0
;
padding
:
0
0
20px
;
text-transform
:
uppercase
}
.adyen-checkout__fieldset--readonly
{
color
:
#001b2b
;
font-size
:
13px
;
line-height
:
19px
;
margin
:
0
}
.adyen-checkout__open-invoice
.adyen-checkout__checkbox--consent-checkbox
{
max-width
:
540px
}
.adyen-checkout__open-invoice
.adyen-checkout__checkbox
+
.adyen-checkout__open-invoice
.adyen-checkout__fieldset
{
padding-top
:
30px
}
}
.adyen-checkout__open-invoice
.adyen-checkout__checkbox--consent-checkbox
{
.adyen-checkout__open-invoice
.adyen-checkout__checkbox--consent-checkbox
{
max-width
:
540px
max-width
:
540px
}
}
.adyen-checkout__open-invoice
.adyen-checkout__checkbox
+
.adyen-checkout__open-invoice
.adyen-checkout__fieldset
{
padding-top
:
30px
}
.adyen-checkout__open-invoice
.adyen-checkout__checkbox
{
.adyen-checkout__open-invoice
.adyen-checkout__checkbox
{
margin
:
0
0
20px
margin
:
0
0
20px
}
}
.adyen-checkout__link--more-information
{
.adyen-checkout__applepay__button
{
font-size
:
.81em
height
:
40px
;
}
width
:
240px
.adyen-checkout__applepay__button
{
}
height
:
40px
;
width
:
240px
.adyen-checkout__card-input__form
{
}
transition
:
opacity
.25s
ease-out
.adyen-checkout__card-input__form
{
}
transition
:
opacity
.25s
ease-out
}
.adyen-checkout__card__exp-cvc
{
.adyen-checkout__card__exp-cvc
{
display
:
flex
display
:
flex
}
}
.adyen-checkout__card__cardNumber
{
.adyen-checkout__card__cardNumber
{
max-width
:
400px
max-width
:
400px
}
}
.adyen-checkout__card__cardNumber__input
{
padding
:
5px
8px
5px
57px
.adyen-checkout__card__cardNumber__input
{
}
padding
:
5px
8px
5px
57px
.adyen-checkout__card__exp-date__input--oneclick
{
}
font-weight
:
400
;
height
:
40px
;
.adyen-checkout__card__exp-date__input--oneclick
{
line-height
:
40px
font-weight
:
400
;
}
height
:
40px
;
.adyen-checkout__card__exp-cvc
.adyen-checkout__field
{
line-height
:
40px
margin-bottom
:
0
;
}
margin-right
:
32px
}
.adyen-checkout__card__exp-cvc
.adyen-checkout__field
{
.adyen-checkout__card-input
.adyen-checkout__store-details
{
margin-bottom
:
0
;
margin-top
:
16px
margin-right
:
24px
}
}
.adyen-checkout__giropay__results
{
background
:
#fff
;
.adyen-checkout__card-input
.adyen-checkout__store-details
{
border
:
1px
solid
#b9c4c9
;
margin-top
:
16px
border-radius
:
6px
;
}
max-height
:
140px
;
min-height
:
100px
;
.adyen-checkout__giropay__results
{
min-width
:
300px
;
background
:
#fff
;
overflow-y
:
scroll
;
border
:
1px
solid
#b9c4c9
;
width
:
100%
border-radius
:
4px
;
}
max-height
:
140px
;
.adyen-checkout__giropay__no-results
{
min-height
:
100px
;
color
:
#687282
;
overflow-y
:
scroll
;
display
:
block
;
width
:
100%
font-size
:
.81em
;
}
padding
:
0
0
0
2px
}
.adyen-checkout__giropay__no-results
{
.adyen-checkout__giropay__placeholder
{
color
:
#687282
;
color
:
#b9c4c9
;
display
:
block
;
display
:
block
;
font-size
:
13px
;
font-weight
:
200
;
padding
:
0
0
0
2px
padding
:
0
0
0
2px
}
}
.adyen-checkout__giropay__loading
{
.adyen-checkout__giropay__placeholder
{
display
:
block
;
color
:
#90a2bd
;
min-height
:
100px
display
:
block
;
}
font-weight
:
200
;
.adyen-checkout__giropay__loading
.adyen-checkout__spinner__wrapper
{
padding
:
0
0
0
2px
display
:
inline-block
;
}
vertical-align
:
middle
}
.adyen-checkout__giropay__loading
{
.adyen-checkout__giropay__loading-text
{
display
:
block
;
color
:
#687282
;
min-height
:
100px
font-size
:
.81em
;
}
line-height
:
16px
;
vertical-align
:
middle
.adyen-checkout__giropay__loading
.adyen-checkout__spinner__wrapper
{
}
display
:
inline-block
;
.adyen-checkout__giropay__error
{
vertical-align
:
middle
color
:
#d10244
;
}
font-size
:
.81em
}
.adyen-checkout__giropay__loading-text
{
.adyen-checkout__button
{
color
:
#687282
;
background
:
#00112c
;
font-size
:
13px
;
border
:
0
;
line-height
:
16px
;
border-radius
:
6px
;
vertical-align
:
middle
box-shadow
:
0
3px
4px
rgba
(
0
,
15
,
45
,
.2
);
}
color
:
#fff
;
cursor
:
pointer
;
.adyen-checkout__giropay__error
{
font-size
:
1em
;
color
:
#d0021b
;
font-weight
:
700
;
font-size
:
13px
height
:
48px
;
}
margin
:
0
;
padding
:
15px
;
.adyen-checkout__phone-input
{
transition
:
background
.3s
ease-out
;
display
:
flex
width
:
100%
}
}
.adyen-checkout__button
:disabled
{
.adyen-checkout__phone-input__prefix
{
-moz-user-select
:
all
;
margin-right
:
.5em
-ms-user-select
:
all
;
}
-webkit-user-select
:
all
;
background
:
#e6e9eb
;
.adyen-checkout__phone-input
.adyen-checkout__field
{
box-shadow
:
none
;
margin-bottom
:
0
cursor
:
not-allowed
;
}
user-select
:
all
}
.adyen-checkout__iban-input__number
{
.adyen-checkout__button--loading
{
padding
:
5px
36px
5px
8px
;
-moz-user-select
:
none
;
text-transform
:
uppercase
-ms-user-select
:
none
;
}
-webkit-user-select
:
none
;
background
:
#687282
;
.adyen-checkout__threeds2__challenge-container
{
box-shadow
:
none
;
background-color
:
transparent
;
outline
:
0
;
box-sizing
:
border-box
;
pointer-events
:
none
;
display
:
block
;
user-select
:
none
overflow
:
auto
;
}
width
:
100%
.adyen-checkout__button
.adyen-checkout__spinner
{
}
border-color
:
transparent
#fff
#fff
;
border-width
:
3px
.adyen-checkout__threeds2__challenge-container--01
{
}
height
:
400px
;
.adyen-checkout__button__content
{
width
:
250px
align-items
:
center
;
}
display
:
flex
;
justify-content
:
center
.adyen-checkout__threeds2__challenge-container--02
{
}
height
:
400px
;
.adyen-checkout__phone-input
{
width
:
390px
display
:
flex
}
}
.adyen-checkout__phone-input__prefix
{
.adyen-checkout__threeds2__challenge-container--03
{
margin-bottom
:
0
;
height
:
600px
;
margin-right
:
.5em
width
:
500px
}
}
.adyen-checkout__input--phone-number
{
margin-bottom
:
0
.adyen-checkout__threeds2__challenge-container--04
{
}
height
:
400px
;
.adyen-checkout__iban-input__number
{
width
:
600px
padding
:
5px
36px
5px
8px
;
}
text-transform
:
uppercase
}
.adyen-checkout__threeds2_challenge-container--05
{
.adyen-checkout__threeds2__challenge
,
.adyen-checkout__threeds2__challenge-container
{
height
:
100%
;
background-color
:
transparent
;
width
:
100%
box-sizing
:
border-box
;
}
display
:
block
;
overflow
:
auto
;
.adyen-checkout__wechatpay
{
width
:
100%
background
:
#fff
;
}
border
:
1px
solid
#dde1e3
;
.adyen-checkout__threeds2__challenge-container--01
{
border-radius
:
3px
;
height
:
400px
;
min-height
:
443px
;
width
:
250px
padding
:
40px
;
}
text-align
:
center
.adyen-checkout__threeds2__challenge-container--02
{
}
height
:
400px
;
width
:
390px
.adyen-checkout__wechatpay__brand-logo
{
}
height
:
20px
;
.adyen-checkout__threeds2__challenge-container--03
{
width
:
109px
height
:
600px
;
}
width
:
500px
}
.adyen-checkout__wechatpay__subtitle
{
.adyen-checkout__threeds2__challenge-container--04
{
margin-top
:
32px
height
:
400px
;
}
width
:
600px
}
.adyen-checkout__wechatpay__payment_amount
,
.adyen-checkout__wechatpay__subtitle
{
.adyen-checkout__threeds2_challenge-container--05
{
color
:
#001b2b
;
height
:
100%
;
font-size
:
16px
;
width
:
100%
line-height
:
19px
}
}
.adyen-checkout__threeds2__challenge.adyen-checkout__threeds2__challenge--05
{
overflow
:
hidden
;
.adyen-checkout__wechatpay__progress
{
padding-top
:
56.25%
;
background
:
#d4d9db
;
position
:
relative
border-radius
:
25px
;
}
height
:
4px
;
.adyen-checkout__threeds2__challenge.adyen-checkout__threeds2__challenge--05
.adyen-checkout__iframe--threeDSIframe
{
margin
:
32px
auto
12px
;
border
:
0
;
padding-right
:
3%
;
height
:
100%
;
width
:
152px
left
:
0
;
}
position
:
absolute
;
top
:
0
;
.adyen-checkout__wechatpay__progress
>
span
{
width
:
100%
background
:
#00a3ff
;
}
border-radius
:
25px
;
.adyen-checkout__qr-loader
{
display
:
block
;
background
:
#fff
;
height
:
100%
border
:
1px
solid
#d4d9db
;
}
border-radius
:
6px
;
padding
:
40px
;
.adyen-checkout__wechatpay__countdown
{
text-align
:
center
color
:
#687282
;
}
font-size
:
13px
.adyen-checkout__qr-loader--app
{
}
border
:
0
;
border-radius
:
0
;
.adyen-checkout__wechatpay
.adyen-checkout__spinner__wrapper
{
padding
:
0
margin
:
60px
0
}
}
.adyen-checkout__qr-loader__brand-logo
{
max-height
:
50px
;
.adyen-checkout__alert
{
width
:
110px
align-items
:
flex-start
;
}
background-color
:
#00a3ff
;
.adyen-checkout__qr-loader__subtitle
{
border-radius
:
3px
;
margin-top
:
32px
color
:
#fff
;
}
display
:
flex
;
.adyen-checkout__qr-loader__payment_amount
,
.adyen-checkout__qr-loader__subtitle
{
justify-content
:
space-between
;
color
:
#00112c
;
line-height
:
1
;
font-size
:
1em
;
margin
:
0
;
line-height
:
19px
padding
:
12px
}
}
.adyen-checkout__qr-loader__payment_amount
{
font-weight
:
700
.adyen-checkout__alert--error
{
}
background-color
:
#d81b4a
.adyen-checkout__qr-loader__progress
{
}
background
:
#d4d9db
;
border-radius
:
25px
;
.adyen-checkout__alert--success
{
height
:
4px
;
background-color
:
#0abf53
margin
:
32px
auto
12px
;
}
padding-right
:
3%
;
width
:
152px
.adyen-checkout__alert--info
{
}
background-color
:
#00a3ff
.adyen-checkout__qr-loader__percentage
{
}
background
:
#06f
;
border-radius
:
25px
;
.adyen-checkout__sdk
,
.adyen-checkout__sdk
*,
.adyen-checkout__sdk
*
:before
,
.adyen-checkout__sdk
:after
{
display
:
block
;
box-sizing
:
border-box
height
:
100%
}
}
.adyen-checkout__qr-loader__countdown
{
.adyen-checkout__payment-methods-list
{
color
:
#687282
;
border-radius
:
3px
font-size
:
.81em
}
}
.adyen-checkout__qr-loader
>
.adyen-checkout__spinner__wrapper
{
.adyen-checkout__payment-methods-list--loading
{
margin
:
60px
0
-moz-user-select
:
none
;
}
-ms-user-select
:
none
;
.adyen-checkout__qr-loader__separator__label
{
-webkit-user-select
:
none
;
background
:
#fff
;
pointer-events
:
none
;
border-radius
:
100%
;
user-select
:
none
color
:
#687282
;
display
:
inline-block
;
height
:
34px
;
line-height
:
34px
;
position
:
relative
;
width
:
34px
;
z-index
:
1
}
.adyen-checkout__qr-loader__separator__line
{
-webkit-transform
:
translateY
(
-17px
);
border-top
:
1px
solid
#d4d9db
;
display
:
block
;
transform
:
translateY
(
-17px
)
}
.adyen-checkout__button.adyen-checkout__button--qr-loader
{
display
:
block
;
text-decoration
:
none
}
.adyen-checkout__voucher-result
{
background
:
#fff
;
border
:
1px
solid
#d4d9db
;
border-radius
:
6px
;
box-sizing
:
border-box
;
padding
:
20px
16px
56px
;
text-align
:
center
}
.adyen-checkout__voucher-result__image
{
align-items
:
center
;
display
:
flex
;
justify-content
:
center
;
margin-bottom
:
16px
;
width
:
100%
}
.adyen-checkout__voucher-result__image__wrapper
{
display
:
inline-block
;
padding
:
8px
;
width
:
120px
}
.adyen-checkout__voucher-result__image__wrapper
:nth-child
(
2
)
{
border-left
:
1px
solid
#d4d9db
}
.adyen-checkout__voucher-result__image__brand
,
.adyen-checkout__voucher-result__image__issuer
{
height
:
34px
}
.adyen-checkout__voucher-result__image__brand
{
height
:
60px
}
.adyen-checkout__voucher-result__introduction
{
color
:
#00112c
;
font-size
:
.81em
;
line-height
:
19px
;
margin
:
0
auto
;
max-width
:
400px
;
text-align
:
center
}
.adyen-checkout__voucher-result__amount
{
color
:
#00112c
;
font-size
:
1em
;
font-weight
:
700
;
margin
:
24px
auto
0
;
text-align
:
center
}
.adyen-checkout__voucher-result__surcharge
{
color
:
#687282
;
display
:
block
;
font-size
:
.81em
;
font-weight
:
400
;
line-height
:
19px
;
text-align
:
center
}
.adyen-checkout__voucher-result__code__label
{
-moz-user-select
:
none
;
-ms-user-select
:
none
;
-webkit-user-select
:
none
;
display
:
block
;
font-weight
:
400
;
left
:
0
;
margin
:
0
auto
;
position
:
absolute
;
right
:
0
;
top
:
-14px
;
user-select
:
none
;
width
:
auto
}
.adyen-checkout__voucher-result__code__label__text
{
background
:
#fff
;
color
:
#00112c
;
font-size
:
13px
;
padding
:
0
8px
}
.adyen-checkout__voucher-result__code
{
-moz-user-select
:
all
;
-ms-user-select
:
all
;
-webkit-user-select
:
all
;
border
:
1px
solid
#e6e9eb
;
border-radius
:
6px
;
color
:
#00112c
;
display
:
inline-block
;
font-size
:
1.5em
;
font-weight
:
700
;
letter-spacing
:
1px
;
line-height
:
19px
;
margin
:
20px
auto
16px
;
max-width
:
100%
;
min-width
:
200px
;
padding
:
28px
48px
24px
;
position
:
relative
;
text-align
:
center
;
user-select
:
all
;
width
:
300px
}
.adyen-checkout__voucher-result__details
{
list-style
:
none
;
margin
:
8px
auto
0
;
max-width
:
300px
;
padding
:
0
}
.adyen-checkout__voucher-result__details__item
{
color
:
#00112c
;
display
:
flex
;
font-size
:
.81em
;
justify-content
:
space-between
;
margin-bottom
:
16px
;
word-break
:
break-word
}
.adyen-checkout__voucher-result__details__item
:last-child
{
margin-bottom
:
0
}
.adyen-checkout__voucher-result__details__label
{
max-width
:
50%
;
text-align
:
left
}
.adyen-checkout__voucher-result__details__value
{
font-weight
:
700
;
max-width
:
50%
;
text-align
:
right
}
.adyen-checkout__payment-method
{
background
:
#fff
;
border
:
1px
solid
#d4d9db
;
cursor
:
pointer
;
margin-top
:
-1px
;
position
:
relative
;
transition
:
opacity
.3s
ease-out
;
width
:
100%
}
.adyen-checkout__payment-method
:focus
{
outline
:
0
}
.adyen-checkout__payment-method--selected
+
.adyen-checkout__payment-method
,
.adyen-checkout__payment-method
:first-child
{
border-top-left-radius
:
6px
;
border-top-right-radius
:
6px
;
margin-top
:
0
}
.adyen-checkout__payment-method--next-selected
,
.adyen-checkout__payment-method
:last-child
{
border-bottom-left-radius
:
6px
;
border-bottom-right-radius
:
6px
;
margin-bottom
:
0
}
.adyen-checkout__payment-method--loading
{
opacity
:
.2
}
.adyen-checkout__payment-method--selected.adyen-checkout__payment-method--loading
{
opacity
:
.9
}
.adyen-checkout__payment-method--disabling
{
opacity
:
.5
}
.adyen-checkout__payment-method__header
{
align-items
:
center
;
color
:
#00112c
;
display
:
flex
;
font-size
:
1em
;
font-weight
:
400
;
padding
:
16px
;
position
:
relative
;
transition
:
background
.1s
ease-out
;
width
:
100%
}
.adyen-checkout__payment-method__surcharge
{
color
:
#687282
;
margin-left
:
5px
}
.adyen-checkout__payment-method--selected
{
background
:
#f7f8f9
;
border
:
1px
solid
#d4d9db
;
border-radius
:
6px
;
cursor
:
default
;
margin
:
8px
0
;
transition
:
margin
.15s
cubic-bezier
(
.4
,
0
,
.2
,
1
)
0ms
,
opacity
.3s
ease-out
}
.adyen-checkout__payment-method__name--selected
{
font-weight
:
500
}
.adyen-checkout__payment-method__details
{
padding
:
0
16px
}
.adyen-checkout__payment-method__details__content
{
margin
:
6px
0
22px
}
.adyen-checkout__payment-method__image__wrapper
{
height
:
26px
;
position
:
relative
}
.adyen-checkout__payment-method__image__wrapper
:after
{
border
:
1px
solid
rgba
(
0
,
27
,
43
,
.17
);
border-radius
:
3px
;
content
:
""
;
height
:
100%
;
left
:
0
;
position
:
absolute
;
top
:
0
;
width
:
100%
}
.adyen-checkout__payment-method__image
{
border-radius
:
3px
}
.adyen-checkout__payment-method__disable-confirmation
{
align-items
:
center
;
background
:
#e6e9eb
;
color
:
#00112c
;
display
:
flex
;
font-size
:
.94em
;
justify-content
:
space-between
;
margin-bottom
:
10px
;
padding
:
8px
16px
}
.adyen-checkout__payment-method__disable-confirmation__buttons
{
display
:
flex
}
.adyen-checkout__payment-method__disable-confirmation__button
{
border
:
1px
solid
transparent
;
border-radius
:
6px
;
cursor
:
pointer
;
font-size
:
.81em
;
line-height
:
15px
;
margin
:
0
0
0
8px
;
padding
:
8px
}
.adyen-checkout__payment-method__disable-confirmation__button--remove
{
background
:
#d10244
;
border-color
:
#d10244
;
color
:
#fff
}
.adyen-checkout__payment-method__disable-confirmation__button--cancel
{
background
:
transparent
;
border-color
:
#00112c
;
color
:
#00112c
}
.adyen-checkout__payment-method__radio
{
background-color
:
#fff
;
border
:
1px
solid
#b9c4c9
;
border-radius
:
50%
;
box-shadow
:
inset
0
1px
3px
rgba
(
0
,
27
,
43
,
.15
);
height
:
18px
;
position
:
absolute
;
right
:
20px
;
transition
:
border-color
.3s
ease-out
;
width
:
18px
}
.adyen-checkout__payment-method__radio
:after
{
-webkit-transform
:
translateY
(
-50%
)
scale
(
0
);
background-color
:
#fff
;
border-radius
:
50%
;
box-shadow
:
0
1px
1px
rgba
(
0
,
15
,
45
,
.25
);
content
:
""
;
display
:
block
;
height
:
6px
;
left
:
0
;
margin
:
0
auto
;
position
:
absolute
;
right
:
0
;
top
:
50%
;
transform
:
translateY
(
-50%
)
scale
(
0
);
transition
:
-webkit-transform
.3s
ease-out
;
transition
:
transform
.3s
ease-out
;
transition
:
transform
.3s
ease-out
,
-webkit-transform
.3s
ease-out
;
width
:
6px
}
.adyen-checkout__payment-method__radio
:hover
{
border-color
:
#06f
;
cursor
:
pointer
}
.adyen-checkout__payment-method__radio--selected
{
background-color
:
#06f
;
border
:
0
;
box-shadow
:
inset
0
1px
2px
rgba
(
0
,
0
,
0
,
.26
);
transition
:
all
.3s
ease-out
}
.adyen-checkout__payment-method__radio--selected
:after
{
-webkit-transform
:
translateY
(
-50%
)
scale
(
1
);
transform
:
translateY
(
-50%
)
scale
(
1
)
}
.adyen-checkout__button--pay
{
margin-bottom
:
16px
}
.adyen-checkout__status
{
align-items
:
center
;
background-color
:
#fff
;
border
:
1px
solid
#d4d9db
;
border-radius
:
6px
;
color
:
#001b2b
;
display
:
flex
;
flex-direction
:
column
;
font-size
:
16px
;
height
:
350px
;
justify-content
:
center
;
margin
:
0
;
padding
:
32px
;
text-align
:
center
}
.adyen-checkout__status__icon
{
margin-bottom
:
24px
}
.adyen-checkout__dropin
,
.adyen-checkout__dropin
*,
.adyen-checkout__dropin
:after
,
.adyen-checkout__dropin
:before
{
box-sizing
:
border-box
}
.adyen-checkout__payment-methods-list--loading
{
-moz-user-select
:
none
;
-ms-user-select
:
none
;
-webkit-user-select
:
none
;
pointer-events
:
none
;
user-select
:
none
}
.adyen-checkout__link
{
color
:
#06f
;
text-decoration
:
none
}
.adyen-checkout__link
:hover
{
text-decoration
:
underline
}
}
/* Checkout component Adyen styling end */
.adyen-checkout__link
{
color
:
#687282
;
font-size
:
13px
;
text-decoration
:
underline
}
/* never show the close button as this will result in errors */
/* never show the close button as this will result in errors */
.threeDS2Modal
.action-close
{
display
:
none
;
}
.threeDS2Modal
.action-close
{
display
:
none
;
}
/* Checkout component Adyen styling end */
view/frontend/web/js/view/payment/method-renderer/adyen-cc-method.js
View file @
77373c29
...
@@ -84,7 +84,6 @@ define(
...
@@ -84,7 +84,6 @@ define(
'
expiryYear
'
,
'
expiryYear
'
,
'
installment
'
,
'
installment
'
,
'
creditCardDetailsValid
'
,
'
creditCardDetailsValid
'
,
'
variant
'
,
'
placeOrderAllowed
'
'
placeOrderAllowed
'
]);
]);
...
@@ -119,7 +118,7 @@ define(
...
@@ -119,7 +118,7 @@ define(
self
.
cardComponent
=
self
.
checkout
.
create
(
'
card
'
,
{
self
.
cardComponent
=
self
.
checkout
.
create
(
'
card
'
,
{
originKey
:
self
.
getOriginKey
(),
originKey
:
self
.
getOriginKey
(),
loadingContext
:
self
.
getLoadingContex
t
(),
environment
:
self
.
getCheckoutEnvironmen
t
(),
type
:
'
card
'
,
type
:
'
card
'
,
hasHolderName
:
true
,
hasHolderName
:
true
,
holderNameRequired
:
true
,
holderNameRequired
:
true
,
...
@@ -128,13 +127,12 @@ define(
...
@@ -128,13 +127,12 @@ define(
onChange
:
function
(
state
,
component
)
{
onChange
:
function
(
state
,
component
)
{
if
(
!!
state
.
isValid
&&
!
component
.
state
.
errors
.
encryptedSecurityCode
)
{
if
(
!!
state
.
isValid
&&
!
component
.
state
.
errors
.
encryptedSecurityCode
)
{
self
.
storeCc
=
!!
state
.
data
.
storeDetails
;
self
.
storeCc
=
!!
state
.
data
.
storePaymentMethod
;
self
.
variant
(
state
.
brand
);
self
.
creditCardNumber
(
state
.
data
.
paymentMethod
.
encryptedCardNumber
);
self
.
creditCardNumber
(
state
.
data
.
encryptedCardNumber
);
self
.
expiryMonth
(
state
.
data
.
paymentMethod
.
encryptedExpiryMonth
);
self
.
expiryMonth
(
state
.
data
.
encryptedExpiryMonth
);
self
.
expiryYear
(
state
.
data
.
paymentMethod
.
encryptedExpiryYear
);
self
.
expiryYear
(
state
.
data
.
encryptedExpiryYear
);
self
.
securityCode
(
state
.
data
.
paymentMethod
.
encryptedSecurityCode
);
self
.
securityCode
(
state
.
data
.
encryptedSecurityCode
);
self
.
creditCardOwner
(
state
.
data
.
paymentMethod
.
holderName
);
self
.
creditCardOwner
(
state
.
data
.
holderName
);
self
.
creditCardDetailsValid
(
true
);
self
.
creditCardDetailsValid
(
true
);
self
.
placeOrderAllowed
(
true
);
self
.
placeOrderAllowed
(
true
);
}
else
{
}
else
{
...
@@ -269,7 +267,7 @@ define(
...
@@ -269,7 +267,7 @@ define(
/**
/**
* Builds the payment details part of the payment information reqeust
* Builds the payment details part of the payment information reqeust
*
*
* @returns {{method: *, additional_data: {c
ard_brand: *, cc_type: *, number: *, cvc: *, expiryMonth: *, expiryYear: *, holderName: *, store_cc: (boolean|*), number_of_installments: *, java_enabled: boolean, screen_color_depth: number, screen_width, screen_height, timezone_offset
: *}}}
* @returns {{method: *, additional_data: {c
c_type: *, number: *, cvc: *, expiryMonth: *, expiryYear: *, holderName: *, store_cc: (boolean|*), number_of_installments: *, java_enabled: () => boolean, screen_color_depth: number, screen_width, screen_height, timezone_offset: *, language
: *}}}
*/
*/
getCcData
:
function
()
{
getCcData
:
function
()
{
const
browserInfo
=
threeDS2Utils
.
getBrowserInfo
();
const
browserInfo
=
threeDS2Utils
.
getBrowserInfo
();
...
@@ -277,7 +275,6 @@ define(
...
@@ -277,7 +275,6 @@ define(
var
data
=
{
var
data
=
{
'
method
'
:
this
.
item
.
method
,
'
method
'
:
this
.
item
.
method
,
additional_data
:
{
additional_data
:
{
'
card_brand
'
:
this
.
variant
(),
'
cc_type
'
:
this
.
creditCardType
(),
'
cc_type
'
:
this
.
creditCardType
(),
'
number
'
:
this
.
creditCardNumber
(),
'
number
'
:
this
.
creditCardNumber
(),
'
cvc
'
:
this
.
securityCode
(),
'
cvc
'
:
this
.
securityCode
(),
...
@@ -306,7 +303,6 @@ define(
...
@@ -306,7 +303,6 @@ define(
return
{
return
{
'
method
'
:
this
.
item
.
method
,
'
method
'
:
this
.
item
.
method
,
additional_data
:
{
additional_data
:
{
'
card_brand
'
:
this
.
variant
(),
'
cc_type
'
:
this
.
creditCardType
(),
'
cc_type
'
:
this
.
creditCardType
(),
'
store_cc
'
:
this
.
storeCc
,
'
store_cc
'
:
this
.
storeCc
,
'
number_of_installments
'
:
this
.
installment
()
'
number_of_installments
'
:
this
.
installment
()
...
@@ -454,8 +450,8 @@ define(
...
@@ -454,8 +450,8 @@ define(
getOriginKey
:
function
()
{
getOriginKey
:
function
()
{
return
window
.
checkoutConfig
.
payment
.
adyenCc
.
originKey
;
return
window
.
checkoutConfig
.
payment
.
adyenCc
.
originKey
;
},
},
get
LoadingContex
t
:
function
()
{
get
CheckoutEnvironmen
t
:
function
()
{
return
window
.
checkoutConfig
.
payment
.
adyenCc
.
checkout
Url
;
return
window
.
checkoutConfig
.
payment
.
adyenCc
.
checkout
Environment
;
},
},
getLocale
:
function
()
{
getLocale
:
function
()
{
return
window
.
checkoutConfig
.
payment
.
adyenCc
.
locale
;
return
window
.
checkoutConfig
.
payment
.
adyenCc
.
locale
;
...
...
view/frontend/web/js/view/payment/method-renderer/adyen-hpp-method.js
View file @
77373c29
...
@@ -373,7 +373,7 @@ define(
...
@@ -373,7 +373,7 @@ define(
items
:
result
.
getIssuers
(),
items
:
result
.
getIssuers
(),
onChange
:
function
(
state
)
{
onChange
:
function
(
state
)
{
if
(
!!
state
.
isValid
)
{
if
(
!!
state
.
isValid
)
{
result
.
issuer
(
state
.
data
.
issuer
);
result
.
issuer
(
state
.
data
.
paymentMethod
.
issuer
);
result
.
isPlaceOrderAllowed
(
true
);
result
.
isPlaceOrderAllowed
(
true
);
}
else
{
}
else
{
...
@@ -398,8 +398,8 @@ define(
...
@@ -398,8 +398,8 @@ define(
countryCode
:
self
.
getLocale
(),
countryCode
:
self
.
getLocale
(),
onChange
:
function
(
state
)
{
onChange
:
function
(
state
)
{
if
(
!!
state
.
isValid
)
{
if
(
!!
state
.
isValid
)
{
result
.
ownerName
(
state
.
data
[
"
sepa.ownerName
"
]);
result
.
ownerName
(
state
.
data
.
paymentMethod
[
"
sepa.ownerName
"
]);
result
.
ibanNumber
(
state
.
data
[
"
sepa.ibanNumber
"
]);
result
.
ibanNumber
(
state
.
data
.
paymentMethod
[
"
sepa.ibanNumber
"
]);
result
.
isPlaceOrderAllowed
(
true
);
result
.
isPlaceOrderAllowed
(
true
);
}
else
{
}
else
{
result
.
isPlaceOrderAllowed
(
false
);
result
.
isPlaceOrderAllowed
(
false
);
...
@@ -431,9 +431,9 @@ define(
...
@@ -431,9 +431,9 @@ define(
},
},
onChange
:
function
(
state
)
{
onChange
:
function
(
state
)
{
if
(
!!
state
.
isValid
)
{
if
(
!!
state
.
isValid
)
{
result
.
dob
(
state
.
data
.
personalDetails
.
dateOfBirth
);
result
.
dob
(
state
.
data
.
p
aymentMethod
.
p
ersonalDetails
.
dateOfBirth
);
result
.
telephone
(
state
.
data
.
personalDetails
.
telephoneNumber
);
result
.
telephone
(
state
.
data
.
p
aymentMethod
.
p
ersonalDetails
.
telephoneNumber
);
result
.
gender
(
state
.
data
.
personalDetails
.
gender
);
result
.
gender
(
state
.
data
.
p
aymentMethod
.
p
ersonalDetails
.
gender
);
result
.
isPlaceOrderAllowed
(
true
);
result
.
isPlaceOrderAllowed
(
true
);
}
else
{
}
else
{
result
.
isPlaceOrderAllowed
(
false
);
result
.
isPlaceOrderAllowed
(
false
);
...
@@ -456,9 +456,9 @@ define(
...
@@ -456,9 +456,9 @@ define(
},
},
onChange
:
function
(
state
)
{
onChange
:
function
(
state
)
{
if
(
!!
state
.
isValid
)
{
if
(
!!
state
.
isValid
)
{
result
.
dob
(
state
.
data
.
personalDetails
.
dateOfBirth
);
result
.
dob
(
state
.
data
.
p
aymentMethod
.
p
ersonalDetails
.
dateOfBirth
);
result
.
telephone
(
state
.
data
.
personalDetails
.
telephoneNumber
);
result
.
telephone
(
state
.
data
.
p
aymentMethod
.
p
ersonalDetails
.
telephoneNumber
);
result
.
gender
(
state
.
data
.
personalDetails
.
gender
);
result
.
gender
(
state
.
data
.
p
aymentMethod
.
p
ersonalDetails
.
gender
);
result
.
isPlaceOrderAllowed
(
true
);
result
.
isPlaceOrderAllowed
(
true
);
}
else
{
}
else
{
result
.
isPlaceOrderAllowed
(
false
);
result
.
isPlaceOrderAllowed
(
false
);
...
...
view/frontend/web/js/view/payment/method-renderer/adyen-oneclick-method.js
View file @
77373c29
...
@@ -110,7 +110,7 @@ define(
...
@@ -110,7 +110,7 @@ define(
var
checkout
=
new
AdyenCheckout
({
var
checkout
=
new
AdyenCheckout
({
locale
:
self
.
getLocale
(),
locale
:
self
.
getLocale
(),
originKey
:
self
.
getOriginKey
(),
originKey
:
self
.
getOriginKey
(),
loadingContext
:
self
.
getLoadingContex
t
(),
environment
:
self
.
getCheckoutEnvironmen
t
(),
risk
:
{
risk
:
{
enabled
:
false
enabled
:
false
}
}
...
@@ -256,9 +256,10 @@ define(
...
@@ -256,9 +256,10 @@ define(
isValid
(
true
);
isValid
(
true
);
if
(
typeof
state
.
data
!==
'
undefined
'
&&
if
(
typeof
state
.
data
!==
'
undefined
'
&&
typeof
state
.
data
.
encryptedSecurityCode
!==
'
undefined
'
typeof
state
.
data
.
paymentMethod
!==
'
undefined
'
&&
typeof
state
.
data
.
paymentMethod
.
encryptedSecurityCode
!==
'
undefined
'
)
{
)
{
self
.
encryptedCreditCardVerificationNumber
=
state
.
data
.
encryptedSecurityCode
;
self
.
encryptedCreditCardVerificationNumber
=
state
.
data
.
paymentMethod
.
encryptedSecurityCode
;
}
}
}
else
{
}
else
{
self
.
encryptedCreditCardVerificationNumber
=
''
;
self
.
encryptedCreditCardVerificationNumber
=
''
;
...
@@ -268,14 +269,6 @@ define(
...
@@ -268,14 +269,6 @@ define(
isValid
(
false
);
isValid
(
false
);
}
}
}
}
// When we move to the component v2.2 it should be removed
if
(
self
.
agreement_data
.
variant
==
"
maestro
"
&&
component
.
state
.
errors
.
encryptedSecurityCode
)
{
self
.
placeOrderAllowed
(
false
);
isValid
(
false
);
}
}
}
})
})
.
mount
(
oneClickCardNode
);
.
mount
(
oneClickCardNode
);
...
@@ -566,8 +559,8 @@ define(
...
@@ -566,8 +559,8 @@ define(
getOriginKey
:
function
()
{
getOriginKey
:
function
()
{
return
window
.
checkoutConfig
.
payment
.
adyenOneclick
.
originKey
;
return
window
.
checkoutConfig
.
payment
.
adyenOneclick
.
originKey
;
},
},
get
LoadingContex
t
:
function
()
{
get
CheckoutEnvironmen
t
:
function
()
{
return
window
.
checkoutConfig
.
payment
.
adyenOneclick
.
checkout
Url
;
return
window
.
checkoutConfig
.
payment
.
adyenOneclick
.
checkout
Environment
;
}
}
});
});
}
}
...
...
Write
Preview
Markdown
is supported
0%
Try again
or
attach a new file
Attach a file
Cancel
You are about to add
0
people
to the discussion. Proceed with caution.
Finish editing this message first!
Cancel
Please
register
or
sign in
to comment