diff --git a/css/app.css b/css/app.css index 8504c55..2ecfbd5 100644 --- a/css/app.css +++ b/css/app.css @@ -574,15 +574,24 @@ video { .mb-8{ margin-bottom: 2rem } +.mr-3{ + margin-right: 0.75rem +} .mt-4{ margin-top: 1rem } +.mt-8{ + margin-top: 2rem +} .block{ display: block } .inline-block{ display: inline-block } +.inline{ + display: inline +} .flex{ display: flex } @@ -648,6 +657,15 @@ video { .transform{ transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y)) } +@keyframes spin{ + + to{ + transform: rotate(360deg) + } +} +.animate-spin{ + animation: spin 1s linear infinite +} .cursor-pointer{ cursor: pointer } @@ -832,6 +850,10 @@ video { --tw-text-opacity: 1; color: rgb(17 24 39 / var(--tw-text-opacity)) } +.text-slate-400{ + --tw-text-opacity: 1; + color: rgb(148 163 184 / var(--tw-text-opacity)) +} .text-white{ --tw-text-opacity: 1; color: rgb(255 255 255 / var(--tw-text-opacity)) @@ -957,6 +979,9 @@ article > *:not(.entry-content), list-style-position: inside; list-style-type: decimal } +.htmx-request .htmx-indicator{ + display: inline +} #loginform-custom label{ margin-bottom: 0.5rem; display: block diff --git a/css/editor-style.css b/css/editor-style.css index ae0bb99..197fb06 100644 --- a/css/editor-style.css +++ b/css/editor-style.css @@ -77,12 +77,21 @@ .mt-4 { margin-top: 1rem } +.mt-8 { + margin-top: 2rem +} +.mr-3 { + margin-right: 0.75rem +} .block { display: block } .inline-block { display: inline-block } +.inline { + display: inline +} .flex { display: flex } @@ -104,6 +113,9 @@ .h-full { height: 100% } +.h-5 { + height: 1.25rem +} .min-h-12 { min-height: 3rem } @@ -122,6 +134,9 @@ .w-full { width: 100% } +.w-5 { + width: 1.25rem +} .min-w-max { min-width: -moz-max-content; min-width: max-content @@ -148,6 +163,14 @@ .transform { transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y)) } +@keyframes spin { + to { + transform: rotate(360deg) + } +} +.animate-spin { + animation: spin 1s linear infinite +} .cursor-pointer { cursor: pointer } @@ -336,6 +359,22 @@ --tw-text-opacity: 1; color: rgb(255 255 255 / var(--tw-text-opacity)) } +.text-amber-500 { + --tw-text-opacity: 1; + color: rgb(245 158 11 / var(--tw-text-opacity)) +} +.text-gray-300 { + --tw-text-opacity: 1; + color: rgb(209 213 219 / var(--tw-text-opacity)) +} +.text-slate-200 { + --tw-text-opacity: 1; + color: rgb(226 232 240 / var(--tw-text-opacity)) +} +.text-slate-400 { + --tw-text-opacity: 1; + color: rgb(148 163 184 / var(--tw-text-opacity)) +} .underline { text-decoration-line: underline } diff --git a/functions.php b/functions.php index f836924..17b48be 100644 --- a/functions.php +++ b/functions.php @@ -112,3 +112,4 @@ add_filter( 'nav_menu_submenu_css_class', 'tailpress_nav_menu_add_submenu_class' require_once(__DIR__ . '/includes/post-type.php'); require_once(__DIR__ . '/includes/add-form.php'); +require_once(__DIR__ . '/includes/api.php'); diff --git a/htmx/events-home.php b/htmx/events-home.php new file mode 100644 index 0000000..82499c0 --- /dev/null +++ b/htmx/events-home.php @@ -0,0 +1,63 @@ + 'evenements', + 'posts_per_page' => 6, + 'paged' => $paged, + 'meta_key' => 'date_debut', // Nom du champ ACF + 'orderby' => 'meta_value', // Trier par la valeur du champ + 'order' => 'ASC', // Ordre croissant ('DESC' pour décroissant) + 'meta_type' => 'DATE' // Préciser que c'est une date (important) +); + +// The Query +$query = new WP_Query( $args ); +?> + +have_posts() ) : while ( $query->have_posts() ) : $query->the_post(); ?> + + + + + + + + + +

+ + + +have_posts() ) : +?> + + \ No newline at end of file diff --git a/includes/api.php b/includes/api.php new file mode 100644 index 0000000..6997941 --- /dev/null +++ b/includes/api.php @@ -0,0 +1,40 @@ + 'GET', + 'callback' => 'load_custom_template', + 'permission_callback' => '__return_true', // Autorise l'accès à tous les utilisateurs + ]); +}); + +function load_custom_template($request) { + // Nom du fichier de template à inclure (ex. : 'custom-template.php' dans votre thème) + $template = locate_template('htmx/events-home.php'); + + if ($template) { + // Capture la sortie du template pour l'inclure dans la réponse + ob_start(); + include $template; + $content = ob_get_clean(); + + header('Content-Type: text/html; charset=UTF-8'); + echo $content; + exit; // Important pour éviter que WordPress ajoute des données JSON supplémentaires + } + + // Retourne une erreur si le fichier template est introuvable + header('Content-Type: text/html; charset=UTF-8', true, 404); + echo 'Template introuvable.'; + exit; +} + + +// ENQUEUE HTMX +add_action('wp_enqueue_scripts', 'add_scripts'); +function add_scripts(){ + wp_register_script( 'htmx', 'https://unpkg.com/htmx.org@2.0.3', false, null, true); + if(is_front_page()): + wp_enqueue_script( 'htmx' ); + endif; +} \ No newline at end of file diff --git a/resources/css/custom.css b/resources/css/custom.css index 0f52d84..c094612 100644 --- a/resources/css/custom.css +++ b/resources/css/custom.css @@ -40,3 +40,8 @@ article > *:not(.entry-content), } } } + + +.htmx-request .htmx-indicator{ + @apply inline; +} \ No newline at end of file diff --git a/template-parts/events-display.php b/template-parts/events-display.php index 17ae09f..94ce636 100644 --- a/template-parts/events-display.php +++ b/template-parts/events-display.php @@ -3,7 +3,7 @@ // WP_Query arguments $args = array( 'post_type' => 'evenements', - 'posts_per_page' => -1, + 'posts_per_page' => 6, 'meta_key' => 'date_debut', // Nom du champ ACF 'orderby' => 'meta_value', // Trier par la valeur du champ 'order' => 'ASC', // Ordre croissant ('DESC' pour décroissant) @@ -12,6 +12,7 @@ $args = array( // The Query $query = new WP_Query( $args ); +$paged = (get_query_var('paged')) ? get_query_var('paged') : 1; ?> @@ -27,7 +28,7 @@ $query = new WP_Query( $args ); Titre - + have_posts() ) : while ( $query->have_posts() ) : $query->the_post(); ?> -

+

+ \ No newline at end of file