Compare commits
3 Commits
70ebc1976e
...
d72159c9e4
| Author | SHA1 | Date | |
|---|---|---|---|
|
|
d72159c9e4 | ||
|
|
23dc43cbfb | ||
|
|
b20a4f3211 |
|
|
@ -32,6 +32,10 @@
|
|||
"textColor": {
|
||||
"type": "string",
|
||||
"default": "#ffffff"
|
||||
},
|
||||
"blockVariant": {
|
||||
"type": "string",
|
||||
"default": "framed"
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
@ -1 +1 @@
|
|||
<?php return array('dependencies' => array('react-jsx-runtime', 'wp-block-editor', 'wp-blocks', 'wp-components', 'wp-i18n'), 'version' => '1e925ab101f7d6d0270a');
|
||||
<?php return array('dependencies' => array('react-jsx-runtime', 'wp-block-editor', 'wp-blocks', 'wp-components', 'wp-data', 'wp-i18n'), 'version' => 'fbe907136f52d95a3931');
|
||||
|
|
|
|||
|
|
@ -41,7 +41,7 @@ function isColorLight(color) {
|
|||
\************************/
|
||||
/***/ ((module) => {
|
||||
|
||||
module.exports = /*#__PURE__*/JSON.parse('{"$schema":"https://schemas.wp.org/trunk/block.json","apiVersion":3,"name":"carhop-blocks/content-box","version":"0.1.0","title":"Content Box","category":"carhop-blocks","icon":"smiley","description":"Boite de contenu pour la mise en forme d\'éléments de contenu","example":{},"supports":{"html":false},"textdomain":"carhop-blocks","editorScript":"file:./index.js","editorStyle":"file:./index.css","style":"file:./style-index.css","viewScript":"file:./view.js","attributes":{"hasBackgroundColor":{"type":"boolean","default":false},"backgroundColor":{"type":"string","default":"#136f63"},"hasLightBackground":{"type":"boolean","default":true},"textColor":{"type":"string","default":"#ffffff"}}}');
|
||||
module.exports = /*#__PURE__*/JSON.parse('{"$schema":"https://schemas.wp.org/trunk/block.json","apiVersion":3,"name":"carhop-blocks/content-box","version":"0.1.0","title":"Content Box","category":"carhop-blocks","icon":"smiley","description":"Boite de contenu pour la mise en forme d\'éléments de contenu","example":{},"supports":{"html":false},"textdomain":"carhop-blocks","editorScript":"file:./index.js","editorStyle":"file:./index.css","style":"file:./style-index.css","viewScript":"file:./view.js","attributes":{"hasBackgroundColor":{"type":"boolean","default":false},"backgroundColor":{"type":"string","default":"#136f63"},"hasLightBackground":{"type":"boolean","default":true},"textColor":{"type":"string","default":"#ffffff"},"blockVariant":{"type":"string","default":"framed"}}}');
|
||||
|
||||
/***/ }),
|
||||
|
||||
|
|
@ -59,12 +59,18 @@ __webpack_require__.r(__webpack_exports__);
|
|||
/* 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 _utilities_utilities__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ../../_utilities/utilities */ "../_utilities/utilities.js");
|
||||
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! @wordpress/components */ "@wordpress/components");
|
||||
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_4___default = /*#__PURE__*/__webpack_require__.n(_wordpress_components__WEBPACK_IMPORTED_MODULE_4__);
|
||||
/* 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__);
|
||||
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! @wordpress/components */ "@wordpress/components");
|
||||
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(_wordpress_components__WEBPACK_IMPORTED_MODULE_2__);
|
||||
/* harmony import */ var _wordpress_data__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! @wordpress/data */ "@wordpress/data");
|
||||
/* harmony import */ var _wordpress_data__WEBPACK_IMPORTED_MODULE_3___default = /*#__PURE__*/__webpack_require__.n(_wordpress_data__WEBPACK_IMPORTED_MODULE_3__);
|
||||
/* harmony import */ var _editor_scss__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ./editor.scss */ "./src/editor.scss");
|
||||
/* harmony import */ var _utilities_utilities__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ../../_utilities/utilities */ "../_utilities/utilities.js");
|
||||
/* harmony import */ var _utilities__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! ./utilities */ "./src/utilities.js");
|
||||
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! react/jsx-runtime */ "react/jsx-runtime");
|
||||
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_7___default = /*#__PURE__*/__webpack_require__.n(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_7__);
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
|
@ -81,8 +87,16 @@ function Edit({
|
|||
hasBackgroundColor,
|
||||
backgroundColor,
|
||||
textColor,
|
||||
hasLightBackground
|
||||
hasLightBackground,
|
||||
blockVariant
|
||||
} = attributes;
|
||||
|
||||
// Détecter le type de post actuel
|
||||
const postType = (0,_wordpress_data__WEBPACK_IMPORTED_MODULE_3__.useSelect)(select => {
|
||||
return select("core/editor").getCurrentPostType();
|
||||
}, []);
|
||||
const filteredBgColors = (0,_utilities__WEBPACK_IMPORTED_MODULE_6__.filterBgColors)(colors, postType);
|
||||
const filteredTextColors = (0,_utilities__WEBPACK_IMPORTED_MODULE_6__.filterTextColors)(colors, postType, backgroundColor);
|
||||
function onBackgroundColorChange(value) {
|
||||
if (value === undefined) {
|
||||
setAttributes({
|
||||
|
|
@ -92,13 +106,22 @@ function Edit({
|
|||
backgroundColor: "transparent"
|
||||
});
|
||||
}
|
||||
const isLightBackgroundColor = (0,_utilities_utilities__WEBPACK_IMPORTED_MODULE_3__.isColorLight)(backgroundColor);
|
||||
const isLightBackgroundColor = (0,_utilities_utilities__WEBPACK_IMPORTED_MODULE_5__.isColorLight)(value);
|
||||
setAttributes({
|
||||
hasLightBackground: isLightBackgroundColor
|
||||
});
|
||||
setAttributes({
|
||||
backgroundColor: value
|
||||
});
|
||||
if (!isLightBackgroundColor) {
|
||||
setAttributes({
|
||||
textColor: "#fff"
|
||||
});
|
||||
} else {
|
||||
setAttributes({
|
||||
textColor: "inherit"
|
||||
});
|
||||
}
|
||||
}
|
||||
function onHasBackgroundColorChange(value) {
|
||||
setAttributes({
|
||||
|
|
@ -115,48 +138,72 @@ function Edit({
|
|||
textColor: value
|
||||
});
|
||||
}
|
||||
return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsxs)(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.Fragment, {
|
||||
children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsxs)(_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_1__.InspectorControls, {
|
||||
children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsxs)(_wordpress_components__WEBPACK_IMPORTED_MODULE_4__.PanelBody, {
|
||||
className: "deligraph-blocks-components-image__panel-body",
|
||||
title: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Arrière plan", "deligraph-blocks"),
|
||||
children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_4__.CheckboxControl, {
|
||||
label: "Arri\xE8re plan color\xE9",
|
||||
checked: hasBackgroundColor,
|
||||
onChange: onHasBackgroundColorChange
|
||||
}), hasBackgroundColor && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsx)(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.Fragment, {
|
||||
children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_4__.ColorPalette, {
|
||||
colors: colors,
|
||||
function onBlockVariantChange(value) {
|
||||
setAttributes({
|
||||
blockVariant: value
|
||||
});
|
||||
}
|
||||
return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_7__.jsxs)(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_7__.Fragment, {
|
||||
children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_7__.jsx)(_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_1__.InspectorControls, {
|
||||
children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_7__.jsxs)(_wordpress_components__WEBPACK_IMPORTED_MODULE_2__.PanelBody, {
|
||||
title: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Aspect", "carhop-blocks"),
|
||||
children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_7__.jsxs)(_wordpress_components__WEBPACK_IMPORTED_MODULE_2__.__experimentalToggleGroupControl, {
|
||||
label: "Mod\xE8le de bloc",
|
||||
value: blockVariant,
|
||||
onChange: onBlockVariantChange,
|
||||
isBlock: true,
|
||||
__nextHasNoMarginBottom: true,
|
||||
__next40pxDefaultSize: true,
|
||||
children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_7__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_2__.__experimentalToggleGroupControlOption, {
|
||||
value: "framed",
|
||||
label: "Encadr\xE9"
|
||||
}), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_7__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_2__.__experimentalToggleGroupControlOption, {
|
||||
value: "backgrounded",
|
||||
label: "Fond color\xE9"
|
||||
})]
|
||||
}), blockVariant === "backgrounded" && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_7__.jsxs)(_wordpress_components__WEBPACK_IMPORTED_MODULE_2__.Card, {
|
||||
children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_7__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_2__.CardHeader, {
|
||||
children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_7__.jsx)("h1", {
|
||||
children: "Couleur de fond"
|
||||
})
|
||||
}), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_7__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_2__.CardBody, {
|
||||
children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_7__.jsx)(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_7__.Fragment, {
|
||||
children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_7__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_2__.ColorPalette, {
|
||||
colors: filteredBgColors,
|
||||
value: backgroundColor,
|
||||
onChange: onBackgroundColorChange
|
||||
})
|
||||
})
|
||||
})]
|
||||
}), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_4__.PanelBody, {
|
||||
className: "deligraph-blocks-components-image__panel-body",
|
||||
title: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Couleur du texte", "deligraph-blocks"),
|
||||
children: hasBackgroundColor && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsx)(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.Fragment, {
|
||||
children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_4__.ColorPalette, {
|
||||
colors: colors,
|
||||
}), blockVariant === "backgrounded" && postType !== "articles" && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_7__.jsxs)(_wordpress_components__WEBPACK_IMPORTED_MODULE_2__.Card, {
|
||||
children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_7__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_2__.CardHeader, {
|
||||
children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_7__.jsx)("h1", {
|
||||
children: "Couleur du texte "
|
||||
})
|
||||
}), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_7__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_2__.CardBody, {
|
||||
children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_7__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_2__.ColorPalette, {
|
||||
colors: filteredTextColors,
|
||||
value: textColor,
|
||||
onChange: onTextColorChange
|
||||
})
|
||||
})
|
||||
})]
|
||||
}), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsx)("section", {
|
||||
})]
|
||||
})
|
||||
}), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_7__.jsx)("section", {
|
||||
...(0,_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_1__.useBlockProps)({
|
||||
className: `content-box ${hasLightBackground ? "content-box--bg-light" : "content-box--bg-dark"}`,
|
||||
className: `content-box content-box--variant-${blockVariant} ${hasLightBackground ? "content-box--bg-light" : "content-box--bg-dark"}`,
|
||||
style: {
|
||||
"--content-box-text-color": textColor !== null && textColor !== void 0 ? textColor : "inherit",
|
||||
"--content-box-background-color": hasBackgroundColor ? backgroundColor : "transparent"
|
||||
"--content-box-background-color": blockVariant === "backgrounded" ? backgroundColor : "transparent"
|
||||
}
|
||||
}),
|
||||
children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsx)("div", {
|
||||
children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_7__.jsx)("div", {
|
||||
className: "content-box__innerblocks",
|
||||
children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsx)(_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_1__.InnerBlocks, {
|
||||
children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_7__.jsx)(_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_1__.InnerBlocks, {
|
||||
template: [["core/paragraph", {
|
||||
placeholder: "Ajouter ici le texte"
|
||||
}]],
|
||||
allowedBlocks: ["core/heading", "core/paragraph", "core/group", "core/list", "core/button", "core/buttons", "carhop-blocks/heading", "carhop-blocks/decorative-shapes", "acf/statistics-datas", "carhop-blocks/scroll-story-block", "carhop-blocks/cta-group", "ninja-forms/form"]
|
||||
allowedBlocks: ["core/heading", "core/paragraph", "core/group", "core/list", "core/button", "core/image", "core/buttons", "carhop-blocks/heading", "carhop-blocks/decorative-shapes", "acf/statistics-datas", "carhop-blocks/scroll-story-block", "carhop-blocks/cta-group", "ninja-forms/form"]
|
||||
})
|
||||
})
|
||||
})]
|
||||
|
|
@ -245,14 +292,15 @@ function save({
|
|||
backgroundColor,
|
||||
textColor,
|
||||
hasLightBackground,
|
||||
hasBackgroundColor
|
||||
hasBackgroundColor,
|
||||
blockVariant
|
||||
} = attributes;
|
||||
return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_2__.jsx)("section", {
|
||||
..._wordpress_block_editor__WEBPACK_IMPORTED_MODULE_0__.useBlockProps.save({
|
||||
className: `content-box ${hasLightBackground ? "content-box--bg-light" : "content-box--bg-dark"}`,
|
||||
className: `content-box content-box--variant-${blockVariant} ${hasLightBackground ? "content-box--bg-light" : "content-box--bg-dark"}`,
|
||||
style: {
|
||||
"--content-box-text-color": textColor !== null && textColor !== void 0 ? textColor : "inherit",
|
||||
"--content-box-background-color": hasBackgroundColor ? backgroundColor : "transparent"
|
||||
"--content-box-background-color": blockVariant === "backgrounded" ? backgroundColor : "transparent"
|
||||
}
|
||||
}),
|
||||
children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_2__.jsx)("div", {
|
||||
|
|
@ -274,6 +322,45 @@ __webpack_require__.r(__webpack_exports__);
|
|||
// extracted by mini-css-extract-plugin
|
||||
|
||||
|
||||
/***/ }),
|
||||
|
||||
/***/ "./src/utilities.js":
|
||||
/*!**************************!*\
|
||||
!*** ./src/utilities.js ***!
|
||||
\**************************/
|
||||
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
|
||||
|
||||
__webpack_require__.r(__webpack_exports__);
|
||||
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
|
||||
/* harmony export */ filterBgColors: () => (/* binding */ filterBgColors),
|
||||
/* harmony export */ filterTextColors: () => (/* binding */ filterTextColors)
|
||||
/* harmony export */ });
|
||||
/* harmony import */ var _utilities_utilities__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ../../_utilities/utilities */ "../_utilities/utilities.js");
|
||||
|
||||
const filterBgColors = (colors, postType) => {
|
||||
if (!postType) return colors || [];
|
||||
if (postType === "articles") {
|
||||
return colors?.filter(color => {
|
||||
// Garder seulement certaines couleurs pour les articles
|
||||
const allowedColors = ["carhop-green-light", "carhop-blue-light", "carhop-orange-light", "carhop-red-light", "carhop-purple-light"];
|
||||
return allowedColors.includes(color.slug);
|
||||
}) || [];
|
||||
}
|
||||
return colors || [];
|
||||
};
|
||||
const filterTextColors = (colors, postType, backgroundColor) => {
|
||||
if (!postType) return colors || [];
|
||||
if (postType === "page" && !(0,_utilities_utilities__WEBPACK_IMPORTED_MODULE_0__.isColorLight)(backgroundColor)) {
|
||||
// Retourner seulement du blanc pour les pages avec arrière-plan sombre
|
||||
return [{
|
||||
name: "White",
|
||||
slug: "white",
|
||||
color: "#ffffff"
|
||||
}];
|
||||
}
|
||||
return colors || [];
|
||||
};
|
||||
|
||||
/***/ }),
|
||||
|
||||
/***/ "@wordpress/block-editor":
|
||||
|
|
@ -306,6 +393,16 @@ module.exports = window["wp"]["components"];
|
|||
|
||||
/***/ }),
|
||||
|
||||
/***/ "@wordpress/data":
|
||||
/*!******************************!*\
|
||||
!*** external ["wp","data"] ***!
|
||||
\******************************/
|
||||
/***/ ((module) => {
|
||||
|
||||
module.exports = window["wp"]["data"];
|
||||
|
||||
/***/ }),
|
||||
|
||||
/***/ "@wordpress/i18n":
|
||||
/*!******************************!*\
|
||||
!*** external ["wp","i18n"] ***!
|
||||
|
|
|
|||
File diff suppressed because one or more lines are too long
|
|
@ -32,6 +32,10 @@
|
|||
"textColor": {
|
||||
"type": "string",
|
||||
"default": "#ffffff"
|
||||
},
|
||||
"blockVariant": {
|
||||
"type": "string",
|
||||
"default": "framed"
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
@ -7,9 +7,16 @@ import {
|
|||
MediaReplaceFlow,
|
||||
MediaPlaceholder,
|
||||
} from "@wordpress/block-editor";
|
||||
import {
|
||||
Card,
|
||||
CardHeader,
|
||||
CardBody,
|
||||
Heading,
|
||||
Text,
|
||||
} from "@wordpress/components";
|
||||
import { useSelect } from "@wordpress/data";
|
||||
import "./editor.scss";
|
||||
import { isColorLight } from "../../_utilities/utilities";
|
||||
|
||||
import {
|
||||
PanelBody,
|
||||
__experimentalToggleGroupControl as ToggleGroupControl,
|
||||
|
|
@ -19,20 +26,45 @@ import {
|
|||
ColorPalette,
|
||||
} from "@wordpress/components";
|
||||
|
||||
import { filterBgColors, filterTextColors } from "./utilities";
|
||||
|
||||
export default function Edit({ attributes, setAttributes, ...props }) {
|
||||
const colors = useSetting("color.palette.theme");
|
||||
const { hasBackgroundColor, backgroundColor, textColor, hasLightBackground } =
|
||||
attributes;
|
||||
|
||||
const {
|
||||
hasBackgroundColor,
|
||||
backgroundColor,
|
||||
textColor,
|
||||
hasLightBackground,
|
||||
blockVariant,
|
||||
} = attributes;
|
||||
|
||||
// Détecter le type de post actuel
|
||||
const postType = useSelect((select) => {
|
||||
return select("core/editor").getCurrentPostType();
|
||||
}, []);
|
||||
|
||||
const filteredBgColors = filterBgColors(colors, postType);
|
||||
const filteredTextColors = filterTextColors(
|
||||
colors,
|
||||
postType,
|
||||
backgroundColor,
|
||||
);
|
||||
|
||||
function onBackgroundColorChange(value) {
|
||||
if (value === undefined) {
|
||||
setAttributes({ hasBackgroundColor: false });
|
||||
setAttributes({ backgroundColor: "transparent" });
|
||||
}
|
||||
const isLightBackgroundColor = isColorLight(backgroundColor);
|
||||
const isLightBackgroundColor = isColorLight(value);
|
||||
setAttributes({ hasLightBackground: isLightBackgroundColor });
|
||||
|
||||
setAttributes({ backgroundColor: value });
|
||||
|
||||
if (!isLightBackgroundColor) {
|
||||
setAttributes({ textColor: "#fff" });
|
||||
} else {
|
||||
setAttributes({ textColor: "inherit" });
|
||||
}
|
||||
}
|
||||
function onHasBackgroundColorChange(value) {
|
||||
setAttributes({ hasBackgroundColor: value });
|
||||
|
|
@ -43,55 +75,72 @@ export default function Edit({ attributes, setAttributes, ...props }) {
|
|||
function onTextColorChange(value) {
|
||||
setAttributes({ textColor: value });
|
||||
}
|
||||
function onBlockVariantChange(value) {
|
||||
setAttributes({ blockVariant: value });
|
||||
}
|
||||
return (
|
||||
<>
|
||||
<InspectorControls>
|
||||
<PanelBody
|
||||
className="deligraph-blocks-components-image__panel-body"
|
||||
title={__("Arrière plan", "deligraph-blocks")}
|
||||
<PanelBody title={__("Aspect", "carhop-blocks")}>
|
||||
<ToggleGroupControl
|
||||
label="Modèle de bloc"
|
||||
value={blockVariant}
|
||||
onChange={onBlockVariantChange}
|
||||
isBlock
|
||||
__nextHasNoMarginBottom
|
||||
__next40pxDefaultSize
|
||||
>
|
||||
<CheckboxControl
|
||||
label="Arrière plan coloré"
|
||||
checked={hasBackgroundColor}
|
||||
onChange={onHasBackgroundColorChange}
|
||||
<ToggleGroupControlOption value="framed" label="Encadré" />
|
||||
<ToggleGroupControlOption
|
||||
value="backgrounded"
|
||||
label="Fond coloré"
|
||||
/>
|
||||
{hasBackgroundColor && (
|
||||
</ToggleGroupControl>
|
||||
|
||||
{blockVariant === "backgrounded" && (
|
||||
<Card>
|
||||
<CardHeader>
|
||||
<h1>Couleur de fond</h1>
|
||||
</CardHeader>
|
||||
<CardBody>
|
||||
<>
|
||||
<ColorPalette
|
||||
colors={colors}
|
||||
colors={filteredBgColors}
|
||||
value={backgroundColor}
|
||||
onChange={onBackgroundColorChange}
|
||||
/>
|
||||
</>
|
||||
</CardBody>
|
||||
</Card>
|
||||
)}
|
||||
</PanelBody>
|
||||
<PanelBody
|
||||
className="deligraph-blocks-components-image__panel-body"
|
||||
title={__("Couleur du texte", "deligraph-blocks")}
|
||||
>
|
||||
{hasBackgroundColor && (
|
||||
<>
|
||||
|
||||
{blockVariant === "backgrounded" && postType !== "articles" && (
|
||||
<Card>
|
||||
<CardHeader>
|
||||
<h1>Couleur du texte </h1>
|
||||
</CardHeader>
|
||||
<CardBody>
|
||||
<ColorPalette
|
||||
colors={colors}
|
||||
colors={filteredTextColors}
|
||||
value={textColor}
|
||||
onChange={onTextColorChange}
|
||||
/>
|
||||
</>
|
||||
</CardBody>
|
||||
</Card>
|
||||
)}
|
||||
</PanelBody>
|
||||
</InspectorControls>
|
||||
<section
|
||||
{...useBlockProps({
|
||||
className: `content-box ${
|
||||
className: `content-box content-box--variant-${blockVariant} ${
|
||||
hasLightBackground
|
||||
? "content-box--bg-light"
|
||||
: "content-box--bg-dark"
|
||||
}`,
|
||||
style: {
|
||||
"--content-box-text-color": textColor ?? "inherit",
|
||||
"--content-box-background-color": hasBackgroundColor
|
||||
? backgroundColor
|
||||
: "transparent",
|
||||
"--content-box-background-color":
|
||||
blockVariant === "backgrounded" ? backgroundColor : "transparent",
|
||||
},
|
||||
})}
|
||||
>
|
||||
|
|
@ -106,6 +155,7 @@ export default function Edit({ attributes, setAttributes, ...props }) {
|
|||
"core/group",
|
||||
"core/list",
|
||||
"core/button",
|
||||
"core/image",
|
||||
"core/buttons",
|
||||
"carhop-blocks/heading",
|
||||
"carhop-blocks/decorative-shapes",
|
||||
|
|
|
|||
|
|
@ -2,19 +2,23 @@ import { useBlockProps, InnerBlocks } from "@wordpress/block-editor";
|
|||
import { isColorLight } from "../../_utilities/utilities";
|
||||
|
||||
export default function save({ attributes }) {
|
||||
const { backgroundColor, textColor, hasLightBackground, hasBackgroundColor } =
|
||||
attributes;
|
||||
const {
|
||||
backgroundColor,
|
||||
textColor,
|
||||
hasLightBackground,
|
||||
hasBackgroundColor,
|
||||
blockVariant,
|
||||
} = attributes;
|
||||
return (
|
||||
<section
|
||||
{...useBlockProps.save({
|
||||
className: `content-box ${
|
||||
className: `content-box content-box--variant-${blockVariant} ${
|
||||
hasLightBackground ? "content-box--bg-light" : "content-box--bg-dark"
|
||||
}`,
|
||||
style: {
|
||||
"--content-box-text-color": textColor ?? "inherit",
|
||||
"--content-box-background-color": hasBackgroundColor
|
||||
? backgroundColor
|
||||
: "transparent",
|
||||
"--content-box-background-color":
|
||||
blockVariant === "backgrounded" ? backgroundColor : "transparent",
|
||||
},
|
||||
})}
|
||||
>
|
||||
|
|
|
|||
39
plugins/carhop-blocks/blocks/content-box/src/utilities.js
Normal file
39
plugins/carhop-blocks/blocks/content-box/src/utilities.js
Normal file
|
|
@ -0,0 +1,39 @@
|
|||
import { isColorLight } from "../../_utilities/utilities";
|
||||
|
||||
export const filterBgColors = (colors, postType) => {
|
||||
if (!postType) return colors || [];
|
||||
|
||||
if (postType === "articles") {
|
||||
return (
|
||||
colors?.filter((color) => {
|
||||
// Garder seulement certaines couleurs pour les articles
|
||||
const allowedColors = [
|
||||
"carhop-green-light",
|
||||
"carhop-blue-light",
|
||||
"carhop-orange-light",
|
||||
"carhop-red-light",
|
||||
"carhop-purple-light",
|
||||
];
|
||||
return allowedColors.includes(color.slug);
|
||||
}) || []
|
||||
);
|
||||
}
|
||||
|
||||
return colors || [];
|
||||
};
|
||||
|
||||
export const filterTextColors = (colors, postType, backgroundColor) => {
|
||||
if (!postType) return colors || [];
|
||||
if (postType === "page" && !isColorLight(backgroundColor)) {
|
||||
// Retourner seulement du blanc pour les pages avec arrière-plan sombre
|
||||
return [
|
||||
{
|
||||
name: "White",
|
||||
slug: "white",
|
||||
color: "#ffffff",
|
||||
},
|
||||
];
|
||||
}
|
||||
|
||||
return colors || [];
|
||||
};
|
||||
|
|
@ -40,7 +40,7 @@ body {
|
|||
.popover_footnote_field {
|
||||
.components-popover__content {
|
||||
padding: 10px !important;
|
||||
min-width: 300px;
|
||||
min-width: 500px;
|
||||
}
|
||||
.popover_footnote_field_buttons {
|
||||
display: flex;
|
||||
|
|
|
|||
|
|
@ -1 +1 @@
|
|||
<?php return array('dependencies' => array('react-jsx-runtime', 'wp-block-editor', 'wp-components', 'wp-element', 'wp-i18n', 'wp-primitives', 'wp-rich-text'), 'version' => '2a4a696193922e7ac850');
|
||||
<?php return array('dependencies' => array('react-jsx-runtime', 'wp-block-editor', 'wp-components', 'wp-element', 'wp-i18n', 'wp-primitives', 'wp-rich-text'), 'version' => 'f6950541d590ca633920');
|
||||
|
|
|
|||
|
|
@ -40,7 +40,7 @@ body {
|
|||
.popover_footnote_field {
|
||||
.components-popover__content {
|
||||
padding: 10px !important;
|
||||
min-width: 300px;
|
||||
min-width: 500px;
|
||||
}
|
||||
.popover_footnote_field_buttons {
|
||||
display: flex;
|
||||
|
|
|
|||
|
|
@ -1 +1 @@
|
|||
{"version":3,"file":"index.css","mappings":";;;AAAA;CACC,6BAA6B;AAC9B;AACA;CACC,iCAAiC;CACjC,kBAAkB;CAClB,YAAY;;CAEZ;EACC,mDAAmD;EACnD,WAAW;EACX,WAAW;EACX,YAAY;EACZ,kBAAkB;EAClB,gCAAgC;EAChC,oBAAoB;EACpB,uBAAuB;EACvB,mBAAmB;EACnB,0BAA0B;EAC1B,gBAAgB;EAChB,gBAAgB;EAChB,iBAAiB;CAClB;AACD;;AAEA;;CAEC;EACC,0BAA0B;EAC1B,6BAA6B;EAC7B,wDAAwD;EACxD,8BAA8B;EAC9B,0BAA0B;CAC3B;AACD;;AAEA;CACC;EACC,wBAAwB;EACxB,gBAAgB;CACjB;CACA;EACC,aAAa;EACb,yBAAyB;EACzB,SAAS;EACT,gBAAgB;;EAEhB;GACC,oCAAoC;GACpC,sBAAsB;EACvB;;EAEA;GACC,8DAA8D;GAC9D,sBAAsB;EACvB;CACD;AACD","sources":["webpack:///./src/footnote.css"],"sourcesContent":["body {\r\n\tcounter-reset: footnote-index;\r\n}\r\n.footnote-reference {\r\n\tcounter-increment: footnote-index;\r\n\tposition: relative;\r\n\tcolor: unset;\r\n\r\n\t&::after {\r\n\t\tbackground-color: var(--wp--preset--color--primary);\r\n\t\tcolor: #fff;\r\n\t\twidth: 30px;\r\n\t\theight: 30px;\r\n\t\tborder-radius: 50%;\r\n\t\tcontent: counter(footnote-index);\r\n\t\tdisplay: inline-flex;\r\n\t\tjustify-content: center;\r\n\t\talign-items: center;\r\n\t\tfont-size: 16px !important;\r\n\t\tfont-weight: 600;\r\n\t\tmargin-left: 3px;\r\n\t\tmargin-right: 3px;\r\n\t}\r\n}\r\n\r\n// Editor\r\n.footnote-reference {\r\n\t.wp-block-post-content & {\r\n\t\ttext-decoration: underline;\r\n\t\ttext-decoration-style: dotted;\r\n\t\ttext-decoration-color: var(--wp--preset--color--primary);\r\n\t\ttext-decoration-thickness: 2px;\r\n\t\ttext-underline-offset: 2px;\r\n\t}\r\n}\r\n\r\n.popover_footnote_field {\r\n\t.components-popover__content {\r\n\t\tpadding: 10px !important;\r\n\t\tmin-width: 300px;\r\n\t}\r\n\t.popover_footnote_field_buttons {\r\n\t\tdisplay: flex;\r\n\t\tjustify-content: flex-end;\r\n\t\tgap: 10px;\r\n\t\tmargin-top: 10px;\r\n\r\n\t\tbutton.is-destructive {\r\n\t\t\tbackground-color: #cc1818 !important;\r\n\t\t\tcolor: #fff !important;\r\n\t\t}\r\n\r\n\t\tbutton.is-primary {\r\n\t\t\tbackground-color: var(--wp--preset--color--primary) !important;\r\n\t\t\tcolor: #fff !important;\r\n\t\t}\r\n\t}\r\n}\r\n"],"names":[],"sourceRoot":""}
|
||||
{"version":3,"file":"index.css","mappings":";;;AAAA;CACC,6BAA6B;AAC9B;AACA;CACC,iCAAiC;CACjC,kBAAkB;CAClB,YAAY;;CAEZ;EACC,mDAAmD;EACnD,WAAW;EACX,WAAW;EACX,YAAY;EACZ,kBAAkB;EAClB,gCAAgC;EAChC,oBAAoB;EACpB,uBAAuB;EACvB,mBAAmB;EACnB,0BAA0B;EAC1B,gBAAgB;EAChB,gBAAgB;EAChB,iBAAiB;CAClB;AACD;;AAEA;;CAEC;EACC,0BAA0B;EAC1B,6BAA6B;EAC7B,wDAAwD;EACxD,8BAA8B;EAC9B,0BAA0B;CAC3B;AACD;;AAEA;CACC;EACC,wBAAwB;EACxB,gBAAgB;CACjB;CACA;EACC,aAAa;EACb,yBAAyB;EACzB,SAAS;EACT,gBAAgB;;EAEhB;GACC,oCAAoC;GACpC,sBAAsB;EACvB;;EAEA;GACC,8DAA8D;GAC9D,sBAAsB;EACvB;CACD;AACD","sources":["webpack:///./src/footnote.css"],"sourcesContent":["body {\r\n\tcounter-reset: footnote-index;\r\n}\r\n.footnote-reference {\r\n\tcounter-increment: footnote-index;\r\n\tposition: relative;\r\n\tcolor: unset;\r\n\r\n\t&::after {\r\n\t\tbackground-color: var(--wp--preset--color--primary);\r\n\t\tcolor: #fff;\r\n\t\twidth: 30px;\r\n\t\theight: 30px;\r\n\t\tborder-radius: 50%;\r\n\t\tcontent: counter(footnote-index);\r\n\t\tdisplay: inline-flex;\r\n\t\tjustify-content: center;\r\n\t\talign-items: center;\r\n\t\tfont-size: 16px !important;\r\n\t\tfont-weight: 600;\r\n\t\tmargin-left: 3px;\r\n\t\tmargin-right: 3px;\r\n\t}\r\n}\r\n\r\n// Editor\r\n.footnote-reference {\r\n\t.wp-block-post-content & {\r\n\t\ttext-decoration: underline;\r\n\t\ttext-decoration-style: dotted;\r\n\t\ttext-decoration-color: var(--wp--preset--color--primary);\r\n\t\ttext-decoration-thickness: 2px;\r\n\t\ttext-underline-offset: 2px;\r\n\t}\r\n}\r\n\r\n.popover_footnote_field {\r\n\t.components-popover__content {\r\n\t\tpadding: 10px !important;\r\n\t\tmin-width: 500px;\r\n\t}\r\n\t.popover_footnote_field_buttons {\r\n\t\tdisplay: flex;\r\n\t\tjustify-content: flex-end;\r\n\t\tgap: 10px;\r\n\t\tmargin-top: 10px;\r\n\r\n\t\tbutton.is-destructive {\r\n\t\t\tbackground-color: #cc1818 !important;\r\n\t\t\tcolor: #fff !important;\r\n\t\t}\r\n\r\n\t\tbutton.is-primary {\r\n\t\t\tbackground-color: var(--wp--preset--color--primary) !important;\r\n\t\t\tcolor: #fff !important;\r\n\t\t}\r\n\t}\r\n}\r\n"],"names":[],"sourceRoot":""}
|
||||
|
|
@ -244,7 +244,7 @@ const FootnoteFormatButton = props => {
|
|||
children: [isPopoverOpen && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_6__.jsxs)(_wordpress_components__WEBPACK_IMPORTED_MODULE_3__.Popover, {
|
||||
onClose: () => setIsPopoverOpen(false),
|
||||
className: "popover_footnote_field",
|
||||
children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_6__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_3__.TextControl, {
|
||||
children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_6__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_3__.TextareaControl, {
|
||||
__nextHasNoMarginBottom: true,
|
||||
__next40pxDefaultSize: true,
|
||||
label: "Note de bas de page",
|
||||
|
|
|
|||
File diff suppressed because one or more lines are too long
|
|
@ -37,7 +37,7 @@ body {
|
|||
.popover_footnote_field {
|
||||
.components-popover__content {
|
||||
padding: 10px !important;
|
||||
min-width: 300px;
|
||||
min-width: 500px;
|
||||
}
|
||||
.popover_footnote_field_buttons {
|
||||
display: flex;
|
||||
|
|
|
|||
|
|
@ -2,7 +2,8 @@ import { __ } from "@wordpress/i18n";
|
|||
import { registerFormatType, toggleFormat, applyFormat, getActiveFormats } from "@wordpress/rich-text";
|
||||
|
||||
import { BlockControls, __experimentalLinkControl as LinkControl } from "@wordpress/block-editor";
|
||||
import { Popover, ToolbarGroup, ToolbarButton, TextControl, Button } from "@wordpress/components";
|
||||
import { Popover, ToolbarGroup, ToolbarButton, TextControl, TextareaControl, Button } from "@wordpress/components";
|
||||
|
||||
import { trash, customPostType } from "@wordpress/icons";
|
||||
import { useState } from "@wordpress/element";
|
||||
|
||||
|
|
@ -47,7 +48,7 @@ const FootnoteFormatButton = (props) => {
|
|||
<Popover
|
||||
onClose={() => setIsPopoverOpen(false)}
|
||||
className='popover_footnote_field'>
|
||||
<TextControl
|
||||
<TextareaControl
|
||||
__nextHasNoMarginBottom
|
||||
__next40pxDefaultSize
|
||||
label='Note de bas de page'
|
||||
|
|
|
|||
26
plugins/dynamiques-blocks/acf-blocks/sitemap/block.json
Normal file
26
plugins/dynamiques-blocks/acf-blocks/sitemap/block.json
Normal file
|
|
@ -0,0 +1,26 @@
|
|||
{
|
||||
"name": "acf/sitemap",
|
||||
"title": "Plan du site",
|
||||
"category": "dynamiques-blocks",
|
||||
"multiple": false,
|
||||
"icon": {
|
||||
"foreground": "#136f63",
|
||||
"src": "groups"
|
||||
},
|
||||
"keywords": [
|
||||
"plan",
|
||||
"du",
|
||||
"site",
|
||||
"sitemap"
|
||||
],
|
||||
"supports": {
|
||||
"align": [
|
||||
"full"
|
||||
]
|
||||
},
|
||||
"acf": {
|
||||
"mode": "preview",
|
||||
"renderTemplate": "sitemap.php"
|
||||
},
|
||||
"align": "full"
|
||||
}
|
||||
65
plugins/dynamiques-blocks/acf-blocks/sitemap/sitemap.php
Normal file
65
plugins/dynamiques-blocks/acf-blocks/sitemap/sitemap.php
Normal file
|
|
@ -0,0 +1,65 @@
|
|||
<?php
|
||||
|
||||
?>
|
||||
|
||||
<section class="sitemap content-section">
|
||||
<div class="sitemap__inner">
|
||||
<h2 class="sitemap__title"><?php echo __('Plan du site', "carhop"); ?></h2>
|
||||
<ul class="sitemap__list">
|
||||
<li class="sitemap__item">
|
||||
<a href="<?php echo home_url(); ?>" class="sitemap__link"><?php echo __('Accueil', "carhop"); ?></a>
|
||||
</li>
|
||||
</ul>
|
||||
|
||||
<?php switch_to_blog(1); ?>
|
||||
<h3 class="sitemap__title"><?php echo __('Menu Principal', "carhop"); ?></h2>
|
||||
<?php
|
||||
wp_nav_menu(
|
||||
array(
|
||||
'container' => 'false',
|
||||
'theme_location' => 'primary',
|
||||
'li_class' => 'menu-navlink',
|
||||
'fallback_cb' => false,
|
||||
"menu_class" => "sitemap__carhop-primary-menu",
|
||||
)
|
||||
); ?>
|
||||
<h3 class="sitemap__title"><?php echo __('Menu secondaire', "carhop"); ?></h2>
|
||||
|
||||
<?php
|
||||
wp_nav_menu(
|
||||
array(
|
||||
'container' => 'false',
|
||||
'theme_location' => 'secondary',
|
||||
'li_class' => 'menu-navlink',
|
||||
'fallback_cb' => false,
|
||||
"menu_class" => "sitemap__dynamiques-secondary-menu",
|
||||
)
|
||||
); ?>
|
||||
|
||||
<?php switch_to_blog(2); ?>
|
||||
<h3 class="sitemap__title"><?php echo __('Menu Principal', "carhop"); ?></h2>
|
||||
<?php
|
||||
wp_nav_menu(
|
||||
array(
|
||||
'container' => 'false',
|
||||
'theme_location' => 'primary',
|
||||
'li_class' => 'menu-navlink',
|
||||
'fallback_cb' => false,
|
||||
"menu_class" => "sitemap__dynamiques-primary-menu",
|
||||
)
|
||||
); ?>
|
||||
<h3 class="sitemap__title"><?php echo __('Menu secondaire', "carhop"); ?></h2>
|
||||
|
||||
<?php
|
||||
wp_nav_menu(
|
||||
array(
|
||||
'container' => 'false',
|
||||
'theme_location' => 'secondary',
|
||||
'li_class' => 'menu-navlink',
|
||||
'fallback_cb' => false,
|
||||
"menu_class" => "sitemap__dynamiques-secondary-menu",
|
||||
)
|
||||
); ?>
|
||||
<?php restore_current_blog(); ?>
|
||||
</div>
|
||||
</section>
|
||||
|
|
@ -46,5 +46,6 @@ function dynamiques_register_acf_blocks_init()
|
|||
{
|
||||
register_block_type(__DIR__ . '/acf-blocks/team-authors');
|
||||
register_block_type(__DIR__ . '/acf-blocks/statistics-datas');
|
||||
register_block_type(__DIR__ . '/acf-blocks/sitemap');
|
||||
}
|
||||
add_action('init', 'dynamiques_register_acf_blocks_init');
|
||||
|
|
|
|||
Loading…
Reference in New Issue
Block a user