update
@@ -0,0 +1,57 @@
|
||||
body.ppwp-sitewide-protection {
|
||||
background: #2a2c2e url("<?php echo esc_url( ppw_get_background_image( 'sw-default1.jpg' ) ); ?>") no-repeat center/cover !important;
|
||||
}
|
||||
|
||||
.pda-form-login {
|
||||
width: 50%;
|
||||
height: 100%;
|
||||
position: relative;
|
||||
margin: 0 0 0 auto;
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
.ppwp-countdown-container {
|
||||
position: absolute;
|
||||
bottom: 0;
|
||||
right: 2px;
|
||||
width: 50%;
|
||||
}
|
||||
|
||||
.pda-form-login a.ppw-swp-logo {
|
||||
top: 22%;
|
||||
position: absolute;
|
||||
left: 50%;
|
||||
transform: translate(-50%, -50%);
|
||||
}
|
||||
|
||||
.pda-form-login form {
|
||||
position: absolute;
|
||||
width: 350px;
|
||||
left: 50%;
|
||||
transform: translate(-50%, -50%);
|
||||
top: 50%;
|
||||
padding: 3rem;
|
||||
background: #0404047a;
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
.pda-form-login .input_wp_protect_password,
|
||||
.pda-form-login .button-login {
|
||||
width: 100%;
|
||||
padding: .8rem;
|
||||
border: 1px solid #001428;
|
||||
outline: 0;
|
||||
font-size: 1rem;
|
||||
}
|
||||
|
||||
.pda-form-login .input_wp_protect_password {
|
||||
background: #acb2c9;
|
||||
margin-bottom: 1.5rem;
|
||||
}
|
||||
|
||||
.pda-form-login .button-login {
|
||||
text-transform: uppercase;
|
||||
font-weight: 700;
|
||||
background: #001428;
|
||||
border-color: #fff;
|
||||
}
|
||||
@@ -0,0 +1,95 @@
|
||||
body.ppwp-sitewide-protection {
|
||||
background: #2a2c2e url("<?php echo esc_url( ppw_get_background_image( 'sw-default2.jpg' ) ); ?>") no-repeat center/cover !important;
|
||||
}
|
||||
|
||||
.pda-form-login {
|
||||
width: 50%;
|
||||
height: 100%;
|
||||
position: relative;
|
||||
left: 0;
|
||||
margin: 0 0 0 auto;
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
.ppwp-countdown-container {
|
||||
position: absolute;
|
||||
bottom: 0;
|
||||
right: 2px;
|
||||
width: 50%;
|
||||
margin: 0 0 0 auto;
|
||||
}
|
||||
|
||||
.pda-form-login form {
|
||||
max-width: 350px;
|
||||
top: 50%;
|
||||
left: 50%;
|
||||
transform: translate(-50%, -50%);
|
||||
position: relative;
|
||||
padding: 2rem;
|
||||
overflow: hidden;
|
||||
background: #111;
|
||||
border-radius: 0.4em;
|
||||
border: 1px solid #191919;
|
||||
box-shadow: 1px 1px 78px #171717;
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
.pda-form-login a.ppw-swp-logo {
|
||||
top: 26%;
|
||||
position: absolute;
|
||||
left: 50%;
|
||||
transform: translate(-50%, -50%);
|
||||
}
|
||||
|
||||
.pda-form-login form:before {
|
||||
content: "";
|
||||
width: 8px;
|
||||
height: 5px;
|
||||
position: absolute;
|
||||
left: 34%;
|
||||
top: -7px;
|
||||
border-radius: 50%;
|
||||
box-shadow: 0 0 6px 4px #fff;
|
||||
}
|
||||
|
||||
.pda-form-login form:after {
|
||||
content: "";
|
||||
width: 400px;
|
||||
height: 200px;
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 35px;
|
||||
transform: rotate(75deg);
|
||||
background: linear-gradient(50deg, rgba(255, 255, 255, 0.15), transparent);
|
||||
opacity: .4;
|
||||
z-index: -1;
|
||||
}
|
||||
|
||||
.pda-form-login .input_wp_protect_password {
|
||||
padding: .8rem;
|
||||
background: linear-gradient(#1f2124, #27292c);
|
||||
border: 1px solid #000;
|
||||
box-shadow: 0 1px 0 rgba(255, 255, 255, 0.1);
|
||||
border-radius: 3px;
|
||||
color: #fff;
|
||||
padding-right: 2.5rem;
|
||||
}
|
||||
|
||||
.pda-form-login .input_wp_protect_password:focus {
|
||||
box-shadow: inset 0 0 2px #000;
|
||||
background: #494d54;
|
||||
outline: none;
|
||||
}
|
||||
|
||||
.pda-form-login .button-login {
|
||||
width: 100%;
|
||||
border: 1px solid rgba(0, 0, 0, 0.4);
|
||||
box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.3), inset 0 10px 10px rgba(255, 255, 255, 0.1);
|
||||
border-radius: 3px;
|
||||
background: #218dd6;
|
||||
cursor: pointer;
|
||||
font-weight: 700;
|
||||
font-size: 15px;
|
||||
text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.8);
|
||||
margin-top: 1rem;
|
||||
}
|
||||
@@ -0,0 +1,63 @@
|
||||
body.ppwp-sitewide-protection {
|
||||
background: #2a2c2e url("<?php echo esc_url( ppw_get_background_image( 'sw-default3.jpg' ) ); ?>") no-repeat center/cover !important;
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
.pda-form-login {
|
||||
width: 50%;
|
||||
background: #ffffffc4;
|
||||
height: 100%;
|
||||
position: relative;
|
||||
box-shadow: 0 1px 13px #ECEBEB;
|
||||
left: 0;
|
||||
margin: 0;
|
||||
padding-top:0;
|
||||
}
|
||||
|
||||
.ppwp-countdown-container {
|
||||
position: absolute;
|
||||
bottom: 0;
|
||||
width: 50%;
|
||||
margin: 0 0 0 auto;
|
||||
}
|
||||
|
||||
.pda-form-login a.ppw-swp-logo {
|
||||
top: 32%;
|
||||
position: absolute;
|
||||
left: 50%;
|
||||
transform: translate(-50%, -50%);
|
||||
}
|
||||
|
||||
.pda-form-login form {
|
||||
position: absolute;
|
||||
max-width: 350px;
|
||||
top: 50%;
|
||||
left: 50%;
|
||||
transform: translate(-50%, -50%);
|
||||
text-align: center;
|
||||
background: transparent;
|
||||
box-shadow: 0 0 black;
|
||||
}
|
||||
|
||||
.pda-form-login .input_wp_protect_password {
|
||||
width: 100%;
|
||||
font-size: 1rem;
|
||||
outline: 0;
|
||||
border-radius: 30px;
|
||||
border: 2px solid #d0cece;
|
||||
padding: 1rem 3.5rem 1rem 1.5rem;
|
||||
background: white;
|
||||
}
|
||||
.pda-form-login .button-login {
|
||||
margin-top: 1rem;
|
||||
text-transform: uppercase;
|
||||
font-weight: 700;
|
||||
color: #fff;
|
||||
border-color: #cac8c7;
|
||||
border-radius: 30px;
|
||||
width: 40%;
|
||||
text-align: center;
|
||||
padding: .8rem;
|
||||
background: #7d7974;
|
||||
box-shadow: 2px 4px 1px #cac8c7;
|
||||
}
|
||||
|
After Width: | Height: | Size: 230 KiB |
|
After Width: | Height: | Size: 2.1 MiB |
|
After Width: | Height: | Size: 459 KiB |
|
After Width: | Height: | Size: 4.4 KiB |
|
After Width: | Height: | Size: 47 KiB |
|
After Width: | Height: | Size: 50 KiB |
|
After Width: | Height: | Size: 45 KiB |
@@ -0,0 +1,4 @@
|
||||
.datetime .customize-control-error-message {
|
||||
color: red;
|
||||
display: none;
|
||||
}
|
||||
@@ -0,0 +1,32 @@
|
||||
( function( $, api ) {
|
||||
|
||||
api.controlConstructor['datetime'] = api.Control.extend( {
|
||||
|
||||
ready: function() {
|
||||
var control = this;
|
||||
this.container.on( 'change', 'input[type="datetime-local"]', function() {
|
||||
if (control.params.id === 'ppwp_sitewide_start_time' && this.value ) {
|
||||
var endTime = document.getElementById("datetime-ppwp_sitewide_end_time");
|
||||
endTime.min = this.value;
|
||||
}
|
||||
if (control.params.id === 'ppwp_sitewide_start_time' && !this.value ) {
|
||||
var endTime = document.getElementById("datetime-ppwp_sitewide_end_time");
|
||||
endTime.min = this.min;
|
||||
}
|
||||
if (control.params.id === 'ppwp_sitewide_end_time' ) {
|
||||
document.getElementById('datetime-ppwp_sitewide_end_time-error-message').style.display = 'none';
|
||||
var startTime = document.getElementById("datetime-ppwp_sitewide_start_time").value;
|
||||
var countDownDateStart = new Date(startTime).getTime();
|
||||
var countDownDateEnd = new Date(this.value).getTime();
|
||||
if ( countDownDateStart > countDownDateEnd ) {
|
||||
document.getElementById('datetime-ppwp_sitewide_end_time-error-message').style.display = 'block';
|
||||
}
|
||||
}
|
||||
value = this.value;
|
||||
control.setting.set( value );
|
||||
} );
|
||||
}
|
||||
|
||||
} );
|
||||
|
||||
} )( jQuery, wp.customize );
|
||||
@@ -0,0 +1,40 @@
|
||||
.control-title--wrapper span.customize-control-title {
|
||||
margin: 0px -12px;
|
||||
border: 1px solid #ddd;
|
||||
padding: 13px;
|
||||
font-size: 13px;
|
||||
font-weight: 600;
|
||||
letter-spacing: 2px;
|
||||
line-height: 1;
|
||||
text-transform: uppercase;
|
||||
color: #555;
|
||||
background-color: #fff;
|
||||
margin-top: 8px;
|
||||
}
|
||||
|
||||
#accordion-panel-ppwp {
|
||||
margin-top: 1rem;
|
||||
}
|
||||
|
||||
#accordion-panel-ppwp h3 {
|
||||
border-top: 1px solid #ddd;
|
||||
}
|
||||
|
||||
#accordion-section-ppwp_upsell {
|
||||
margin-bottom: 1rem;
|
||||
}
|
||||
|
||||
#accordion-section-ppwp_upsell .ppwp-accordion-section-title {
|
||||
color: #f78935!important;
|
||||
border-left-color: #f78935!important;
|
||||
}
|
||||
|
||||
#accordion-section-ppwp_upsell .ppwp-accordion-section-title a {
|
||||
color: #f78935!important;
|
||||
text-decoration: none;
|
||||
display: block;
|
||||
}
|
||||
|
||||
#accordion-section-ppwp_upsell .accordion-section-title:after {
|
||||
color: #f78935!important;
|
||||
}
|
||||
@@ -0,0 +1,107 @@
|
||||
.customize-control-toggle .toggle--wrapper {
|
||||
display: -webkit-box;
|
||||
display: -webkit-flex;
|
||||
display: -ms-flexbox;
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
|
||||
-webkit-box-direction: normal;
|
||||
-webkit-box-orient: horizontal;
|
||||
-webkit-box-pack: start;
|
||||
-webkit-flex-direction: row;
|
||||
-ms-flex-direction: row;
|
||||
-ms-flex-pack: start;
|
||||
-webkit-justify-content: flex-start;
|
||||
justify-content: flex-start;
|
||||
margin-bottom: 10px;
|
||||
align-items: baseline;
|
||||
}
|
||||
|
||||
.customize-control-toggle .toggle--wrapper .customize-control-title {
|
||||
font-weight: 600;
|
||||
margin-bottom: 0px;
|
||||
vertical-align: middle;
|
||||
-webkit-box-flex: 2;
|
||||
-webkit-flex: 2 0 0;
|
||||
-ms-flex: 2 0 0;
|
||||
flex: 2 0 0;
|
||||
}
|
||||
|
||||
.customize-control-toggle .toggle--wrapper input[type=checkbox] {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.customize-control-toggle {
|
||||
margin-bottom: 0
|
||||
}
|
||||
|
||||
.customize-control-toggle .toggle--wrapper label {
|
||||
background-color: #555d66;
|
||||
border-radius: 14px;
|
||||
cursor: pointer;
|
||||
display: inline-block;
|
||||
height: 20px;
|
||||
outline: none;
|
||||
position: relative;
|
||||
right: 0px;
|
||||
top: 2px;
|
||||
-webkit-transition: background 0.2s ease;
|
||||
transition: background 0.2s ease;
|
||||
-webkit-user-select: none;
|
||||
-moz-user-select: none;
|
||||
-ms-user-select: none;
|
||||
user-select: none;
|
||||
width: 34px;
|
||||
}
|
||||
|
||||
.customize-control-toggle .toggle--wrapper label::after,
|
||||
.customize-control-toggle .toggle--wrapper label::before {
|
||||
content: "";
|
||||
display: block;
|
||||
position: absolute;
|
||||
}
|
||||
|
||||
.customize-control-toggle .toggle--wrapper label::after {
|
||||
border: 2px solid #555d66;
|
||||
border-radius: 50%;
|
||||
box-sizing: border-box;
|
||||
height: 12px;
|
||||
left: 4px;
|
||||
top: 4px;
|
||||
-webkit-transition: background 0.2s ease, -webkit-transform 0.2s ease;
|
||||
transition: background 0.2s ease, -webkit-transform 0.2s ease;
|
||||
transition: transform 0.2s ease, background 0.2s ease;
|
||||
transition: transform 0.2s ease, background 0.2s ease, -webkit-transform 0.2s ease;
|
||||
width: 12px;
|
||||
}
|
||||
|
||||
.customize-control-toggle .toggle--wrapper label::before {
|
||||
background-color: #eee;
|
||||
border-radius: 60px;
|
||||
bottom: 2px;
|
||||
left: 2px;
|
||||
right: 2px;
|
||||
top: 2px;
|
||||
-webkit-transition: background 0.2s ease;
|
||||
transition: background 0.2s ease;
|
||||
}
|
||||
|
||||
.customize-control-toggle .toggle--wrapper input[type=checkbox]:checked + label {
|
||||
background-color: #f78935;
|
||||
}
|
||||
|
||||
.customize-control-toggle .toggle--wrapper input[type=checkbox]:checked + label::after {
|
||||
background-color: #f78935;
|
||||
border: 2px solid #fff;
|
||||
-webkit-transform: translateX(14px);
|
||||
-ms-transform: translateX(14px);
|
||||
transform: translateX(14px);
|
||||
}
|
||||
|
||||
.customize-control-toggle .toggle--wrapper input[type=checkbox]:checked + label::before {
|
||||
background-color: #f78935;
|
||||
}
|
||||
|
||||
.customize-control-toggle:hover .toggle--wrapper label::before {
|
||||
background-color: #fdefe4;
|
||||
}
|
||||
@@ -0,0 +1,16 @@
|
||||
( function( $, api ) {
|
||||
|
||||
api.controlConstructor['toggle'] = api.Control.extend( {
|
||||
|
||||
ready: function() {
|
||||
var control = this;
|
||||
|
||||
this.container.on( 'change', 'input:checkbox', function() {
|
||||
value = this.checked ? true : false;
|
||||
control.setting.set( value );
|
||||
} );
|
||||
}
|
||||
|
||||
} );
|
||||
|
||||
} )( jQuery, wp.customize );
|
||||
@@ -0,0 +1,12 @@
|
||||
( function( $, api ) {
|
||||
api.sectionConstructor['ppwp-upsell-section'] = api.Section.extend( {
|
||||
|
||||
// No events for this type of section.
|
||||
attachEvents: function () {},
|
||||
|
||||
// Always make the section active.
|
||||
isContextuallyActive: function () {
|
||||
return true;
|
||||
}
|
||||
} );
|
||||
} )( jQuery, wp.customize );
|
||||
@@ -0,0 +1,39 @@
|
||||
<?php
|
||||
|
||||
if ( ! defined( 'ABSPATH' ) ) {
|
||||
exit;
|
||||
}
|
||||
|
||||
if ( class_exists( 'WP_Customize_Section' ) && ! class_exists( 'PPW_Customize_Link_Section' ) ) {
|
||||
|
||||
/**
|
||||
* PPW_Customize_Link_Section Initial setup
|
||||
*/
|
||||
class PPW_Customize_Link_Section extends WP_Customize_Section {
|
||||
public $type = 'ppwp-upsell-section';
|
||||
public $ppwp_url = '';
|
||||
public $ppwp_text = '';
|
||||
public $id = '';
|
||||
|
||||
public function json() {
|
||||
$json = parent::json();
|
||||
$json['ppwp_text'] = $this->ppwp_text;
|
||||
$json['ppwp_url'] = esc_url( $this->ppwp_url );
|
||||
$json['id'] = $this->id;
|
||||
|
||||
return $json;
|
||||
}
|
||||
|
||||
protected function render_template() {
|
||||
?>
|
||||
<li id="accordion-section-{{ data.id }}"
|
||||
class="ppwp-accordion-section accordion-section control-section control-panel control-panel-default">
|
||||
<h3 class="ppwp-accordion-section-title accordion-section-title"><a href="{{{ data.ppwp_url }}}"
|
||||
target="_blank">{{ data.ppwp_text
|
||||
}}</a></h3>
|
||||
</li>
|
||||
<?php
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
@@ -0,0 +1,100 @@
|
||||
<?php
|
||||
/**
|
||||
* datetime Customizer Control
|
||||
*/
|
||||
|
||||
// Exit if accessed directly.
|
||||
if ( ! defined( 'ABSPATH' ) ) {
|
||||
exit;
|
||||
}
|
||||
|
||||
// Exit if WP_Customize_Control does not exsist.
|
||||
if ( ! class_exists( 'WP_Customize_Control' ) ) {
|
||||
return null;
|
||||
}
|
||||
|
||||
/**
|
||||
* This class is for the datetime control in the Customizer.
|
||||
*
|
||||
* @access public
|
||||
*/
|
||||
|
||||
class PPW_Datetime_Control extends WP_Customize_Control {
|
||||
|
||||
/**
|
||||
* The type of customize control.
|
||||
*
|
||||
* @access public
|
||||
* @since 1.3.4
|
||||
* @var string
|
||||
*/
|
||||
public $type = 'datetime';
|
||||
|
||||
/**
|
||||
* Enqueue scripts and styles.
|
||||
*
|
||||
* @access public
|
||||
* @since 1.0.0
|
||||
* @return void
|
||||
*/
|
||||
public function enqueue() {
|
||||
wp_enqueue_style( 'ppw-designer-datetime-control-styles', PPW_DIR_URL . 'includes/customizers/assets/ppw-datetime.css', false, PPW_VERSION, 'all' );
|
||||
wp_enqueue_script( 'ppw-designer-datetime-control-scripts', PPW_DIR_URL . 'includes/customizers/assets/ppw-datetime.js', array( 'jquery' ), PPW_VERSION, true );
|
||||
}
|
||||
|
||||
/**
|
||||
* Add custom parameters to pass to the JS via JSON.
|
||||
*
|
||||
* @access public
|
||||
* @since 1.0.0
|
||||
* @return void
|
||||
*/
|
||||
public function to_json() {
|
||||
parent::to_json();
|
||||
|
||||
// The setting value.
|
||||
$this->json['id'] = $this->id;
|
||||
$this->json['value'] = $this->value();
|
||||
$this->json['min'] = date('Y-m-d\TH:i', current_time( 'timestamp' ));
|
||||
}
|
||||
|
||||
/**
|
||||
* Don't render the content via PHP. This control is handled with a JS template.
|
||||
*
|
||||
* @access public
|
||||
* @since 1.0.0
|
||||
* @return void
|
||||
*/
|
||||
public function render_content() {}
|
||||
|
||||
/**
|
||||
* An Underscore (JS) template for this control's content.
|
||||
*
|
||||
* Class variables for this control class are available in the `data` JS object;
|
||||
* export custom variables by overriding {@see WP_Customize_Control::to_json()}.
|
||||
*
|
||||
* @see WP_Customize_Control::print_template()
|
||||
*
|
||||
* @access protected
|
||||
* @since 1.3.4
|
||||
* @return void
|
||||
*/
|
||||
protected function content_template() {
|
||||
?>
|
||||
<label class="datetime">
|
||||
<div class="datetime--wrapper">
|
||||
<# if ( data.label ) { #>
|
||||
<span class="customize-control-title">{{ data.label }}</span>
|
||||
<# } #>
|
||||
<# if ( data.description ) { #>
|
||||
<span class="customize-control-description"><span>Note:</span> {{ data.description }}</span>
|
||||
<# } #>
|
||||
<input type="datetime-local" id="datetime-{{ data.id }}" name="datetime" min="{{ data.min }}" value="{{ data.value }}">
|
||||
<label for="datetime-{{ data.id }}" class="datetime-label"></label>
|
||||
</div>
|
||||
|
||||
<span id="datetime-{{ data.id }}-error-message" class="customize-control-error-message">Input wrong value.</span>
|
||||
</label>
|
||||
<?php
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,287 @@
|
||||
<?php
|
||||
// Exit if accessed directly.
|
||||
if ( ! defined( 'ABSPATH' ) ) {
|
||||
exit;
|
||||
}
|
||||
|
||||
// Exit if WP_Customize_Control does not exsist.
|
||||
if ( ! class_exists( 'WP_Customize_Control' ) ) {
|
||||
return null;
|
||||
}
|
||||
|
||||
class PPW_Presets_Control extends WP_Customize_Control {
|
||||
/**
|
||||
* @var string Control type
|
||||
*/
|
||||
public $type = 'ppw-presets';
|
||||
|
||||
/**
|
||||
* Render the content on the theme customizer page.
|
||||
*/
|
||||
public function render_content() {
|
||||
if ( empty( $this->choices ) ) {
|
||||
return;
|
||||
}
|
||||
$name = 'password-protect-page_preset-' . $this->id; ?>
|
||||
|
||||
<span class="customize-control-title">
|
||||
<?php echo esc_attr( $this->label ); ?>
|
||||
<?php if ( ! empty( $this->description ) ) : ?>
|
||||
<span class="description customize-control-description"><?php echo esc_html( $this->description ); ?></span>
|
||||
<?php endif; ?>
|
||||
</span>
|
||||
|
||||
<div id="input_<?php echo esc_attr( $this->id ); ?>" class="image">
|
||||
<?php foreach ( $this->choices as $val ) : ?>
|
||||
<div class="password-protect-page_thumbnail">
|
||||
<input class="image-select" type="radio"
|
||||
value="<?php echo esc_attr( $val['id'] ); ?>"
|
||||
id="<?php echo esc_attr($this->id . $val['id']); ?>"
|
||||
name="<?php echo esc_attr( $name ); ?>" <?php checked( $this->value(), $val['id'] ); ?> />
|
||||
<label for="<?php echo esc_attr($this->id . $val['id']); ?>">
|
||||
<div class="password-protect-page_thumbnail_img">
|
||||
<img src="<?php echo esc_url($val['thumbnail']); ?>" alt="<?php echo esc_attr( $val['id'] ); ?>"
|
||||
title="<?php echo esc_attr( $val['id'] ); ?>">
|
||||
</div>
|
||||
<h3><?php echo esc_html( $val['name'] ) ?></h3>
|
||||
</label>
|
||||
|
||||
</div>
|
||||
<?php endforeach; ?>
|
||||
</div>
|
||||
|
||||
<input name='presets_hidden' type="hidden" <?php $this->link(); ?> value="<?php echo esc_attr( $this->value() ); ?>"/>
|
||||
<?php }
|
||||
}
|
||||
|
||||
function ppw_presets_control_css() {
|
||||
?>
|
||||
<style>
|
||||
.customize-control-ppw-presets .image.ui-buttonset input[type=radio] {
|
||||
height: auto;
|
||||
}
|
||||
.customize-control-ppw-presets .image.ui-buttonset label {
|
||||
display: inline-block;
|
||||
margin-right: 5px;
|
||||
margin-bottom: 5px;
|
||||
}
|
||||
.customize-control-ppw-presets .image.ui-buttonset label.ui-state-active {
|
||||
background: none;
|
||||
}
|
||||
.customize-control-ppw-presets .customize-control-radio-buttonset label {
|
||||
padding: 5px 10px;
|
||||
background: #f7f7f7;
|
||||
border-left: 1px solid #dedede;
|
||||
line-height: 35px;
|
||||
}
|
||||
.customize-control-ppw-presets label img {
|
||||
border: 1px solid #bbb;
|
||||
opacity: 0.5;
|
||||
}
|
||||
#customize-controls .customize-control-ppw-presets label img {
|
||||
max-width: 250px;
|
||||
height: auto;
|
||||
width: 100%;
|
||||
margin-bottom: 0;
|
||||
border: 0;
|
||||
display: block;
|
||||
}
|
||||
.customize-control-ppw-presets label.ui-state-active img {
|
||||
background: #dedede;
|
||||
border-color: #000;
|
||||
opacity: 1;
|
||||
margin-bottom: 0;
|
||||
}
|
||||
.customize-control-ppw-presets label.ui-state-hover img {
|
||||
opacity: 0.9;
|
||||
border-color: #999;
|
||||
}
|
||||
.customize-control-radio-buttonset label.ui-corner-left {
|
||||
border-radius: 3px 0 0 3px;
|
||||
border-left: 0;
|
||||
}
|
||||
.customize-control-radio-buttonset label.ui-corner-right {
|
||||
border-radius: 0 3px 3px 0;
|
||||
}
|
||||
#customize-control-ppw_customize_presets_settings input[type=radio]{
|
||||
display: none;
|
||||
}
|
||||
#customize-control-ppw_customize_presets_settings label{
|
||||
display: block;
|
||||
position: relative;
|
||||
width: 100%;
|
||||
}
|
||||
#customize-control-ppw_customize_presets_settings .password-protect-page_thumbnail{
|
||||
width: calc(50% - 10px);
|
||||
margin-bottom: 10px;
|
||||
position: relative;
|
||||
border: 5px solid transparent;
|
||||
-webkit-transition:all 0.2s ease-in-out;
|
||||
-moz-transition:all 0.2s ease-in-out;
|
||||
-ms-transition:all 0.2s ease-in-out;
|
||||
transition:all 0.2s ease-in-out;
|
||||
}
|
||||
#customize-control-ppw_customize_presets_settings .password-protect-page_thumbnail:nth-child(odd){
|
||||
float: left;
|
||||
}
|
||||
#customize-control-ppw_customize_presets_settings .password-protect-page_thumbnail:nth-child(even){
|
||||
float: right;
|
||||
}
|
||||
#customize-control-ppw_customize_presets_settings .image:after{
|
||||
content: '';
|
||||
display: table;
|
||||
clear: both;
|
||||
}
|
||||
#customize-control-ppw_customize_presets_settings h3{
|
||||
margin: 0;
|
||||
font: 400 14px 'Open Sans', Arial, Helvetica, sans-serif;
|
||||
line-height: 1.1;
|
||||
padding: 3px;
|
||||
text-align: center;
|
||||
background: #eee;
|
||||
color: #777777;
|
||||
}
|
||||
#customize-control-ppw_customize_presets_settings label .password-protect-page_thumbnail_img:after {
|
||||
content: '';
|
||||
width: 20px;
|
||||
height: 20px;
|
||||
border-radius: 50%;
|
||||
background: #ff8935;
|
||||
position: absolute;
|
||||
top: -5px;
|
||||
left: -5px;
|
||||
border-radius: 50%;
|
||||
visibility: hidden;
|
||||
}
|
||||
#customize-control-ppw_customize_presets_settings label .password-protect-page_thumbnail_img:before {
|
||||
height: 6px;
|
||||
width: 3px;
|
||||
-webkit-transform-origin: left top;
|
||||
-moz-transform-origin: left top;
|
||||
-ms-transform-origin: left top;
|
||||
-o-transform-origin: left top;
|
||||
transform-origin: left top;
|
||||
border-right: 3px solid white;
|
||||
border-top: 3px solid white;
|
||||
border-radius: 2.5px !important;
|
||||
content: '';
|
||||
position: absolute;
|
||||
z-index: 2;
|
||||
opacity: 0;
|
||||
margin-top: 0px;
|
||||
margin-left: -7px;
|
||||
top: 5px;
|
||||
left: 4px;
|
||||
}
|
||||
#customize-control-ppw_customize_presets_settings .password-protect-page_thumbnail_img{
|
||||
display: block;
|
||||
position: relative;
|
||||
}
|
||||
#customize-control-ppw_customize_presets_settings input[type="radio"]:checked + label .password-protect-page_thumbnail_img:before {
|
||||
-webkit-animation-delay: 100ms;
|
||||
-moz-animation-delay: 100ms;
|
||||
animation-delay: 100ms;
|
||||
-webkit-animation-duration: 1s;
|
||||
-moz-animation-duration: 1s;
|
||||
animation-duration: 1s;
|
||||
-webkit-animation-timing-function: ease;
|
||||
-moz-animation-timing-function: ease;
|
||||
animation-timing-function: ease;
|
||||
-webkit-animation-name: checkmark;
|
||||
-moz-animation-name: checkmark;
|
||||
animation-name: checkmark;
|
||||
-webkit-transform: scaleX(-1) rotate(135deg);
|
||||
-moz-transform: scaleX(-1) rotate(135deg);
|
||||
-ms-transform: scaleX(-1) rotate(135deg);
|
||||
-o-transform: scaleX(-1) rotate(135deg);
|
||||
transform: scaleX(-1) rotate(135deg);
|
||||
-webkit-animation-fill-mode: forwards;
|
||||
-moz-animation-fill-mode: forwards;
|
||||
animation-fill-mode: forwards;
|
||||
z-index: 2;
|
||||
}
|
||||
#customize-control-ppw_customize_presets_settings input[type="radio"]:checked + label .password-protect-page_thumbnail_img:after{
|
||||
visibility: visible;
|
||||
}
|
||||
#customize-control-ppw_customize_presets_settings img{
|
||||
margin-bottom: 0;
|
||||
}
|
||||
#customize-control-ppw_customize_presets_settings input[type="radio"]:checked + label img{
|
||||
opacity: 1;
|
||||
}
|
||||
#customize-control-ppw_customize_presets_settings .password-protect-page_thumbnail:hover{
|
||||
border-color: #ccc;
|
||||
}
|
||||
|
||||
@-webkit-keyframes checkmark {
|
||||
0% {
|
||||
height: 0;
|
||||
width: 0;
|
||||
opacity: 1;
|
||||
}
|
||||
20% {
|
||||
height: 0;
|
||||
width: 5px;
|
||||
opacity: 1;
|
||||
}
|
||||
40% {
|
||||
height: 10px;
|
||||
width: 5px;
|
||||
opacity: 1;
|
||||
}
|
||||
100% {
|
||||
height: 10px;
|
||||
width: 5px;
|
||||
opacity: 1;
|
||||
}
|
||||
}
|
||||
@-moz-keyframes checkmark {
|
||||
0% {
|
||||
height: 0;
|
||||
width: 0;
|
||||
opacity: 1;
|
||||
}
|
||||
20% {
|
||||
height: 0;
|
||||
width: 5px;
|
||||
opacity: 1;
|
||||
}
|
||||
40% {
|
||||
height: 10px;
|
||||
width: 5px;
|
||||
opacity: 1;
|
||||
}
|
||||
100% {
|
||||
height: 10px;
|
||||
width: 5px;
|
||||
opacity: 1;
|
||||
}
|
||||
}
|
||||
@keyframes checkmark {
|
||||
0% {
|
||||
height: 0;
|
||||
width: 0;
|
||||
opacity: 1;
|
||||
}
|
||||
20% {
|
||||
height: 0;
|
||||
width: 5px;
|
||||
opacity: 1;
|
||||
}
|
||||
40% {
|
||||
height: 10px;
|
||||
width: 5px;
|
||||
opacity: 1;
|
||||
}
|
||||
100% {
|
||||
height: 10px;
|
||||
width: 5px;
|
||||
opacity: 1;
|
||||
}
|
||||
}
|
||||
|
||||
</style>
|
||||
<?php
|
||||
}
|
||||
add_action( 'customize_controls_print_styles', 'ppw_presets_control_css' );
|
||||
?>
|
||||
@@ -0,0 +1,39 @@
|
||||
<?php
|
||||
// Exit if accessed directly.
|
||||
if ( ! defined( 'ABSPATH' ) ) {
|
||||
exit;
|
||||
}
|
||||
|
||||
// Exit if WP_Customize_Control does not exsist.
|
||||
if ( ! class_exists( 'WP_Customize_Control' ) ) {
|
||||
return null;
|
||||
}
|
||||
|
||||
class PPW_Text_Editor_Custom_Control extends WP_Customize_Control {
|
||||
/**
|
||||
* @var string Control type
|
||||
*/
|
||||
public $type = 'editor';
|
||||
|
||||
/**
|
||||
* Render the content on the theme customizer page.
|
||||
*/
|
||||
public function render_content() {
|
||||
$input_id = $this->id;
|
||||
?>
|
||||
<label>
|
||||
<span class="customize-control-title"><?php echo esc_html( $this->label ); ?></span>
|
||||
<span class="description customize-control-description"><?php echo esc_html( $this->description ); ?></span>
|
||||
</label>
|
||||
<input type="hidden" <?php echo esc_url( $this->get_link() ); ?> value="<?php echo esc_attr( $this->value() ); ?>">
|
||||
<?php
|
||||
wp_editor( $this->value(), $input_id, array(
|
||||
'textarea_name' => $input_id,
|
||||
'textarea_rows' => 3,
|
||||
) );
|
||||
do_action( 'admin_footer' );
|
||||
do_action( 'admin_print_footer_scripts' );
|
||||
?>
|
||||
<?php
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,39 @@
|
||||
<?php
|
||||
/**
|
||||
* Toggle Customizer Control
|
||||
*/
|
||||
|
||||
// Exit if accessed directly.
|
||||
if ( ! defined( 'ABSPATH' ) ) {
|
||||
exit;
|
||||
}
|
||||
|
||||
// Exit if WP_Customize_Control does not exsist.
|
||||
if ( ! class_exists( 'WP_Customize_Control' ) ) {
|
||||
return null;
|
||||
}
|
||||
|
||||
/**
|
||||
* This class is for the toggle control in the Customizer.
|
||||
*
|
||||
* @access public
|
||||
*/
|
||||
|
||||
class PPW_Title_Group_Control extends WP_Customize_Control {
|
||||
|
||||
public $type = 'control_title';
|
||||
|
||||
public function enqueue() {
|
||||
wp_enqueue_style( 'control-title-group-styles', PPW_DIR_URL . 'includes/customizers/assets/ppw-title-group-control.css', false, PPW_VERSION, 'all' );
|
||||
}
|
||||
|
||||
public function render_content() {}
|
||||
|
||||
protected function content_template() {
|
||||
?>
|
||||
<div class="control-title--wrapper">
|
||||
<span class="customize-control-title">{{ data.label }}</span>
|
||||
</div>
|
||||
<?php
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,102 @@
|
||||
<?php
|
||||
/**
|
||||
* Toggle Customizer Control
|
||||
*/
|
||||
|
||||
// Exit if accessed directly.
|
||||
if ( ! defined( 'ABSPATH' ) ) {
|
||||
exit;
|
||||
}
|
||||
|
||||
// Exit if WP_Customize_Control does not exsist.
|
||||
if ( ! class_exists( 'WP_Customize_Control' ) ) {
|
||||
return null;
|
||||
}
|
||||
|
||||
/**
|
||||
* This class is for the toggle control in the Customizer.
|
||||
*
|
||||
* @access public
|
||||
*/
|
||||
|
||||
class PPW_Toggle_Control extends WP_Customize_Control {
|
||||
|
||||
/**
|
||||
* The type of customize control.
|
||||
*
|
||||
* @access public
|
||||
* @since 1.3.4
|
||||
* @var string
|
||||
*/
|
||||
public $type = 'toggle';
|
||||
|
||||
/**
|
||||
* Enqueue scripts and styles.
|
||||
*
|
||||
* @access public
|
||||
* @since 1.0.0
|
||||
* @return void
|
||||
*/
|
||||
public function enqueue() {
|
||||
wp_enqueue_style( 'ppw-designer-toggle-control-styles', PPW_DIR_URL . 'includes/customizers/assets/ppw-toggle-control.css', false, PPW_VERSION, 'all' );
|
||||
wp_enqueue_script( 'ppw-designer-toggle-control-scripts', PPW_DIR_URL . 'includes/customizers/assets/ppw-toggle-control.js', array( 'jquery' ), PPW_VERSION, true );
|
||||
}
|
||||
|
||||
/**
|
||||
* Add custom parameters to pass to the JS via JSON.
|
||||
*
|
||||
* @access public
|
||||
* @since 1.0.0
|
||||
* @return void
|
||||
*/
|
||||
public function to_json() {
|
||||
parent::to_json();
|
||||
|
||||
// The setting value.
|
||||
$this->json['id'] = $this->id;
|
||||
$this->json['value'] = $this->value();
|
||||
$this->json['link'] = $this->get_link();
|
||||
$this->json['defaultValue'] = $this->setting->default;
|
||||
}
|
||||
|
||||
/**
|
||||
* Don't render the content via PHP. This control is handled with a JS template.
|
||||
*
|
||||
* @access public
|
||||
* @since 1.0.0
|
||||
* @return void
|
||||
*/
|
||||
public function render_content() {}
|
||||
|
||||
/**
|
||||
* An Underscore (JS) template for this control's content.
|
||||
*
|
||||
* Class variables for this control class are available in the `data` JS object;
|
||||
* export custom variables by overriding {@see WP_Customize_Control::to_json()}.
|
||||
*
|
||||
* @see WP_Customize_Control::print_template()
|
||||
*
|
||||
* @access protected
|
||||
* @since 1.3.4
|
||||
* @return void
|
||||
*/
|
||||
protected function content_template() {
|
||||
?>
|
||||
<label class="toggle">
|
||||
<div class="toggle--wrapper">
|
||||
|
||||
<# if ( data.label ) { #>
|
||||
<span class="customize-control-title">{{ data.label }}</span>
|
||||
<# } #>
|
||||
|
||||
<input id="toggle-{{ data.id }}" type="checkbox" class="toggle--input" value="{{ data.value }}" {{{ data.link }}} <# if ( data.value ) { #> checked="checked" <# } #> />
|
||||
<label for="toggle-{{ data.id }}" class="toggle--label"></label>
|
||||
</div>
|
||||
|
||||
<# if ( data.description ) { #>
|
||||
<span class="description customize-control-description">{{ data.description }}</span>
|
||||
<# } #>
|
||||
</label>
|
||||
<?php
|
||||
}
|
||||
}
|
||||