page-liste.hbs

{{!--
This template is used for the posts that are marked as pages.
--}}

{{!-- This block preloads specific assets for the post page --}}
{{#contentFor "preload"}}
<link rel="preload" href="{{asset " css/post.css"}}" as="style" />
<link rel="preload" href="{{asset " js/page.js"}}" as="script" />
<style>
    .button-style-liste{
        background-color: #FF8000; 
        border-radius: 25px; 
        padding: 15px; 
        margin-bottom:15px
    }
</style>
{{/contentFor}}

{{!-- This block loads specific styles for the post page --}}
{{#contentFor "styles"}}
<link rel="stylesheet" type="text/css" href="{{asset " css/post.css"}}" media="screen" />
{{/contentFor}}

{{!-- The tag below means: insert everything in this file
into the {body} of the default.hbs template --}}
{{!< default}} {{!-- Special header.hbs partial to generate the <header> tag --}}
    {{#post}}
    {{> header background=feature_image}}
    <div class="m-hero__content" data-animate="fade-down">
        <h1 class="m-hero-title bigger">Liste Finale</h1>
        {{#if custom_excerpt}}
        <p class="m-hero-description">{{custom_excerpt}}</p>
        {{/if}}
    </div>
    {{/post}}

    <main class="main-wrap">
        {{!-- Everything inside the #post tags pulls data from the post --}}
        {{#post}}
        {{!-- Inject styles of the hero image to make it responsive --}}
        {{> hero background=feature_image}}
        <div class="m-hero__content" data-animate="fade-down">
            {{#if custom_excerpt}}
            <p class="m-hero-description">{{custom_excerpt}}</p>
            {{/if}}
        </div>
        </section>
        <article>
            <div class="l-content">
                <div class="l-wrapper in-post" data-animate="fade-up">
                    <div class="l-post-content">
                        <div class="pos-relative js-post-content">
                            <div style="display:flex; align-items:center; justify-content:center">
                                <button class="button-style-liste">
                                       <a href="https://esu.osut.org/content/files/2023/05/Liste participanti-a treia etapa-lista.pdf"
                                        target="_blank" style="color:white;font-size:30px;">Descarcă <i class="fa fa-download"></i></a>
                                </button>
                            </div>
                            <div>
                                <iframe src="https://drive.google.com/file/d/1Zw42rnAuhWpuLDPumCMX078Fb9MBze2A/preview"
                                    class="size"></iframe>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </article>
        {{/post}}
    </main>

    <style>
        .size {
            width: 100%;
            height: 700px;
        }

        @media only screen and (max-width: 620px) {
            .size {
                height: 400px;
            }
        }
    </style>

    {{!-- The #contentFor helper here will send everything inside it up to the matching #block helper found in
    default.hbs --}}
    {{#contentFor "scripts"}}
    <script defer src="{{asset " js/page.js"}}"></script>
    {{/contentFor}}