Initial commit: Atomaste website

Atomaste Reference/public_html/wp-content/themes/rara-business/inc/custom-controls/toggle/class-toggle-control.php

@@ -0,0 +1,65 @@
+<?php
+/**
+ * Customizer Control: toggle.
+ */
+
+// Exit if accessed directly.
+if ( ! defined( 'ABSPATH' ) ) {
+	exit;
+}
+
+if ( ! class_exists( 'Rara_Business_Toggle_Control' ) ) {
+
+	/**
+	 * Toggle control (modified checkbox).
+	 */
+	class Rara_Business_Toggle_Control extends WP_Customize_Control {
+
+		public $type = 'toggle';
+        
+        public $tooltip = '';
+        
+        public function to_json() {
+			parent::to_json();
+			
+            if ( isset( $this->default ) ) {
+				$this->json['default'] = $this->default;
+			} else {
+				$this->json['default'] = $this->setting->default;
+			}
+			
+            $this->json['value']   = $this->value();
+			$this->json['link']    = $this->get_link();
+            $this->json['id']      = $this->id;
+            $this->json['tooltip'] = $this->tooltip;
+						
+            $this->json['inputAttrs'] = '';
+			foreach ( $this->input_attrs as $attr => $value ) {
+				$this->json['inputAttrs'] .= $attr . '="' . esc_attr( $value ) . '" ';
+			}
+		}
+        
+        public function enqueue() {            
+            wp_enqueue_style( 'rara-business-toggle', get_template_directory_uri() . '/inc/custom-controls/toggle/toggle.css', null );
+            wp_enqueue_script( 'rara-business-toggle', get_template_directory_uri() . '/inc/custom-controls/toggle/toggle.js', array( 'jquery' ), false, true ); //for toggle        
+        }
+        
+		protected function content_template() {
+			?>
+			<# if ( data.tooltip ) { #>
+				<a href="#" class="tooltip hint--left" data-hint="{{ data.tooltip }}"><span class='dashicons dashicons-info'></span></a>
+			<# } #>
+			<label for="toggle_{{ data.id }}">
+				<span class="customize-control-title">
+					{{{ data.label }}}
+				</span>
+				<# if ( data.description ) { #>
+					<span class="description customize-control-description">{{{ data.description }}}</span>
+				<# } #>
+				<input {{{ data.inputAttrs }}} name="toggle_{{ data.id }}" id="toggle_{{ data.id }}" type="checkbox" value="{{ data.value }}" {{{ data.link }}}<# if ( '1' == data.value ) { #> checked<# } #> hidden />
+				<span class="switch"></span>
+			</label>
+			<?php
+		}
+	}
+}

Atomaste Reference/public_html/wp-content/themes/rara-business/inc/custom-controls/toggle/toggle.css

@@ -0,0 +1,64 @@
+.customize-control-toggle label {
+    display: flex;
+    flex-wrap: wrap; 
+}
+.customize-control-toggle label .customize-control-title {
+    width: calc(100% - 55px); 
+}
+.customize-control-toggle label .description {
+    order: 99; 
+}
+.customize-control-toggle input[type="checkbox"] {
+    display: none; 
+}
+.customize-control-toggle .switch { 
+    border: 1px solid rgba(0, 0, 0, 0.1);
+    display: inline-block;
+    width: 35px;
+    height: 12px;
+    border-radius: 8px;
+    background: #ccc;
+    vertical-align: middle;
+    position: relative;
+    cursor: pointer;
+    user-select: none;
+    transition: background 350ms ease; 
+}
+.customize-control-toggle .switch:before, .customize-control-toggle .switch:after {
+    content: "";
+    display: block;
+    width: 20px;
+    height: 20px;
+    border-radius: 50%;
+    position: absolute;
+    top: 50%;
+    left: -3px;
+    transition: all 350ms cubic-bezier(0, 0.95, 0.38, 0.98), background 150ms ease; 
+}
+.customize-control-toggle .switch:before {
+    background: rgba(0, 0, 0, 0.2);
+    transform: translate3d(0, -50%, 0) scale(0); 
+}
+.customize-control-toggle .switch:after {
+    background: #999;
+    border: 1px solid rgba(0, 0, 0, 0.1);
+    transform: translate3d(0, -50%, 0); 
+}
+.customize-control-toggle .switch:active:before {
+    transform: translate3d(0, -50%, 0) scale(3);
+}
+.customize-control-toggle input:checked + .switch {
+    background: rgba(52, 152, 222, 0.3); 
+}
+.customize-control-toggle input:checked + .switch:before {
+    background: rgba(52, 152, 222, 0.075);
+    transform: translate3d(100%, -50%, 0) scale(1); 
+}
+.customize-control-toggle input:checked + .switch:after {
+    background: #3498DE;
+    transform: translate3d(100%, -50%, 0); 
+}
+.customize-control-toggle input:checked + .switch:active:before {
+    background: rgba(52, 152, 222, 0.075);
+    transform: translate3d(100%, -50%, 0) scale(3); 
+}

Atomaste Reference/public_html/wp-content/themes/rara-business/inc/custom-controls/toggle/toggle.js

@@ -0,0 +1,18 @@
+wp.customize.controlConstructor['toggle'] = wp.customize.Control.extend({
+
+	ready: function() {
+
+		'use strict';
+
+		var control = this,
+		    checkboxValue = control.setting._value;
+
+		// Save the value
+		this.container.on( 'change', 'input', function() {
+			checkboxValue = ( jQuery( this ).is( ':checked' ) ) ? true : false;
+			control.setting.set( checkboxValue );
+		});
+
+	}
+
+});