Skip to content

A
Adyen Magento2

We will be off from 27/1 (Monday) to 31/1 (Friday) (GMT +7) for our Tet Holiday (Lunar New Year) in our country

Commit e3446216 authored by attilak's avatar attilak
Browse files
Options

Remove CHECKOUT_ENVIRONMENT_URL_LIVE and CHECKOUT_ENVIRONMENT_URL_TEST - 

we are not using them anymore
Use TEST and LIVE instead of CHECKOUT_ENVIRONMENT_URL_TEST and
CHECKOUT_ENVIRONMENT_URL_LIVE
Add styling for admin
Add component version number in the css files as well
parent 3c41d3e6
Hide whitespace changes
Inline Side-by-side
Showing with 553 additions and 390 deletions
Helper/Data.php
View file @ e3446216
...@@ -33,8 +33,6 @@ class Data extends AbstractHelper ...@@ -33,8 +33,6 @@ 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_ENVIRONMENT_URL_LIVE = 'https://checkoutshopper-live.adyen.com/checkoutshopper/';
const CHECKOUT_ENVIRONMENT_URL_TEST = 'https://checkoutshopper-test.adyen.com/checkoutshopper/';
const CHECKOUT_COMPONENT_JS_LIVE = 'https://checkoutshopper-live.adyen.com/checkoutshopper/sdk/3.0.0/adyen.js'; const CHECKOUT_COMPONENT_JS_LIVE = 'https://checkoutshopper-live.adyen.com/checkoutshopper/sdk/3.0.0/adyen.js';
const CHECKOUT_COMPONENT_JS_TEST = 'https://checkoutshopper-test.adyen.com/checkoutshopper/sdk/3.0.0/adyen.js'; const CHECKOUT_COMPONENT_JS_TEST = 'https://checkoutshopper-test.adyen.com/checkoutshopper/sdk/3.0.0/adyen.js';
...@@ -1552,10 +1550,10 @@ class Data extends AbstractHelper ...@@ -1552,10 +1550,10 @@ class Data extends AbstractHelper
public function getCheckoutEnvironment($storeId = null) public function getCheckoutEnvironment($storeId = null)
{ {
if ($this->isDemoMode($storeId)) { if ($this->isDemoMode($storeId)) {
return self::CHECKOUT_ENVIRONMENT_URL_TEST; return self::TEST;
} }
return self::CHECKOUT_ENVIRONMENT_URL_LIVE; return self::LIVE;
} }
/** /**
......
Model/Ui/AdyenCcConfigProvider.php
View file @ e3446216
...@@ -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']['checkoutUrl'] = $this->_adyenHelper->getCheckoutEnvironment($this->storeManager->getStore()->getId()); $config['payment']['adyenCc']['checkoutEnvironment'] = $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 @ e3446216
...@@ -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']['checkoutUrl'] = $this->_adyenHelper->getCheckoutEnvironment($this->_storeManager->getStore()->getId()); $config['payment']['adyenOneclick']['checkoutEnvironment'] = $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/web/css/order_create_styles.css
View file @ e3446216
...@@ -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 #00a3ff; border:2px solid #06f;
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:#00a3ff; border-color:#06f;
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:#00a3ff; background-color:#06f;
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:#001b2b; color:#00112c;
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:#00a3ff; background-color:#06f;
border:1px solid #00a3ff border:1px solid #06f
} }
.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:16px; font-size:1em;
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:3px; border-radius:6px;
font-size:16px; font-size:1em;
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:20px; max-height:26px;
max-width:32px max-width:40px
} }
.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:#00a3ff; border-color:#06f;
box-shadow:0 0 0 2px #91d7ff box-shadow:0 0 0 2px #99c2ff
} }
.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:#001b2b; color:#00112c;
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:3px; border-radius:6px;
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:#00a3ff; border-bottom-color:#06f;
border-top-color:#00a3ff border-top-color:#06f
} }
.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:16px; font-size:1em;
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:3px; border-radius:6px;
color:#001b2b; color:#00112c;
display:block; display:block;
font-family:inherit; font-family:inherit;
font-size:16px; font-size:1em;
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:#039450 color:#0abf53
} }
.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:130px width:134px
} }
.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:#04ba65 border-bottom-color:#0abf53
} }
.adyen-checkout__input--error{ .adyen-checkout__input--error{
border-color:#d0021b border-color:#d10244
} }
.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 #00a3ff; border:1px solid #06f;
box-shadow:0 0 0 2px #91d7ff box-shadow:0 0 0 2px #99c2ff
} }
.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:#001b2b; color:#00112c;
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:24px margin-right:32px
} }
.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:4px; border-radius:6px;
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:#001b2b; color:#00112c;
font-size:16px; font-size:1em;
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:#00a3ff; background:#06f;
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 @ e3446216
...@@ -209,7 +209,7 @@ ...@@ -209,7 +209,7 @@
} }
/* Checkout component Adyen styling start */ /* Checkout component Adyen v3.0.0 styling start */
.adyen-checkout__field{ .adyen-checkout__field{
display:block; display:block;
margin-bottom:16px margin-bottom:16px
......
view/frontend/web/js/view/payment/method-renderer/adyen-cc-method.js
View file @ e3446216
...@@ -455,7 +455,7 @@ define( ...@@ -455,7 +455,7 @@ define(
return window.checkoutConfig.payment.adyenCc.originKey; return window.checkoutConfig.payment.adyenCc.originKey;
}, },
getCheckoutEnvironment: function () { getCheckoutEnvironment: function () {
return window.checkoutConfig.payment.adyenCc.checkoutUrl; return window.checkoutConfig.payment.adyenCc.checkoutEnvironment;
}, },
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-oneclick-method.js
View file @ e3446216
...@@ -560,7 +560,7 @@ define( ...@@ -560,7 +560,7 @@ define(
return window.checkoutConfig.payment.adyenOneclick.originKey; return window.checkoutConfig.payment.adyenOneclick.originKey;
}, },
getCheckoutEnvironment: function () { getCheckoutEnvironment: function () {
return window.checkoutConfig.payment.adyenOneclick.checkoutUrl; return window.checkoutConfig.payment.adyenOneclick.checkoutEnvironment;
} }
}); });
} }
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment