refining few details

This commit is contained in:
Antoine M 2023-09-27 17:36:02 +02:00
parent 07799a1522
commit 5a091f3c11
23 changed files with 101 additions and 37 deletions

View File

@ -1 +1 @@
<?php return array('dependencies' => array('wp-blob', 'wp-block-editor', 'wp-blocks', 'wp-components', 'wp-data', 'wp-element', 'wp-i18n'), 'version' => 'e63645d5b16e12b63e0d');
<?php return array('dependencies' => array('wp-blob', 'wp-block-editor', 'wp-blocks', 'wp-components', 'wp-data', 'wp-element', 'wp-i18n'), 'version' => 'a7ab9ce50d3cfb82e362');

View File

@ -472,6 +472,7 @@ function save({
return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
"data-focus-bullet-title": focusBullet.title,
className: "homegrade-blocks-focus-point-bullet",
"aria-hidden": "true",
style: {
top: `${focusBullet.y * 100}%`,
left: `${focusBullet.x * 100}%`

File diff suppressed because one or more lines are too long

View File

@ -14,6 +14,7 @@ export default function save({ attributes }) {
<div
data-focus-bullet-title={focusBullet.title}
className="homegrade-blocks-focus-point-bullet"
aria-hidden="true"
style={{
top: `${focusBullet.y * 100}%`,
left: `${focusBullet.x * 100}%`,

File diff suppressed because one or more lines are too long

View File

@ -31,8 +31,6 @@
padding-left: 10px;
}
.wp-block-homegrade-content-blocks-points-cles ul li {
list-style-type: disc;
list-style-position: inside;
margin-left: 1.5em;
}
.wp-block-homegrade-content-blocks-points-cles p + ul {

View File

@ -1 +1 @@
{"version":3,"file":"./style-index.css","mappings":";;;AAAA;;;;;EAAA;AAOA;EACC;AAAD;AACC;EACC;EACA;AACF;AAAE;EACC;EACA;EACA;EACA;EACA;EACA;EAAA;AAEH;AAAG;EACC;EACA;AAEJ;AACE;EACC;AACH;AAGC;EACC;EACA;EAEA;AAFF;AAKC;EACC;AAHF;AAKC;EACC;AAHF,C","sources":["webpack://multiblocks/./src/style.scss"],"sourcesContent":["/**\n * The following styles get applied both on the front of your site\n * and in the editor.\n *\n * Replace them with your own styles or remove the file completely.\n */\n\n.wp-block-homegrade-content-blocks-points-cles {\n\tmargin-bottom: 2rem;\n\t&__titling {\n\t\tdisplay: flex;\n\t\talign-items: center;\n\t\t.icon {\n\t\t\tbackground-color: black;\n\t\t\tborder-radius: 50%;\n\t\t\taspect-ratio: 1/1;\n\t\t\twidth: 40px;\n\t\t\tpadding: 10px;\n\t\t\theight: fit-content;\n\n\t\t\timg {\n\t\t\t\twidth: 30px;\n\t\t\t\theight: auto;\n\t\t\t}\n\t\t}\n\t\th3 {\n\t\t\tpadding-left: 10px;\n\t\t}\n\t}\n\n\tul li {\n\t\tlist-style-type: disc;\n\t\tlist-style-position: inside;\n\t\t// display: flex;\n\t\tmargin-left: 1.5em;\n\t}\n\n\tp + ul {\n\t\tpadding-top: 16px;\n\t}\n\tul + p {\n\t\tpadding-top: 16px;\n\t}\n}\n"],"names":[],"sourceRoot":""}
{"version":3,"file":"./style-index.css","mappings":";;;AAAA;;;;;EAAA;AAOA;EACC;AAAD;AACC;EACC;EACA;AACF;AAAE;EACC;EACA;EACA;EACA;EACA;EACA;EAAA;AAEH;AAAG;EACC;EACA;AAEJ;AACE;EACC;AACH;AAGC;EAIC;AAJF;AAOC;EACC;AALF;AAOC;EACC;AALF,C","sources":["webpack://multiblocks/./src/style.scss"],"sourcesContent":["/**\n * The following styles get applied both on the front of your site\n * and in the editor.\n *\n * Replace them with your own styles or remove the file completely.\n */\n\n.wp-block-homegrade-content-blocks-points-cles {\n\tmargin-bottom: 2rem;\n\t&__titling {\n\t\tdisplay: flex;\n\t\talign-items: center;\n\t\t.icon {\n\t\t\tbackground-color: black;\n\t\t\tborder-radius: 50%;\n\t\t\taspect-ratio: 1/1;\n\t\t\twidth: 40px;\n\t\t\tpadding: 10px;\n\t\t\theight: fit-content;\n\n\t\t\timg {\n\t\t\t\twidth: 30px;\n\t\t\t\theight: auto;\n\t\t\t}\n\t\t}\n\t\th3 {\n\t\t\tpadding-left: 10px;\n\t\t}\n\t}\n\n\tul li {\n\t\t// list-style-type: disc;\n\t\t// list-style-position: inside;\n\t\t// display: flex;\n\t\tmargin-left: 1.5em;\n\t}\n\n\tp + ul {\n\t\tpadding-top: 16px;\n\t}\n\tul + p {\n\t\tpadding-top: 16px;\n\t}\n}\n"],"names":[],"sourceRoot":""}

View File

@ -29,8 +29,8 @@
}
ul li {
list-style-type: disc;
list-style-position: inside;
// list-style-type: disc;
// list-style-position: inside;
// display: flex;
margin-left: 1.5em;
}

File diff suppressed because one or more lines are too long

View File

@ -5,6 +5,6 @@ $relatedPost = get_post($relatedPostId);
<section id="questions-container-<?php echo $relatedPostId ?>" class="questions-container-block">
<h2 class="questions-container-block__title"><?php echo $relatedPost->post_title ?></h2>
<h2 class="questions-container-block__title" tabindex="-1"><?php echo $relatedPost->post_title ?></h2>
<?php echo $relatedPost->post_content ?>
</section>

View File

@ -5,6 +5,6 @@ $relatedPost = get_post($relatedPostId);
<section id="questions-container-<?php echo $relatedPostId ?>" class="questions-container-block">
<h2 class="questions-container-block__title"><?php echo $relatedPost->post_title ?></h2>
<h2 class="questions-container-block__title" tabindex="-1"><?php echo $relatedPost->post_title ?></h2>
<?php echo $relatedPost->post_content ?>
</section>

File diff suppressed because one or more lines are too long

View File

@ -4,7 +4,7 @@ global $post;
$thematique = get_the_terms($post->ID, 'thematiques')[0];
?>
<section class="homegrade-blocks-vocabulaire-summary">
<section id="vocabulaire-summary" class="homegrade-blocks-vocabulaire-summary">
<h3 className="homegrade-blocks-vocabulaire-summary__title">
Vocabulaire <?php echo $thematique->name ? "" . $thematique->name : ""; ?>
</h3>

View File

@ -4,7 +4,7 @@ global $post;
$thematique = get_the_terms($post->ID, 'thematiques')[0];
?>
<section class="homegrade-blocks-vocabulaire-summary">
<section id="vocabulaire-summary" class="homegrade-blocks-vocabulaire-summary">
<h3 className="homegrade-blocks-vocabulaire-summary__title">
Vocabulaire <?php echo $thematique->name ? "" . $thematique->name : ""; ?>
</h3>

View File

@ -1 +1 @@
<?php return array('dependencies' => array('wp-block-editor', 'wp-components', 'wp-data', 'wp-element', 'wp-i18n', 'wp-primitives', 'wp-rich-text'), 'version' => '6b99bf41aa6ae29bed43');
<?php return array('dependencies' => array('wp-block-editor', 'wp-components', 'wp-data', 'wp-element', 'wp-i18n', 'wp-primitives', 'wp-rich-text'), 'version' => 'd0f83f5f5780d1e8868a');

View File

@ -16,12 +16,15 @@
top: -6px;
left: 50%;
text-align: left;
transform: translate(-50%, -100%);
transform: translate(-50%, -94%);
padding: 10px;
max-width: 300px;
width: -moz-max-content;
width: max-content;
}
.tooltip-popup[aria-hidden="true"] {
display: none;
}
.tooltip-popup:after {
content: "";
display: block;

View File

@ -1 +1 @@
{"version":3,"file":"index.css","mappings":";;;AAAA;CACC,iBAAiB;CACjB,kBAAkB;CAClB,eAAe;CACf,0BAA0B;CAC1B,6BAA6B;CAC7B,0BAA0B;AAC3B;;AAEA;CACC,wBAAwB;CACxB,kBAAkB;CAClB,SAAS;CACT,SAAS;CACT,gBAAgB;CAChB,iCAAiC;CACjC,aAAa;CACb,gBAAgB;CAChB,uBAAkB;CAAlB,kBAAkB;AACnB;AACA;CACC,WAAW;CACX,cAAc;CACd,uBAAuB;CACvB,kBAAkB;CAClB,SAAS;CACT,SAAS;CACT,WAAW;CACX,YAAY;CACZ,8CAA8C;CAC9C,2CAA2C;AAC5C;AACA;CACC,iBAAiB;CACjB,uBAAuB;CACvB,oBAAoB;AACrB;AACA;CACC,uBAAuB;CACvB,oBAAoB;AACrB;;AAEA,mBAAmB;AACnB;CACC;EACC,wBAAwB;EACxB,gBAAgB;CACjB;AACD;;;;;AChDA;CACC,mBAAmB;CACnB,qBAAqB;CACrB,2BAA2B;AAC5B","sources":["webpack://multi-blocks/./src/format-types/tooltip/tooltip.css","webpack://multi-blocks/./src/format-types/brochure/brochure.css"],"sourcesContent":[".tooltip-word {\r\n\tpadding-top: 12px;\r\n\tposition: relative;\r\n\tcursor: default;\r\n\ttext-underline-offset: 4px;\r\n\ttext-decoration-style: dashed;\r\n\ttext-decoration-color: red;\r\n}\r\n\r\n.tooltip-popup {\r\n\tbackground-color: yellow;\r\n\tposition: absolute;\r\n\ttop: -6px;\r\n\tleft: 50%;\r\n\ttext-align: left;\r\n\ttransform: translate(-50%, -100%);\r\n\tpadding: 10px;\r\n\tmax-width: 300px;\r\n\twidth: max-content;\r\n}\r\n.tooltip-popup:after {\r\n\tcontent: \"\";\r\n\tdisplay: block;\r\n\tbackground-color: white;\r\n\tposition: absolute;\r\n\ttop: 100%;\r\n\tleft: 50%;\r\n\twidth: 20px;\r\n\theight: 20px;\r\n\ttransform: translate(-50%, -50%) rotate(45deg);\r\n\tbox-shadow: 4px 4px 4px rgba(0, 0, 0, 0.08);\r\n}\r\n.tooltip-popup__title {\r\n\tfont-weight: bold;\r\n\tcolor: black !important;\r\n\tpadding-bottom: 10px;\r\n}\r\n.tooltip-popup__definition {\r\n\tcolor: black !important;\r\n\tmargin: 0 !important;\r\n}\r\n\r\n/* FOR THE EDITOR */\r\n.popover_tooltip_field {\r\n\t.components-popover__content {\r\n\t\tpadding: 10px !important;\r\n\t\tmin-width: 200px;\r\n\t}\r\n}\r\n",".brochure-download-icon {\r\n\tmargin: 0 0px 0 6px;\r\n\tdisplay: inline-block;\r\n\ttransform: translateY(-1px);\r\n}\r\n"],"names":[],"sourceRoot":""}
{"version":3,"file":"index.css","mappings":";;;AAAA;CACC,iBAAiB;CACjB,kBAAkB;CAClB,eAAe;CACf,0BAA0B;CAC1B,6BAA6B;CAC7B,0BAA0B;AAC3B;;AAEA;CACC,wBAAwB;CACxB,kBAAkB;CAClB,SAAS;CACT,SAAS;CACT,gBAAgB;CAChB,gCAAgC;CAChC,aAAa;CACb,gBAAgB;CAChB,uBAAkB;CAAlB,kBAAkB;AACnB;AACA;CACC,aAAa;AACd;AACA;CACC,WAAW;CACX,cAAc;CACd,uBAAuB;CACvB,kBAAkB;CAClB,SAAS;CACT,SAAS;CACT,WAAW;CACX,YAAY;CACZ,8CAA8C;CAC9C,2CAA2C;AAC5C;AACA;CACC,iBAAiB;CACjB,uBAAuB;CACvB,oBAAoB;AACrB;AACA;CACC,uBAAuB;CACvB,oBAAoB;AACrB;;AAEA,mBAAmB;AACnB;CACC;EACC,wBAAwB;EACxB,gBAAgB;CACjB;AACD;;;;;ACnDA;CACC,mBAAmB;CACnB,qBAAqB;CACrB,2BAA2B;AAC5B","sources":["webpack://multi-blocks/./src/format-types/tooltip/tooltip.css","webpack://multi-blocks/./src/format-types/brochure/brochure.css"],"sourcesContent":[".tooltip-word {\r\n\tpadding-top: 12px;\r\n\tposition: relative;\r\n\tcursor: default;\r\n\ttext-underline-offset: 4px;\r\n\ttext-decoration-style: dashed;\r\n\ttext-decoration-color: red;\r\n}\r\n\r\n.tooltip-popup {\r\n\tbackground-color: yellow;\r\n\tposition: absolute;\r\n\ttop: -6px;\r\n\tleft: 50%;\r\n\ttext-align: left;\r\n\ttransform: translate(-50%, -94%);\r\n\tpadding: 10px;\r\n\tmax-width: 300px;\r\n\twidth: max-content;\r\n}\r\n.tooltip-popup[aria-hidden=\"true\"] {\r\n\tdisplay: none;\r\n}\r\n.tooltip-popup:after {\r\n\tcontent: \"\";\r\n\tdisplay: block;\r\n\tbackground-color: white;\r\n\tposition: absolute;\r\n\ttop: 100%;\r\n\tleft: 50%;\r\n\twidth: 20px;\r\n\theight: 20px;\r\n\ttransform: translate(-50%, -50%) rotate(45deg);\r\n\tbox-shadow: 4px 4px 4px rgba(0, 0, 0, 0.08);\r\n}\r\n.tooltip-popup__title {\r\n\tfont-weight: bold;\r\n\tcolor: black !important;\r\n\tpadding-bottom: 10px;\r\n}\r\n.tooltip-popup__definition {\r\n\tcolor: black !important;\r\n\tmargin: 0 !important;\r\n}\r\n\r\n/* FOR THE EDITOR */\r\n.popover_tooltip_field {\r\n\t.components-popover__content {\r\n\t\tpadding: 10px !important;\r\n\t\tmin-width: 200px;\r\n\t}\r\n}\r\n",".brochure-download-icon {\r\n\tmargin: 0 0px 0 6px;\r\n\tdisplay: inline-block;\r\n\ttransform: translateY(-1px);\r\n}\r\n"],"names":[],"sourceRoot":""}

File diff suppressed because one or more lines are too long

View File

@ -84,6 +84,20 @@ function blocks_course_plugin_enqueue_assets()
wp_enqueue_script('homegrade-blocks-tooltipjs', plugin_dir_url(__FILE__) . 'src/format-types/tooltip/tooltip-front.js');
wp_enqueue_style('homegrade-blocks-tooltipcss', plugin_dir_url(__FILE__) . 'src/format-types/tooltip/tooltip.css');
wp_enqueue_script('homegrade-blocks-brochurejs', plugin_dir_url(__FILE__) . 'src/format-types/brochure/brochure-front.js');
// #PASSING TRANSLATIONS
wp_register_script('homegrade-blocks-brochurejs', plugin_dir_url(__FILE__) . 'src/format-types/brochure/brochure-front.js');
$translation_array_brochure_link = array(
'download' => __('Télécharger', 'homegrade-theme__texte-fonctionnel'),
);
wp_localize_script('homegrade-blocks-brochurejs', 'textTranslationsBrochureLink', $translation_array_brochure_link);
wp_enqueue_script('homegrade-blocks-brochurejs');
wp_enqueue_style('homegrade-blocks-brochurecss', plugin_dir_url(__FILE__) . 'src/format-types/brochure/brochure.css');
wp_localize_script('homegrade-blocks-brochurejs', 'img_path_datas', array(

View File

@ -8,7 +8,7 @@ window.addEventListener("DOMContentLoaded", (event) => {
const brochureLinkIcon = document.createElement("img");
brochureLinkIcon.src = iconSrc;
brochureLinkIcon.classList.add("brochure-download-icon");
brochureLinkIcon.alt = "";
brochureLinkIcon.alt = textTranslationsBrochureLink.download;
brochureLink.appendChild(brochureLinkIcon);
});

View File

@ -1,27 +1,70 @@
function initTooltips(tooltipWords) {
tooltipWords.forEach((word) => {
word.setAttribute("tabindex", "0");
createTooltip(word);
});
}
function createTooltip(tooltipWord) {
const tooltipPopup = document.createElement("div");
tooltipPopup.className = "tooltip-popup";
tooltipPopup.setAttribute("aria-hidden", "true");
const tooltipDefinition = document.createElement("p");
tooltipDefinition.textContent = tooltipWord.getAttribute("data-tooltip-definition");
tooltipDefinition.className = "tooltip-popup__definition";
const tooltipTitle = document.createElement("h5");
tooltipTitle.textContent = tooltipWord.getAttribute("data-tooltip-word");
tooltipTitle.className = "tooltip-popup__title";
tooltipPopup.appendChild(tooltipTitle);
tooltipPopup.appendChild(tooltipDefinition);
tooltipWord.appendChild(tooltipPopup);
// tooltipWord.insertAdjacentElement("afterend", tooltipPopup);
}
function showTooltip(tooltipWord) {
const tooltipPopup = tooltipWord.querySelector(".tooltip-popup");
tooltipPopup.setAttribute("aria-hidden", "false");
}
function hideTooltip(tooltipWord) {
const tooltipPopup = tooltipWord.querySelector(".tooltip-popup");
tooltipPopup.setAttribute("aria-hidden", "true");
}
window.addEventListener("DOMContentLoaded", (event) => {
let tooltipWords = document.querySelectorAll("[data-tooltip-definition]");
tooltipWords.forEach((tooltipWord) => {
tooltipWord.addEventListener("click", (event) => {
showTooltip(tooltipWord);
});
tooltipWord.addEventListener("keydown", (event) => {
switch (event.key) {
case "Enter":
toggleTooltip(tooltipWord);
break;
case "Escape":
hideTooltip(tooltipWord);
break;
}
});
tooltipWord.addEventListener("mouseover", (event) => {
const tooltipPopup = document.createElement("div");
tooltipPopup.className = "tooltip-popup";
const tooltipDefinition = document.createElement("p");
tooltipDefinition.textContent = tooltipWord.getAttribute("data-tooltip-definition");
tooltipDefinition.className = "tooltip-popup__definition";
const tooltipTitle = document.createElement("h5");
tooltipTitle.textContent = tooltipWord.getAttribute("data-tooltip-word");
tooltipTitle.className = "tooltip-popup__title";
tooltipPopup.appendChild(tooltipTitle);
tooltipPopup.appendChild(tooltipDefinition);
tooltipWord.appendChild(tooltipPopup);
showTooltip(tooltipWord);
});
tooltipWord.addEventListener("mouseout", function () {
const tooltipPopup = tooltipWord.querySelector(".tooltip-popup");
tooltipPopup.remove();
tooltipWord.addEventListener("mouseout", (event) => {
var isFocused = document.activeElement === tooltipWord;
if (!isFocused) {
hideTooltip(tooltipWord);
}
});
tooltipWord.addEventListener("focusin", (event) => {
showTooltip(tooltipWord);
});
tooltipWord.addEventListener("focusout", (event) => {
hideTooltip(tooltipWord);
});
});
initTooltips(tooltipWords);
});

View File

@ -13,11 +13,14 @@
top: -6px;
left: 50%;
text-align: left;
transform: translate(-50%, -100%);
transform: translate(-50%, -94%);
padding: 10px;
max-width: 300px;
width: max-content;
}
.tooltip-popup[aria-hidden="true"] {
display: none;
}
.tooltip-popup:after {
content: "";
display: block;

View File

@ -16,6 +16,7 @@ const Edit = (props) => {
const activeFormat = getActiveFormats(value).filter((format) => format.type === formatName)[0];
const lang = getAdminLanguageFromCookie("wp-wpml_current_language");
function getAdminLanguageFromCookie(c_name) {
var c_value = document.cookie,
c_start = c_value.indexOf(" " + c_name + "=");