FEATURE Introducing first working version
This commit is contained in:
Antoine M
parent
3cbb753a57
commit
4a234c2e99
|
|
@ -0,0 +1,18 @@
|
||||||
|
# This file is for unifying the coding style for different editors and IDEs
|
||||||
|
# editorconfig.org
|
||||||
|
|
||||||
|
# WordPress Coding Standards
|
||||||
|
# https://make.wordpress.org/core/handbook/coding-standards/
|
||||||
|
|
||||||
|
root = true
|
||||||
|
|
||||||
|
[*]
|
||||||
|
charset = utf-8
|
||||||
|
end_of_line = lf
|
||||||
|
insert_final_newline = true
|
||||||
|
trim_trailing_whitespace = true
|
||||||
|
indent_style = tab
|
||||||
|
|
||||||
|
[*.{yml,yaml}]
|
||||||
|
indent_style = space
|
||||||
|
indent_size = 2
|
||||||
30
plugins/carhop-blocks/blocks/scroll-story-block/.gitignore
vendored
Normal file
30
plugins/carhop-blocks/blocks/scroll-story-block/.gitignore
vendored
Normal file
|
|
@ -0,0 +1,30 @@
|
||||||
|
# Logs
|
||||||
|
logs
|
||||||
|
*.log
|
||||||
|
npm-debug.log*
|
||||||
|
yarn-debug.log*
|
||||||
|
yarn-error.log*
|
||||||
|
|
||||||
|
# Coverage directory used by tools like istanbul
|
||||||
|
coverage
|
||||||
|
|
||||||
|
# Compiled binary addons (https://nodejs.org/api/addons.html)
|
||||||
|
build/Release
|
||||||
|
|
||||||
|
# Dependency directories
|
||||||
|
node_modules/
|
||||||
|
|
||||||
|
# Optional npm cache directory
|
||||||
|
.npm
|
||||||
|
|
||||||
|
# Optional eslint cache
|
||||||
|
.eslintcache
|
||||||
|
|
||||||
|
# Output of `npm pack`
|
||||||
|
*.tgz
|
||||||
|
|
||||||
|
# Output of `wp-scripts plugin-zip`
|
||||||
|
*.zip
|
||||||
|
|
||||||
|
# dotenv environment variables file
|
||||||
|
.env
|
||||||
|
|
@ -0,0 +1,19 @@
|
||||||
|
{
|
||||||
|
"$schema": "https://schemas.wp.org/trunk/block.json",
|
||||||
|
"apiVersion": 3,
|
||||||
|
"name": "carhop-blocks/scroll-story-block",
|
||||||
|
"version": "0.1.0",
|
||||||
|
"title": "Section défilante animée",
|
||||||
|
"category": "carhop-blocks",
|
||||||
|
"icon": "format-quote",
|
||||||
|
"description": "Une section défilante animée",
|
||||||
|
"example": {},
|
||||||
|
"supports": {
|
||||||
|
"html": false
|
||||||
|
},
|
||||||
|
"textdomain": "carhop-blocks",
|
||||||
|
"editorScript": "file:./index.js",
|
||||||
|
"editorStyle": "file:./index.css",
|
||||||
|
"style": "file:./style-index.css",
|
||||||
|
"viewScript": "file:./view.js"
|
||||||
|
}
|
||||||
|
|
@ -0,0 +1,25 @@
|
||||||
|
<?php
|
||||||
|
// This file is generated. Do not modify it manually.
|
||||||
|
return array(
|
||||||
|
'build' => array(
|
||||||
|
'$schema' => 'https://schemas.wp.org/trunk/block.json',
|
||||||
|
'apiVersion' => 3,
|
||||||
|
'name' => 'carhop-blocks/scroll-story-block',
|
||||||
|
'version' => '0.1.0',
|
||||||
|
'title' => 'Section défilante animée',
|
||||||
|
'category' => 'carhop-blocks',
|
||||||
|
'icon' => 'format-quote',
|
||||||
|
'description' => 'Une section défilante animée',
|
||||||
|
'example' => array(
|
||||||
|
|
||||||
|
),
|
||||||
|
'supports' => array(
|
||||||
|
'html' => false
|
||||||
|
),
|
||||||
|
'textdomain' => 'carhop-blocks',
|
||||||
|
'editorScript' => 'file:./index.js',
|
||||||
|
'editorStyle' => 'file:./index.css',
|
||||||
|
'style' => 'file:./style-index.css',
|
||||||
|
'viewScript' => 'file:./view.js'
|
||||||
|
)
|
||||||
|
);
|
||||||
|
|
@ -0,0 +1,32 @@
|
||||||
|
/*!****************************************************************************************************************************************************************************************************************************************!*\
|
||||||
|
!*** css ./node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[4].use[1]!./node_modules/postcss-loader/dist/cjs.js??ruleSet[1].rules[4].use[2]!./node_modules/sass-loader/dist/cjs.js??ruleSet[1].rules[4].use[3]!./src/editor.scss ***!
|
||||||
|
\****************************************************************************************************************************************************************************************************************************************/
|
||||||
|
.wp-block-carhop-blocks-cta {
|
||||||
|
color: var(--cta-current-color);
|
||||||
|
padding: 2px;
|
||||||
|
display: block;
|
||||||
|
width: -moz-fit-content;
|
||||||
|
width: fit-content;
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
gap: 10px;
|
||||||
|
line-height: normal;
|
||||||
|
}
|
||||||
|
.wp-block-carhop-blocks-cta .icon svg {
|
||||||
|
width: 30px;
|
||||||
|
height: 30px;
|
||||||
|
}
|
||||||
|
.wp-block-carhop-blocks-cta .icon svg path,
|
||||||
|
.wp-block-carhop-blocks-cta .icon svg circle {
|
||||||
|
stroke: var(--cta-current-color);
|
||||||
|
}
|
||||||
|
.wp-block-carhop-blocks-cta.align--left {
|
||||||
|
margin-right: 0;
|
||||||
|
}
|
||||||
|
.wp-block-carhop-blocks-cta.align--right {
|
||||||
|
margin-left: 0;
|
||||||
|
margin-right: auto;
|
||||||
|
}
|
||||||
|
.wp-block-carhop-blocks-cta.align--center {
|
||||||
|
margin: 0 auto;
|
||||||
|
}
|
||||||
|
|
@ -0,0 +1 @@
|
||||||
|
<?php return array('dependencies' => array('react-jsx-runtime', 'wp-block-editor', 'wp-blocks', 'wp-i18n'), 'version' => 'b5e49d5fc844161aff84');
|
||||||
|
|
@ -0,0 +1,34 @@
|
||||||
|
/*!****************************************************************************************************************************************************************************************************************************************!*\
|
||||||
|
!*** css ./node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[4].use[1]!./node_modules/postcss-loader/dist/cjs.js??ruleSet[1].rules[4].use[2]!./node_modules/sass-loader/dist/cjs.js??ruleSet[1].rules[4].use[3]!./src/editor.scss ***!
|
||||||
|
\****************************************************************************************************************************************************************************************************************************************/
|
||||||
|
.wp-block-carhop-blocks-cta {
|
||||||
|
color: var(--cta-current-color);
|
||||||
|
padding: 2px;
|
||||||
|
display: block;
|
||||||
|
width: -moz-fit-content;
|
||||||
|
width: fit-content;
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
gap: 10px;
|
||||||
|
line-height: normal;
|
||||||
|
}
|
||||||
|
.wp-block-carhop-blocks-cta .icon svg {
|
||||||
|
width: 30px;
|
||||||
|
height: 30px;
|
||||||
|
}
|
||||||
|
.wp-block-carhop-blocks-cta .icon svg path,
|
||||||
|
.wp-block-carhop-blocks-cta .icon svg circle {
|
||||||
|
stroke: var(--cta-current-color);
|
||||||
|
}
|
||||||
|
.wp-block-carhop-blocks-cta.align--left {
|
||||||
|
margin-left: 0;
|
||||||
|
}
|
||||||
|
.wp-block-carhop-blocks-cta.align--right {
|
||||||
|
margin-right: 0;
|
||||||
|
margin-left: auto;
|
||||||
|
}
|
||||||
|
.wp-block-carhop-blocks-cta.align--center {
|
||||||
|
margin: 0 auto;
|
||||||
|
}
|
||||||
|
|
||||||
|
/*# sourceMappingURL=index.css.map*/
|
||||||
|
|
@ -0,0 +1 @@
|
||||||
|
{"version":3,"file":"index.css","mappings":";;;AAAA;EACC;EAEA;EACA;EACA;EAAA;EACA;EACA;EACA;EACA;AAAD;AAGE;EACC;EACA;AADH;AAGE;;EAEC;AADH;AAKC;EACC;AAHF;AAKC;EACC;EACA;AAHF;AAKC;EACC;AAHF,C","sources":["webpack://cta/./src/editor.scss"],"sourcesContent":[".wp-block-carhop-blocks-cta {\n\tcolor: var(--cta-current-color);\n\n\tpadding: 2px;\n\tdisplay: block;\n\twidth: fit-content;\n\tdisplay: flex;\n\talign-items: center;\n\tgap: 10px;\n\tline-height: normal;\n\n\t.icon {\n\t\tsvg {\n\t\t\twidth: 30px;\n\t\t\theight: 30px;\n\t\t}\n\t\tsvg path,\n\t\tsvg circle {\n\t\t\tstroke: var(--cta-current-color);\n\t\t}\n\t}\n\n\t&.align--left {\n\t\tmargin-left: 0;\n\t}\n\t&.align--right {\n\t\tmargin-right: 0;\n\t\tmargin-left: auto;\n\t}\n\t&.align--center {\n\t\tmargin: 0 auto;\n\t}\n}\n"],"names":[],"sourceRoot":""}
|
||||||
369
plugins/carhop-blocks/blocks/scroll-story-block/build/index.js
Normal file
369
plugins/carhop-blocks/blocks/scroll-story-block/build/index.js
Normal file
|
|
@ -0,0 +1,369 @@
|
||||||
|
/******/ (() => { // webpackBootstrap
|
||||||
|
/******/ "use strict";
|
||||||
|
/******/ var __webpack_modules__ = ({
|
||||||
|
|
||||||
|
/***/ "./src/block.json":
|
||||||
|
/*!************************!*\
|
||||||
|
!*** ./src/block.json ***!
|
||||||
|
\************************/
|
||||||
|
/***/ ((module) => {
|
||||||
|
|
||||||
|
module.exports = /*#__PURE__*/JSON.parse('{"$schema":"https://schemas.wp.org/trunk/block.json","apiVersion":3,"name":"carhop-blocks/scroll-story-block","version":"0.1.0","title":"Section défilante animée","category":"carhop-blocks","icon":"format-quote","description":"Une section défilante animée","example":{},"supports":{"html":false},"textdomain":"carhop-blocks","editorScript":"file:./index.js","editorStyle":"file:./index.css","style":"file:./style-index.css","viewScript":"file:./view.js"}');
|
||||||
|
|
||||||
|
/***/ }),
|
||||||
|
|
||||||
|
/***/ "./src/edit.js":
|
||||||
|
/*!*********************!*\
|
||||||
|
!*** ./src/edit.js ***!
|
||||||
|
\*********************/
|
||||||
|
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
|
||||||
|
|
||||||
|
__webpack_require__.r(__webpack_exports__);
|
||||||
|
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
|
||||||
|
/* harmony export */ "default": () => (/* binding */ Edit)
|
||||||
|
/* harmony export */ });
|
||||||
|
/* harmony import */ var _wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @wordpress/i18n */ "@wordpress/i18n");
|
||||||
|
/* harmony import */ var _wordpress_i18n__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__);
|
||||||
|
/* harmony import */ var _wordpress_block_editor__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @wordpress/block-editor */ "@wordpress/block-editor");
|
||||||
|
/* harmony import */ var _wordpress_block_editor__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_1__);
|
||||||
|
/* harmony import */ var _editor_scss__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./editor.scss */ "./src/editor.scss");
|
||||||
|
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! react/jsx-runtime */ "react/jsx-runtime");
|
||||||
|
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3___default = /*#__PURE__*/__webpack_require__.n(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__);
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
function Edit({
|
||||||
|
attributes,
|
||||||
|
setAttributes
|
||||||
|
}) {
|
||||||
|
return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.Fragment, {
|
||||||
|
children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
|
||||||
|
...(0,_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_1__.useBlockProps)({
|
||||||
|
className: `scroll-story-block`
|
||||||
|
}),
|
||||||
|
children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_1__.InnerBlocks, {
|
||||||
|
allowedBlocks: ["carhop-blocks/narrative-card"],
|
||||||
|
template: [["carhop-blocks/narrative-card", {
|
||||||
|
hasCover: true,
|
||||||
|
coverPosition: "left",
|
||||||
|
innerBlocks: [["core/heading", {
|
||||||
|
content: "Lorem ipsum"
|
||||||
|
}], ["core/paragraph", {
|
||||||
|
content: "Lorem ipsum dolor sit amet consectetur adipisicing elit."
|
||||||
|
}]]
|
||||||
|
}], ["carhop-blocks/narrative-card", {
|
||||||
|
hasCover: true,
|
||||||
|
coverPosition: "right",
|
||||||
|
innerBlocks: [["core/heading", {
|
||||||
|
content: "Lorem ipsum"
|
||||||
|
}], ["core/paragraph", {
|
||||||
|
content: "Lorem ipsum dolor sit amet consectetur adipisicing elit."
|
||||||
|
}]]
|
||||||
|
}]]
|
||||||
|
})
|
||||||
|
})
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
/***/ }),
|
||||||
|
|
||||||
|
/***/ "./src/editor.scss":
|
||||||
|
/*!*************************!*\
|
||||||
|
!*** ./src/editor.scss ***!
|
||||||
|
\*************************/
|
||||||
|
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
|
||||||
|
|
||||||
|
__webpack_require__.r(__webpack_exports__);
|
||||||
|
// extracted by mini-css-extract-plugin
|
||||||
|
|
||||||
|
|
||||||
|
/***/ }),
|
||||||
|
|
||||||
|
/***/ "./src/index.js":
|
||||||
|
/*!**********************!*\
|
||||||
|
!*** ./src/index.js ***!
|
||||||
|
\**********************/
|
||||||
|
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
|
||||||
|
|
||||||
|
__webpack_require__.r(__webpack_exports__);
|
||||||
|
/* harmony import */ var _wordpress_blocks__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @wordpress/blocks */ "@wordpress/blocks");
|
||||||
|
/* harmony import */ var _wordpress_blocks__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_wordpress_blocks__WEBPACK_IMPORTED_MODULE_0__);
|
||||||
|
/* harmony import */ var _style_scss__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./style.scss */ "./src/style.scss");
|
||||||
|
/* harmony import */ var _edit__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./edit */ "./src/edit.js");
|
||||||
|
/* harmony import */ var _save__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ./save */ "./src/save.js");
|
||||||
|
/* harmony import */ var _block_json__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ./block.json */ "./src/block.json");
|
||||||
|
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! react/jsx-runtime */ "react/jsx-runtime");
|
||||||
|
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5___default = /*#__PURE__*/__webpack_require__.n(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__);
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
(0,_wordpress_blocks__WEBPACK_IMPORTED_MODULE_0__.registerBlockType)(_block_json__WEBPACK_IMPORTED_MODULE_4__.name, {
|
||||||
|
icon: {
|
||||||
|
src: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsx)("svg", {
|
||||||
|
viewBox: "0 0 24 24",
|
||||||
|
width: "24",
|
||||||
|
height: "24",
|
||||||
|
children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsx)("path", {
|
||||||
|
d: "M22,13v8a1,1,0,0,1-1,1H13a1,1,0,0,1-1-1V13a1,1,0,0,1,1-1h8A1,1,0,0,1,22,13ZM7,6A1,1,0,0,0,6,7v9a1,1,0,0,0,1,1h3V10.5a.5.5,0,0,1,.5-.5H17V7a1,1,0,0,0-1-1ZM3,13H4V4.5A.5.5,0,0,1,4.5,4H13V3a1,1,0,0,0-1-1H3A1,1,0,0,0,2,3v9A1,1,0,0,0,3,13Z"
|
||||||
|
})
|
||||||
|
}),
|
||||||
|
foreground: "#136f63"
|
||||||
|
},
|
||||||
|
edit: _edit__WEBPACK_IMPORTED_MODULE_2__["default"],
|
||||||
|
save: _save__WEBPACK_IMPORTED_MODULE_3__["default"]
|
||||||
|
});
|
||||||
|
|
||||||
|
/***/ }),
|
||||||
|
|
||||||
|
/***/ "./src/save.js":
|
||||||
|
/*!*********************!*\
|
||||||
|
!*** ./src/save.js ***!
|
||||||
|
\*********************/
|
||||||
|
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
|
||||||
|
|
||||||
|
__webpack_require__.r(__webpack_exports__);
|
||||||
|
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
|
||||||
|
/* harmony export */ "default": () => (/* binding */ save)
|
||||||
|
/* harmony export */ });
|
||||||
|
/* harmony import */ var _wordpress_block_editor__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @wordpress/block-editor */ "@wordpress/block-editor");
|
||||||
|
/* harmony import */ var _wordpress_block_editor__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_0__);
|
||||||
|
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! react/jsx-runtime */ "react/jsx-runtime");
|
||||||
|
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__);
|
||||||
|
|
||||||
|
|
||||||
|
function save({
|
||||||
|
attributes
|
||||||
|
}) {
|
||||||
|
return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__.jsx)("div", {
|
||||||
|
..._wordpress_block_editor__WEBPACK_IMPORTED_MODULE_0__.useBlockProps.save({
|
||||||
|
className: "scroll-story-block"
|
||||||
|
}),
|
||||||
|
children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__.jsx)(_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_0__.InnerBlocks.Content, {})
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
/***/ }),
|
||||||
|
|
||||||
|
/***/ "./src/style.scss":
|
||||||
|
/*!************************!*\
|
||||||
|
!*** ./src/style.scss ***!
|
||||||
|
\************************/
|
||||||
|
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
|
||||||
|
|
||||||
|
__webpack_require__.r(__webpack_exports__);
|
||||||
|
// extracted by mini-css-extract-plugin
|
||||||
|
|
||||||
|
|
||||||
|
/***/ }),
|
||||||
|
|
||||||
|
/***/ "@wordpress/block-editor":
|
||||||
|
/*!*************************************!*\
|
||||||
|
!*** external ["wp","blockEditor"] ***!
|
||||||
|
\*************************************/
|
||||||
|
/***/ ((module) => {
|
||||||
|
|
||||||
|
module.exports = window["wp"]["blockEditor"];
|
||||||
|
|
||||||
|
/***/ }),
|
||||||
|
|
||||||
|
/***/ "@wordpress/blocks":
|
||||||
|
/*!********************************!*\
|
||||||
|
!*** external ["wp","blocks"] ***!
|
||||||
|
\********************************/
|
||||||
|
/***/ ((module) => {
|
||||||
|
|
||||||
|
module.exports = window["wp"]["blocks"];
|
||||||
|
|
||||||
|
/***/ }),
|
||||||
|
|
||||||
|
/***/ "@wordpress/i18n":
|
||||||
|
/*!******************************!*\
|
||||||
|
!*** external ["wp","i18n"] ***!
|
||||||
|
\******************************/
|
||||||
|
/***/ ((module) => {
|
||||||
|
|
||||||
|
module.exports = window["wp"]["i18n"];
|
||||||
|
|
||||||
|
/***/ }),
|
||||||
|
|
||||||
|
/***/ "react/jsx-runtime":
|
||||||
|
/*!**********************************!*\
|
||||||
|
!*** external "ReactJSXRuntime" ***!
|
||||||
|
\**********************************/
|
||||||
|
/***/ ((module) => {
|
||||||
|
|
||||||
|
module.exports = window["ReactJSXRuntime"];
|
||||||
|
|
||||||
|
/***/ })
|
||||||
|
|
||||||
|
/******/ });
|
||||||
|
/************************************************************************/
|
||||||
|
/******/ // The module cache
|
||||||
|
/******/ var __webpack_module_cache__ = {};
|
||||||
|
/******/
|
||||||
|
/******/ // The require function
|
||||||
|
/******/ function __webpack_require__(moduleId) {
|
||||||
|
/******/ // Check if module is in cache
|
||||||
|
/******/ var cachedModule = __webpack_module_cache__[moduleId];
|
||||||
|
/******/ if (cachedModule !== undefined) {
|
||||||
|
/******/ return cachedModule.exports;
|
||||||
|
/******/ }
|
||||||
|
/******/ // Create a new module (and put it into the cache)
|
||||||
|
/******/ var module = __webpack_module_cache__[moduleId] = {
|
||||||
|
/******/ // no module.id needed
|
||||||
|
/******/ // no module.loaded needed
|
||||||
|
/******/ exports: {}
|
||||||
|
/******/ };
|
||||||
|
/******/
|
||||||
|
/******/ // Execute the module function
|
||||||
|
/******/ __webpack_modules__[moduleId](module, module.exports, __webpack_require__);
|
||||||
|
/******/
|
||||||
|
/******/ // Return the exports of the module
|
||||||
|
/******/ return module.exports;
|
||||||
|
/******/ }
|
||||||
|
/******/
|
||||||
|
/******/ // expose the modules object (__webpack_modules__)
|
||||||
|
/******/ __webpack_require__.m = __webpack_modules__;
|
||||||
|
/******/
|
||||||
|
/************************************************************************/
|
||||||
|
/******/ /* webpack/runtime/chunk loaded */
|
||||||
|
/******/ (() => {
|
||||||
|
/******/ var deferred = [];
|
||||||
|
/******/ __webpack_require__.O = (result, chunkIds, fn, priority) => {
|
||||||
|
/******/ if(chunkIds) {
|
||||||
|
/******/ priority = priority || 0;
|
||||||
|
/******/ for(var i = deferred.length; i > 0 && deferred[i - 1][2] > priority; i--) deferred[i] = deferred[i - 1];
|
||||||
|
/******/ deferred[i] = [chunkIds, fn, priority];
|
||||||
|
/******/ return;
|
||||||
|
/******/ }
|
||||||
|
/******/ var notFulfilled = Infinity;
|
||||||
|
/******/ for (var i = 0; i < deferred.length; i++) {
|
||||||
|
/******/ var [chunkIds, fn, priority] = deferred[i];
|
||||||
|
/******/ var fulfilled = true;
|
||||||
|
/******/ for (var j = 0; j < chunkIds.length; j++) {
|
||||||
|
/******/ if ((priority & 1 === 0 || notFulfilled >= priority) && Object.keys(__webpack_require__.O).every((key) => (__webpack_require__.O[key](chunkIds[j])))) {
|
||||||
|
/******/ chunkIds.splice(j--, 1);
|
||||||
|
/******/ } else {
|
||||||
|
/******/ fulfilled = false;
|
||||||
|
/******/ if(priority < notFulfilled) notFulfilled = priority;
|
||||||
|
/******/ }
|
||||||
|
/******/ }
|
||||||
|
/******/ if(fulfilled) {
|
||||||
|
/******/ deferred.splice(i--, 1)
|
||||||
|
/******/ var r = fn();
|
||||||
|
/******/ if (r !== undefined) result = r;
|
||||||
|
/******/ }
|
||||||
|
/******/ }
|
||||||
|
/******/ return result;
|
||||||
|
/******/ };
|
||||||
|
/******/ })();
|
||||||
|
/******/
|
||||||
|
/******/ /* webpack/runtime/compat get default export */
|
||||||
|
/******/ (() => {
|
||||||
|
/******/ // getDefaultExport function for compatibility with non-harmony modules
|
||||||
|
/******/ __webpack_require__.n = (module) => {
|
||||||
|
/******/ var getter = module && module.__esModule ?
|
||||||
|
/******/ () => (module['default']) :
|
||||||
|
/******/ () => (module);
|
||||||
|
/******/ __webpack_require__.d(getter, { a: getter });
|
||||||
|
/******/ return getter;
|
||||||
|
/******/ };
|
||||||
|
/******/ })();
|
||||||
|
/******/
|
||||||
|
/******/ /* webpack/runtime/define property getters */
|
||||||
|
/******/ (() => {
|
||||||
|
/******/ // define getter functions for harmony exports
|
||||||
|
/******/ __webpack_require__.d = (exports, definition) => {
|
||||||
|
/******/ for(var key in definition) {
|
||||||
|
/******/ if(__webpack_require__.o(definition, key) && !__webpack_require__.o(exports, key)) {
|
||||||
|
/******/ Object.defineProperty(exports, key, { enumerable: true, get: definition[key] });
|
||||||
|
/******/ }
|
||||||
|
/******/ }
|
||||||
|
/******/ };
|
||||||
|
/******/ })();
|
||||||
|
/******/
|
||||||
|
/******/ /* webpack/runtime/hasOwnProperty shorthand */
|
||||||
|
/******/ (() => {
|
||||||
|
/******/ __webpack_require__.o = (obj, prop) => (Object.prototype.hasOwnProperty.call(obj, prop))
|
||||||
|
/******/ })();
|
||||||
|
/******/
|
||||||
|
/******/ /* webpack/runtime/make namespace object */
|
||||||
|
/******/ (() => {
|
||||||
|
/******/ // define __esModule on exports
|
||||||
|
/******/ __webpack_require__.r = (exports) => {
|
||||||
|
/******/ if(typeof Symbol !== 'undefined' && Symbol.toStringTag) {
|
||||||
|
/******/ Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
|
||||||
|
/******/ }
|
||||||
|
/******/ Object.defineProperty(exports, '__esModule', { value: true });
|
||||||
|
/******/ };
|
||||||
|
/******/ })();
|
||||||
|
/******/
|
||||||
|
/******/ /* webpack/runtime/jsonp chunk loading */
|
||||||
|
/******/ (() => {
|
||||||
|
/******/ // no baseURI
|
||||||
|
/******/
|
||||||
|
/******/ // object to store loaded and loading chunks
|
||||||
|
/******/ // undefined = chunk not loaded, null = chunk preloaded/prefetched
|
||||||
|
/******/ // [resolve, reject, Promise] = chunk loading, 0 = chunk loaded
|
||||||
|
/******/ var installedChunks = {
|
||||||
|
/******/ "index": 0,
|
||||||
|
/******/ "./style-index": 0
|
||||||
|
/******/ };
|
||||||
|
/******/
|
||||||
|
/******/ // no chunk on demand loading
|
||||||
|
/******/
|
||||||
|
/******/ // no prefetching
|
||||||
|
/******/
|
||||||
|
/******/ // no preloaded
|
||||||
|
/******/
|
||||||
|
/******/ // no HMR
|
||||||
|
/******/
|
||||||
|
/******/ // no HMR manifest
|
||||||
|
/******/
|
||||||
|
/******/ __webpack_require__.O.j = (chunkId) => (installedChunks[chunkId] === 0);
|
||||||
|
/******/
|
||||||
|
/******/ // install a JSONP callback for chunk loading
|
||||||
|
/******/ var webpackJsonpCallback = (parentChunkLoadingFunction, data) => {
|
||||||
|
/******/ var [chunkIds, moreModules, runtime] = data;
|
||||||
|
/******/ // add "moreModules" to the modules object,
|
||||||
|
/******/ // then flag all "chunkIds" as loaded and fire callback
|
||||||
|
/******/ var moduleId, chunkId, i = 0;
|
||||||
|
/******/ if(chunkIds.some((id) => (installedChunks[id] !== 0))) {
|
||||||
|
/******/ for(moduleId in moreModules) {
|
||||||
|
/******/ if(__webpack_require__.o(moreModules, moduleId)) {
|
||||||
|
/******/ __webpack_require__.m[moduleId] = moreModules[moduleId];
|
||||||
|
/******/ }
|
||||||
|
/******/ }
|
||||||
|
/******/ if(runtime) var result = runtime(__webpack_require__);
|
||||||
|
/******/ }
|
||||||
|
/******/ if(parentChunkLoadingFunction) parentChunkLoadingFunction(data);
|
||||||
|
/******/ for(;i < chunkIds.length; i++) {
|
||||||
|
/******/ chunkId = chunkIds[i];
|
||||||
|
/******/ if(__webpack_require__.o(installedChunks, chunkId) && installedChunks[chunkId]) {
|
||||||
|
/******/ installedChunks[chunkId][0]();
|
||||||
|
/******/ }
|
||||||
|
/******/ installedChunks[chunkId] = 0;
|
||||||
|
/******/ }
|
||||||
|
/******/ return __webpack_require__.O(result);
|
||||||
|
/******/ }
|
||||||
|
/******/
|
||||||
|
/******/ var chunkLoadingGlobal = globalThis["webpackChunkcta"] = globalThis["webpackChunkcta"] || [];
|
||||||
|
/******/ chunkLoadingGlobal.forEach(webpackJsonpCallback.bind(null, 0));
|
||||||
|
/******/ chunkLoadingGlobal.push = webpackJsonpCallback.bind(null, chunkLoadingGlobal.push.bind(chunkLoadingGlobal));
|
||||||
|
/******/ })();
|
||||||
|
/******/
|
||||||
|
/************************************************************************/
|
||||||
|
/******/
|
||||||
|
/******/ // startup
|
||||||
|
/******/ // Load entry module and return exports
|
||||||
|
/******/ // This entry module depends on other loaded chunks and execution need to be delayed
|
||||||
|
/******/ var __webpack_exports__ = __webpack_require__.O(undefined, ["./style-index"], () => (__webpack_require__("./src/index.js")))
|
||||||
|
/******/ __webpack_exports__ = __webpack_require__.O(__webpack_exports__);
|
||||||
|
/******/
|
||||||
|
/******/ })()
|
||||||
|
;
|
||||||
|
//# sourceMappingURL=index.js.map
|
||||||
File diff suppressed because one or more lines are too long
|
|
@ -0,0 +1,37 @@
|
||||||
|
/*!***************************************************************************************************************************************************************************************************************************************!*\
|
||||||
|
!*** css ./node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[4].use[1]!./node_modules/postcss-loader/dist/cjs.js??ruleSet[1].rules[4].use[2]!./node_modules/sass-loader/dist/cjs.js??ruleSet[1].rules[4].use[3]!./src/style.scss ***!
|
||||||
|
\***************************************************************************************************************************************************************************************************************************************/
|
||||||
|
.wp-block-carhop-blocks-cta {
|
||||||
|
margin-top: 20px;
|
||||||
|
color: var(--cta-current-color);
|
||||||
|
padding: 2px;
|
||||||
|
display: block;
|
||||||
|
width: -moz-fit-content;
|
||||||
|
width: fit-content;
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
gap: 10px;
|
||||||
|
line-height: normal;
|
||||||
|
font-weight: 700;
|
||||||
|
}
|
||||||
|
.wp-block-carhop-blocks-cta a {
|
||||||
|
text-decoration: none;
|
||||||
|
}
|
||||||
|
.wp-block-carhop-blocks-cta .icon svg {
|
||||||
|
width: 30px;
|
||||||
|
height: 30px;
|
||||||
|
}
|
||||||
|
.wp-block-carhop-blocks-cta .icon svg path,
|
||||||
|
.wp-block-carhop-blocks-cta .icon svg circle {
|
||||||
|
stroke: var(--cta-current-color);
|
||||||
|
}
|
||||||
|
.wp-block-carhop-blocks-cta.align--left {
|
||||||
|
margin-right: 0;
|
||||||
|
}
|
||||||
|
.wp-block-carhop-blocks-cta.align--right {
|
||||||
|
margin-left: 0;
|
||||||
|
margin-right: auto;
|
||||||
|
}
|
||||||
|
.wp-block-carhop-blocks-cta.align--center {
|
||||||
|
margin: 0 auto;
|
||||||
|
}
|
||||||
|
|
@ -0,0 +1,39 @@
|
||||||
|
/*!***************************************************************************************************************************************************************************************************************************************!*\
|
||||||
|
!*** css ./node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[4].use[1]!./node_modules/postcss-loader/dist/cjs.js??ruleSet[1].rules[4].use[2]!./node_modules/sass-loader/dist/cjs.js??ruleSet[1].rules[4].use[3]!./src/style.scss ***!
|
||||||
|
\***************************************************************************************************************************************************************************************************************************************/
|
||||||
|
.wp-block-carhop-blocks-cta {
|
||||||
|
margin-top: 20px;
|
||||||
|
color: var(--cta-current-color);
|
||||||
|
padding: 2px;
|
||||||
|
display: block;
|
||||||
|
width: -moz-fit-content;
|
||||||
|
width: fit-content;
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
gap: 10px;
|
||||||
|
line-height: normal;
|
||||||
|
font-weight: 700;
|
||||||
|
}
|
||||||
|
.wp-block-carhop-blocks-cta a {
|
||||||
|
text-decoration: none;
|
||||||
|
}
|
||||||
|
.wp-block-carhop-blocks-cta .icon svg {
|
||||||
|
width: 30px;
|
||||||
|
height: 30px;
|
||||||
|
}
|
||||||
|
.wp-block-carhop-blocks-cta .icon svg path,
|
||||||
|
.wp-block-carhop-blocks-cta .icon svg circle {
|
||||||
|
stroke: var(--cta-current-color);
|
||||||
|
}
|
||||||
|
.wp-block-carhop-blocks-cta.align--left {
|
||||||
|
margin-left: 0;
|
||||||
|
}
|
||||||
|
.wp-block-carhop-blocks-cta.align--right {
|
||||||
|
margin-right: 0;
|
||||||
|
margin-left: auto;
|
||||||
|
}
|
||||||
|
.wp-block-carhop-blocks-cta.align--center {
|
||||||
|
margin: 0 auto;
|
||||||
|
}
|
||||||
|
|
||||||
|
/*# sourceMappingURL=style-index.css.map*/
|
||||||
|
|
@ -0,0 +1 @@
|
||||||
|
{"version":3,"file":"./style-index.css","mappings":";;;AAAA;EACC;EACA;EAEA;EACA;EACA;EAAA;EACA;EACA;EACA;EACA;EAEA;AADD;AAGC;EACC;AADF;AAIE;EACC;EACA;AAFH;AAIE;;EAEC;AAFH;AAMC;EACC;AAJF;AAMC;EACC;EACA;AAJF;AAMC;EACC;AAJF,C","sources":["webpack://cta/./src/style.scss"],"sourcesContent":[".wp-block-carhop-blocks-cta {\n\tmargin-top: 20px;\n\tcolor: var(--cta-current-color);\n\n\tpadding: 2px;\n\tdisplay: block;\n\twidth: fit-content;\n\tdisplay: flex;\n\talign-items: center;\n\tgap: 10px;\n\tline-height: normal;\n\n\tfont-weight: 700;\n\n\ta {\n\t\ttext-decoration: none;\n\t}\n\t.icon {\n\t\tsvg {\n\t\t\twidth: 30px;\n\t\t\theight: 30px;\n\t\t}\n\t\tsvg path,\n\t\tsvg circle {\n\t\t\tstroke: var(--cta-current-color);\n\t\t}\n\t}\n\n\t&.align--left {\n\t\tmargin-left: 0;\n\t}\n\t&.align--right {\n\t\tmargin-right: 0;\n\t\tmargin-left: auto;\n\t}\n\t&.align--center {\n\t\tmargin: 0 auto;\n\t}\n}\n"],"names":[],"sourceRoot":""}
|
||||||
|
|
@ -0,0 +1 @@
|
||||||
|
<?php return array('dependencies' => array(), 'version' => '21d21202ac10eacbe2b5');
|
||||||
|
|
@ -0,0 +1,44 @@
|
||||||
|
/******/ (() => { // webpackBootstrap
|
||||||
|
/*!*********************!*\
|
||||||
|
!*** ./src/view.js ***!
|
||||||
|
\*********************/
|
||||||
|
const cards = gsap.utils.toArray(".scroll-story-block .narrative-card");
|
||||||
|
|
||||||
|
// Ajouter des classes alternées pour le styling
|
||||||
|
cards.forEach((card, index) => {
|
||||||
|
if (index % 2 === 0) {
|
||||||
|
card.classList.add("narrative-card--even");
|
||||||
|
} else {
|
||||||
|
card.classList.add("narrative-card--odd");
|
||||||
|
}
|
||||||
|
});
|
||||||
|
let stickDistance = 0;
|
||||||
|
let firstCardST = ScrollTrigger.create({
|
||||||
|
trigger: cards[0],
|
||||||
|
start: "top 10%"
|
||||||
|
});
|
||||||
|
let lastCardST = ScrollTrigger.create({
|
||||||
|
trigger: cards[cards.length - 1],
|
||||||
|
start: "top 10%"
|
||||||
|
});
|
||||||
|
cards.forEach((card, index) => {
|
||||||
|
var scale = 1 - (cards.length - index) * 0.025;
|
||||||
|
let scaleDown = gsap.to(card, {
|
||||||
|
scale: scale,
|
||||||
|
"transform-origin": '"50% ' + (lastCardST.start + stickDistance) + '"'
|
||||||
|
});
|
||||||
|
ScrollTrigger.create({
|
||||||
|
trigger: card,
|
||||||
|
start: "top 10%",
|
||||||
|
end: () => lastCardST.start + stickDistance,
|
||||||
|
pin: true,
|
||||||
|
// markers: true,
|
||||||
|
pinSpacing: false,
|
||||||
|
ease: "none",
|
||||||
|
animation: scaleDown,
|
||||||
|
toggleActions: "restart none none reverse"
|
||||||
|
});
|
||||||
|
});
|
||||||
|
/******/ })()
|
||||||
|
;
|
||||||
|
//# sourceMappingURL=view.js.map
|
||||||
|
|
@ -0,0 +1 @@
|
||||||
|
{"version":3,"file":"view.js","mappings":";;;;AAAA,MAAMA,KAAK,GAAGC,IAAI,CAACC,KAAK,CAACC,OAAO,CAAC,qCAAqC,CAAC;;AAEvE;AACAH,KAAK,CAACI,OAAO,CAAC,CAACC,IAAI,EAAEC,KAAK,KAAK;EAC9B,IAAIA,KAAK,GAAG,CAAC,KAAK,CAAC,EAAE;IACpBD,IAAI,CAACE,SAAS,CAACC,GAAG,CAAC,sBAAsB,CAAC;EAC3C,CAAC,MAAM;IACNH,IAAI,CAACE,SAAS,CAACC,GAAG,CAAC,qBAAqB,CAAC;EAC1C;AACD,CAAC,CAAC;AAEF,IAAIC,aAAa,GAAG,CAAC;AAErB,IAAIC,WAAW,GAAGC,aAAa,CAACC,MAAM,CAAC;EACtCC,OAAO,EAAEb,KAAK,CAAC,CAAC,CAAC;EACjBc,KAAK,EAAE;AACR,CAAC,CAAC;AAEF,IAAIC,UAAU,GAAGJ,aAAa,CAACC,MAAM,CAAC;EACrCC,OAAO,EAAEb,KAAK,CAACA,KAAK,CAACgB,MAAM,GAAG,CAAC,CAAC;EAChCF,KAAK,EAAE;AACR,CAAC,CAAC;AAEFd,KAAK,CAACI,OAAO,CAAC,CAACC,IAAI,EAAEC,KAAK,KAAK;EAC9B,IAAIW,KAAK,GAAG,CAAC,GAAG,CAACjB,KAAK,CAACgB,MAAM,GAAGV,KAAK,IAAI,KAAK;EAC9C,IAAIY,SAAS,GAAGjB,IAAI,CAACkB,EAAE,CAACd,IAAI,EAAE;IAC7BY,KAAK,EAAEA,KAAK;IACZ,kBAAkB,EAAE,OAAO,IAAIF,UAAU,CAACD,KAAK,GAAGL,aAAa,CAAC,GAAG;EACpE,CAAC,CAAC;EAEFE,aAAa,CAACC,MAAM,CAAC;IACpBC,OAAO,EAAER,IAAI;IACbS,KAAK,EAAE,SAAS;IAChBM,GAAG,EAAEA,CAAA,KAAML,UAAU,CAACD,KAAK,GAAGL,aAAa;IAC3CY,GAAG,EAAE,IAAI;IACT;IACAC,UAAU,EAAE,KAAK;IACjBC,IAAI,EAAE,MAAM;IACZC,SAAS,EAAEN,SAAS;IACpBO,aAAa,EAAE;EAChB,CAAC,CAAC;AACH,CAAC,CAAC,C","sources":["webpack://cta/./src/view.js"],"sourcesContent":["const cards = gsap.utils.toArray(\".scroll-story-block .narrative-card\");\r\n\r\n// Ajouter des classes alternées pour le styling\r\ncards.forEach((card, index) => {\r\n\tif (index % 2 === 0) {\r\n\t\tcard.classList.add(\"narrative-card--even\");\r\n\t} else {\r\n\t\tcard.classList.add(\"narrative-card--odd\");\r\n\t}\r\n});\r\n\r\nlet stickDistance = 0;\r\n\r\nlet firstCardST = ScrollTrigger.create({\r\n\ttrigger: cards[0],\r\n\tstart: \"top 10%\",\r\n});\r\n\r\nlet lastCardST = ScrollTrigger.create({\r\n\ttrigger: cards[cards.length - 1],\r\n\tstart: \"top 10%\",\r\n});\r\n\r\ncards.forEach((card, index) => {\r\n\tvar scale = 1 - (cards.length - index) * 0.025;\r\n\tlet scaleDown = gsap.to(card, {\r\n\t\tscale: scale,\r\n\t\t\"transform-origin\": '\"50% ' + (lastCardST.start + stickDistance) + '\"',\r\n\t});\r\n\r\n\tScrollTrigger.create({\r\n\t\ttrigger: card,\r\n\t\tstart: \"top 10%\",\r\n\t\tend: () => lastCardST.start + stickDistance,\r\n\t\tpin: true,\r\n\t\t// markers: true,\r\n\t\tpinSpacing: false,\r\n\t\tease: \"none\",\r\n\t\tanimation: scaleDown,\r\n\t\ttoggleActions: \"restart none none reverse\",\r\n\t});\r\n});\r\n"],"names":["cards","gsap","utils","toArray","forEach","card","index","classList","add","stickDistance","firstCardST","ScrollTrigger","create","trigger","start","lastCardST","length","scale","scaleDown","to","end","pin","pinSpacing","ease","animation","toggleActions"],"sourceRoot":""}
|
||||||
20255
plugins/carhop-blocks/blocks/scroll-story-block/package-lock.json
generated
Normal file
20255
plugins/carhop-blocks/blocks/scroll-story-block/package-lock.json
generated
Normal file
File diff suppressed because it is too large
Load Diff
24
plugins/carhop-blocks/blocks/scroll-story-block/package.json
Normal file
24
plugins/carhop-blocks/blocks/scroll-story-block/package.json
Normal file
|
|
@ -0,0 +1,24 @@
|
||||||
|
{
|
||||||
|
"name": "cta",
|
||||||
|
"version": "0.1.0",
|
||||||
|
"description": "Example block scaffolded with Create Block tool.",
|
||||||
|
"author": "The WordPress Contributors",
|
||||||
|
"license": "GPL-2.0-or-later",
|
||||||
|
"main": "build/index.js",
|
||||||
|
"scripts": {
|
||||||
|
"build": "wp-scripts build --blocks-manifest",
|
||||||
|
"format": "wp-scripts format",
|
||||||
|
"lint:css": "wp-scripts lint-style",
|
||||||
|
"lint:js": "wp-scripts lint-js",
|
||||||
|
"packages-update": "wp-scripts packages-update",
|
||||||
|
"plugin-zip": "wp-scripts plugin-zip",
|
||||||
|
"start": "wp-scripts start --blocks-manifest"
|
||||||
|
},
|
||||||
|
"devDependencies": {
|
||||||
|
"@wordpress/scripts": "^30.15.0"
|
||||||
|
},
|
||||||
|
"packageManager": "pnpm@10.10.0+sha512.d615db246fe70f25dcfea6d8d73dee782ce23e2245e3c4f6f888249fb568149318637dca73c2c5c8ef2a4ca0d5657fb9567188bfab47f566d1ee6ce987815c39",
|
||||||
|
"dependencies": {
|
||||||
|
"url-loader": "^4.1.1"
|
||||||
|
}
|
||||||
|
}
|
||||||
12891
plugins/carhop-blocks/blocks/scroll-story-block/pnpm-lock.yaml
Normal file
12891
plugins/carhop-blocks/blocks/scroll-story-block/pnpm-lock.yaml
Normal file
File diff suppressed because it is too large
Load Diff
55
plugins/carhop-blocks/blocks/scroll-story-block/readme.txt
Normal file
55
plugins/carhop-blocks/blocks/scroll-story-block/readme.txt
Normal file
|
|
@ -0,0 +1,55 @@
|
||||||
|
=== Cta ===
|
||||||
|
Contributors: The WordPress Contributors
|
||||||
|
Tags: block
|
||||||
|
Tested up to: 6.7
|
||||||
|
Stable tag: 0.1.0
|
||||||
|
License: GPL-2.0-or-later
|
||||||
|
License URI: https://www.gnu.org/licenses/gpl-2.0.html
|
||||||
|
|
||||||
|
Example block scaffolded with Create Block tool.
|
||||||
|
|
||||||
|
== Description ==
|
||||||
|
|
||||||
|
This is the long description. No limit, and you can use Markdown (as well as in the following sections).
|
||||||
|
|
||||||
|
For backwards compatibility, if this section is missing, the full length of the short description will be used, and
|
||||||
|
Markdown parsed.
|
||||||
|
|
||||||
|
== Installation ==
|
||||||
|
|
||||||
|
This section describes how to install the plugin and get it working.
|
||||||
|
|
||||||
|
e.g.
|
||||||
|
|
||||||
|
1. Upload the plugin files to the `/wp-content/plugins/cta` directory, or install the plugin through the WordPress plugins screen directly.
|
||||||
|
1. Activate the plugin through the 'Plugins' screen in WordPress
|
||||||
|
|
||||||
|
|
||||||
|
== Frequently Asked Questions ==
|
||||||
|
|
||||||
|
= A question that someone might have =
|
||||||
|
|
||||||
|
An answer to that question.
|
||||||
|
|
||||||
|
= What about foo bar? =
|
||||||
|
|
||||||
|
Answer to foo bar dilemma.
|
||||||
|
|
||||||
|
== Screenshots ==
|
||||||
|
|
||||||
|
1. This screen shot description corresponds to screenshot-1.(png|jpg|jpeg|gif). Note that the screenshot is taken from
|
||||||
|
the /assets directory or the directory that contains the stable readme.txt (tags or trunk). Screenshots in the /assets
|
||||||
|
directory take precedence. For example, `/assets/screenshot-1.png` would win over `/tags/4.3/screenshot-1.png`
|
||||||
|
(or jpg, jpeg, gif).
|
||||||
|
2. This is the second screen shot
|
||||||
|
|
||||||
|
== Changelog ==
|
||||||
|
|
||||||
|
= 0.1.0 =
|
||||||
|
* Release
|
||||||
|
|
||||||
|
== Arbitrary section ==
|
||||||
|
|
||||||
|
You may provide arbitrary sections, in the same format as the ones above. This may be of use for extremely complicated
|
||||||
|
plugins where more information needs to be conveyed that doesn't fit into the categories of "description" or
|
||||||
|
"installation." Arbitrary sections will be shown below the built-in sections outlined above.
|
||||||
|
|
@ -0,0 +1,19 @@
|
||||||
|
{
|
||||||
|
"$schema": "https://schemas.wp.org/trunk/block.json",
|
||||||
|
"apiVersion": 3,
|
||||||
|
"name": "carhop-blocks/scroll-story-block",
|
||||||
|
"version": "0.1.0",
|
||||||
|
"title": "Section défilante animée",
|
||||||
|
"category": "carhop-blocks",
|
||||||
|
"icon": "format-quote",
|
||||||
|
"description": "Une section défilante animée",
|
||||||
|
"example": {},
|
||||||
|
"supports": {
|
||||||
|
"html": false
|
||||||
|
},
|
||||||
|
"textdomain": "carhop-blocks",
|
||||||
|
"editorScript": "file:./index.js",
|
||||||
|
"editorStyle": "file:./index.css",
|
||||||
|
"style": "file:./style-index.css",
|
||||||
|
"viewScript": "file:./view.js"
|
||||||
|
}
|
||||||
55
plugins/carhop-blocks/blocks/scroll-story-block/src/edit.js
Normal file
55
plugins/carhop-blocks/blocks/scroll-story-block/src/edit.js
Normal file
|
|
@ -0,0 +1,55 @@
|
||||||
|
import { __ } from "@wordpress/i18n";
|
||||||
|
import { useBlockProps, InnerBlocks } from "@wordpress/block-editor";
|
||||||
|
import "./editor.scss";
|
||||||
|
|
||||||
|
export default function Edit({ attributes, setAttributes }) {
|
||||||
|
return (
|
||||||
|
<>
|
||||||
|
<div
|
||||||
|
{...useBlockProps({
|
||||||
|
className: `scroll-story-block`,
|
||||||
|
})}
|
||||||
|
>
|
||||||
|
<InnerBlocks
|
||||||
|
allowedBlocks={["carhop-blocks/narrative-card"]}
|
||||||
|
template={[
|
||||||
|
[
|
||||||
|
"carhop-blocks/narrative-card",
|
||||||
|
{
|
||||||
|
hasCover: true,
|
||||||
|
coverPosition: "left",
|
||||||
|
innerBlocks: [
|
||||||
|
["core/heading", { content: "Lorem ipsum" }],
|
||||||
|
[
|
||||||
|
"core/paragraph",
|
||||||
|
{
|
||||||
|
content:
|
||||||
|
"Lorem ipsum dolor sit amet consectetur adipisicing elit.",
|
||||||
|
},
|
||||||
|
],
|
||||||
|
],
|
||||||
|
},
|
||||||
|
],
|
||||||
|
[
|
||||||
|
"carhop-blocks/narrative-card",
|
||||||
|
{
|
||||||
|
hasCover: true,
|
||||||
|
coverPosition: "right",
|
||||||
|
innerBlocks: [
|
||||||
|
["core/heading", { content: "Lorem ipsum" }],
|
||||||
|
[
|
||||||
|
"core/paragraph",
|
||||||
|
{
|
||||||
|
content:
|
||||||
|
"Lorem ipsum dolor sit amet consectetur adipisicing elit.",
|
||||||
|
},
|
||||||
|
],
|
||||||
|
],
|
||||||
|
},
|
||||||
|
],
|
||||||
|
]}
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
</>
|
||||||
|
);
|
||||||
|
}
|
||||||
|
|
@ -0,0 +1,33 @@
|
||||||
|
.wp-block-carhop-blocks-cta {
|
||||||
|
color: var(--cta-current-color);
|
||||||
|
|
||||||
|
padding: 2px;
|
||||||
|
display: block;
|
||||||
|
width: fit-content;
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
gap: 10px;
|
||||||
|
line-height: normal;
|
||||||
|
|
||||||
|
.icon {
|
||||||
|
svg {
|
||||||
|
width: 30px;
|
||||||
|
height: 30px;
|
||||||
|
}
|
||||||
|
svg path,
|
||||||
|
svg circle {
|
||||||
|
stroke: var(--cta-current-color);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
&.align--left {
|
||||||
|
margin-left: 0;
|
||||||
|
}
|
||||||
|
&.align--right {
|
||||||
|
margin-right: 0;
|
||||||
|
margin-left: auto;
|
||||||
|
}
|
||||||
|
&.align--center {
|
||||||
|
margin: 0 auto;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
@ -0,0 +1,17 @@
|
||||||
|
<?xml version="1.0" encoding="UTF-8"?>
|
||||||
|
<svg id="fleche-lien-externe-full" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 32 32">
|
||||||
|
<defs>
|
||||||
|
<style>
|
||||||
|
.cls-1 {
|
||||||
|
fill: none;
|
||||||
|
stroke: #000;
|
||||||
|
stroke-width: 2px;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
|
</defs>
|
||||||
|
<g>
|
||||||
|
<path class="cls-1" d="M21.15,10.59l-9.38,10.02"/>
|
||||||
|
<path class="cls-1" d="M21.15,21.4v-10.81h-10.32"/>
|
||||||
|
</g>
|
||||||
|
<circle class="cls-1" cx="16" cy="16" r="15"/>
|
||||||
|
</svg>
|
||||||
|
After Width: | Height: | Size: 445 B |
19
plugins/carhop-blocks/blocks/scroll-story-block/src/index.js
Normal file
19
plugins/carhop-blocks/blocks/scroll-story-block/src/index.js
Normal file
|
|
@ -0,0 +1,19 @@
|
||||||
|
import { registerBlockType } from "@wordpress/blocks";
|
||||||
|
import "./style.scss";
|
||||||
|
|
||||||
|
import Edit from "./edit";
|
||||||
|
import save from "./save";
|
||||||
|
import metadata from "./block.json";
|
||||||
|
|
||||||
|
registerBlockType(metadata.name, {
|
||||||
|
icon: {
|
||||||
|
src: (
|
||||||
|
<svg viewBox="0 0 24 24" width="24" height="24">
|
||||||
|
<path d="M22,13v8a1,1,0,0,1-1,1H13a1,1,0,0,1-1-1V13a1,1,0,0,1,1-1h8A1,1,0,0,1,22,13ZM7,6A1,1,0,0,0,6,7v9a1,1,0,0,0,1,1h3V10.5a.5.5,0,0,1,.5-.5H17V7a1,1,0,0,0-1-1ZM3,13H4V4.5A.5.5,0,0,1,4.5,4H13V3a1,1,0,0,0-1-1H3A1,1,0,0,0,2,3v9A1,1,0,0,0,3,13Z" />
|
||||||
|
</svg>
|
||||||
|
),
|
||||||
|
foreground: "#136f63",
|
||||||
|
},
|
||||||
|
edit: Edit,
|
||||||
|
save,
|
||||||
|
});
|
||||||
|
|
@ -0,0 +1,9 @@
|
||||||
|
import { useBlockProps, InnerBlocks } from "@wordpress/block-editor";
|
||||||
|
|
||||||
|
export default function save({ attributes }) {
|
||||||
|
return (
|
||||||
|
<div {...useBlockProps.save({ className: "scroll-story-block" })}>
|
||||||
|
<InnerBlocks.Content />
|
||||||
|
</div>
|
||||||
|
);
|
||||||
|
}
|
||||||
|
|
@ -0,0 +1,39 @@
|
||||||
|
.wp-block-carhop-blocks-cta {
|
||||||
|
margin-top: 20px;
|
||||||
|
color: var(--cta-current-color);
|
||||||
|
|
||||||
|
padding: 2px;
|
||||||
|
display: block;
|
||||||
|
width: fit-content;
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
gap: 10px;
|
||||||
|
line-height: normal;
|
||||||
|
|
||||||
|
font-weight: 700;
|
||||||
|
|
||||||
|
a {
|
||||||
|
text-decoration: none;
|
||||||
|
}
|
||||||
|
.icon {
|
||||||
|
svg {
|
||||||
|
width: 30px;
|
||||||
|
height: 30px;
|
||||||
|
}
|
||||||
|
svg path,
|
||||||
|
svg circle {
|
||||||
|
stroke: var(--cta-current-color);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
&.align--left {
|
||||||
|
margin-left: 0;
|
||||||
|
}
|
||||||
|
&.align--right {
|
||||||
|
margin-right: 0;
|
||||||
|
margin-left: auto;
|
||||||
|
}
|
||||||
|
&.align--center {
|
||||||
|
margin: 0 auto;
|
||||||
|
}
|
||||||
|
}
|
||||||
42
plugins/carhop-blocks/blocks/scroll-story-block/src/view.js
Normal file
42
plugins/carhop-blocks/blocks/scroll-story-block/src/view.js
Normal file
|
|
@ -0,0 +1,42 @@
|
||||||
|
const cards = gsap.utils.toArray(".scroll-story-block .narrative-card");
|
||||||
|
|
||||||
|
// Ajouter des classes alternées pour le styling
|
||||||
|
cards.forEach((card, index) => {
|
||||||
|
if (index % 2 === 0) {
|
||||||
|
card.classList.add("narrative-card--even");
|
||||||
|
} else {
|
||||||
|
card.classList.add("narrative-card--odd");
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
let stickDistance = 0;
|
||||||
|
|
||||||
|
let firstCardST = ScrollTrigger.create({
|
||||||
|
trigger: cards[0],
|
||||||
|
start: "top 10%",
|
||||||
|
});
|
||||||
|
|
||||||
|
let lastCardST = ScrollTrigger.create({
|
||||||
|
trigger: cards[cards.length - 1],
|
||||||
|
start: "top 10%",
|
||||||
|
});
|
||||||
|
|
||||||
|
cards.forEach((card, index) => {
|
||||||
|
var scale = 1 - (cards.length - index) * 0.025;
|
||||||
|
let scaleDown = gsap.to(card, {
|
||||||
|
scale: scale,
|
||||||
|
"transform-origin": '"50% ' + (lastCardST.start + stickDistance) + '"',
|
||||||
|
});
|
||||||
|
|
||||||
|
ScrollTrigger.create({
|
||||||
|
trigger: card,
|
||||||
|
start: "top 10%",
|
||||||
|
end: () => lastCardST.start + stickDistance,
|
||||||
|
pin: true,
|
||||||
|
// markers: true,
|
||||||
|
pinSpacing: false,
|
||||||
|
ease: "none",
|
||||||
|
animation: scaleDown,
|
||||||
|
toggleActions: "restart none none reverse",
|
||||||
|
});
|
||||||
|
});
|
||||||
Loading…
Reference in New Issue
Block a user