File: /var/www/html/wp-content/plugins/loginpress/classes/traits/loginpress-addons-trait.php
<?php
/**
* LoginPress Addons Trait
*
* Contains method to generate the markup of addons.
* Method originally defined in `class-loginpress-addons.php` to keep the main file slim.
*
* @package LoginPress
* @subpackage Traits
* @since 6.1.0
*/
// Prevent direct access.
if ( ! defined( 'ABSPATH' ) ) {
exit;
}
if ( ! trait_exists( 'LoginPress_Addons_Trait' ) ) {
/**
* LoginPress Addons Trait
*
* Handles addons display and functionality.
*
* @package LoginPress
* @subpackage Traits
* @since 6.1.0
*/
trait LoginPress_Addons_Trait {
/**
* Generate the markup for addons.
*
* @since 1.0.19
* @version 3.0.5
* @return void HTML of addons management interface with cards and controls
*/
public function addon_html() {
?>
<!-- Style for Add-ons Page -->
<style media="screen">
.loginpress_page_loginpress-addons #wpcontent .loginpress-addons-wrap{
padding: 0px 20px 0 0;
max-width: 1370px;
width: 100%;
margin: 0 auto;
box-sizing: border-box;
}
.loginpress_page_loginpress-addons{
background-color: #F6F9FF;
}
.loginpress-extension p:empty {
display: none;
}
#wpbody-content .loginpress-extension p:has(.button-primary) {
margin-top: auto;
padding-top: 30px;
padding-bottom: 0;
text-align: center;
}
#wpbody-content .loginpress-extension .button-primary{
border:0;
text-shadow:none;
background: #516885;
padding: 12px 18px;
height:auto;
font-size:15px;
cursor: pointer;
box-shadow:none;
border-radius:5px;
transition: background-color .3s;
font-size: 16px;
line-height: 24px;
color: #fff;
font-family: "Poppins", sans-serif;
font-weight: 500;
text-decoration: none;
margin-top: auto;
width: 100%;
}
#wpbody-content .loginpress-extension .button-primary:active,
#wpbody-content .loginpress-extension .button-primary:hover,
#wpbody-content .loginpress-extension .button-primary:focus{
background: #2B3D54;
box-shadow: none;
outline: none;
}
.notice_msg{
box-shadow: rgba(0, 0, 0, 0.1) 0px 1px 1px 0px;
background: rgb(255, 255, 255);
border-left: 4px solid #46b450;
margin: 5px 0 20px;
padding: 15px;
}
.loginpress-extension button.button-primary{
background: #f9fafa;
border-radius: 0;
box-shadow: none;
color: #444;
}
.loginpress-extension button.button-primary:visited,
.loginpress-extension button.button-primary:active,
.loginpress-extension button.button-primary:hover,
.loginpress-extension button.button-primary:focus{
background: #36bcf2;
color: #444;
border: 0;
outline: none;
box-shadow: none;
}
.logoinpress_addons_thumbnails{
max-width: 100px;
position: absolute;
top: 5px;
inset-inline-start: 10px;
height: auto;
width: auto;
max-height: 75px;
position: static;
vertical-align: middle;
margin-inline-end: 20px;
margin-top: 0;
}
.loginpress-extension p {
margin: 0;
padding: 15px 0 0;
color: #5C7697;
font-family: Poppins;
font-weight: 400;
font-style: Regular;
line-height: 1.5;
letter-spacing: 0%;
}
.loginpress-addons-loading-errors {
padding-top: 15px;
}
.loginpress-addons-loading-errors img {
float: left;
padding-right: 10px;
}
.loginpress-free-add-ons h3:after{
content: "Free";
position: absolute;
top: -15px;
right: -50px;
width: 100px;
height: 30px;
background-color: #14AE5C;
color: #fff;
transform: rotate(45deg);
line-height: 30px;
text-align: center;
font-size: 16px;
font-weight: 600;
font-family: Poppins, Arial, Helvetica, sans-serif;
}
.loginpress-extension .logoinpress_addons_links{
position: relative;
text-decoration: none !important;
display: inline-block;
width: 100%;
padding-bottom: 0px;
height: auto;
}
@media only screen and (max-width: 1400px) {
.loginpress-extension{
width: calc(50% - 15px);
}
}
@media only screen and (max-width: 670px) {
.loginpress-extension:nth-child(n){
width:100%;
margin: 0 0 20px;
}
.addon_cards_wraper{
margin: 0;
}
}
.loginpress-addon-enable{
position: absolute;
top: -2px;;
left: -2px;
bottom: -2px;
right: -2px;
background: #fff;
z-index: 100;
}
.loginpress-logo-container{
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
width: 250px;
height: 250px;
display: flex;
flex-direction: column;
align-items: center;
}
.loginpress-logo-container img{
height: auto;
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
width: 100%;
max-width: 64px;
}
.loginpress-addon-enable p{
font-weight: 700;
position: absolute;
bottom: 15px;
left: 0;
width: 100%;
text-align: center;
box-sizing: border-box;
}
.loader-path {
stroke-dasharray: 150,200;
stroke-dashoffset: -10;
-webkit-animation: dash 1.5s ease-in-out infinite, color 6s ease-in-out infinite;
animation: dash 1.5s ease-in-out infinite, color 6s ease-in-out infinite;
stroke-linecap: round;
}
@-webkit-keyframes rotate {
100% {
-webkit-transform: rotate(360deg);
transform: rotate(360deg);
}
}
@keyframes rotate {
100% {
-webkit-transform: rotate(360deg);
transform: rotate(360deg);
}
}
.circular-loader{
-webkit-animation: rotate 2s ease-in-out infinite, color 6s ease-in-out infinite;
animation: rotate 2s ease-in-out infinite, color 6s ease-in-out infinite;
stroke-linecap: round;
}
@keyframes loader-spin {
0% {
transform: rotate(0deg);
}
100% {
transform: rotate(360deg);
}
}
@keyframes dash {
0% {
stroke-dasharray: 1,200;
stroke-dashoffset: 0;
}
50% {
stroke-dasharray: 89,200;
stroke-dashoffset: -35;
}
100% {
stroke-dasharray: 89,200;
stroke-dashoffset: -124;
}
}
.loginpress-install,.loginpress-uninstall,.loginpress-uninstalling, .loginpress-wrong{
position: absolute;
top: -2px;;
left: -2px;
bottom: -2px;
right: -2px;
background: rgb(255,255,255);
z-index: 100;
}
.loader-path2{
stroke-dasharray: 150,200;
stroke-dashoffset: 150px;
-webkit-animation: dashtwo 1s ease-in-out 1 forwards;
animation: dashtwo 1s ease-in-out 1 forwards;
}
.checkmark__circle {
stroke-width: 2;
stroke: #ff0000;
}
.checkmark_login {
width: 150px;
height: 150px;
border-radius: 50%;
display: block;
stroke-width: 2;
stroke: #fff;
stroke-miterlimit: 10;
margin: 10% auto;
animation: scale .3s ease-in-out .2s both;
position: absolute;
top: 50%;
left: 50%;
margin: -75px 0 0 -75px;
}
.checkmark__check {
transform-origin: 50% 50%;
stroke-dasharray: 29;
stroke-dashoffset: 29;
animation: stroke 0.3s cubic-bezier(0.65, 0, 0.45, 1) 0.5s forwards;
}
@keyframes stroke {
100% {
stroke-dashoffset: 0;
}
}
@keyframes scale {
0%, 100% {
transform: none;
}
50% {
transform: scale3d(1.1, 1.1, 1);
}
}
@keyframes fill {
100% {
box-shadow: inset 0px 0px 0px 30px #7ac142;
}
}
@keyframes dashtwo {
0% {
stroke-dashoffset: 150px;
}
100% {
stroke-dashoffset: 20px;
}
}
.circular-loader2, .circular-loader3{
width: 200px;
height: 200px;
top: 50%;
left: 50%;
transform: translate(-50%, -50%) rotate(-90deg);
position: absolute;
}
.loginpress-install.activated p{
position: absolute;
bottom: 15px;
left: 0;
text-align: center;
width: 100%;
box-sizing: border-box;
}
.loginpress-wrong.activated p{
position: absolute;
bottom: 15px;
left: 0;
text-align: center;
width: 100%;
box-sizing: border-box;
color: #ff0000;
font-weight: 700;
}
.checkmark {
top: 50%;
position: absolute;
left: 50%;
transform: translate(-50%, -50%);
width: 140px;
height: 140px;
}
.checkmark.draw:after {
animation-duration: 800ms;
animation-delay: 1s;
animation-timing-function: ease;
animation-name: checkmark;
transform: scaleX(-1) rotate(135deg);
opacity: 0;
animation-fill-mode: forwards;
}
.checkmark:after {
height: 4em;
width: 2em;
transform-origin: left top;
border-right: 4px solid #00c853;
border-top: 4px solid #00c853;
content: '';
left: 42px;
top: 70px;
position: absolute;
}
.loginpress-uninstall .checkmark:after{
border-right: 4px solid #ff0000;
border-top: 4px solid #ff0000;
}
.loginpress-uninstall p, .loginpress-uninstalling p{
position: absolute;
bottom: 15px;
left: 0;
text-align: center;
width: 100%;
box-sizing: border-box;
}
@keyframes checkmark {
0% {
height: 0;
width: 0;
opacity: 1;
}
20% {
height: 0;
width: 2em;
opacity: 1;
}
40% {
height: 4em;
width: 2em;
opacity: 1;
}
100% {
height: 4em;
width: 2em;
opacity: 1;
}
}
.loginpress-extension input[type="checkbox"]{
display: none;
}
.loginpress-extension .loginpress-radio-btn{
outline: 0;
display: block;
width: 36px;
height: 18px;
position: relative;
cursor: pointer;
-webkit-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
}
.loginpress-extension input[type=checkbox].loginpress-radio-ios + .loginpress-radio-btn {
background: #fff;
border-radius: 2em;
padding: 2px;
-webkit-transition: all .4s ease;
transition: all .4s ease;
border: 2px solid #D2DDF2;
position: absolute;
bottom: 20px;
left: 50%;
transform: translateX(-50%);
}
.loginpress-extension input[type=checkbox].loginpress-radio + .loginpress-radio-btn:after{
position: relative;
display: block;
content: "";
width: 18px;
height: 18px;
}
.loginpress-extension input[type=checkbox].loginpress-radio-ios + .loginpress-radio-btn:after {
border-radius: 2em;
background: #fbfbfb;
-webkit-transition: left 0.3s cubic-bezier(0.175, 0.885, 0.32, 1.275), padding 0.3s ease, margin 0.3s ease;
transition: left 0.3s cubic-bezier(0.175, 0.885, 0.32, 1.275), padding 0.3s ease, margin 0.3s ease;
border: 2px solid #D2DDF2;
box-sizing: border-box;
left: 0;
}
.loginpress-extension input[type=checkbox].loginpress-radio + .loginpress-radio-btn:hover {
background-color: #e2e4e7;
}
.loginpress-extension input[type=checkbox].loginpress-radio-ios + .loginpress-radio-btn:active:after {
border-width: 9px;
}
.loginpress-extension input[type=checkbox].loginpress-radio:checked + .loginpress-radio-btn:after {
left: 18px;
border-color: #fff;
background: #33b3db;
border-width: 9px;
}
.loginpress-extension input[type=checkbox].loginpress-radio:checked + .loginpress-radio-btn{
background: #07003B;
border-color: #07003B;
}
</style>
<div class="wrap loginpress-addons-wrap">
<h2 class="opt-title"><?php esc_html_e( 'Extend the functionality of LoginPress with these awesome Add-ons', 'loginpress' ); ?></h2>
<div class="tabwrapper">
<?php $this->show_addon_page(); ?>
</div>
</div>
<?php
}
}
}