new-templane/resources/view/home.php

<?php

$settingsContent = settings('content')->getAll();

// Декодируем banner-logo из JSON
$bannerLogo = [];
if (isset($settingsContent['banner-logo']) && !empty($settingsContent['banner-logo'])) {
    $bannerLogo = json_decode($settingsContent['banner-logo'], true) ?: [];
}

ob_start();

?>

<?php if (!empty($bannerLogo['src'])): ?>
    <section class="banner">
        <div class="banner__img-wrp">
            <img class="banner__img redirect-js" src="<?= htmlspecialchars($bannerLogo['src']) ?>" alt="<?= htmlspecialchars($bannerLogo['alt'] ?? '') ?>" title="<?= htmlspecialchars($bannerLogo['title'] ?? '') ?>">
        </div>
    </section>
<?php endif; ?>


<div class="section-wrapper container">
    <!-- Table of Contents -->
    <div class="toc">
        <div class="toc__header">
            <h2 class="toc__title">Contents</h2>
        </div>
        <div class="toc__content">
            <ol class="toc__list">
                <li class="toc__item">
                    <a href="#section1" class="toc__link">Introduction to the Topic</a>
                </li>
                <li class="toc__item">
                    <a href="#section2" class="toc__link">Main Features and Benefits</a>
                    <ul class="toc__list toc__list--nested">
                        <li class="toc__item">
                            <a href="#section2-1" class="toc__link">Feature Overview</a>
                        </li>
                        <li class="toc__item">
                            <a href="#section2-2" class="toc__link">Key Benefits</a>
                        </li>
                        <li class="toc__item">
                            <a href="#section2-3" class="toc__link">Comparison with Competitors</a>
                        </li>
                    </ul>
                </li>
                <li class="toc__item">
                    <a href="#section3" class="toc__link">How to Get Started</a>
                    <ul class="toc__list toc__list--nested">
                        <li class="toc__item">
                            <a href="#section3-1" class="toc__link">Installation Process</a>
                        </li>
                        <li class="toc__item">
                            <a href="#section3-2" class="toc__link">Initial Configuration</a>
                        </li>
                    </ul>
                </li>
                <li class="toc__item">
                    <a href="#section4" class="toc__link">Advanced Tips and Tricks</a>
                </li>
                <li class="toc__item">
                    <a href="#section5" class="toc__link">Common Questions</a>
                </li>
                <li class="toc__item">
                    <a href="#section6" class="toc__link">Conclusion</a>
                </li>
            </ol>
        </div>
    </div>

    <section class="section text">
        <h2>Lorem ipsum dolor sit amet consectetur adipisicing elit. </h2>
        <p>Lorem ipsum dolor sit amet consectetur adipisicing elit.
            Quis dolore qui nemo quaerat aperiam aliquam nobis inventore,
            accusamus eos doloremque, a quam dolorum culpa, aliquid
            deserunt impedit ex possimus illo.</p>
        <h2>Lorem ipsum dolor sit amet consectetur adipisicing elit. </h2>
        <p>Lorem ipsum dolor sit amet consectetur adipisicing elit.
            Quis dolore qui nemo quaerat aperiam aliquam nobis inventore,
            accusamus eos doloremque, a quam dolorum culpa, aliquid
            deserunt impedit ex possimus illo.</p>
        <p>Lorem ipsum dolor sit amet consectetur adipisicing elit.
            Quis dolore qui nemo quaerat aperiam aliquam nobis inventore,
            accusamus eos doloremque, a quam dolorum culpa, aliquid
            deserunt impedit ex possimus illo.</p>
        <div class="btn-wrapper">
            <button class="btn btn--accent">Click Here to Learn More</button>
        </div>
    </section>
    <section class="section text">
        <h2>Lorem ipsum dolor sit amet consectetur adipisicing elit. </h2>
        <p>Lorem ipsum dolor sit amet consectetur adipisicing elit.
            Quis dolore qui nemo quaerat aperiam aliquam nobis inventore,
            accusamus eos doloremque, a quam dolorum culpa, aliquid
            deserunt impedit ex possimus illo.</p>
        <h2>Lorem ipsum dolor sit amet consectetur adipisicing elit. </h2>
        <p>Lorem ipsum dolor sit amet consectetur adipisicing elit.
            Quis dolore qui nemo quaerat aperiam aliquam nobis inventore,
            accusamus eos doloremque, a quam dolorum culpa, aliquid
            deserunt impedit ex possimus illo.</p>
        <p>Lorem ipsum dolor sit amet consectetur adipisicing elit.
            Quis dolore qui nemo quaerat aperiam aliquam nobis inventore,
            accusamus eos doloremque, a quam dolorum culpa, aliquid
            deserunt impedit ex possimus illo.</p>
        <div class="btn-wrapper">
            <button class="btn btn--accent">Get Started Now</button>
        </div>
    </section>


    <!-- FAQ Section -->
    <section class="section">
        <h2 class="faq__title">Frequently Asked Questions</h2>
        <div class="faq">
            <div class="faq__item">
                <div class="faq__question">
                    <div class="faq__question-title">What is your refund policy?</div>
                </div>
                <div class="faq__answer">
                    <div class="faq__answer-inner">
                        <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.</p>
                    </div>
                </div>
            </div>

            <div class="faq__item">
                <div class="faq__question">
                    <div class="faq__question-title">How long does shipping take?</div>
                </div>
                <div class="faq__answer">
                    <div class="faq__answer-inner">
                        <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.</p>
                    </div>
                </div>
            </div>

            <div class="faq__item">
                <div class="faq__question">
                    <div class="faq__question-title">Do you offer customer support?</div>
                </div>
                <div class="faq__answer">
                    <div class="faq__answer-inner">
                        <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.</p>
                    </div>
                </div>
            </div>

            <div class="faq__item">
                <div class="faq__question">
                    <div class="faq__question-title">Can I change my order after placing it?</div>
                </div>
                <div class="faq__answer">
                    <div class="faq__answer-inner">
                        <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.</p>
                    </div>
                </div>
            </div>
        </div>
    </section>


    <?php if (!empty($settingsContent['author-img'])): ?>
        <section class=" section">
            <div class="author">
                <div class="author__img">
                    <img src="<?= htmlspecialchars($settingsContent['author-img']) ?>" alt="<?= htmlspecialchars($settingsContent['author-name'] ?? '') ?>" title="<?= htmlspecialchars($settingsContent['author-name'] ?? '') ?>">
                </div>
                <div class="author__info">
                    <div class="author__name"><?= htmlspecialchars($settingsContent['author-name'] ?? '') ?></div>
                    <div class="author__date"><?= $settingsContent['modified-date'] ?? '' ?></div>
                </div>
            </div>
        </section>
    <?php endif; ?>

