Banners


import React from 'react';

const Example = () => (
    <div className="banner-mobile">
        <div className="container">
            <div className="row align-items-bottom">
                <div className="col-12 col-md-6 order-2 order-md-1">
                    <div className="banner-mobile__image-container">
                        <div className="banner-mobile__gradient" />
                        <picture>
                            <source
                                media="(max-width: 767px)"
                                srcSet="https://seduocz.educdn.cz/static/images/mobile_banner/cover3_mobile_320px@1.png, https://seduocz.educdn.cz/static/images/mobile_banner/cover3_mobile_320px@2.png 2x"
                            />
                            <img
                                src="https://seduocz.educdn.cz/static/images/mobile_banner/cover1_desktop_1200px@1.png"
                                srcSet="https://seduocz.educdn.cz/static/images/mobile_banner/cover1_desktop_1200px@1.png, https://seduocz.educdn.cz/static/images/mobile_banner/cover1_desktop_1200px@2.png 2x"
                                className="banner-mobile__image"
                                alt="Vaši zaměstnanci mohou studovat opravdu kdekoliv…"
                            />
                        </picture>
                    </div>
                </div>
                <div className="col-12 col-md-6 order-1 order-md-2 my-8 my-md-9 my-lg-11">
                    <div className="row my-md-8 my-lg-0">
                        <div className="col-12">
                            <h2 className="banner-mobile__title">
                                Vaši zaměstnanci mohou studovat <em>opravdu kdekoliv…</em>
                            </h2>
                            <p className="text-transparent">
                                … dokonce i když jsou offline. Mobilní aplikace Seduo.cz jim videokurzy spustí v metru,
                                letadle, na chalupě u lesa nebo kdekoliv jinde. Vzdělávání tedy mají v kapse. Doslova.
                            </p>
                            <div className="text-center text-md-left">
                                <a
                                    href="https://play.google.com/store/apps/details?id=eu.lmc.seduo"
                                    className="link-reset mr-5"
                                    // @ts-ignore
                                    onClick="dataLayer.push({ 'event' : 'GAEvent', 'eventCategory' : 'Link', 'eventAction' : 'StrankaProFirmy', 'eventLabel' : 'Android', 'eventValue' : 0});"
                                >
                                    <img
                                        src="https://seduocz.educdn.cz/static/images/icons/google_play.svg"
                                        className="icon-app-download"
                                        alt="Stáhnout na Google play"
                                    />
                                </a>
                                <a
                                    href="https://apps.apple.com/cz/app/seduo/id1452881860?mt=8"
                                    className="link-reset"
                                    // @ts-ignore
                                    onClick="dataLayer.push({ 'event' : 'GAEvent', 'eventCategory' : 'Link', 'eventAction' : 'StrankaProFirmy', 'eventLabel' : 'iOS', 'eventValue' : 0});"
                                >
                                    <img
                                        src="https://seduocz.educdn.cz/static/images/icons/app_store.svg"
                                        className="icon-app-download"
                                        alt="Stáhnout na App Store"
                                    />
                                </a>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
);

export default Example;