{namespace ms=Mediatesystems\UmjSitepackage\ViewHelpers}
<f:render section="e05_social_media_handle_section" arguments="{data: data}"/>


<f:section name="e05_social_media_handle_section">

    <div class="e05_social_media_handle_section {f:if(condition: '!{data.tx_mask_use_primary_color}', then: 'standard-color')}" id="c{data.uid}">
        <div class="e05_social_media_handle_section_wrapper">
            <f:if condition="{data.header}">
                <div class="e05_social_media_handle_section_header">
                    <p>{data.header -> f:format.raw()}</p>
                </div>
            </f:if>
            <div class="e05_social_media_handle_section_links_wrapper">
                <f:for each="{data.tx_mask_e05_social_media_handle_section_all_links}" as="link">
                    <div class="e05_social_media_handle_section_link">
                        <f:link.typolink parameter="{link.tx_mask_tx_mask_e05_social_media_handle_section_url}" additionalAttributes="{aria-label: link.tx_mask_tx_mask_e05_social_media_handle_section_type}">
                            <div class="e05_social_media_handle_section_link_wrapper btn">
                                <f:switch expression="{link.tx_mask_tx_mask_e05_social_media_handle_section_type}">
                                    <f:case value="facebook">
                                        <svg width="10" height="18" viewBox="0 0 10 18" fill="none" xmlns="http://www.w3.org/2000/svg">
                                            <path d="M6.39703 17.997V9.80099H9.16203L9.57303 6.59199H6.39703V4.54799C6.39703 3.62199 6.65503 2.98799 7.98403 2.98799H9.66803V0.126986C8.84867 0.0391771 8.02508 -0.00322112 7.20103 -1.39392e-05C4.75703 -1.39392e-05 3.07903 1.49199 3.07903 4.23099V6.58599H0.332031V9.79499H3.08503V17.997H6.39703Z" fill="white"/>
                                        </svg>
                                    </f:case>
                                    <f:case value="instagram">
                                        <svg width="20" height="20" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg">
                                            <path d="M18.9461 6.30502C18.936 5.54764 18.7942 4.79779 18.5271 4.08902C18.2954 3.49117 17.9416 2.94822 17.4883 2.49485C17.0349 2.04148 16.4919 1.68767 15.8941 1.45602C15.1944 1.19338 14.4553 1.05136 13.7081 1.03602C12.7461 0.993018 12.4411 0.981018 9.9991 0.981018C7.55709 0.981018 7.24409 0.981018 6.28909 1.03602C5.54225 1.05147 4.80344 1.19349 4.10409 1.45602C3.50615 1.68751 2.96312 2.04126 2.50973 2.49465C2.05634 2.94804 1.70258 3.49108 1.47109 4.08902C1.20792 4.78815 1.06622 5.52713 1.05209 6.27402C1.00909 7.23702 0.996094 7.54202 0.996094 9.98402C0.996094 12.426 0.996094 12.738 1.05209 13.694C1.06709 14.442 1.20809 15.18 1.47109 15.881C1.70297 16.4788 2.05699 17.0216 2.51053 17.4748C2.96407 17.928 3.50716 18.2816 4.10509 18.513C4.80253 18.7862 5.54147 18.9384 6.2901 18.963C7.2531 19.006 7.5581 19.019 10.0001 19.019C12.4421 19.019 12.7551 19.019 13.7101 18.963C14.4572 18.9483 15.1965 18.8066 15.8961 18.544C16.4938 18.3121 17.0366 17.9582 17.4899 17.5049C17.9433 17.0515 18.2972 16.5087 18.5291 15.911C18.7921 15.211 18.9331 14.473 18.9481 13.724C18.9911 12.762 19.0041 12.457 19.0041 10.014C19.0021 7.57202 19.0021 7.26202 18.9461 6.30502V6.30502ZM9.9931 14.602C7.4391 14.602 5.37009 12.533 5.37009 9.97902C5.37009 7.42502 7.4391 5.35602 9.9931 5.35602C11.2192 5.35602 12.3951 5.84308 13.2621 6.71006C14.129 7.57705 14.6161 8.75292 14.6161 9.97902C14.6161 11.2051 14.129 12.381 13.2621 13.248C12.3951 14.115 11.2192 14.602 9.9931 14.602V14.602ZM14.8001 6.26302C14.6585 6.26315 14.5183 6.23536 14.3874 6.18123C14.2566 6.1271 14.1377 6.0477 14.0375 5.94757C13.9374 5.84745 13.858 5.72856 13.8039 5.59771C13.7498 5.46686 13.722 5.32662 13.7221 5.18502C13.7221 5.04352 13.75 4.90341 13.8041 4.77268C13.8583 4.64195 13.9376 4.52317 14.0377 4.42311C14.1377 4.32306 14.2565 4.24369 14.3873 4.18954C14.518 4.13539 14.6581 4.10752 14.7996 4.10752C14.9411 4.10752 15.0812 4.13539 15.2119 4.18954C15.3427 4.24369 15.4614 4.32306 15.5615 4.42311C15.6616 4.52317 15.7409 4.64195 15.7951 4.77268C15.8492 4.90341 15.8771 5.04352 15.8771 5.18502C15.8771 5.78102 15.3951 6.26302 14.8001 6.26302Z" fill="white"/>
                                        </svg>
                                    </f:case>
                                    <f:case value="twitter">
                                        <svg width="20" height="16" viewBox="0 0 20 16" fill="none" xmlns="http://www.w3.org/2000/svg">
                                            <path d="M17.633 3.99698C17.646 4.17198 17.646 4.34598 17.646 4.51998C17.646 9.84498 13.593 15.981 6.186 15.981C3.904 15.981 1.784 15.32 0 14.172C0.324 14.209 0.636 14.222 0.973 14.222C2.78599 14.2264 4.54765 13.6201 5.974 12.501C5.13342 12.4858 4.31858 12.2084 3.64324 11.7077C2.9679 11.207 2.46578 10.5079 2.207 9.70798C2.456 9.74498 2.706 9.76998 2.968 9.76998C3.329 9.76998 3.692 9.71998 4.029 9.63298C3.11676 9.4488 2.29647 8.95433 1.70762 8.23367C1.11876 7.513 0.797693 6.61063 0.799 5.67998V5.62998C1.336 5.92898 1.959 6.11598 2.619 6.14098C2.06609 5.77357 1.61272 5.27501 1.29934 4.68977C0.98596 4.10454 0.822313 3.45084 0.823 2.78698C0.823 2.03898 1.022 1.35298 1.371 0.754982C2.38314 2 3.6455 3.01854 5.07634 3.74464C6.50717 4.47074 8.07456 4.8882 9.677 4.96998C9.615 4.66998 9.577 4.35898 9.577 4.04698C9.57674 3.51794 9.68075 2.99404 9.88308 2.50522C10.0854 2.0164 10.3821 1.57226 10.7562 1.19817C11.1303 0.824083 11.5744 0.527393 12.0632 0.32506C12.5521 0.122728 13.076 0.0187196 13.605 0.0189824C14.765 0.0189824 15.812 0.504982 16.548 1.29098C17.4498 1.1166 18.3145 0.787404 19.104 0.317982C18.8034 1.2488 18.1738 2.03809 17.333 2.53798C18.1328 2.44676 18.9144 2.23643 19.652 1.91398C19.1011 2.71708 18.4185 3.42133 17.633 3.99698V3.99698Z" fill="white"/>
                                        </svg>
                                    </f:case>
                                    <f:case value="youtube">
                                        <svg width="21" height="15" viewBox="0 0 21 15" fill="none" xmlns="http://www.w3.org/2000/svg">
                                            <path d="M20.5914 2.20298C20.4775 1.78038 20.2549 1.39498 19.9457 1.08514C19.6366 0.775308 19.2517 0.551837 18.8294 0.436977C17.2634 0.00697687 10.9984 -2.29211e-05 10.9984 -2.29211e-05C10.9984 -2.29211e-05 4.73438 -0.00702313 3.16738 0.403977C2.7453 0.524123 2.3612 0.750754 2.05194 1.06211C1.74269 1.37347 1.51866 1.7591 1.40138 2.18198C0.988377 3.74798 0.984376 6.99598 0.984376 6.99598C0.984376 6.99598 0.980376 10.26 1.39038 11.81C1.62038 12.667 2.29538 13.344 3.15338 13.575C4.73538 14.005 10.9834 14.012 10.9834 14.012C10.9834 14.012 17.2484 14.019 18.8144 13.609C19.2369 13.4943 19.6221 13.2714 19.932 12.9622C20.2419 12.653 20.4658 12.2682 20.5814 11.846C20.9954 10.281 20.9984 7.03398 20.9984 7.03398C20.9984 7.03398 21.0184 3.76898 20.5914 2.20298V2.20298ZM8.99438 10.005L8.99938 4.00498L14.2064 7.00998L8.99438 10.005V10.005Z" fill="white"/>
                                        </svg>
                                    </f:case>
                                    <f:case value="tiktok">
                                        <svg id="Layer_2" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 450 450" style="height: 36px; margin-top: 3px; margin-left: 3px;">
                                            <g id="Layer_1-2">
                                                <g>
                                                    <path d="M284.07,111.86c-15.01-9.79-25.85-25.45-29.23-43.71-.73-3.95-1.13-8.01-1.13-12.16h-47.92l-.08,192.04c-.81,21.51-18.5,38.77-40.2,38.77-6.74,0-13.09-1.69-18.68-4.63-12.82-6.75-21.6-20.19-21.6-35.65,0-22.21,18.07-40.28,40.28-40.28,4.15,0,8.12,.68,11.89,1.86v-48.92c-3.89-.53-7.85-.86-11.89-.86-48.63,0-88.2,39.57-88.2,88.2,0,29.84,14.91,56.25,37.65,72.21,14.33,10.06,31.75,15.98,50.55,15.98,48.63,0,88.2-39.56,88.2-88.2v-97.38c18.79,13.49,41.82,21.44,66.67,21.44v-47.92c-13.38,0-25.85-3.98-36.3-10.8Z"/>
                                                </g>
                                            </g>
                                        </svg>
                                    </f:case>

                                </f:switch>
                            </div>
                        </f:link.typolink>
                    </div>

                </f:for>
            </div>
        </div>
    </div>
</f:section>