Willkommen bei WordPress. Dies ist dein erster Beitrag. Bearbeite oder lösche ihn und beginne mit dem Schreiben!
Hallo Welt!
von raredesign | Dez 3, 2019 | Allgemein | 0 Kommentare
Cokiee Shell
| Current Path : /var/www/web28/html/wp-content/plugins/wp-statistics/assets/dev/sass/pages/ |
| Current File : //var/www/web28/html/wp-content/plugins/wp-statistics/assets/dev/sass/pages/add-ons.scss |
/*
* WP Statistics Add-Ons Admin page
*/
@media(max-width: 768px) {
.wps_plugins_page-title {
width: 100%;
box-sizing: border-box;
display: flex;
flex-direction: column;
gap: 16px;
}
}
.wps_plugins_page-title {
font-size: 20px;
}
.wps-install-addon-btn {
background: #12121B;
padding: 12px 16px;
gap: 8px;
border-radius: 6px;
color: #FFFFFF !important;
font-size: 14px;
font-weight: 500 !important;
line-height: 16.41px;
display: inline-flex;
margin-left: 24px;
@media(max-width: 768px) {
width: 100%;
margin: 0 !important;
box-sizing: border-box;
justify-content: center;
}
.rtl & {
margin-left: 0;
margin-right: 24px;
}
&:hover {
background: #12121BE5;
}
&:active {
background: #0C0C11;
}
&.disabled {
background: #F1F1F9;
span {
color: #B2B2CF;
}
&:before {
background: url("data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTYiIGhlaWdodD0iMTYiIHZpZXdCb3g9IjAgMCAxNiAxNiIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHBhdGggZD0iTTguNjY2NzEgNi42NjY2N0gxMkw4LjAwMDA0IDEwLjY2NjdMNC4wMDAwNCA2LjY2NjY3SDcuMzMzMzdWMkg4LjY2NjcxVjYuNjY2NjdaTTIuNjY2NzEgMTIuNjY2N0gxMy4zMzM0VjhIMTQuNjY2N1YxMy4zMzMzQzE0LjY2NjcgMTMuNzAxNSAxNC4zNjgyIDE0IDE0IDE0SDIuMDAwMDRDMS42MzE4NSAxNCAxLjMzMzM3IDEzLjcwMTUgMS4zMzMzNyAxMy4zMzMzVjhIMi42NjY3MVYxMi42NjY3WiIgZmlsbD0iI0IyQjJDRiIvPgo8L3N2Zz4K") center center no-repeat;
}
}
&:before {
content: '';
width: 16px;
height: 16px;
background: url("data:image/svg+xml;base64,Cjxzdmcgd2lkdGg9IjE2IiBoZWlnaHQ9IjE2IiB2aWV3Qm94PSIwIDAgMTYgMTYiIGZpbGw9Im5vbmUiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+CjxwYXRoIGQ9Ik04LjY2NjgzIDYuNjY2NjdIMTIuMDAwMkw4LjAwMDE2IDEwLjY2NjdMNC4wMDAxNiA2LjY2NjY3SDcuMzMzNVYySDguNjY2ODNWNi42NjY2N1pNMi42NjY4MyAxMi42NjY3SDEzLjMzMzVWOEgxNC42NjY4VjEzLjMzMzNDMTQuNjY2OCAxMy43MDE1IDE0LjM2ODQgMTQgMTQuMDAwMiAxNEgyLjAwMDE2QzEuNjMxOTggMTQgMS4zMzM1IDEzLjcwMTUgMS4zMzM1IDEzLjMzMzNWOEgyLjY2NjgzVjEyLjY2NjdaIiBmaWxsPSJ3aGl0ZSIvPgo8L3N2Zz4K") center center no-repeat;
}
}
.wps-postbox-addon-container {
width: 764px;
max-width: 100%;
float: left;
margin-right: 20px;
.rtl & {
float: right;
margin-right: 0;
margin-left: 20px;
}
.wps-postbox-addon {
display: flex;
padding: 32px;
gap: 32px;
border: 1px solid #DADCE0;
border-radius: 8px;
box-shadow: none;
flex-direction: column;
background: #fff;
@media(max-width: 768px) {
padding: 32px 16px;
}
& > div {
display: flex;
gap: 12px;
flex-direction: column;
}
&__title {
padding: 0;
margin: 0;
color: #56585A;
gap: 8px;
font-size: 11px;
font-weight: 500;
line-height: 12.89px;
letter-spacing: 0.09em;
text-transform: uppercase;
}
&__items {
display: flex;
gap: 16px;
flex-direction: column;
}
&__item {
padding: 16px;
gap: 16px;
border-radius: 8px;
border: 1px solid #DADCE0;
position: relative;
& > div:first-child {
display: flex;
align-items: flex-start;
justify-content: space-between;
@media(max-width: 768px) {
flex-direction: column;
align-items: flex-end;
padding-bottom: 40px;
.wps-postbox-addon__item--info {
order: 2;
display: block;
width: 100%;
}
.wps-postbox-addon__item--actions {
order: 1;
gap: 8px;
align-items: self-start;
height: calc(100% - 32px);
}
}
}
&--info {
display: flex;
gap: 16px;
&__img {
background: #404BF214;
padding: 8px;
border-radius: 6px;
width: 48px;
min-width: 48px;
height: 48px;
align-items: center;
display: flex;
justify-content: center;
box-sizing: border-box;
@media(max-width: 768px) {
margin-bottom: 8px;
}
a, img {
width: 24px;
min-width: 24px;
height: 24px;
}
}
&__text {
display: flex;
gap: 4px;
flex-direction: column;
}
&__title {
a {
color: #0C0C0D;
font-size: 15px;
font-weight: 500;
line-height: 17.58px;
display: flex;
gap: 4px;
align-items: center;
white-space: nowrap;
}
color: #0C0C0D;
font-size: 15px;
font-weight: 500;
line-height: 17.58px;
min-height: 27px;
display: flex;
align-items: center;
gap: 8px;
flex-wrap: wrap;
span.wps-postbox-addon__version {
color: #898A8E;
font-size: 11px;
display: inline-block;
font-weight: 400;
line-height: 16px;
}
}
&__desc {
color: #717274;
font-size: 13px;
font-weight: 400;
line-height: 16px;
margin: 0 !important;
}
}
&.active {
.wps-addon__item__license {
display: flex;
}
}
.wps-addon__item__license {
border-top: 1px solid #EEEFF1;
gap: 16px;
flex-direction: column;
padding-top: 16px;
margin-top: 16px;
display: none;
.wps-addon__item__update_license {
display: flex;
gap: 16px;
justify-content: space-between;
@media(max-width: 768px) {
flex-direction: column;
}
input {
padding: 10px 14px !important;
border-radius: 3px;
border: 1px solid #DADCE0 !important;
font-size: 14px;
font-weight: 400;
width: 100%;
&::placeholder {
color: #8F9093;
}
&.wps-danger {
border: 1px solid #D63638 !important;
box-shadow: 0 0 0 3px #D6363833;
outline: 2px solid rgba(0, 0, 0, 0);
}
&.wps-warning {
border: 1px solid #EE8B44 !important;
box-shadow: 0 0 0 3px #EE8B4433;
outline: 2px solid rgba(0, 0, 0, 0);
}
&:focus, &:active {
border: 1px solid #404BF2 !important;
box-shadow: 0 0 0 3px #404BF233;
outline: 2px solid rgba(0, 0, 0, 0);
}
}
button {
padding: 8px 16px;
gap: 6px;
border-radius: 4px;
background: #12121B;
font-size: 14px;
font-weight: 500;
line-height: 22px;
color: #FFFFFF;
white-space: nowrap;
cursor: pointer;
display: inline-flex;
align-items: center;
justify-content: center;
border: none;
&.redirecting {
background: transparent !important;
color: #56585A !important;
font-size: 14px;
font-weight: 500;
opacity: 1;
border: none;
&:after {
content: '';
display: inline-block;
width: 16px;
height: 16px;
-webkit-animation-name: wps-cycle;
-webkit-animation-duration: 2s;
-webkit-animation-iteration-count: infinite;
-webkit-animation-fill-mode: forwards;
animation-name: wps-cycle;
animation-duration: 2s;
animation-iteration-count: infinite;
animation-fill-mode: forwards;
-moz-animation-name: wps-cycle;
-moz-animation-duration: 2s;
-moz-animation-iteration-count: infinite;
-moz-animation-fill-mode: forwards;
background: url("data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTYiIGhlaWdodD0iMTYiIHZpZXdCb3g9IjAgMCAxNiAxNiIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHBhdGggZD0iTTMuNjQxNzIgMi45NTM3OEM0LjgxMDM4IDEuOTQzMjggNi4zMzM4MSAxLjMzMjAzIDguMDAwMDEgMS4zMzIwM0MxMS42ODE5IDEuMzMyMDMgMTQuNjY2NyA0LjMxNjggMTQuNjY2NyA3Ljk5ODdDMTQuNjY2NyA5LjQyMjc2IDE0LjIyMDEgMTAuNzQyNiAxMy40NTk1IDExLjgyNThMMTEuMzMzMyA3Ljk5ODdIMTMuMzMzM0MxMy4zMzMzIDUuMDUzMTggMTAuOTQ1NSAyLjY2NTM2IDguMDAwMDEgMi42NjUzNkM2LjU2NjU2IDIuNjY1MzYgNS4yNjUxOSAzLjIzMDg4IDQuMzA2ODMgNC4xNTA5OEwzLjY0MTcyIDIuOTUzNzhaTTEyLjM1ODMgMTMuMDQzNkMxMS4xODk2IDE0LjA1NDEgOS42NjYyMSAxNC42NjU0IDguMDAwMDEgMTQuNjY1NEM0LjMxODExIDE0LjY2NTQgMS4zMzMzNCAxMS42ODA2IDEuMzMzMzQgNy45OTg3QzEuMzMzMzQgNi41NzQ2IDEuNzc5ODcgNS4yNTQ4IDIuNTQwNTQgNC4xNzE2Nkw0LjY2NjY4IDcuOTk4N0gyLjY2NjY4QzIuNjY2NjggMTAuOTQ0MiA1LjA1NDQ5IDEzLjMzMiA4LjAwMDAxIDEzLjMzMkM5LjQzMzQ4IDEzLjMzMiAxMC43MzQ4IDEyLjc2NjUgMTEuNjkzMiAxMS44NDY0TDEyLjM1ODMgMTMuMDQzNloiIGZpbGw9IiM1NjU4NUEiLz4KPC9zdmc+Cg==") center center no-repeat;
}
&:hover {
background: transparent;
}
}
&:hover {
background: #12121BE5;
&.redirecting {
background: transparent;
}
}
&.loading {
pointer-events: none;
background: #F1F1F9;
color: transparent !important;
position: relative;
&:after {
content: '';
display: inline-block;
width: 16px;
height: 16px;
animation: wps-spin 5s infinite;
background: url("data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTYiIGhlaWdodD0iMTYiIHZpZXdCb3g9IjAgMCAxNiAxNiIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHBhdGggZD0iTTMuNjQxNzUgMi45NTM3OEM0LjgxMDQxIDEuOTQzMjggNi4zMzM4NCAxLjMzMjAzIDguMDAwMDQgMS4zMzIwM0MxMS42ODE5IDEuMzMyMDMgMTQuNjY2NyA0LjMxNjggMTQuNjY2NyA3Ljk5ODdDMTQuNjY2NyA5LjQyMjc2IDE0LjIyMDIgMTAuNzQyNiAxMy40NTk1IDExLjgyNThMMTEuMzMzNCA3Ljk5ODdIMTMuMzMzNEMxMy4zMzM0IDUuMDUzMTggMTAuOTQ1NiAyLjY2NTM2IDguMDAwMDQgMi42NjUzNkM2LjU2NjU5IDIuNjY1MzYgNS4yNjUyMiAzLjIzMDg4IDQuMzA2ODYgNC4xNTA5OEwzLjY0MTc1IDIuOTUzNzhaTTEyLjM1ODMgMTMuMDQzNkMxMS4xODk2IDE0LjA1NDEgOS42NjYyNCAxNC42NjU0IDguMDAwMDQgMTQuNjY1NEM0LjMxODE0IDE0LjY2NTQgMS4zMzMzNyAxMS42ODA2IDEuMzMzMzcgNy45OTg3QzEuMzMzMzcgNi41NzQ2IDEuNzc5OSA1LjI1NDggMi41NDA1NyA0LjE3MTY2TDQuNjY2NzEgNy45OTg3SDIuNjY2NzFDMi42NjY3MSAxMC45NDQyIDUuMDU0NTIgMTMuMzMyIDguMDAwMDQgMTMuMzMyQzkuNDMzNTEgMTMuMzMyIDEwLjczNDggMTIuNzY2NSAxMS42OTMyIDExLjg0NjRMMTIuMzU4MyAxMy4wNDM2WiIgZmlsbD0iI0IyQjJDRiIvPgo8L3N2Zz4K") center center no-repeat;
position: absolute;
.rtl & {
transform: none;
}
}
}
&.disabled {
pointer-events: none;
background: #F1F1F9;
color: #B2B2CF;
position: relative;
}
}
}
}
}
}
}
.wps-postbox-addon__step {
width: 764px;
max-width: 100%;
margin: 0 auto;
background: #FFFFFF;
border: 1px solid #DADCE0;
padding: 32px;
border-radius: 8px;
display: block;
box-sizing: border-box;
@media (max-width: 768px) {
padding: 32px 16px;
}
.wps-addon__step {
&__image {
width: 56px;
height: 56px;
padding: 16px;
border-radius: 200px;
background-color: #1219261A;
margin-bottom: 24px;
display: inline-block;
box-sizing: border-box;
background-position: center center;
background-repeat: no-repeat;
&--lock {
background-image: url("data:image/svg+xml;base64,Cjxzdmcgd2lkdGg9IjI0IiBoZWlnaHQ9IjI0IiB2aWV3Qm94PSIwIDAgMjQgMjQiIGZpbGw9Im5vbmUiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+CjxwYXRoIGQ9Ik0xMC43NTc3IDExLjgyOTRMMTguNjA2NiAzLjk4MDQ3TDIwLjAyMDggNS4zOTQ2OEwxOC42MDY2IDYuODA4ODlMMjEuMDgxNSA5LjI4Mzc3TDE5LjY2NzMgMTAuNjk4TDE3LjE5MjQgOC4yMjMxMUwxNS43NzgyIDkuNjM3MzJMMTcuODk5NSAxMS43NTg3TDE2LjQ4NTMgMTMuMTcyOUwxNC4zNjQgMTEuMDUxNkwxMi4xNzE5IDEzLjI0MzZDMTMuNDU4MSAxNS4xODUgMTMuMjQ2IDE3LjgyNjQgMTEuNTM1NSAxOS41MzY4QzkuNTgyOTEgMjEuNDg5NSA2LjQxNzA5IDIxLjQ4OTUgNC40NjQ0NyAxOS41MzY4QzIuNTExODQgMTcuNTg0MiAyLjUxMTg0IDE0LjQxODQgNC40NjQ0NyAxMi40NjU4QzYuMTc0OTMgMTAuNzU1MyA4LjgxNjMzIDEwLjU0MzIgMTAuNzU3NyAxMS44Mjk0Wk0xMC4xMjEzIDE4LjEyMjZDMTEuMjkyOSAxNi45NTEgMTEuMjkyOSAxNS4wNTE2IDEwLjEyMTMgMTMuODhDOC45NDk3NSAxMi43MDg0IDcuMDUwMjUgMTIuNzA4NCA1Ljg3ODY4IDEzLjg4QzQuNzA3MTEgMTUuMDUxNiA0LjcwNzExIDE2Ljk1MSA1Ljg3ODY4IDE4LjEyMjZDNy4wNTAyNSAxOS4yOTQyIDguOTQ5NzUgMTkuMjk0MiAxMC4xMjEzIDE4LjEyMjZaIiBmaWxsPSIjMTIxMjFCIi8+Cjwvc3ZnPgo=");
background-size: 24px;
}
&--checked {
width: 41px;
height: 41px;
background-color: #165E2E1A;
background-image: url("data:image/svg+xml;base64,Cjxzdmcgd2lkdGg9IjE3IiBoZWlnaHQ9IjE3IiB2aWV3Qm94PSIwIDAgMTcgMTciIGZpbGw9Im5vbmUiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+CjxwYXRoIGQ9Ik03LjA4MzEyIDEwLjc0NTZMMTMuNTk0NCA0LjIzNDM4TDE0LjU5NjEgNS4yMzYxMUw3LjA4MzEyIDEyLjc0OTFMMi41NzUzMiA4LjI0MTMzTDMuNTc3MDYgNy4yMzk2MUw3LjA4MzEyIDEwLjc0NTZaIiBmaWxsPSIjMTY1RTJFIi8+Cjwvc3ZnPgo=");
background-size: 17px;
}
}
&__title {
color: #0C0C0D;
font-size: 20px;
font-weight: 500;
line-height: 24px;
margin: 0 0 8px;
padding: 0;
}
&__desc {
font-size: 14px;
font-weight: 400;
line-height: 16.41px;
color: #56585A;
margin: 0;
padding: 0;
}
&__faq {
border-top: 1px solid #EEEFF1;
margin-top: 32px;
padding-top: 32px;
ul {
padding: 0;
margin: 0;
display: flex;
flex-direction: column;
gap: 12px;
li {
margin: 0;
a {
font-size: 13px;
font-weight: 400;
line-height: 21px;
border-bottom: 1px solid #56585A;
color: #56585A;
&:after {
content: "";
width: 10px;
height: 10px;
display: inline-block;
background: url("data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTAiIGhlaWdodD0iMTEiIHZpZXdCb3g9IjAgMCAxMCAxMSIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPGcgY2xpcC1wYXRoPSJ1cmwoI2NsaXAwXzE3ODA4XzU2NjQpIj4KPHBhdGggZD0iTTcuNzQwMTcgNS4xNjk4M0w0LjU3MzkyIDEuOTEzMjdMNS40MDg2OSAxLjA1NDY5TDkuOTk5OTkgNS43NzY5NUw1LjQwODY5IDEwLjQ5OTFMNC41NzM5MiA5LjY0MDU1TDcuNzQwMTcgNi4zODQwNkgwLjU1NTU0MlY1LjE2OTgzSDcuNzQwMTdaIiBmaWxsPSIjNTY1ODVBIi8+CjwvZz4KPGRlZnM+CjxjbGlwUGF0aCBpZD0iY2xpcDBfMTc4MDhfNTY2NCI+CjxyZWN0IHdpZHRoPSIxMCIgaGVpZ2h0PSIxMCIgZmlsbD0id2hpdGUiIHRyYW5zZm9ybT0idHJhbnNsYXRlKDAgMC41KSIvPgo8L2NsaXBQYXRoPgo8L2RlZnM+Cjwvc3ZnPgo=") center center no-repeat;
margin-left: 5px;
.rtl & {
transform: rotate(180deg);
margin-left: 0;
margin-right: 5px;
}
}
&:hover {
color: #0C0C0D;
border-bottom: 1px solid #0C0C0D;
&:after {
background: url("data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTAiIGhlaWdodD0iMTEiIHZpZXdCb3g9IjAgMCAxMCAxMSIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPGcgY2xpcC1wYXRoPSJ1cmwoI2NsaXAwXzE3ODA4XzU2NjgpIj4KPHBhdGggZD0iTTcuNzQwMTcgNS4xNjk4M0w0LjU3MzkyIDEuOTEzMjdMNS40MDg2OSAxLjA1NDY5TDkuOTk5OTkgNS43NzY5NUw1LjQwODY5IDEwLjQ5OTFMNC41NzM5MiA5LjY0MDU1TDcuNzQwMTcgNi4zODQwNkgwLjU1NTU0MlY1LjE2OTgzSDcuNzQwMTdaIiBmaWxsPSIjMEMwQzBEIi8+CjwvZz4KPGRlZnM+CjxjbGlwUGF0aCBpZD0iY2xpcDBfMTc4MDhfNTY2OCI+CjxyZWN0IHdpZHRoPSIxMCIgaGVpZ2h0PSIxMCIgZmlsbD0id2hpdGUiIHRyYW5zZm9ybT0idHJhbnNsYXRlKDAgMC41KSIvPgo8L2NsaXBQYXRoPgo8L2RlZnM+Cjwvc3ZnPgo=") center center no-repeat;
}
}
}
&:first-child {
a {
border-bottom: 1px solid #404BF2;
color: #404BF2;
&:after {
background: url(data:image/svg+xml;base64,Cjxzdmcgd2lkdGg9IjEwIiBoZWlnaHQ9IjExIiB2aWV3Qm94PSIwIDAgMTAgMTEiIGZpbGw9Im5vbmUiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+CjxnIGNsaXAtcGF0aD0idXJsKCNjbGlwMF8xNjQ5M183MDU3MykiPgo8cGF0aCBkPSJNNy43NDAyOSA1LjE2OTgzTDQuNTc0MDQgMS45MTMyN0w1LjQwODgxIDEuMDU0NjlMMTAuMDAwMSA1Ljc3Njk1TDUuNDA4ODEgMTAuNDk5MUw0LjU3NDA0IDkuNjQwNTVMNy43NDAyOSA2LjM4NDA2SDAuNTU1NjY0VjUuMTY5ODNINy43NDAyOVoiIGZpbGw9IiM0MDRCRjIiLz4KPC9nPgo8ZGVmcz4KPGNsaXBQYXRoIGlkPSJjbGlwMF8xNjQ5M183MDU3MyI+CjxyZWN0IHdpZHRoPSIxMCIgaGVpZ2h0PSIxMCIgZmlsbD0id2hpdGUiIHRyYW5zZm9ybT0idHJhbnNsYXRlKDAgMC41KSIvPgo8L2NsaXBQYXRoPgo8L2RlZnM+Cjwvc3ZnPgo=) center center no-repeat;
}
&:hover {
color: #0C0C0D;
border-bottom: 1px solid #0C0C0D;
&:after {
background: url("data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTAiIGhlaWdodD0iMTEiIHZpZXdCb3g9IjAgMCAxMCAxMSIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPGcgY2xpcC1wYXRoPSJ1cmwoI2NsaXAwXzE3ODA4XzU2NjgpIj4KPHBhdGggZD0iTTcuNzQwMTcgNS4xNjk4M0w0LjU3MzkyIDEuOTEzMjdMNS40MDg2OSAxLjA1NDY5TDkuOTk5OTkgNS43NzY5NUw1LjQwODY5IDEwLjQ5OTFMNC41NzM5MiA5LjY0MDU1TDcuNzQwMTcgNi4zODQwNkgwLjU1NTU0MlY1LjE2OTgzSDcuNzQwMTdaIiBmaWxsPSIjMEMwQzBEIi8+CjwvZz4KPGRlZnM+CjxjbGlwUGF0aCBpZD0iY2xpcDBfMTc4MDhfNTY2OCI+CjxyZWN0IHdpZHRoPSIxMCIgaGVpZ2h0PSIxMCIgZmlsbD0id2hpdGUiIHRyYW5zZm9ybT0idHJhbnNsYXRlKDAgMC41KSIvPgo8L2NsaXBQYXRoPgo8L2RlZnM+Cjwvc3ZnPgo=") center center no-repeat;
}
}
}
}
}
}
}
&__license {
gap: 16px;
flex-direction: column;
display: flex;
.wps-alert {
margin-top: 16px;
}
.wps-addon__step__active-license {
display: flex;
gap: 16px;
justify-content: space-between;
margin-top: 32px;
@media(max-width: 768px) {
flex-direction: column;
}
input {
padding: 10px 14px !important;
border-radius: 3px;
border: 1px solid #DADCE0 !important;
font-size: 14px;
font-weight: 400;
width: 100%;
&::placeholder {
color: #8F9093;
}
&.wps-danger {
border: 1px solid #D63638 !important;
box-shadow: 0 0 0 3px #D6363833;
outline: 2px solid rgba(0, 0, 0, 0);
}
&.wps-warning {
border: 1px solid #EE8B44 !important;
box-shadow: 0 0 0 3px #EE8B4433;
outline: 2px solid rgba(0, 0, 0, 0);
}
&:focus, &:active {
border: 1px solid #404BF2 !important;
box-shadow: 0 0 0 3px #404BF233;
outline: 2px solid rgba(0, 0, 0, 0);
}
}
}
}
&__download {
display: flex;
flex-direction: column;
gap: 16px;
.wps-addon__download__items {
display: flex;
gap: 16px;
flex-direction: column;
}
.wps-addon__download__title {
display: flex;
justify-content: space-between;
align-items: center;
margin-top: 32px;
h3 {
font-size: 16px;
font-weight: 500;
line-height: 18.75px;
color: #0C0C0D;
margin: 0;
}
a {
font-size: 14px;
font-weight: 500;
line-height: 16.41px;
border-bottom: 1px solid;
cursor: pointer;
}
}
.wps-addon__download__item {
border: 1px solid #DADCE0;
padding: 16px;
gap: 16px;
border-radius: 8px;
display: flex;
justify-content: space-between;
align-items: flex-start;
position: relative;
@media (max-width: 768px) {
flex-direction: column;
align-items: flex-end;
gap: 0;
position: relative;
}
&.wps-has-checkbox:not(.wps-addon__download__item--disabled):hover {
background: #FAFAFB;
border: 1px solid #56585A
}
&--disabled {
background: #EEEFF1;
&:hover {
background: #EEEFF1;
border: 1px solid #DADCE0;
}
}
.wps-postbox-addon__read-more {
padding: 3px 4px;
gap: 3px;
border-radius: 4px;
background: #404BF20D;
font-size: 11px;
font-weight: 500;
color: #6972F9;
display: inline-flex;
align-items: center;
white-space: nowrap;
&:hover {
color: #0C0C0D;
&:after {
filter: grayscale(1) brightness(0.5);
}
}
&:after {
content: '';
display: inline-flex;
width: 12px;
height: 12px;
background: url("data:image/svg+xml;base64,Cjxzdmcgd2lkdGg9IjEyIiBoZWlnaHQ9IjEzIiB2aWV3Qm94PSIwIDAgMTIgMTMiIGZpbGw9Im5vbmUiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+CjxwYXRoIGQ9Ik01IDMuNVY0LjVIMi41VjEwSDhWNy41SDlWMTAuNUM5IDEwLjc3NjEgOC43NzYxNSAxMSA4LjUgMTFIMkMxLjcyMzg2IDExIDEuNSAxMC43NzYxIDEuNSAxMC41VjRDMS41IDMuNzIzODYgMS43MjM4NiAzLjUgMiAzLjVINVpNMTAuNSAyVjYuNUw4LjYwMyA0LjYwMzVMNS42MDM1NSA3LjYwMzU1TDQuODk2NDQgNi44OTY0NUw3Ljg5NiAzLjg5NjVMNiAySDEwLjVaIiBmaWxsPSIjNzk4MUY2Ii8+Cjwvc3ZnPgo=") center center no-repeat;
.rtl & {
transform: rotate(270deg);
}
}
}
&--info {
display: flex;
gap: 16px;
@media (max-width: 768px) {
order: 2;
display: block;
width: 100%;
}
&__img {
background: #404BF214;
padding: 8px;
border-radius: 6px;
width: 48px;
min-width: 48px;
height: 48px;
align-items: center;
display: flex;
justify-content: center;
box-sizing: border-box;
@media(max-width: 768px) {
margin-bottom: 8px;
}
img {
width: 24px;
height: 24px;
}
}
&__text {
display: flex;
gap: 8px;
flex-direction: column;
}
&__title {
color: #0C0C0D;
font-size: 15px;
font-weight: 500;
line-height: 17.58px;
display: flex;
gap: 8px;
align-items: center;
flex-wrap: wrap;
min-height: 27px;
span.wps-postbox-addon__version {
color: #898A8E;
font-size: 11px;
font-weight: 500;
line-height: 16px;
}
}
&__desc {
color: #717274;
font-size: 13px;
font-weight: 400;
line-height: 16px;
margin: 0 !important;
}
}
&--select {
display: flex;
gap: 12px;
align-items: flex-start;
position: absolute;
justify-content: flex-end;
top: 16px;
right: 16px;
.rtl & {
right: unset;
left: 16px;
}
@media (max-width: 768px) {
order: 1;
}
.wps-postbox-addon__status {
&--disable {
color: #56585A;
}
}
input[type=checkbox] {
margin: 0 !important;
}
}
}
}
&__action {
display: flex;
align-items: center;
justify-content: space-between;
margin-top: 32px;
@media (max-width: 768px) {
flex-direction: column;
gap: 8px;
justify-content: flex-start;
align-items: flex-start;
}
.wps-addon__step__back {
display: inline-flex;
align-items: center;
gap: 4px;
font-size: 13px;
font-weight: 500;
line-height: 15.23px;
color: #56585A;
@media (max-width: 768px) {
order: 2
}
&:hover {
color: #0C0C0D;
&:before {
background-image: url("data:image/svg+xml;base64,Cjxzdmcgd2lkdGg9IjE4IiBoZWlnaHQ9IjE4IiB2aWV3Qm94PSIwIDAgMTggMTgiIGZpbGw9Im5vbmUiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+CjxwYXRoIGQ9Ik01Ljg3MTMyIDguMjUxNjNIMTVWOS43NTE2M0g1Ljg3MTMyTDkuODk0MyAxMy43NzQ2TDguODMzNjUgMTQuODM1MkwzIDkuMDAxNjNMOC44MzM2NSAzLjE2Nzk3TDkuODk0MyA0LjIyODYzTDUuODcxMzIgOC4yNTE2M1oiIGZpbGw9IiMwQzBDMEQiLz4KPC9zdmc+Cg==");
}
}
&:before {
content: '';
display: inline-block;
width: 18px;
height: 18px;
background-size: 12px 11.6px;
background-image: url("data:image/svg+xml;base64,Cjxzdmcgd2lkdGg9IjE4IiBoZWlnaHQ9IjE4IiB2aWV3Qm94PSIwIDAgMTggMTgiIGZpbGw9Im5vbmUiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+CjxwYXRoIGQ9Ik01Ljg3MTMyIDguMjUxNjNIMTVWOS43NTE2M0g1Ljg3MTMyTDkuODk0MyAxMy43NzQ2TDguODMzNjUgMTQuODM1MkwzIDkuMDAxNjNMOC44MzM2NSAzLjE2Nzk3TDkuODk0MyA0LjIyODYzTDUuODcxMzIgOC4yNTE2M1oiIGZpbGw9IiM1NjU4NUEiLz4KPC9zdmc+Cg==");
background-repeat: no-repeat;
background-position: center;
.rtl & {
transform: rotate(180deg);
}
}
}
.wps-postbox-addon-button {
padding: 8px 16px;
@media (max-width: 768px) {
padding: 8px;
width: 100%;
box-sizing: border-box;
}
}
}
&__back-to-addons {
margin-top: 44px;
display: flex;
gap: 4px;
color: #56585A;
&:before {
content: '';
width: 18px;
min-width: 18px;
height: 18px;
background: url("data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTgiIGhlaWdodD0iMTgiIHZpZXdCb3g9IjAgMCAxOCAxOCIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHBhdGggZD0iTTUuODcxMzIgOC4yNTE2M0gxNVY5Ljc1MTYzSDUuODcxMzJMOS44OTQzIDEzLjc3NDZMOC44MzM2NSAxNC44MzUyTDMgOS4wMDE2M0w4LjgzMzY1IDMuMTY3OTdMOS44OTQzIDQuMjI4NjNMNS44NzEzMiA4LjI1MTYzWiIgZmlsbD0iIzU2NTg1QSIvPgo8L3N2Zz4K") center center no-repeat;
.rtl &{
transform: rotate(180deg);
}
}
&:hover {
color: #0C0C0D;
&:before {
background: url("data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTgiIGhlaWdodD0iMTgiIHZpZXdCb3g9IjAgMCAxOCAxOCIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHBhdGggZD0iTTUuODcxMzIgOC4yNTE2M0gxNVY5Ljc1MTYzSDUuODcxMzJMOS44OTQzIDEzLjc3NDZMOC44MzM2NSAxNC44MzUyTDMgOS4wMDE2M0w4LjgzMzY1IDMuMTY3OTdMOS44OTQzIDQuMjI4NjNMNS44NzEzMiA4LjI1MTYzWiIgZmlsbD0iIzBDMEMwRCIvPgo8L3N2Zz4K") center center no-repeat;
}
}
}
}
}
@media(max-width: 768px){
.wps-addon__download__items--get-started .wps-addon__download__item--info{
margin-bottom: 44px!important;
}
}
.wps-postbox-addon__label {
font-size: 10px;
font-weight: 500;
line-height: 11.72px;
letter-spacing: 0.07em;
padding: 4px 5px;
border-radius: 2px;
text-transform: uppercase;
white-space: nowrap;
display: inline-block;
&--new {
color: #404BF2;
background: #ECEDFE;
}
&--updated {
color: #4F2DBC;
background: #EBE9F0;
}
}
.wps-postbox-addon__status {
padding: 2px 4px;
gap: 3px;
border-radius: 4px;
font-size: 13px;
font-weight: 500;
line-height: 15.23px;
display: flex;
align-items: center;
justify-content: center;
white-space: nowrap;
@media(max-width: 768px) {
margin-top: 4px;
}
&--success {
color: #196140;
background: #1961400D;
}
&--installed {
color: #196140;
background: transparent;
}
&--danger {
color: #D5201C;
background: #D5201C0D;
}
&--primary {
color: #56585A;
background: transparent;
}
&--purple {
color: #7362BF;
background: #7362BF0D;
}
&--waiting {
color: #7362BF;
background: #7362BF0D;
}
&--disable {
color: #56585A;
background: transparent;
}
}
.wps-postbox-addon-button {
border: none;
padding: 8px 16px;
gap: 8px;
border-radius: 4px;
background: #12121B;
font-size: 14px;
font-weight: 500;
line-height: 22px;
color: #FFFFFF !important;
white-space: nowrap;
cursor: pointer;
display: inline-flex;
align-items: center;
justify-content: center;
min-width: 154px;
&.disabled {
background: #F1F1F9;
color: #B2B2CF !important;
pointer-events: none;
&:after {
background: url("data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTIiIGhlaWdodD0iMTIiIHZpZXdCb3g9IjAgMCAxMiAxMiIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPGcgY2xpcC1wYXRoPSJ1cmwoI2NsaXAwXzE3ODU1XzEwNjM1NSkiPgo8cGF0aCBkPSJNOS4yODgyNCA1LjYwNjE0TDUuNDg4NzQgMS42OTgyN0w2LjQ5MDQ2IDAuNjY3OTY5TDEyIDYuMzM0NjhMNi40OTA0NiAxMi4wMDEzTDUuNDg4NzQgMTAuOTcxTDkuMjg4MjQgNy4wNjMyMUgwLjY2NjY4N1Y1LjYwNjE0SDkuMjg4MjRaIiBmaWxsPSIjQjJCMkNGIi8+CjwvZz4KPGRlZnM+CjxjbGlwUGF0aCBpZD0iY2xpcDBfMTc4NTVfMTA2MzU1Ij4KPHJlY3Qgd2lkdGg9IjEyIiBoZWlnaHQ9IjEyIiBmaWxsPSJ3aGl0ZSIvPgo8L2NsaXBQYXRoPgo8L2RlZnM+Cjwvc3ZnPgo=") center center no-repeat;
}
}
&.redirecting, &.redirecting.loading, &.redirecting.disabled {
background: transparent !important;
color: #56585A !important;
font-size: 14px;
font-weight: 500;
opacity: 1;
&:hover {
background: transparent;
}
&:after {
position: relative;
width: 16px;
min-width: 16px;
height: 16px;
-webkit-animation-name: wps-cycle;
-webkit-animation-duration: 2s;
-webkit-animation-iteration-count: infinite;
-webkit-animation-fill-mode: forwards;
animation-name: wps-cycle;
animation-duration: 2s;
animation-iteration-count: infinite;
animation-fill-mode: forwards;
-moz-animation-name: wps-cycle;
-moz-animation-duration: 2s;
-moz-animation-iteration-count: infinite;
-moz-animation-fill-mode: forwards;
background: url("data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTYiIGhlaWdodD0iMTYiIHZpZXdCb3g9IjAgMCAxNiAxNiIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHBhdGggZD0iTTMuNjQxNzIgMi45NTM3OEM0LjgxMDM4IDEuOTQzMjggNi4zMzM4MSAxLjMzMjAzIDguMDAwMDEgMS4zMzIwM0MxMS42ODE5IDEuMzMyMDMgMTQuNjY2NyA0LjMxNjggMTQuNjY2NyA3Ljk5ODdDMTQuNjY2NyA5LjQyMjc2IDE0LjIyMDEgMTAuNzQyNiAxMy40NTk1IDExLjgyNThMMTEuMzMzMyA3Ljk5ODdIMTMuMzMzM0MxMy4zMzMzIDUuMDUzMTggMTAuOTQ1NSAyLjY2NTM2IDguMDAwMDEgMi42NjUzNkM2LjU2NjU2IDIuNjY1MzYgNS4yNjUxOSAzLjIzMDg4IDQuMzA2ODMgNC4xNTA5OEwzLjY0MTcyIDIuOTUzNzhaTTEyLjM1ODMgMTMuMDQzNkMxMS4xODk2IDE0LjA1NDEgOS42NjYyMSAxNC42NjU0IDguMDAwMDEgMTQuNjY1NEM0LjMxODExIDE0LjY2NTQgMS4zMzMzNCAxMS42ODA2IDEuMzMzMzQgNy45OTg3QzEuMzMzMzQgNi41NzQ2IDEuNzc5ODcgNS4yNTQ4IDIuNTQwNTQgNC4xNzE2Nkw0LjY2NjY4IDcuOTk4N0gyLjY2NjY4QzIuNjY2NjggMTAuOTQ0MiA1LjA1NDQ5IDEzLjMzMiA4LjAwMDAxIDEzLjMzMkM5LjQzMzQ4IDEzLjMzMiAxMC43MzQ4IDEyLjc2NjUgMTEuNjkzMiAxMS44NDY0TDEyLjM1ODMgMTMuMDQzNloiIGZpbGw9IiM1NjU4NUEiLz4KPC9zdmc+Cg==") center center no-repeat;
.rtl & {
transform: none;
}
}
}
&:hover {
background: #12121BE5;
}
&:focus, &:active {
background: #0C0C11;
}
&:after {
content: '';
display: inline-block;
width: 12px;
min-width: 12px;
height: 12px;
background: url("data:image/svg+xml;base64,Cjxzdmcgd2lkdGg9IjEyIiBoZWlnaHQ9IjEyIiB2aWV3Qm94PSIwIDAgMTIgMTIiIGZpbGw9Im5vbmUiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+CjxnIGNsaXAtcGF0aD0idXJsKCNjbGlwMF8xNDAzM183NzQyMikiPgo8cGF0aCBkPSJNOS4yODgyNCA1LjYwNjE0TDUuNDg4NzQgMS42OTgyN0w2LjQ5MDQ2IDAuNjY3OTY5TDEyIDYuMzM0NjhMNi40OTA0NiAxMi4wMDEzTDUuNDg4NzQgMTAuOTcxTDkuMjg4MjQgNy4wNjMyMUgwLjY2NjY4N1Y1LjYwNjE0SDkuMjg4MjRaIiBmaWxsPSJ3aGl0ZSIvPgo8L2c+CjxkZWZzPgo8Y2xpcFBhdGggaWQ9ImNsaXAwXzE0MDMzXzc3NDIyIj4KPHJlY3Qgd2lkdGg9IjEyIiBoZWlnaHQ9IjEyIiBmaWxsPSJ3aGl0ZSIvPgo8L2NsaXBQYXRoPgo8L2RlZnM+Cjwvc3ZnPgo=") center center no-repeat;
.rtl & {
transform: rotate(180deg);
}
}
&.loading {
pointer-events: none;
background: #F1F1F9;
color: transparent !important;
position: relative;
&:after {
content: '';
display: inline-block;
width: 16px;
height: 16px;
animation: wps-spin 5s infinite;
background: url("data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTYiIGhlaWdodD0iMTYiIHZpZXdCb3g9IjAgMCAxNiAxNiIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHBhdGggZD0iTTMuNjQxNzUgMi45NTM3OEM0LjgxMDQxIDEuOTQzMjggNi4zMzM4NCAxLjMzMjAzIDguMDAwMDQgMS4zMzIwM0MxMS42ODE5IDEuMzMyMDMgMTQuNjY2NyA0LjMxNjggMTQuNjY2NyA3Ljk5ODdDMTQuNjY2NyA5LjQyMjc2IDE0LjIyMDIgMTAuNzQyNiAxMy40NTk1IDExLjgyNThMMTEuMzMzNCA3Ljk5ODdIMTMuMzMzNEMxMy4zMzM0IDUuMDUzMTggMTAuOTQ1NiAyLjY2NTM2IDguMDAwMDQgMi42NjUzNkM2LjU2NjU5IDIuNjY1MzYgNS4yNjUyMiAzLjIzMDg4IDQuMzA2ODYgNC4xNTA5OEwzLjY0MTc1IDIuOTUzNzhaTTEyLjM1ODMgMTMuMDQzNkMxMS4xODk2IDE0LjA1NDEgOS42NjYyNCAxNC42NjU0IDguMDAwMDQgMTQuNjY1NEM0LjMxODE0IDE0LjY2NTQgMS4zMzMzNyAxMS42ODA2IDEuMzMzMzcgNy45OTg3QzEuMzMzMzcgNi41NzQ2IDEuNzc5OSA1LjI1NDggMi41NDA1NyA0LjE3MTY2TDQuNjY2NzEgNy45OTg3SDIuNjY2NzFDMi42NjY3MSAxMC45NDQyIDUuMDU0NTIgMTMuMzMyIDguMDAwMDQgMTMuMzMyQzkuNDMzNTEgMTMuMzMyIDEwLjczNDggMTIuNzY2NSAxMS42OTMyIDExLjg0NjRMMTIuMzU4MyAxMy4wNDM2WiIgZmlsbD0iI0IyQjJDRiIvPgo8L3N2Zz4K") center center no-repeat;
position: absolute;
.rtl & {
transform: none;
}
}
}
}
.wps-addon__download__item, .wps-postbox-addon__item {
&--actions {
display: flex;
gap: 12px;
align-items: center;
position: absolute;
top: 16px;
right: 16px;
.rtl &{
left: 16px;
right: unset;
}
@media (max-width: 768px) {
justify-content: flex-end;
order: 1;
gap: 8px;
align-items: self-start;
height: calc(100% - 32px);
top: 16px;
}
.wps-addon--actions {
position: relative;
&.active .wps-addon--submenus {
display: block
}
span.wps-addon--actions--show-more {
position: relative;
display: block;
cursor: pointer;
width: 27px;
height: 27px;
background-image: url("data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTUiIGhlaWdodD0iMTUiIHZpZXdCb3g9IjAgMCAxNSAxNSIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHBhdGggZD0iTTcuNSAxLjg3NUM2LjgxMjUgMS44NzUgNi4yNSAyLjQzNzUgNi4yNSAzLjEyNUM2LjI1IDMuODEyNSA2LjgxMjUgNC4zNzUgNy41IDQuMzc1QzguMTg3NSA0LjM3NSA4Ljc1IDMuODEyNSA4Ljc1IDMuMTI1QzguNzUgMi40Mzc1IDguMTg3NSAxLjg3NSA3LjUgMS44NzVaTTcuNSAxMC42MjVDNi44MTI1IDEwLjYyNSA2LjI1IDExLjE4NzUgNi4yNSAxMS44NzVDNi4yNSAxMi41NjI1IDYuODEyNSAxMy4xMjUgNy41IDEzLjEyNUM4LjE4NzUgMTMuMTI1IDguNzUgMTIuNTYyNSA4Ljc1IDExLjg3NUM4Ljc1IDExLjE4NzUgOC4xODc1IDEwLjYyNSA3LjUgMTAuNjI1Wk03LjUgNi4yNUM2LjgxMjUgNi4yNSA2LjI1IDYuODEyNSA2LjI1IDcuNUM2LjI1IDguMTg3NSA2LjgxMjUgOC43NSA3LjUgOC43NUM4LjE4NzUgOC43NSA4Ljc1IDguMTg3NSA4Ljc1IDcuNUM4Ljc1IDYuODEyNSA4LjE4NzUgNi4yNSA3LjUgNi4yNVoiIGZpbGw9IiMxMjEyMUIiLz4KPC9zdmc+Cg==");
background-position: center;
background-repeat: no-repeat;
background-size: 15px;
background-color: #12121B0A;
border-radius: 4px;
&:hover {
background-color: #12121B0F;
}
}
&.active {
span.wps-addon--actions--show-more, span.wps-addon--actions--show:hover {
background-color: #12121B;
background-image: url("data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTUiIGhlaWdodD0iMTUiIHZpZXdCb3g9IjAgMCAxNSAxNSIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHBhdGggZD0iTTcuNSAxLjg3NUM2LjgxMjUgMS44NzUgNi4yNSAyLjQzNzUgNi4yNSAzLjEyNUM2LjI1IDMuODEyNSA2LjgxMjUgNC4zNzUgNy41IDQuMzc1QzguMTg3NSA0LjM3NSA4Ljc1IDMuODEyNSA4Ljc1IDMuMTI1QzguNzUgMi40Mzc1IDguMTg3NSAxLjg3NSA3LjUgMS44NzVaTTcuNSAxMC42MjVDNi44MTI1IDEwLjYyNSA2LjI1IDExLjE4NzUgNi4yNSAxMS44NzVDNi4yNSAxMi41NjI1IDYuODEyNSAxMy4xMjUgNy41IDEzLjEyNUM4LjE4NzUgMTMuMTI1IDguNzUgMTIuNTYyNSA4Ljc1IDExLjg3NUM4Ljc1IDExLjE4NzUgOC4xODc1IDEwLjYyNSA3LjUgMTAuNjI1Wk03LjUgNi4yNUM2LjgxMjUgNi4yNSA2LjI1IDYuODEyNSA2LjI1IDcuNUM2LjI1IDguMTg3NSA2LjgxMjUgOC43NSA3LjUgOC43NUM4LjE4NzUgOC43NSA4Ljc1IDguMTg3NSA4Ljc1IDcuNUM4Ljc1IDYuODEyNSA4LjE4NzUgNi4yNSA3LjUgNi4yNVoiIGZpbGw9IndoaXRlIi8+Cjwvc3ZnPgo=");
}
}
.wps-addon--submenus {
display: none;
position: absolute;
border: 1px solid #DADCE0;
box-shadow: 1px 0 8px 0 #0000000D;
background: #fff;
border-radius: 4px;
width: 193px;
margin: 0;
z-index: 9;
gap: 4px;
padding: 4px 0;
box-sizing: border-box;
top: -1px;
left: calc(100% + 4px);
.rtl & {
left: unset;
right: calc(100% + 4px);
}
@media(max-width: 1105px) {
right: 0;
left: unset;
top: calc(100% + 4px);
.rtl & {
right: unset;
left: 0;
}
}
li {
margin: 0 auto 4px auto;
display: flex;
width: calc(100% - 8px);
.wps-separator {
background: #EEEFF1;
height: 1px;
box-sizing: border-box;
border-radius: 0;
width: calc(100% + 8px);
margin-right: -4px;
margin-left: -4px;
}
&:last-child {
margin-bottom: 0;
}
a {
padding: 10px 16px;
font-size: 13px;
font-weight: 500;
line-height: 15.23px;
color: #5F6368;
width: 100%;
border-radius: 4px;
display: flex;
justify-content: space-between;
align-items: center;
&:after {
content: '';
width: 13px;
height: 13px;
display: inline-flex;
background: url("data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTQiIGhlaWdodD0iMTMiIHZpZXdCb3g9IjAgMCAxNCAxMyIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHBhdGggZD0iTTUuOTE2NjcgMy4yNVY0LjMzMzMzSDMuMjA4MzNWMTAuMjkxN0g5LjE2NjY3VjcuNTgzMzNIMTAuMjVWMTAuODMzM0MxMC4yNSAxMS4xMzI1IDEwLjAwNzUgMTEuMzc1IDkuNzA4MzMgMTEuMzc1SDIuNjY2NjdDMi4zNjc1MSAxMS4zNzUgMi4xMjUgMTEuMTMyNSAyLjEyNSAxMC44MzMzVjMuNzkxNjdDMi4xMjUgMy40OTI1MiAyLjM2NzUxIDMuMjUgMi42NjY2NyAzLjI1SDUuOTE2NjdaTTExLjg3NSAxLjYyNVY2LjVMOS44MTk5MiA0LjQ0NTQ2TDYuNTcwNTEgNy42OTU1MUw1LjgwNDQ4IDYuOTI5NDlMOS4wNTQgMy42Nzk1NEw3IDEuNjI1SDExLjg3NVoiIGZpbGw9IiNBOUFBQUUiLz4KPC9zdmc+Cg==") center center no-repeat;
}
&:hover {
background: #FAFAFB;
color: #0C0C0D;
&.wps-addon--submenu__settings span:before {
background: url("data:image/svg+xml;base64,Cjxzdmcgd2lkdGg9IjE2IiBoZWlnaHQ9IjE1IiB2aWV3Qm94PSIwIDAgMTYgMTUiIGZpbGw9Im5vbmUiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+CjxwYXRoIGQ9Ik0xLjkxMzU3IDcuNTAwNjFDMS45MTM1NyA2Ljk2MDI5IDEuOTgyMTQgNi40MzU5OCAyLjExMTA0IDUuOTM1OTJDMi43OTI0NiA1Ljk3MTI1IDMuNDY4ODcgNS42MzIwNyAzLjgzMzQ1IDUuMDAwNjJDNC4xOTc3NCA0LjM2OTY0IDQuMTUzNjEgMy42MTQ5MiAzLjc4MzA4IDMuMDQyNjFDNC41MjgyOSAyLjMxMDI5IDUuNDU2MjcgMS43NjMzNyA2LjQ5MjM0IDEuNDc2NTZDNi44MDI0NSAyLjA4NDM5IDcuNDM0MzkgMi41MDA2MiA4LjE2MzU3IDIuNTAwNjJDOC44OTI3NiAyLjUwMDYyIDkuNTI0NyAyLjA4NDM5IDkuODM0ODIgMS40NzY1NkMxMC44NzA5IDEuNzYzMzcgMTEuNzk4OSAyLjMxMDI5IDEyLjU0NDEgMy4wNDI2MUMxMi4xNzM1IDMuNjE0OTIgMTIuMTI5NCA0LjM2OTY0IDEyLjQ5MzcgNS4wMDA2MkMxMi44NTgzIDUuNjMyMDcgMTMuNTM0NyA1Ljk3MTI1IDE0LjIxNjEgNS45MzU5MkMxNC4zNDUgNi40MzU5OCAxNC40MTM2IDYuOTYwMjkgMTQuNDEzNiA3LjUwMDYxQzE0LjQxMzYgOC4wNDA5MiAxNC4zNDUgOC41NjUyMyAxNC4yMTYxIDkuMDY1MjlDMTMuNTM0NyA5LjAyOTk4IDEyLjg1ODMgOS4zNjkxNyAxMi40OTM3IDEwLjAwMDZDMTIuMTI5NCAxMC42MzE2IDEyLjE3MzUgMTEuMzg2MyAxMi41NDQxIDExLjk1ODZDMTEuNzk4OSAxMi42OTA5IDEwLjg3MDkgMTMuMjM3OSA5LjgzNDgyIDEzLjUyNDdDOS41MjQ3IDEyLjkxNjkgOC44OTI3NiAxMi41MDA2IDguMTYzNTcgMTIuNTAwNkM3LjQzNDM5IDEyLjUwMDYgNi44MDI0NSAxMi45MTY5IDYuNDkyMzQgMTMuNTI0N0M1LjQ1NjI3IDEzLjIzNzkgNC41MjgyOSAxMi42OTA5IDMuNzgzMDggMTEuOTU4NkM0LjE1MzYxIDExLjM4NjMgNC4xOTc3NCAxMC42MzE2IDMuODMzNDUgMTAuMDAwNkMzLjQ2ODg3IDkuMzY5MTcgMi43OTI0NiA5LjAyOTk4IDIuMTExMDQgOS4wNjUyOUMxLjk4MjE0IDguNTY1MjMgMS45MTM1NyA4LjA0MDkyIDEuOTEzNTcgNy41MDA2MVpNNC45MTU5OCA5LjM3NTZDNS4zMDk3OSAxMC4wNTc3IDUuNDIyNjkgMTAuODQxOSA1LjI2ODY5IDExLjU3OEM1LjUyMzU2IDExLjc1OTQgNS43OTQ4NiAxMS45MTY1IDYuMDc5MTMgMTIuMDQ3QzYuNjM5NjcgMTEuNTQ1MiA3LjM3NTU3IDExLjI1MDYgOC4xNjM1NyAxMS4yNTA2QzguOTUxNTcgMTEuMjUwNiA5LjY4NzQ1IDExLjU0NTIgMTAuMjQ4IDEyLjA0N0MxMC41MzIzIDExLjkxNjUgMTAuODAzNiAxMS43NTk0IDExLjA1ODQgMTEuNTc4QzEwLjkwNDQgMTAuODQxOSAxMS4wMTczIDEwLjA1NzcgMTEuNDExMiA5LjM3NTZDMTEuODA0OSA4LjY5MzU0IDEyLjQyNzYgOC4yMDM3MyAxMy4xNDIgNy45NjkwNEMxMy4xNTYzIDcuODE0MTcgMTMuMTYzNiA3LjY1Nzk4IDEzLjE2MzYgNy41MDA2MUMxMy4xNjM2IDcuMzQzMjkgMTMuMTU2MyA3LjE4NzA0IDEzLjE0MiA3LjAzMjIzQzEyLjQyNzYgNi43OTc1NCAxMS44MDQ5IDYuMzA3NzMgMTEuNDExMiA1LjYyNTYyQzExLjAxNzMgNC45NDM1MSAxMC45MDQ0IDQuMTU5MzQgMTEuMDU4NCAzLjQyMzI2QzEwLjgwMzYgMy4yNDE5MSAxMC41MzIzIDMuMDg0NzcgMTAuMjQ4IDIuOTU0MThDOS42ODc0NSAzLjQ1NjAxIDguOTUxNTcgMy43NTA2MiA4LjE2MzU3IDMuNzUwNjJDNy4zNzU1NyAzLjc1MDYyIDYuNjM5NjcgMy40NTYwMSA2LjA3OTEzIDIuOTU0MThDNS43OTQ4NiAzLjA4NDc3IDUuNTIzNTYgMy4yNDE5MSA1LjI2ODY5IDMuNDIzMjZDNS40MjI2OSA0LjE1OTM0IDUuMzA5NzkgNC45NDM1MSA0LjkxNTk4IDUuNjI1NjJDNC41MjIxNyA2LjMwNzczIDMuODk5NTQgNi43OTc1NCAzLjE4NTE0IDcuMDMyMjNDMy4xNzA4MSA3LjE4NzA0IDMuMTYzNTcgNy4zNDMyOSAzLjE2MzU3IDcuNTAwNjFDMy4xNjM1NyA3LjY1Nzk4IDMuMTcwODEgNy44MTQxNyAzLjE4NTE0IDcuOTY5MDRDMy44OTk1NCA4LjIwMzczIDQuNTIyMTcgOC42OTM1NCA0LjkxNTk4IDkuMzc1NlpNOC4xNjM1NyA5LjM3NTZDNy4xMjgwMSA5LjM3NTYgNi4yODg1NyA4LjUzNjE3IDYuMjg4NTcgNy41MDA2MUM2LjI4ODU3IDYuNDY1MTEgNy4xMjgwMSA1LjYyNTYyIDguMTYzNTcgNS42MjU2MkM5LjE5OTE0IDUuNjI1NjIgMTAuMDM4NiA2LjQ2NTExIDEwLjAzODYgNy41MDA2MUMxMC4wMzg2IDguNTM2MTcgOS4xOTkxNCA5LjM3NTYgOC4xNjM1NyA5LjM3NTZaTTguMTYzNTcgOC4xMjU2QzguNTA4NzYgOC4xMjU2IDguNzg4NTcgNy44NDU3OSA4Ljc4ODU3IDcuNTAwNjFDOC43ODg1NyA3LjE1NTQyIDguNTA4NzYgNi44NzU2MSA4LjE2MzU3IDYuODc1NjFDNy44MTgzOSA2Ljg3NTYxIDcuNTM4NTcgNy4xNTU0MiA3LjUzODU3IDcuNTAwNjFDNy41Mzg1NyA3Ljg0NTc5IDcuODE4MzkgOC4xMjU2IDguMTYzNTcgOC4xMjU2WiIgZmlsbD0iIzBDMEMwRCIvPgo8L3N2Zz4K") center center no-repeat;
}
&:after {
background: url("data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTQiIGhlaWdodD0iMTMiIHZpZXdCb3g9IjAgMCAxNCAxMyIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHBhdGggZD0iTTUuOTE2NjcgMy4yNVY0LjMzMzMzSDMuMjA4MzNWMTAuMjkxN0g5LjE2NjY3VjcuNTgzMzNIMTAuMjVWMTAuODMzM0MxMC4yNSAxMS4xMzI1IDEwLjAwNzUgMTEuMzc1IDkuNzA4MzMgMTEuMzc1SDIuNjY2NjdDMi4zNjc1MSAxMS4zNzUgMi4xMjUgMTEuMTMyNSAyLjEyNSAxMC44MzMzVjMuNzkxNjdDMi4xMjUgMy40OTI1MiAyLjM2NzUxIDMuMjUgMi42NjY2NyAzLjI1SDUuOTE2NjdaTTExLjg3NSAxLjYyNVY2LjVMOS44MTk5MiA0LjQ0NTQ2TDYuNTcwNTEgNy42OTU1MUw1LjgwNDQ4IDYuOTI5NDlMOS4wNTQgMy42Nzk1NEw3IDEuNjI1SDExLjg3NVoiIGZpbGw9IiMwQzBDMEQiLz4KPC9zdmc+Cg==") center center no-repeat;
}
}
&.wps-addon--submenu__settings {
display: flex;
gap: 6px;
align-items: center;
span {
display: flex;
align-items: center;
gap: 8px;
&:before {
content: '';
width: 15px;
height: 15px;
display: inline-flex;
background: url("data:image/svg+xml;base64,Cjxzdmcgd2lkdGg9IjE2IiBoZWlnaHQ9IjE1IiB2aWV3Qm94PSIwIDAgMTYgMTUiIGZpbGw9Im5vbmUiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+CjxwYXRoIGQ9Ik0xLjkxMzU3IDcuNTAwNjFDMS45MTM1NyA2Ljk2MDI5IDEuOTgyMTQgNi40MzU5OCAyLjExMTA0IDUuOTM1OTJDMi43OTI0NiA1Ljk3MTI1IDMuNDY4ODcgNS42MzIwNyAzLjgzMzQ1IDUuMDAwNjJDNC4xOTc3NCA0LjM2OTY0IDQuMTUzNjEgMy42MTQ5MiAzLjc4MzA4IDMuMDQyNjFDNC41MjgyOSAyLjMxMDI5IDUuNDU2MjcgMS43NjMzNyA2LjQ5MjM0IDEuNDc2NTZDNi44MDI0NSAyLjA4NDM5IDcuNDM0MzkgMi41MDA2MiA4LjE2MzU3IDIuNTAwNjJDOC44OTI3NiAyLjUwMDYyIDkuNTI0NyAyLjA4NDM5IDkuODM0ODIgMS40NzY1NkMxMC44NzA5IDEuNzYzMzcgMTEuNzk4OSAyLjMxMDI5IDEyLjU0NDEgMy4wNDI2MUMxMi4xNzM1IDMuNjE0OTIgMTIuMTI5NCA0LjM2OTY0IDEyLjQ5MzcgNS4wMDA2MkMxMi44NTgzIDUuNjMyMDcgMTMuNTM0NyA1Ljk3MTI1IDE0LjIxNjEgNS45MzU5MkMxNC4zNDUgNi40MzU5OCAxNC40MTM2IDYuOTYwMjkgMTQuNDEzNiA3LjUwMDYxQzE0LjQxMzYgOC4wNDA5MiAxNC4zNDUgOC41NjUyMyAxNC4yMTYxIDkuMDY1MjlDMTMuNTM0NyA5LjAyOTk4IDEyLjg1ODMgOS4zNjkxNyAxMi40OTM3IDEwLjAwMDZDMTIuMTI5NCAxMC42MzE2IDEyLjE3MzUgMTEuMzg2MyAxMi41NDQxIDExLjk1ODZDMTEuNzk4OSAxMi42OTA5IDEwLjg3MDkgMTMuMjM3OSA5LjgzNDgyIDEzLjUyNDdDOS41MjQ3IDEyLjkxNjkgOC44OTI3NiAxMi41MDA2IDguMTYzNTcgMTIuNTAwNkM3LjQzNDM5IDEyLjUwMDYgNi44MDI0NSAxMi45MTY5IDYuNDkyMzQgMTMuNTI0N0M1LjQ1NjI3IDEzLjIzNzkgNC41MjgyOSAxMi42OTA5IDMuNzgzMDggMTEuOTU4NkM0LjE1MzYxIDExLjM4NjMgNC4xOTc3NCAxMC42MzE2IDMuODMzNDUgMTAuMDAwNkMzLjQ2ODg3IDkuMzY5MTcgMi43OTI0NiA5LjAyOTk4IDIuMTExMDQgOS4wNjUyOUMxLjk4MjE0IDguNTY1MjMgMS45MTM1NyA4LjA0MDkyIDEuOTEzNTcgNy41MDA2MVpNNC45MTU5OCA5LjM3NTZDNS4zMDk3OSAxMC4wNTc3IDUuNDIyNjkgMTAuODQxOSA1LjI2ODY5IDExLjU3OEM1LjUyMzU2IDExLjc1OTQgNS43OTQ4NiAxMS45MTY1IDYuMDc5MTMgMTIuMDQ3QzYuNjM5NjcgMTEuNTQ1MiA3LjM3NTU3IDExLjI1MDYgOC4xNjM1NyAxMS4yNTA2QzguOTUxNTcgMTEuMjUwNiA5LjY4NzQ1IDExLjU0NTIgMTAuMjQ4IDEyLjA0N0MxMC41MzIzIDExLjkxNjUgMTAuODAzNiAxMS43NTk0IDExLjA1ODQgMTEuNTc4QzEwLjkwNDQgMTAuODQxOSAxMS4wMTczIDEwLjA1NzcgMTEuNDExMiA5LjM3NTZDMTEuODA0OSA4LjY5MzU0IDEyLjQyNzYgOC4yMDM3MyAxMy4xNDIgNy45NjkwNEMxMy4xNTYzIDcuODE0MTcgMTMuMTYzNiA3LjY1Nzk4IDEzLjE2MzYgNy41MDA2MUMxMy4xNjM2IDcuMzQzMjkgMTMuMTU2MyA3LjE4NzA0IDEzLjE0MiA3LjAzMjIzQzEyLjQyNzYgNi43OTc1NCAxMS44MDQ5IDYuMzA3NzMgMTEuNDExMiA1LjYyNTYyQzExLjAxNzMgNC45NDM1MSAxMC45MDQ0IDQuMTU5MzQgMTEuMDU4NCAzLjQyMzI2QzEwLjgwMzYgMy4yNDE5MSAxMC41MzIzIDMuMDg0NzcgMTAuMjQ4IDIuOTU0MThDOS42ODc0NSAzLjQ1NjAxIDguOTUxNTcgMy43NTA2MiA4LjE2MzU3IDMuNzUwNjJDNy4zNzU1NyAzLjc1MDYyIDYuNjM5NjcgMy40NTYwMSA2LjA3OTEzIDIuOTU0MThDNS43OTQ4NiAzLjA4NDc3IDUuNTIzNTYgMy4yNDE5MSA1LjI2ODY5IDMuNDIzMjZDNS40MjI2OSA0LjE1OTM0IDUuMzA5NzkgNC45NDM1MSA0LjkxNTk4IDUuNjI1NjJDNC41MjIxNyA2LjMwNzczIDMuODk5NTQgNi43OTc1NCAzLjE4NTE0IDcuMDMyMjNDMy4xNzA4MSA3LjE4NzA0IDMuMTYzNTcgNy4zNDMyOSAzLjE2MzU3IDcuNTAwNjFDMy4xNjM1NyA3LjY1Nzk4IDMuMTcwODEgNy44MTQxNyAzLjE4NTE0IDcuOTY5MDRDMy44OTk1NCA4LjIwMzczIDQuNTIyMTcgOC42OTM1NCA0LjkxNTk4IDkuMzc1NlpNOC4xNjM1NyA5LjM3NTZDNy4xMjgwMSA5LjM3NTYgNi4yODg1NyA4LjUzNjE3IDYuMjg4NTcgNy41MDA2MUM2LjI4ODU3IDYuNDY1MTEgNy4xMjgwMSA1LjYyNTYyIDguMTYzNTcgNS42MjU2MkM5LjE5OTE0IDUuNjI1NjIgMTAuMDM4NiA2LjQ2NTExIDEwLjAzODYgNy41MDA2MUMxMC4wMzg2IDguNTM2MTcgOS4xOTkxNCA5LjM3NTYgOC4xNjM1NyA5LjM3NTZaTTguMTYzNTcgOC4xMjU2QzguNTA4NzYgOC4xMjU2IDguNzg4NTcgNy44NDU3OSA4Ljc4ODU3IDcuNTAwNjFDOC43ODg1NyA3LjE1NTQyIDguNTA4NzYgNi44NzU2MSA4LjE2MzU3IDYuODc1NjFDNy44MTgzOSA2Ljg3NTYxIDcuNTM4NTcgNy4xNTU0MiA3LjUzODU3IDcuNTAwNjFDNy41Mzg1NyA3Ljg0NTc5IDcuODE4MzkgOC4xMjU2IDguMTYzNTcgOC4xMjU2WiIgZmlsbD0iIzVGNjM2OCIvPgo8L3N2Zz4K") center center no-repeat;
}
}
}
}
}
}
}
.wps-postbox-addon__buttons {
display: flex;
gap: 12px;
align-items: center;
@media (max-width: 768px) {
position: absolute;
bottom: 0;
}
}
.wps-postbox-addon__button {
padding: 6px 12px;
gap: 2px;
border-radius: 4px;
font-size: 13px;
font-weight: 500;
line-height: 15.23px;
color: #56585A;
transition: all .3s ease-in-out;
cursor: pointer;
user-select: none;
background: #12121B0A;
border: none;
&:focus, &:active {
background: #12121B14;
color: #12121B;
}
&:hover {
background: #12121B0F;
color: #56585A;
&.active {
background: #121926CC;
color: #fff;
}
}
&.active {
background: #12121B;
color: #fff;
&:focus, &:active {
background: #0E0E15;
color: #fff;
}
}
&.js-addon-active-plugin-btn , &.button-retry-addon-download{
background: #404BF20A;
color: #404BF2;
&:hover {
background: #404BF20F;
}
&:focus, &:active {
background: #404BF214;
}
}
}
}
}
.wps-review_premium {
margin-top: 32px;
padding: 24px;
gap: 24px;
display: flex;
border-radius: 8px;
border: 1px solid #F6585E4D;
background: linear-gradient(84.03deg, #FFF7F7 0.71%, #FFFFFF 99.08%);
@media (max-width: 768px) {
display: block;
&:before {
display: none !important;
}
h4 {
&:before {
content: "";
width: 20px;
min-width: 20px;
height: 20px;
display: inline-block;
background: url(data:image/svg+xml;base64,Cjxzdmcgd2lkdGg9IjI2IiBoZWlnaHQ9IjI2IiB2aWV3Qm94PSIwIDAgMjYgMjYiIGZpbGw9Im5vbmUiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+CjxwYXRoIGQ9Ik0xNy44MTAxIDMuMzU5MzhDMTUuODQ5MiAzLjM1OTM4IDE0LjA5NDIgNC4zMTI3MSAxMy4wMDAxIDUuNzc1MjFDMTEuOTA1OSA0LjMxMjcxIDEwLjE1MDkgMy4zNTkzOCA4LjE5MDA4IDMuMzU5MzhDNC44NjQyNSAzLjM1OTM4IDIuMTY2NzUgNi4wNjc3MSAyLjE2Njc1IDkuNDE1MjFDMi4xNjY3NSAxMC43MDQ0IDIuMzcyNTggMTEuODk2IDIuNzMwMDggMTMuMDAxQzQuNDQxNzUgMTguNDE3NyA5LjcxNzU4IDIxLjY1NjkgMTIuMzI4NCAyMi41NDUyQzEyLjY5NjcgMjIuNjc1MiAxMy4zMDM0IDIyLjY3NTIgMTMuNjcxNyAyMi41NDUyQzE2LjI4MjYgMjEuNjU2OSAyMS41NTg0IDE4LjQxNzcgMjMuMjcwMSAxMy4wMDFDMjMuNjI3NiAxMS44OTYgMjMuODMzNCAxMC43MDQ0IDIzLjgzMzQgOS40MTUyMUMyMy44MzM0IDYuMDY3NzEgMjEuMTM1OSAzLjM1OTM4IDE3LjgxMDEgMy4zNTkzOFoiIGZpbGw9IiNGNjU4NUUiLz4KPC9zdmc+Cg==) center center no-repeat;
background-size: contain;
margin-top: 5px;
float: left;
margin-right: 5px;
.rtl & {
float: right;
margin-right: 0;
margin-left: 5px;
}
}
}
}
&:before {
content: '';
width: 26px;
min-width: 26px;
height: 26px;
display: inline-flex;
background: url("data:image/svg+xml;base64,Cjxzdmcgd2lkdGg9IjI2IiBoZWlnaHQ9IjI2IiB2aWV3Qm94PSIwIDAgMjYgMjYiIGZpbGw9Im5vbmUiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+CjxwYXRoIGQ9Ik0xNy44MTAxIDMuMzU5MzhDMTUuODQ5MiAzLjM1OTM4IDE0LjA5NDIgNC4zMTI3MSAxMy4wMDAxIDUuNzc1MjFDMTEuOTA1OSA0LjMxMjcxIDEwLjE1MDkgMy4zNTkzOCA4LjE5MDA4IDMuMzU5MzhDNC44NjQyNSAzLjM1OTM4IDIuMTY2NzUgNi4wNjc3MSAyLjE2Njc1IDkuNDE1MjFDMi4xNjY3NSAxMC43MDQ0IDIuMzcyNTggMTEuODk2IDIuNzMwMDggMTMuMDAxQzQuNDQxNzUgMTguNDE3NyA5LjcxNzU4IDIxLjY1NjkgMTIuMzI4NCAyMi41NDUyQzEyLjY5NjcgMjIuNjc1MiAxMy4zMDM0IDIyLjY3NTIgMTMuNjcxNyAyMi41NDUyQzE2LjI4MjYgMjEuNjU2OSAyMS41NTg0IDE4LjQxNzcgMjMuMjcwMSAxMy4wMDFDMjMuNjI3NiAxMS44OTYgMjMuODMzNCAxMC43MDQ0IDIzLjgzMzQgOS40MTUyMUMyMy44MzM0IDYuMDY3NzEgMjEuMTM1OSAzLjM1OTM4IDE3LjgxMDEgMy4zNTkzOFoiIGZpbGw9IiNGNjU4NUUiLz4KPC9zdmc+Cg==") center center no-repeat;
}
&__content {
display: flex;
gap: 14px;
flex-direction: column;
h4 {
font-size: 19px;
font-weight: 500;
line-height: 26px;
color: rgba(45, 30, 31, 1);
margin: 0;
padding: 0;
@media (max-width: 768px) {
font-size: 17px;
}
}
p {
font-size: 16px;
font-weight: 400;
line-height: 22px;
color: rgba(118, 98, 99, 1);
margin: 0;
@media (max-width: 768px) {
font-size: 14px;
}
}
p:last-child {
margin-top: -2px;
}
}
&__actions {
display: flex;
gap: 32px;
flex-direction: row;
margin-top: 24px;
align-items: center;
@media (max-width: 768px) {
flex-direction: column;
gap: 16px;
}
&__review-btn {
background: #f6585e;
padding: 8px 23px;
gap: 6px;
border-radius: 4px;
color: #FFFFFF !important;
font-size: 15px;
font-weight: 500;
line-height: 22px;
display: inline-flex;
align-items: center;
@media (max-width: 768px) {
font-size: 17px;
}
&:hover {
background: #F6585ECC;
}
&:after {
content: '';
width: 11.33px;
min-width: 11.33px;
height: 11.33px;
display: inline-flex;
background: url("data:image/svg+xml;base64,Cjxzdmcgd2lkdGg9IjEyIiBoZWlnaHQ9IjEyIiB2aWV3Qm94PSIwIDAgMTIgMTIiIGZpbGw9Im5vbmUiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+CjxwYXRoIGQ9Ik05LjI4ODA1IDUuNjA2MTRMNS40ODg1NSAxLjY5ODI3TDYuNDkwMjggMC42Njc5NjlMMTEuOTk5OCA2LjMzNDY4TDYuNDkwMjggMTIuMDAxM0w1LjQ4ODU1IDEwLjk3MUw5LjI4ODA1IDcuMDYzMjFIMC42NjY1MDRWNS42MDYxNEg5LjI4ODA1WiIgZmlsbD0id2hpdGUiLz4KPC9zdmc+Cg==") center center no-repeat;
.rtl & {
transform: rotate(180deg);
}
}
}
&__overview-btn {
color: #56585A !important;
font-size: 14px;
font-weight: 500;
line-height: 22px;
@media (max-width: 768px) {
font-size: 13px;
}
&:hover {
color: rgba(12, 12, 13, 1) !important;
}
}
}
}
.wps-alert {
padding: 16px;
border-radius: 8px;
display: flex;
gap: 8px;
align-items: flex-start;
& > div {
display: flex;
gap: 6px;
flex-direction: column;
align-items: self-start;
p {
margin: 0;
padding: 0;
font-size: 14px;
font-weight: 400;
line-height: 22px;
color: #0C0C0D;
word-break: break-word;
}
a {
font-size: 13px;
font-weight: 400;
line-height: 21px;
border-bottom: 1px solid;
}
}
&--warning {
border: 1px solid #EE8B4466;
background: #EE8B440D;
span.icon {
width: 17px;
height: 22px;
display: inline-block;
min-width: 17px;
background: url("data:image/svg+xml;base64,Cjxzdmcgd2lkdGg9IjE3IiBoZWlnaHQ9IjE3IiB2aWV3Qm94PSIwIDAgMTcgMTciIGZpbGw9Im5vbmUiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+CjxwYXRoIGQ9Ik04LjUwMTMgMTUuNTg0NkM0LjU4OTI4IDE1LjU4NDYgMS40MTc5NyAxMi40MTMzIDEuNDE3OTcgOC41MDEzQzEuNDE3OTcgNC41ODkyOCA0LjU4OTI4IDEuNDE3OTcgOC41MDEzIDEuNDE3OTdDMTIuNDEzMyAxLjQxNzk3IDE1LjU4NDYgNC41ODkyOCAxNS41ODQ2IDguNTAxM0MxNS41ODQ2IDEyLjQxMzMgMTIuNDEzMyAxNS41ODQ2IDguNTAxMyAxNS41ODQ2Wk03Ljc5Mjk3IDcuNzkyOTdWMTIuMDQzSDkuMjA5NjRWNy43OTI5N0g3Ljc5Mjk3Wk03Ljc5Mjk3IDQuOTU5NjRWNi4zNzYzSDkuMjA5NjRWNC45NTk2NEg3Ljc5Mjk3WiIgZmlsbD0iI0VFOEI0NCIvPgo8L3N2Zz4K") center center no-repeat;
}
}
&--danger {
background: #D636380D;
border: 1px solid #D6363866;
span.icon {
width: 17px;
height: 22px;
display: inline-block;
min-width: 17px;
background: url("data:image/svg+xml;base64,Cjxzdmcgd2lkdGg9IjE3IiBoZWlnaHQ9IjE5IiB2aWV3Qm94PSIwIDAgMTcgMTkiIGZpbGw9Im5vbmUiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+CjxwYXRoIGQ9Ik04LjUwMTEgMTcuNTg0NkM0LjU4OTA5IDE3LjU4NDYgMS40MTc3NyAxNC40MTMzIDEuNDE3NzcgMTAuNTAxM0MxLjQxNzc3IDYuNTg5MjggNC41ODkwOSAzLjQxNzk3IDguNTAxMSAzLjQxNzk3QzEyLjQxMzEgMy40MTc5NyAxNS41ODQ0IDYuNTg5MjggMTUuNTg0NCAxMC41MDEzQzE1LjU4NDQgMTQuNDEzMyAxMi40MTMxIDE3LjU4NDYgOC41MDExIDE3LjU4NDZaTTcuNzkyNzcgOS43OTI5N1YxNC4wNDNIOS4yMDk0NFY5Ljc5Mjk3SDcuNzkyNzdaTTcuNzkyNzcgNi45NTk2NFY4LjM3NjNIOS4yMDk0NFY2Ljk1OTY0SDcuNzkyNzdaIiBmaWxsPSIjRDYzNjM4Ii8+Cjwvc3ZnPgo=") center center no-repeat;
}
}
&--success {
background: #1961400D;
border: 1px solid #19614066;
span.icon {
width: 17px;
height: 22px;
display: inline-block;
min-width: 17px;
background: url("data:image/svg+xml;base64,Cjxzdmcgd2lkdGg9IjE3IiBoZWlnaHQ9IjE3IiB2aWV3Qm94PSIwIDAgMTcgMTciIGZpbGw9Im5vbmUiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+CjxwYXRoIGQ9Ik04LjQ5OTg0IDE1LjU4NDZDNC41ODc4MiAxNS41ODQ2IDEuNDE2NSAxMi40MTMzIDEuNDE2NSA4LjUwMTNDMS40MTY1IDQuNTg5MjggNC41ODc4MiAxLjQxNzk3IDguNDk5ODQgMS40MTc5N0MxMi40MTE4IDEuNDE3OTcgMTUuNTgzMiA0LjU4OTI4IDE1LjU4MzIgOC41MDEzQzE1LjU4MzIgMTIuNDEzMyAxMi40MTE4IDE1LjU4NDYgOC40OTk4NCAxNS41ODQ2Wk03Ljc5MzM1IDExLjMzNDZMMTIuODAyIDYuMzI1OTZMMTEuODAwMyA1LjMyNDIzTDcuNzkzMzUgOS4zMzExOUw1Ljc4OTkgNy4zMjc2Nkw0Ljc4ODE2IDguMzI5NDZMNy43OTMzNSAxMS4zMzQ2WiIgZmlsbD0iIzE5NjE0MCIvPgo8L3N2Zz4K") center center no-repeat;
}
}
&.wps-hide {
display: none;
}
}
@keyframes wps-spin {
from {
transform: rotate(0deg);
}
to {
transform: rotate(359deg);
}
}Cokiee Shell Web 1.0, Coded By Razor
Neueste Kommentare