<? if (!defined("B_PROLOG_INCLUDED") || B_PROLOG_INCLUDED !== true) die();
/** @var array $arParams */
/** @var array $arResult */
/** @global CMain $APPLICATION */
/** @global CUser $USER */
/** @global CDatabase $DB */
/** @var CBitrixComponentTemplate $this */
/** @var string $templateName */
/** @var string $templateFile */
/** @var string $templateFolder */
/** @var string $componentPath */
/** @var CBitrixComponent $component */
$this->setFrameMode(true);



?>

<section class="page-section" id="links">
    <div class="links">
        <div class="container">

            <div class="links__inner">
                <div class="links__aside">
                    <div class="section-title links__title">
                        <div class="section-title__wrap">
                            <p class="section-title__badge"><?=$arResult['TAG']?></p>
                            <h2 data-animate="title" class="title title--h2 section-title__title words lines
                            splitting"><?=$arResult['NAME']?></h2>
                        </div>

                    </div>
                    <p class="links__title-description">
                        <?=$arResult['TEXT']?>
                    </p>

                    <div class="links__logo">
                        <img src="<?=$arResult['IMG']?>" alt="Картинка" width="262" height="52" loading="lazy">
                    </div>
                </div>
                <ul class="links__list">
                    <?foreach ($arResult['ITEMS'] as $k=>$arItem){ ?>
                        <?
                        $this->AddEditAction($arItem['ID'], $arItem['EDIT_LINK'], CIBlock::GetArrayByID($arItem["IBLOCK_ID"], "ELEMENT_EDIT"));
                        $this->AddDeleteAction($arItem['ID'], $arItem['DELETE_LINK'], CIBlock::GetArrayByID($arItem["IBLOCK_ID"], "ELEMENT_DELETE"), array("CONFIRM" => GetMessage('CT_BNL_ELEMENT_DELETE_CONFIRM')));
                        $img1921 = CFile::GetPath($arItem["PROPERTIES"]['IMG_1921']["VALUE"]);
                        $img768 = CFile::GetPath($arItem["PROPERTIES"]['IMG_768']["VALUE"]);
                        $img767 = CFile::GetPath($arItem["PROPERTIES"]['IMG_767']["VALUE"]);
                        $logo = CFile::GetPath($arItem["PROPERTIES"]['LOGO']["VALUE"]);


                        ?>
                        <li class="links__item">
                        <div class="link-card">
                            <div class="link-card__bg">
                                <div class="link-card__bg-image">
                                    <picture>
                                        <source media="(min-width: 1921px)"
                                                srcset="<?= $img1921?>"
                                                type="image/webp">
                                        <source media="(min-width: 768px)"
                                                srcset="<?= $img768?>"
                                                type="image/webp">
                                        <source media="(max-width: 767px)"
                                                srcset="<?= $img767?>"
                                                type="image/webp">
                                        <img src="<?=$arItem['PREVIEW_PICTURE']['SRC']?>"
                                             srcset="<?= $arItem['PREVIEW_PICTURE']['SRC']?>"
                                            alt="Картинка" width="577" height="553" loading="lazy">
                                    </picture>
                                </div>
                                <div class="link-card__bg-pixels" data-pixels="link-card" data-pixels-qty="45"><div class="pixel" style="opacity: 0; --delay: 0.7305174807457835;"></div><div class="pixel" style="opacity: 0.35; --delay: 0.05411110740021252;"></div><div class="pixel" style="opacity: 0; --delay: 0.9589369612035039;"></div><div class="pixel" style="opacity: 0; --delay: 0.9226369953672806;"></div><div class="pixel" style="opacity: 0; --delay: 0.13522031708422055;"></div><div class="pixel" style="opacity: 0.35; --delay: 0.645215894942397;"></div><div class="pixel" style="opacity: 0.35; --delay: 0.9587063579304413;"></div><div class="pixel" style="opacity: 0; --delay: 0.07654681981082456;"></div><div class="pixel" style="opacity: 0; --delay: 0.9874481084921201;"></div><div class="pixel" style="opacity: 0.75; --delay: 0.020462383713542476;"></div><div class="pixel" style="opacity: 0.35; --delay: 0.09835051039659137;"></div><div class="pixel" style="opacity: 0.35; --delay: 0.6076161300821856;"></div><div class="pixel" style="opacity: 0.75; --delay: 0.11100120786266032;"></div><div class="pixel" style="opacity: 0; --delay: 0.31222638861886987;"></div><div class="pixel" style="opacity: 0; --delay: 0.09515157894828907;"></div><div class="pixel" style="opacity: 0.35; --delay: 0.14442294244695275;"></div><div class="pixel" style="opacity: 0.35; --delay: 0.6106760059308372;"></div><div class="pixel" style="opacity: 0.35; --delay: 0.12025089859749438;"></div><div class="pixel" style="opacity: 0; --delay: 0.3904850340533308;"></div><div class="pixel" style="opacity: 0; --delay: 0.45824611580189933;"></div><div class="pixel" style="opacity: 0.35; --delay: 0.5359375027664275;"></div><div class="pixel" style="opacity: 0.35; --delay: 0.9643170883094792;"></div><div class="pixel" style="opacity: 0; --delay: 0.5659979502876042;"></div><div class="pixel" style="opacity: 0; --delay: 0.6440779878070759;"></div><div class="pixel" style="opacity: 0.35; --delay: 0.7083366519416461;"></div><div class="pixel" style="opacity: 0.35; --delay: 0.8106267294842111;"></div><div class="pixel" style="opacity: 0; --delay: 0.7502709304704536;"></div><div class="pixel" style="opacity: 0.35; --delay: 0.35987798297000184;"></div><div class="pixel" style="opacity: 0.75; --delay: 0.19206341221144285;"></div><div class="pixel" style="opacity: 0; --delay: 0.831288185793909;"></div><div class="pixel" style="opacity: 0.35; --delay: 0.8387303591355713;"></div><div class="pixel" style="opacity: 0; --delay: 0.35133509130057416;"></div><div class="pixel" style="opacity: 0.35; --delay: 0.23389192887043486;"></div><div class="pixel" style="opacity: 0; --delay: 0.15917769571865592;"></div><div class="pixel" style="opacity: 0; --delay: 0.7864311756785434;"></div><div class="pixel" style="opacity: 0; --delay: 0.7205471217637673;"></div><div class="pixel" style="opacity: 0; --delay: 0.8558319407488775;"></div><div class="pixel" style="opacity: 0; --delay: 0.29396440467731244;"></div><div class="pixel" style="opacity: 0; --delay: 0.8364357084326719;"></div><div class="pixel" style="opacity: 0; --delay: 0.15344544973341923;"></div><div class="pixel" style="opacity: 0; --delay: 0.5376703109581036;"></div><div class="pixel" style="opacity: 0; --delay: 0.6082877169030263;"></div><div class="pixel" style="opacity: 0.75; --delay: 0.8368335683604486;"></div><div class="pixel" style="opacity: 0; --delay: 0.8171791567884139;"></div><div class="pixel" style="opacity: 0.75; --delay: 0.8267671860214609;"></div></div>
                            </div>
                            <div class="link-card__inner">
                                <div class="link-card__image">
                                    <img src="<?=$logo?>" alt="Логотип" width="48" height="48" loading="lazy">

                                </div>
                                <h3 class="link-card__title"><?=$arItem['NAME']?></h3>
                                <p class="link-card__text"><?=$arItem['PREVIEW_TEXT']?></p>
                                <a target="_blank" href="<?=$arItem['PROPERTIES']['LINK']['VALUE']?>" class="button button--size-xl-m
                                 button--transparent link-card__btn"><span class="button__text">перейти на сайт</span><span class="button__icon">
        <svg width="1em" height="1em" viewBox="0 0 20 20" data-icon="icon-arrow-up-right">

  <use xlink:href="#ai:local:icon-arrow-up-right"></use>

</svg>
      </span></a>
                            </div>
                        </div>
                    </li>
                    <?}?>
                </ul>
            </div>

        </div>
    </div>

</section>