Keith Solomon
62 lines
2.3 KiB
PHP
62 lines
2.3 KiB
PHP
<?php
|
|
/**
|
|
* Template Name: Q & A
|
|
*
|
|
* @package GoAskAuntie
|
|
* @since 1.0.0
|
|
*/
|
|
|
|
namespace BasicWP;
|
|
|
|
get_header();
|
|
|
|
$qa_image = get_theme_file_uri( '/static/img/q-and-a.png' );
|
|
$bg_condom = get_theme_file_uri( '/static/img/bg-condom.png' );
|
|
|
|
$questions = get_field( 'questions', 'option' ) ?: array();
|
|
?>
|
|
|
|
<section class="w-full pb-24 bg-pattern bg-teal-light bg-contain bg-repeat-y bg-top relative">
|
|
<div class="md:mx-6 lg:mx-auto pt-12 lg:pt-32 text-gray relative">
|
|
<h1 class="text-4xl font-bold md:text-6xl lg:text-7xl tracking-wide uppercase text-white mb-16 mx-auto text-left">Q+A</h1>
|
|
</div>
|
|
</section>
|
|
|
|
<section class="p-0 w-full bg-pattern bg-teal-light bg-contain bg-repeat-y bg-top">
|
|
<div class="q-and-a rounded-[45px] bg-white p-4 pt-8 md:p-8 mx-auto w-full md:w-auto relative">
|
|
<div class="text-purple flex gap-6 w-fit text-2xl items-end">
|
|
<img src="<?php echo esc_url( $qa_image ); ?>" alt="Q&A logo" class="h-24 inline hidden md:block">
|
|
<span class="block mb-4">Do you have a question?<br class="p-0">Find Auntie's answers here.</span>
|
|
</div>
|
|
<div class="absolute top-0 right-0 h-96 w-96 -mt-24 bg-contain bg-no-repeat hidden md:flex items-center flex-col justify-center" style="background-image: url('<?php echo esc_url( $bg_condom ); ?>');">
|
|
<h2 class="text-4xl uppercase text-white text-center">Resources</h2>
|
|
<a href="<?php echo esc_url( home_url( '/resources/' ) ); ?>" class="btn bg-red rounded-full border-4 border-white text-white px-8 py-2 text-center hover:shadow-lg">Learn More</a>
|
|
</div>
|
|
<div class="p-4">
|
|
<div class="grid md:grid-cols-2 gap-6">
|
|
<?php
|
|
if ( $questions ) {
|
|
foreach ( $questions as $qa ) {
|
|
$question = $qa['question'] ?? '';
|
|
$answer = $qa['answer'] ?? '';
|
|
if ( empty( $question ) && empty( $answer ) ) {
|
|
continue;
|
|
}
|
|
echo '<div class="prose my-4">';
|
|
if ( $question ) {
|
|
echo '<p class="my-4 font-bold text-navy">Q: ' . esc_html( $question ) . '</p>';
|
|
}
|
|
if ( $answer ) {
|
|
echo '<p class="!m-0 pb-0 font-extrabold uppercase text-red text-xl">AUNTIE:</p>';
|
|
echo '<p class="mb-4 !mt-1 pt-0 text-red-900">' . esc_html( $answer ) . '</p>';
|
|
}
|
|
echo '</div>';
|
|
}
|
|
}
|
|
?>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
|
|
<?php get_footer(); ?>
|