styling search results

This commit is contained in:
Antoine M 2023-12-12 14:38:56 +01:00
parent 1ac74cf2fb
commit 726945e89f
3 changed files with 122 additions and 10 deletions

View File

@ -1,2 +1,27 @@
.search-results {
.search-results-page {
@apply container;
.section_titling {
@apply pb-12;
}
&__current-term {
@apply block;
}
article {
@apply border-b
border-neutral-200
pb-12;
h2 {
@apply !text-neutral-900 font-bold text-3xl;
}
header,
.entry-summary {
@apply !max-w-full;
}
.cta--button {
@apply mt-6;
}
}
}

View File

@ -0,0 +1,56 @@
<?xml version="1.0" encoding="UTF-8"?>
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 251.66 145.3">
<defs>
<style>
.cls-1 {
fill: #767575;
opacity: .3;
}
.cls-1, .cls-2 {
stroke-width: 0px;
}
.cls-3, .cls-2 {
fill: #fff;
}
.cls-3, .cls-4, .cls-5 {
stroke: #000;
stroke-linecap: round;
stroke-linejoin: round;
}
.cls-3, .cls-5 {
stroke-width: 2px;
}
.cls-4 {
stroke-width: 2px;
}
.cls-4, .cls-5 {
fill: none;
}
</style>
</defs>
<g id="qui-sommes-nous-engagements">
<ellipse class="cls-1" cx="125.83" cy="72.65" rx="72.65" ry="125.83" transform="translate(52.5 198.08) rotate(-89.69)"/>
</g>
<g id="historique-documentation">
<g>
<path id="Tracé_18424" data-name="Tracé 18424" class="cls-3" d="m215.09,55.16l-.06-21.62-15.28-1.21c-14.27-10.65-38.77-16.77-63.28-14.59-9.77.69-19.48,3.15-28.64,7.26l-16.22,6.1c-.15,4.41-.31,8.81-.46,13.22-.03,2.78.25,6.93,1.99,11.47,8.77,22.89,45.65,30.13,74.03,27.65,27.18-2.37,46.03-14.16,47.93-28.28"/>
<path id="Tracé_18426" data-name="Tracé 18426" class="cls-2" d="m167.13,67.15c-33.32,2.92-66.41-9.44-73.96-27.54-7.52-18.05,13.2-35.03,46.3-37.98,33.16-2.96,66.33,9.25,74.06,27.33,7.76,18.14-13.03,35.27-46.4,38.19"/>
<path id="Ellipse_1360" data-name="Ellipse 1360" class="cls-4" d="m158.94,1.58c33.91,2.83,58.97,19.78,55.88,37.9-3.1,18.17-33.28,30.55-67.33,27.62-33.96-2.92-58.79-19.96-55.56-38.03C95.16,11.05,125.12-1.24,158.94,1.58Z"/>
<path id="Tracé_18427" data-name="Tracé 18427" class="cls-2" d="m164.67,61.33c-27.42,2.41-54.67-7.76-60.9-22.66-6.21-14.86,10.85-28.85,38.13-31.29,27.31-2.44,54.61,7.63,60.97,22.52,6.37,14.93-10.74,29.02-38.2,31.43"/>
<path id="Tracé_18428" data-name="Tracé 18428" class="cls-5" d="m164.67,61.33c-27.42,2.41-54.67-7.76-60.9-22.66-6.21-14.86,10.85-28.85,38.13-31.29,27.31-2.44,54.61,7.63,60.97,22.52,6.37,14.93-10.74,29.02-38.2,31.43Z"/>
<path class="cls-3" d="m117.17,66.73c-1.75-3.44-4.97-5.53-7.2-4.67h0s0,0,0,0c0,0-.01,0-.02.01-.15.06-.28.13-.41.21-2.78,1.39-7.69,3.51-10.14,4.83l5.01,14.59,11.87-7.18s.02,0,.03,0c2.23-.86,2.61-4.34.86-7.79Z"/>
<path id="Tracé_18435" data-name="Tracé 18435" class="cls-5" d="m132.26,51.97c2.67.99,5.42,1.81,8.23,2.43"/>
<path id="Tracé_18436" data-name="Tracé 18436" class="cls-5" d="m155.54,13.32c-24.47-2.53-42.71,8.25-44.27,17.32-.84,4.85,2.84,10.71,9.82,15.59"/>
<path id="Tracé_18431" data-name="Tracé 18431" class="cls-2" d="m95.62,65.7c4.06.88,7.38,3.44,9.13,7.03,1.42,3.2,1.47,6.91.13,10.35-19.42,10.77-38.85,21.54-58.29,32.32,1.37-3.55,1.44-7.36.21-10.75-1.66-4.15-5.13-7.28-9.53-8.61l58.35-30.35"/>
<path id="Tracé_18432" data-name="Tracé 18432" class="cls-5" d="m95.62,65.7c4.06.88,7.38,3.44,9.13,7.03,1.42,3.2,1.47,6.91.13,10.35-19.42,10.77-38.85,21.54-58.29,32.32,1.37-3.55,1.44-7.36.21-10.75-1.66-4.15-5.13-7.28-9.53-8.61l58.35-30.35Z"/>
<path id="Tracé_18433" data-name="Tracé 18433" class="cls-2" d="m46.56,115.58c3.45-1.33,4.04-6.74,1.33-12.08-2.71-5.34-7.71-8.57-11.16-7.24-3.45,1.33-4.05,6.73-1.34,12.06s7.72,8.59,11.17,7.26"/>
<path id="Tracé_18434" data-name="Tracé 18434" class="cls-5" d="m46.56,115.58c3.45-1.33,4.04-6.74,1.33-12.08-2.71-5.34-7.71-8.57-11.16-7.24-3.45,1.33-4.05,6.73-1.34,12.06s7.72,8.59,11.17,7.26Z"/>
</g>
</g>
</svg>

After

Width:  |  Height:  |  Size: 3.4 KiB

View File

@ -1,6 +1,36 @@
<?php get_header(); ?>
<div class="search-results container mx-auto my-8">
<div class="search-results-page container mx-auto my-8">
<section class="block-content-page-header">
<div class="block-content-page-header__content">
<div class="section_titling section_titling--left">
<h1 class="section_titling__title"><?php echo __("Résultat de recherche ", "homegrade-theme__texte-fonctionnel") ?></h1>
<h2 class="section_titling__subtitle">
<?php echo __("Résultats de la recherche pour : ", "homegrade-theme__texte-fonctionnel") ?>
<span class="search-results-page__current-term">« <?php echo get_search_query(); ?> »</span>
</h2>
</div>
</div>
<img decoding="async" class="block-content-page-header__page-icon" src="<?php echo get_template_directory_uri() . "/resources/img/illustrations/homegrade_rechercher.svg" ?>" alt="">
</section>
<div class="search-results-page__results-container">
<?php if (have_posts()) : ?>
<?php
while (have_posts()) :
@ -9,6 +39,7 @@
<?php get_template_part('template-components/content', get_post_format()); ?>
<?php endwhile; ?>
<?php endif; ?>
</div>
</div>
<?php