</div>


<!-- <section>
    <div class="container">
        <h1 class="main__title"><?= $content['title'] ?></h1>
        <div class="main__banner">
            <?php if (!empty($bannerLogo['src'])): ?>
                <img class="redirect-js"
                    width="<?= $bannerLogo['width'] ?? '' ?>"
                    height="<?= $bannerLogo['height'] ?? '' ?>"
                    src="<?= htmlspecialchars($bannerLogo['src']) ?>"
                    alt="<?= $bannerLogo['alt'] ?? '' ?>"
                    title="<?= $bannerLogo['title'] ?? '' ?>">
            <?php endif; ?>
        </div>
        <div class="container">
            <?php if (!empty($content['author-img'])): ?>
                <div class="author">
                    <div class="author__img">
                        <img width="" height="" src="<?= htmlspecialchars($content['author-img']) ?>" alt="<?= htmlspecialchars($content['author-name'] ?? '') ?>" title="<?= htmlspecialchars($content['author-name'] ?? '') ?>">
                    </div>
                    <div class="author__info">
                        <div class="author__name"><?= htmlspecialchars($content['author-name'] ?? '') ?></div>
                        <div class="author__date"> <?= $content['modified-date'] ?? '' ?></div>
                    </div>
                </div>
            <?php endif; ?>
            <div class="main__text">
                <?= $content['top_text'] ?>
            </div>
            <?php if (empty($content['hide-btns'])): ?>
                <div class="pulse__btn main__btn accent-color pass-btn-color redirect-js"><?= $content['content_btn'] ?></div>
            <?php endif; ?>
        </div>
</section>
<section>
    <div class="container">
        <div class="secondary__text">
            <?= htmlspecialchars_decode($content['bottom_text']); ?>
        </div>
    </div>
</section>
<section>
    <div class="container">
        <h2><?= $content['faq-title'] ?? '' ?></h2>
        <div class="accordion-container">
            <?php foreach ($faqItems as $item): ?>
                <div class="accordion-item">
                    <h3 class="accordion-header faq-title-hover-font-color secondary-color faq-title-font-color">
                        <?= htmlspecialchars($item['question']) ?>
                        <span class="icon  faq-title-hover-font-color faq-title-font-color">+</span>
                    </h3>
                    <div class="accordion-content secondary-color faq-title-font-color">
                        <p>
                            <?= htmlspecialchars($item['answer']) ?>
                        </p>
                    </div>
                </div>
            <?php endforeach; ?>
        </div>
    </div>
</section> -->

<?php
$pageContent = ob_get_clean();
include __DIR__ . '/layouts/main.php';
?>