adding styles for aller plus loin

This commit is contained in:
Antoine M 2023-09-29 15:53:46 +02:00
parent bb406952a2
commit 91ee7f1de0
17 changed files with 182 additions and 6 deletions

View File

@ -3893,7 +3893,7 @@ article > *:not(.entry-content, .chapter-header-block),
} }
.entry-content > :first-child { .entry-content > :first-child {
margin-top: 0px; margin-top: 0px !important;
} }
.entry-content h1 { .entry-content h1 {
@ -4589,6 +4589,77 @@ article > *:not(.entry-content, .chapter-header-block),
z-index: 9999; z-index: 9999;
} }
.homegrade-blocks-plus-loin {
margin-top: 2rem;
margin-bottom: 2rem;
--tw-bg-opacity: 1;
background-color: rgb(47 1 84 / var(--tw-bg-opacity));
padding: 3rem;
border-radius: 22px;
}
.homegrade-blocks-plus-loin__block-title {
margin-top: 0px !important;
font-size: 2.25rem !important;
line-height: 2.5rem !important;
}
.homegrade-blocks-plus-loin p,
.homegrade-blocks-plus-loin h3,
.homegrade-blocks-plus-loin h4,
.homegrade-blocks-plus-loin h5,
.homegrade-blocks-plus-loin h6,
.homegrade-blocks-plus-loin li,
.homegrade-blocks-plus-loin a {
--tw-text-opacity: 1 !important;
color: rgb(255 255 255 / var(--tw-text-opacity)) !important;
}
.homegrade-blocks-plus-loin a {
font-weight: 500 !important;
text-decoration-thickness: 1px !important;
}
.homegrade-blocks-plus-loin ul li:before {
--tw-bg-opacity: 1;
background-color: rgb(255 255 255 / var(--tw-bg-opacity));
}
.homegrade-blocks-plus-loin ul li::marker {
--tw-text-opacity: 1 !important;
color: rgb(255 255 255 / var(--tw-text-opacity)) !important;
}
.homegrade-blocks-plus-loin .homegrade-blocks-custom-heading + ul {
padding-left: 3rem;
}
.homegrade-blocks-custom-heading.has-icon:before {
--tw-bg-opacity: 1;
background-color: rgb(47 1 84 / var(--tw-bg-opacity));
}
.homegrade-blocks-plus-loin .homegrade-blocks-custom-heading.has-icon.has-icon:before {
--tw-bg-opacity: 1;
background-color: rgb(255 233 163 / var(--tw-bg-opacity));
}
.homegrade-blocks-plus-loin .homegrade-blocks-custom-heading.has-icon.has-icon--key::before {
background-image: url('../resources/img/pictogrammes/icon_key_dark.svg');
}
.homegrade-blocks-plus-loin .homegrade-blocks-custom-heading.has-icon.has-icon--house::before {
background-image: url('../resources/img/pictogrammes/icon_house_dark.svg');
}
.homegrade-blocks-plus-loin .homegrade-blocks-custom-heading.has-icon.has-icon--bulb::before {
background-image: url('../resources/img/pictogrammes/icon_bulb_dark.svg');
}
.homegrade-blocks-plus-loin .homegrade-blocks-custom-heading.has-icon.has-icon--chain::before {
background-image: url('../resources/img/pictogrammes/icon_chain_dark.svg');
}
/* ########### PAGE ############ */ /* ########### PAGE ############ */
.demo-components .title { .demo-components .title {

View File

@ -258,16 +258,14 @@ function wpdocs_admin_classes($classes)
// } // }
global $pagenow; global $pagenow;
global $post; global $post;
// echo '<pre>';
// write_log($post);
// echo '</pre>';
$thematique = get_the_terms(get_the_ID(), 'thematiques')[0] ?? null; $thematique = get_the_terms(get_the_ID(), 'thematiques')[0] ?? null;
$thematiqueParent = getParentThematique($thematique); $thematiqueParent = getParentThematique($thematique);
$thematiqueColorSlug = getThematiqueFamilySlug($thematiqueParent->slug) ?? null; $thematiqueColorSlug = getThematiqueFamilySlug($thematiqueParent->slug) ?? null;
if (in_array($pagenow, array('post.php', 'post-new.php'), true) && $thematiqueColorSlug) { if (in_array($pagenow, array('post.php', 'post-new.php'), true) && $thematiqueColorSlug) {
$classes .= ' salut ' . $thematiqueColorSlug; $classes .= ' ' . $thematiqueParent->slug;
} }
return $classes; return $classes;

View File

@ -224,6 +224,9 @@
// resources/js/single-conseil.js // resources/js/single-conseil.js
function singleConseil() { function singleConseil() {
const hasChapterIndex = document.querySelector(".chapter_index__list");
if (!hasChapterIndex)
return;
let chapterIndex = document.querySelector(".chapter_index"); let chapterIndex = document.querySelector(".chapter_index");
let questionBlocks = document.querySelectorAll(".questions-container-block"); let questionBlocks = document.querySelectorAll(".questions-container-block");
function handleLinksBehavior() { function handleLinksBehavior() {

View File

@ -62,6 +62,8 @@
@import './blocks/vocabulaire-summary.css'; @import './blocks/vocabulaire-summary.css';
@import './blocks/aside.css'; @import './blocks/aside.css';
@import './blocks/focused-schema.css'; @import './blocks/focused-schema.css';
@import './blocks/plus-loin.css';
@import './blocks/content-heading.css';
/* ########### PAGE ############ */ /* ########### PAGE ############ */
@import './pages/demo-components.css'; @import './pages/demo-components.css';

View File

@ -0,0 +1,25 @@
.homegrade-blocks-custom-heading.has-icon {
&:before {
@apply bg-primary;
}
}
.homegrade-blocks-plus-loin {
.homegrade-blocks-custom-heading.has-icon {
&.has-icon:before {
@apply bg-infos;
}
&.has-icon--key::before {
background-image: url('../resources/img/pictogrammes/icon_key_dark.svg');
}
&.has-icon--house::before {
background-image: url('../resources/img/pictogrammes/icon_house_dark.svg');
}
&.has-icon--bulb::before {
background-image: url('../resources/img/pictogrammes/icon_bulb_dark.svg');
}
&.has-icon--chain::before {
background-image: url('../resources/img/pictogrammes/icon_chain_dark.svg');
}
}
}

View File

@ -0,0 +1,27 @@
.homegrade-blocks-plus-loin {
@apply bg-primary p-12 rounding-radius my-8;
&__block-title {
@apply !mt-0 !text-4xl;
}
p,
h3,
h4,
h5,
h6,
li,
a {
@apply !text-white;
}
a {
@apply !font-medium !decoration-1;
}
ul li:before {
@apply bg-white;
}
ul li::marker {
@apply !text-white;
}
.homegrade-blocks-custom-heading + ul {
@apply pl-12;
}
}

View File

@ -6,7 +6,7 @@ article > *:not(.entry-content, .chapter-header-block),
@apply mt-4 lg:mt-0; @apply mt-4 lg:mt-0;
max-width: 800px; max-width: 800px;
& > :first-child { & > :first-child {
@apply mt-0; @apply !mt-0;
} }
h1 { h1 {
@apply text-2xl; @apply text-2xl;

View File

@ -0,0 +1,9 @@
<svg xmlns="http://www.w3.org/2000/svg" width="13.098" height="18.409" viewBox="0 0 13.098 18.409">
<g id="Groupe_3209" data-name="Groupe 3209" transform="translate(-193 -4810)">
<g id="Union_18" data-name="Union 18" transform="translate(193 4810)" fill="none" stroke-linecap="round" stroke-linejoin="round">
<path d="M4.447,14.845a1,1,0,0,1-1-1V12.058A6.392,6.392,0,0,1,0,6.411,6.481,6.481,0,0,1,6.549,0,6.481,6.481,0,0,1,13.1,6.411a6.393,6.393,0,0,1-3.447,5.647v1.787a1,1,0,0,1-1,1Z" stroke="none"/>
<path d="M 7.650700092315674 12.84549999237061 L 7.650700092315674 12.05811977386475 C 7.650700092315674 11.3162202835083 8.061380386352539 10.63527965545654 8.71757984161377 10.28913974761963 C 10.18568992614746 9.51471996307373 11.09770011901855 8.028590202331543 11.09770011901855 6.410699844360352 C 11.09770011901855 3.978630065917969 9.057299613952637 2 6.549300193786621 2 C 4.040810108184814 2 2 3.978630065917969 2 6.410699844360352 C 2 8.028610229492188 2.911970138549805 9.514659881591797 4.380020141601562 10.2889404296875 C 5.036280155181885 10.63506031036377 5.447000026702881 11.31602954864502 5.447000026702881 12.05797004699707 L 5.447000026702881 12.84549999237061 L 7.650700092315674 12.84549999237061 M 8.650799751281738 14.84549999237061 L 4.446899890899658 14.84549999237061 C 3.894299983978271 14.84549999237061 3.447000026702881 14.39729976654053 3.447000026702881 13.84560012817383 L 3.447000026702881 12.05797004699707 C 1.394700050354004 10.97554969787598 5.95092757293969e-08 8.852640151977539 5.95092757293969e-08 6.410699844360352 C 5.95092757293969e-08 2.870100021362305 2.932199954986572 -3.814697890902607e-09 6.549300193786621 -3.814697890902607e-09 C 10.16549968719482 -3.814697890902607e-09 13.09770011901855 2.870100021362305 13.09770011901855 6.410699844360352 C 13.09770011901855 8.852640151977539 11.70271015167236 10.97570037841797 9.650699615478516 12.05811977386475 L 9.650699615478516 13.84560012817383 C 9.650699615478516 14.39729976654053 9.203399658203125 14.84549999237061 8.650799751281738 14.84549999237061 Z" stroke="none" fill="#000"/>
</g>
<line id="Ligne_3197" data-name="Ligne 3197" x2="4.779" transform="translate(197.096 4827.409)" fill="none" stroke="#000" stroke-linecap="round" stroke-width="2"/>
</g>
</svg>

After

Width:  |  Height:  |  Size: 2.2 KiB

View File

@ -0,0 +1,9 @@
<svg xmlns="http://www.w3.org/2000/svg" width="13.098" height="18.409" viewBox="0 0 13.098 18.409">
<g id="Groupe_3209" data-name="Groupe 3209" transform="translate(-193 -4810)">
<g id="Union_18" data-name="Union 18" transform="translate(193 4810)" fill="none" stroke-linecap="round" stroke-linejoin="round">
<path d="M4.447,14.845a1,1,0,0,1-1-1V12.058A6.392,6.392,0,0,1,0,6.411,6.481,6.481,0,0,1,6.549,0,6.481,6.481,0,0,1,13.1,6.411a6.393,6.393,0,0,1-3.447,5.647v1.787a1,1,0,0,1-1,1Z" stroke="none"/>
<path d="M 7.650700092315674 12.84549999237061 L 7.650700092315674 12.05811977386475 C 7.650700092315674 11.3162202835083 8.061380386352539 10.63527965545654 8.71757984161377 10.28913974761963 C 10.18568992614746 9.51471996307373 11.09770011901855 8.028590202331543 11.09770011901855 6.410699844360352 C 11.09770011901855 3.978630065917969 9.057299613952637 2 6.549300193786621 2 C 4.040810108184814 2 2 3.978630065917969 2 6.410699844360352 C 2 8.028610229492188 2.911970138549805 9.514659881591797 4.380020141601562 10.2889404296875 C 5.036280155181885 10.63506031036377 5.447000026702881 11.31602954864502 5.447000026702881 12.05797004699707 L 5.447000026702881 12.84549999237061 L 7.650700092315674 12.84549999237061 M 8.650799751281738 14.84549999237061 L 4.446899890899658 14.84549999237061 C 3.894299983978271 14.84549999237061 3.447000026702881 14.39729976654053 3.447000026702881 13.84560012817383 L 3.447000026702881 12.05797004699707 C 1.394700050354004 10.97554969787598 5.95092757293969e-08 8.852640151977539 5.95092757293969e-08 6.410699844360352 C 5.95092757293969e-08 2.870100021362305 2.932199954986572 -3.814697890902607e-09 6.549300193786621 -3.814697890902607e-09 C 10.16549968719482 -3.814697890902607e-09 13.09770011901855 2.870100021362305 13.09770011901855 6.410699844360352 C 13.09770011901855 8.852640151977539 11.70271015167236 10.97570037841797 9.650699615478516 12.05811977386475 L 9.650699615478516 13.84560012817383 C 9.650699615478516 14.39729976654053 9.203399658203125 14.84549999237061 8.650799751281738 14.84549999237061 Z" stroke="none" fill="#fff"/>
</g>
<line id="Ligne_3197" data-name="Ligne 3197" x2="4.779" transform="translate(197.096 4827.409)" fill="none" stroke="#fff" stroke-linecap="round" stroke-width="2"/>
</g>
</svg>

After

Width:  |  Height:  |  Size: 2.2 KiB

View File

@ -0,0 +1,6 @@
<svg xmlns="http://www.w3.org/2000/svg" width="16.012" height="15.999" viewBox="0 0 16.012 15.999">
<g id="Icon_feather-link" data-name="Icon feather-link" transform="translate(-1.993 -2.007)">
<path id="Tracé_18559" data-name="Tracé 18559" d="M15,10.707a3.5,3.5,0,0,0,5.28.378l2.1-2.1A3.5,3.5,0,1,0,17.43,4.033l-1.2,1.2" transform="translate(-6.402 0)" fill="none" stroke="#000" stroke-linecap="round" stroke-linejoin="round" stroke-width="2"/>
<path id="Tracé_18560" data-name="Tracé 18560" d="M11.4,14.9a3.5,3.5,0,0,0-5.28-.378l-2.1,2.1A3.5,3.5,0,1,0,8.97,21.57l1.2-1.2" transform="translate(0 -5.59)" fill="none" stroke="#000" stroke-linecap="round" stroke-linejoin="round" stroke-width="2"/>
</g>
</svg>

After

Width:  |  Height:  |  Size: 725 B

View File

@ -0,0 +1,6 @@
<svg xmlns="http://www.w3.org/2000/svg" width="16.012" height="15.999" viewBox="0 0 16.012 15.999">
<g id="Icon_feather-link" data-name="Icon feather-link" transform="translate(-1.993 -2.007)">
<path id="Tracé_18559" data-name="Tracé 18559" d="M15,10.707a3.5,3.5,0,0,0,5.28.378l2.1-2.1A3.5,3.5,0,1,0,17.43,4.033l-1.2,1.2" transform="translate(-6.402 0)" fill="none" stroke="#fff" stroke-linecap="round" stroke-linejoin="round" stroke-width="2"/>
<path id="Tracé_18560" data-name="Tracé 18560" d="M11.4,14.9a3.5,3.5,0,0,0-5.28-.378l-2.1,2.1A3.5,3.5,0,1,0,8.97,21.57l1.2-1.2" transform="translate(0 -5.59)" fill="none" stroke="#fff" stroke-linecap="round" stroke-linejoin="round" stroke-width="2"/>
</g>
</svg>

After

Width:  |  Height:  |  Size: 725 B

View File

@ -0,0 +1,3 @@
<svg xmlns="http://www.w3.org/2000/svg" width="12.388" height="14.186" viewBox="0 0 12.388 14.186">
<path id="Tracé_18534" data-name="Tracé 18534" d="M960.214,929.442l-5.194,4.782v7.4h10.388v-7.4Z" transform="translate(-954.02 -928.442)" fill="none" stroke="#000" stroke-linecap="round" stroke-linejoin="round" stroke-width="2"/>
</svg>

After

Width:  |  Height:  |  Size: 341 B

View File

@ -0,0 +1,3 @@
<svg xmlns="http://www.w3.org/2000/svg" width="12.388" height="14.186" viewBox="0 0 12.388 14.186">
<path id="Tracé_18534" data-name="Tracé 18534" d="M960.214,929.442l-5.194,4.782v7.4h10.388v-7.4Z" transform="translate(-954.02 -928.442)" fill="none" stroke="#fff" stroke-linecap="round" stroke-linejoin="round" stroke-width="2"/>
</svg>

After

Width:  |  Height:  |  Size: 341 B

View File

@ -0,0 +1,3 @@
<svg xmlns="http://www.w3.org/2000/svg" width="17.803" height="17.426" viewBox="0 0 17.803 17.426">
<path id="Icon_feather-key" data-name="Icon feather-key" d="M18.013,3l-1.58,1.58M10.42,10.593a4.346,4.346,0,1,1-6.146,0,4.346,4.346,0,0,1,6.146,0Zm0,0,3.248-3.248m0,0,2.37,2.37L18.8,6.951l-2.37-2.37M13.668,7.346,16.433,4.58" transform="translate(-2.001 -1.586)" fill="none" stroke="#000" stroke-linecap="round" stroke-linejoin="round" stroke-width="2"/>
</svg>

After

Width:  |  Height:  |  Size: 463 B

View File

@ -0,0 +1,3 @@
<svg xmlns="http://www.w3.org/2000/svg" width="17.803" height="17.426" viewBox="0 0 17.803 17.426">
<path id="Icon_feather-key" data-name="Icon feather-key" d="M18.013,3l-1.58,1.58M10.42,10.593a4.346,4.346,0,1,1-6.146,0,4.346,4.346,0,0,1,6.146,0Zm0,0,3.248-3.248m0,0,2.37,2.37L18.8,6.951l-2.37-2.37M13.668,7.346,16.433,4.58" transform="translate(-2.001 -1.586)" fill="none" stroke="#fff" stroke-linecap="round" stroke-linejoin="round" stroke-width="2"/>
</svg>

After

Width:  |  Height:  |  Size: 463 B

View File

@ -1,4 +1,7 @@
export default function singleConseil() { export default function singleConseil() {
const hasChapterIndex = document.querySelector('.chapter_index__list');
if (!hasChapterIndex) return;
let chapterIndex = document.querySelector('.chapter_index'); let chapterIndex = document.querySelector('.chapter_index');
let questionBlocks = document.querySelectorAll('.questions-container-block'); let questionBlocks = document.querySelectorAll('.questions-container-block');

View File

@ -29,6 +29,11 @@
"slug": "secondary-light", "slug": "secondary-light",
"color": "#FFEDEC" "color": "#FFEDEC"
}, },
{
"name": "Infos",
"slug": "infos",
"color": "#FFE9A3"
},
{ {
"name": "Secondaire Au Survol", "name": "Secondaire Au Survol",
"slug": "secondary-hover", "slug": "secondary-hover",