{
  "name": "dnxte/before-after",
  "d4Shortcode": "dnxte_before_after",
  "title": "Before After",
  "titles": "Before After",
  "folder": "divi-essential",
  "moduleIcon": "dnxte/before-after",
  "category": "module",
  "attributes": {
    "module": {
      "type": "object",
      "selector": "{{selector}}",
      "default": {
        "meta": {
          "adminLabel": {
            "desktop": {
              "value": "Before After"
            }
          }
        }
      },
      "styleProps": {
        "spacing": {
          "important": true
        }
      }
    },
    "beforeImage": {
      "type": "object",
      "selector": "{{selector}} .dnxte_bf_img",
      "inlineEditor": "upload",
      "elementType": "image",
      "attributes": {
        "class": "beforeImage twentytwenty-before",
        "ref": "beforeImage"
      }
    },
    "beforeImageAlt": {
      "type": "object",
      "inlineEditor": "plainText",
      "elementType": "heading",
      "childrenSanitizer": "et_core_esc_previously"
    },
    "afterImage": {
      "type": "object",
      "selector": "{{selector}} .dnxte_af_img",
      "inlineEditor": "upload",
      "elementType": "image",
      "attributes": {
        "class": "afterImage twentytwenty-after",
        "ref": "afterImage"
      }
    },
    "afterImageAlt": {
      "type": "object",
      "inlineEditor": "plainText",
      "elementType": "heading",
      "childrenSanitizer": "et_core_esc_previously"
    },
    "beforeLabel": {
      "type": "object",
      "selector": "{{selector}} .twentytwenty-before-label",
      "inlineEditor": "plainText",
      "elementType": "heading",
      "tagName": "div",
      "childrenSanitizer": "et_core_esc_previously",
      "attributes": {
        "class": "twentytwenty-before-label",
        "data-content": "Before Label"
      },
      "default": {
        "innerContent": {
          "desktop": {
            "value": "Before"
          }
        }
      }
    },
    "afterLabel": {
      "type": "object",
      "selector": "{{selector}} .twentytwenty-before-label",
      "inlineEditor": "plainText",
      "elementType": "heading",
      "tagName": "div",
      "childrenSanitizer": "et_core_esc_previously",
      "attributes": {
        "class": "after-label twentytwenty-after-label",
        "data-content": "After Label"
      },
      "default": {
        "innerContent": {
          "desktop": {
            "value": "After"
          }
        }
      }
    },
    "sliderColor": {
      "type": "object",
      "selector": "{{selector}} .twentytwenty-handle:before, {selector}} .twentytwenty-handle:after",
      "inlineEditor": "color",
      "elementType": "color",
      "styleProps": {
        "color": {
          "label": "Slider Color",
          "selector": ".twentytwenty-handle:before, .twentytwenty-handle:after",
          "property": "background"
        }
      }
    },
    "showLabels": {
      "type": "object",
      "default": {
        "advanced": {
          "use": {
            "desktop": {
              "value": "on"
            }
          }
        }
      }
    },
    "enabledOverlay": {
      "type": "object",
      "default": {
        "advanced": {
          "use": {
            "desktop": {
              "value": "on"
            }
          }
        }
      }
    },
    "moveOnHover": {
      "type": "object",
      "default": {
        "advanced": {
          "use": {
            "desktop": {
              "value": "off"
            }
          }
        }
      }
    },
    "moveOnClick": {
      "type": "object",
      "default": {
        "advanced": {
          "use": {
            "desktop": {
              "value": "on"
            }
          }
        }
      }
    },
    "moveWithHandle": {
      "type": "object",
      "default": {
        "advanced": {
          "use": {
            "desktop": {
              "value": "on"
            }
          }
        }
      }
    },
    "sliderDirection": {
      "type": "object",
      "default": {
        "innerContent": {
          "desktop": {
            "value": {
              "select": "horizontal"
            }
          }
        }
      }
    },
    "sliderStartOffset": {
      "type": "object",
      "default": {
        "innerContent": {
          "desktop": {
            "value": 0.7
          }
        }
      }
    },
    "overlayHoverColor": {
      "type": "object",
      "selector": "{{selector}} .twentytwenty-overlay",
      "inlineEditor": "color",
      "elementType": "color",
      "default": {
        "background": "rgba(0, 0, 0, 0.5)"
      }
    }
  },
  "customCssFields": {
    "beforeImage": {
      "subName": "beforeImage",
      "selectorSuffix": " .dnxte_bf_img"
    },
    "beforeImageAlt": {
      "subName": "beforeImageAlt",
      "selectorSuffix": " .before-image-alt"
    },
    "afterImage": {
      "subName": "afterImage",
      "selectorSuffix": " .dnxte_af_img"
    },
    "afterImageAlt": {
      "subName": "afterImageAlt",
      "selectorSuffix": " .before-image-alt"
    },
    "beforeLabel": {
      "subName": "beforeLabel",
      "selectorSuffix": " .twentytwenty-before-label"
    },
    "afterLabel": {
      "subName": "afterLabel",
      "selectorSuffix": " .twentytwenty-after-label"
    },
    "sliderColor": {
      "subName": "sliderColor",
      "selectorSuffix": " .twentytwenty-handle:before, .twentytwenty-handle:after"
    },
    "handleColor": {
      "subName": "handleColor",
      "selectorSuffix": " .twentytwenty-handle"
    }
  }
}