Files
edx-platform/cms/static/images/subsection-embed.svg
Bryann Valderrama 19bc5c802c feat: add share link button when hide from toc is enabled in sections (#34043)
* feat: add share link modal when hide from toc is enabled

Adds a new button in the child subsections of sections with Hide From TOC enabled.
This button displays a new modal with two tabs. The first tab displays a button
that allows you to copy the link of that subsection to the clipboard. The second
tab displays a button that allows you to copy the embedded link of the same
subsection to the clipboard.

Ref: https://openedx.atlassian.net/wiki/spaces/OEPM/pages/3853975595/Feature+Enhancement+Proposal+Hide+Sections+from+course+outline
2024-03-07 14:12:17 -04:00

85 lines
13 KiB
XML

<svg width="225" height="158" viewBox="0 0 225 158" fill="none" xmlns="http://www.w3.org/2000/svg">
<g clip-path="url(#clip0_60_202)">
<rect width="225" height="158" rx="5" fill="white"/>
<rect width="225" height="158" rx="5" fill="white"/>
<g filter="url(#filter0_d_60_202)">
<rect x="19" y="15" width="186" height="129" rx="4" fill="white"/>
</g>
<rect x="196.6" y="22" width="5" height="66" rx="2.5" fill="#D9D9D9">
<animate attributeName="y" values="22;40;22" begin="0s" dur="2.5s" repeatCount="indefinite" calcMode="linear" keyTimes="0;0.5;1"/></rect>
<g clip-path="url(#clip1_60_202)">
<rect x="118.899" y="33.6089" width="70.7246" height="3.53623" fill="#EBEBEB">
<animate attributeName="y" values="33.6089;25.6089;33.6089" begin="0s" dur="2.5s" repeatCount="indefinite" calcMode="linear" keyTimes="0;0.5;1"/></rect>
<rect x="118.899" y="65.4346" width="70.7246" height="3.53623" fill="#EBEBEB">
<animate attributeName="y" values="65.4346;57.4346;65.4346" begin="0s" dur="2.5s" repeatCount="indefinite" calcMode="linear" keyTimes="0;0.5;1"/></rect>
<rect x="118.899" y="38.9131" width="70.7246" height="3.53623" fill="#EBEBEB">
<animate attributeName="y" values="38.9131;30.9131;38.9131" begin="0s" dur="2.5s" repeatCount="indefinite" calcMode="linear" keyTimes="0;0.5;1"/></rect>
<rect x="118.899" y="70.7393" width="70.7246" height="3.53623" fill="#EBEBEB">
<animate attributeName="y" values="70.7393;62.7393;70.7393" begin="0s" dur="2.5s" repeatCount="indefinite" calcMode="linear" keyTimes="0;0.5;1"/></rect>
<rect x="118.899" y="44.2173" width="70.7246" height="3.53623" fill="#EBEBEB">
<animate attributeName="y" values="44.2173;36.2173;44.2173" begin="0s" dur="2.5s" repeatCount="indefinite" calcMode="linear" keyTimes="0;0.5;1"/></rect>
<rect x="118.899" y="76.0435" width="70.7246" height="3.53623" fill="#EBEBEB">
<animate attributeName="y" values="76.0435;68.0435;76.0435" begin="0s" dur="2.5s" repeatCount="indefinite" calcMode="linear" keyTimes="0;0.5;1"/></rect>
<rect x="118.899" y="97.0869" width="70.7246" height="3.53623" fill="#EBEBEB">
<animate attributeName="y" values="97.0869;89.0869;97.0869" begin="0s" dur="2.5s" repeatCount="indefinite" calcMode="linear" keyTimes="0;0.5;1"/></rect>
<rect x="118.899" y="49.5215" width="70.7246" height="3.53623" fill="#EBEBEB">
<animate attributeName="y" values="49.5215;41.5215;49.5215" begin="0s" dur="2.5s" repeatCount="indefinite" calcMode="linear" keyTimes="0;0.5;1"/></rect>
<rect x="118.899" y="81.3477" width="70.7246" height="3.53623" fill="#EBEBEB">
<animate attributeName="y" values="81.3477;73.3477;81.3477" begin="0s" dur="2.5s" repeatCount="indefinite" calcMode="linear" keyTimes="0;0.5;1"/></rect>
<rect x="118.899" y="102.391" width="70.7246" height="3.53623" fill="#EBEBEB">
<animate attributeName="y" values="102.391;94.3911;102.391" begin="0s" dur="2.5s" repeatCount="indefinite" calcMode="linear" keyTimes="0;0.5;1"/></rect>
<rect x="118.899" y="54.8262" width="70.7246" height="3.53623" fill="#EBEBEB">
<animate attributeName="y" values="54.8262;46.8262;54.8262" begin="0s" dur="2.5s" repeatCount="indefinite" calcMode="linear" keyTimes="0;0.5;1"/></rect>
<rect x="118.899" y="86.6523" width="70.7246" height="3.53623" fill="#EBEBEB">
<animate attributeName="y" values="86.6523;78.6523;86.6523" begin="0s" dur="2.5s" repeatCount="indefinite" calcMode="linear" keyTimes="0;0.5;1"/></rect>
<rect x="25" y="124" width="165" height="4" fill="#EBEBEB">
<animate attributeName="y" values="124;116;124" begin="0s" dur="2.5s" repeatCount="indefinite" calcMode="linear" keyTimes="0;0.5;1"/></rect>
<rect x="25" y="130" width="165" height="4" fill="#EBEBEB">
<animate attributeName="y" values="130;122;130" begin="0s" dur="2.5s" repeatCount="indefinite" calcMode="linear" keyTimes="0;0.5;1"/></rect>
<rect x="25" y="136" width="165" height="4" fill="#EBEBEB">
<animate attributeName="y" values="136;128;136" begin="0s" dur="2.5s" repeatCount="indefinite" calcMode="linear" keyTimes="0;0.5;1"/></rect>
<rect x="25.1884" y="23" width="164.435" height="3.53623" fill="#EBEBEB">
<animate attributeName="y" values="23;15;23" begin="0s" dur="2.5s" repeatCount="indefinite" calcMode="linear" keyTimes="0;0.5;1"/></rect>
<rect x="118.899" y="60.1304" width="70.7246" height="3.53623" fill="#EBEBEB">
<animate attributeName="y" values="60.1304;52.1304;60.1304" begin="0s" dur="2.5s" repeatCount="indefinite" calcMode="linear" keyTimes="0;0.5;1"/></rect>
<rect x="118.899" y="91.9565" width="70.7246" height="3.53623" fill="#EBEBEB">
<animate attributeName="y" values="91.9565;83.9565;91.9565" begin="0s" dur="2.5s" repeatCount="indefinite" calcMode="linear" keyTimes="0;0.5;1"/></rect>
<rect x="118.899" y="97.0723" width="70.7246" height="3.53623" fill="#EBEBEB">
<animate attributeName="y" values="97.0723;89.0723;97.0723" begin="0s" dur="2.5s" repeatCount="indefinite" calcMode="linear" keyTimes="0;0.5;1"/></rect>
<rect x="25" y="142" width="165" height="4" fill="#EBEBEB">
<animate attributeName="y" values="142;134;142" begin="0s" dur="2.5s" repeatCount="indefinite" calcMode="linear" keyTimes="0;0.5;1"/></rect>
<path d="M25.1884 44.5965C25.1884 41.6824 26.341 38.8876 28.3927 36.8271C30.4444 34.7665 33.227 33.6089 36.1286 33.6089L101.77 33.6089C104.671 33.6089 107.454 34.7665 109.506 36.8271C111.557 38.8876 112.71 41.6824 112.71 44.5965L112.71 99.5343C112.71 102.448 111.557 105.243 109.506 107.304C107.454 109.364 104.671 110.522 101.77 110.522L36.1286 110.522C33.227 110.522 30.4444 109.364 28.3927 107.304C26.341 105.243 25.1884 102.448 25.1884 99.5343L25.1884 44.5965ZM30.6585 94.0406L30.6585 99.5343C30.6585 100.991 31.2348 102.389 32.2606 103.419C33.2865 104.449 34.6778 105.028 36.1286 105.028L101.77 105.028C103.221 105.028 104.612 104.449 105.638 103.419C106.664 102.389 107.24 100.991 107.24 99.5343L107.24 80.3061L86.5794 69.6097C86.0664 69.3516 85.4856 69.2621 84.9192 69.3538C84.3528 69.4455 83.8294 69.7137 83.4231 70.1206L63.129 90.5026L48.5785 80.7676C48.0532 80.4163 47.423 80.2583 46.7949 80.3204C46.1669 80.3825 45.5795 80.6608 45.1324 81.1082L30.6585 94.0406ZM58.009 58.3309C58.009 56.1454 57.1445 54.0493 55.6058 52.5039C54.067 50.9585 51.98 50.0903 49.8038 50.0903C47.6277 50.0903 45.5407 50.9585 44.0019 52.5039C42.4631 54.0493 41.5987 56.1454 41.5987 58.3309C41.5987 60.5165 42.4631 62.6126 44.0019 64.158C45.5407 65.7034 47.6277 66.5716 49.8038 66.5716C51.98 66.5716 54.067 65.7034 55.6058 64.158C57.1445 62.6126 58.009 60.5165 58.009 58.3309Z" fill="#EBEBEB">
<animate attributeName="d" values="M25.1884 44.5965C25.1884 41.6824 26.341 38.8876 28.3927 36.8271C30.4444 34.7665 33.227 33.6089 36.1286 33.6089L101.77 33.6089C104.671 33.6089 107.454 34.7665 109.506 36.8271C111.557 38.8876 112.71 41.6824 112.71 44.5965L112.71 99.5343C112.71 102.448 111.557 105.243 109.506 107.304C107.454 109.364 104.671 110.522 101.77 110.522L36.1286 110.522C33.227 110.522 30.4444 109.364 28.3927 107.304C26.341 105.243 25.1884 102.448 25.1884 99.5343L25.1884 44.5965ZM30.6585 94.0406L30.6585 99.5343C30.6585 100.991 31.2348 102.389 32.2606 103.419C33.2865 104.449 34.6778 105.028 36.1286 105.028L101.77 105.028C103.221 105.028 104.612 104.449 105.638 103.419C106.664 102.389 107.24 100.991 107.24 99.5343L107.24 80.3061L86.5794 69.6097C86.0664 69.3516 85.4856 69.2621 84.9192 69.3538C84.3528 69.4455 83.8294 69.7137 83.4231 70.1206L63.129 90.5026L48.5785 80.7676C48.0532 80.4163 47.423 80.2583 46.7949 80.3204C46.1669 80.3825 45.5795 80.6608 45.1324 81.1082L30.6585 94.0406ZM58.009 58.3309C58.009 56.1454 57.1445 54.0493 55.6058 52.5039C54.067 50.9585 51.98 50.0903 49.8038 50.0903C47.6277 50.0903 45.5407 50.9585 44.0019 52.5039C42.4631 54.0493 41.5987 56.1454 41.5987 58.3309C41.5987 60.5165 42.4631 62.6126 44.0019 64.158C45.5407 65.7034 47.6277 66.5716 49.8038 66.5716C51.98 66.5716 54.067 65.7034 55.6058 64.158C57.1445 62.6126 58.009 60.5165 58.009 58.3309Z;M25.1884 36.5965C25.1884 33.6824 26.341 30.8876 28.3927 28.8271C30.4444 26.7665 33.227 25.6089 36.1286 25.6089L101.77 25.6089C104.671 25.6089 107.454 26.7665 109.506 28.8271C111.557 30.8876 112.71 33.6824 112.71 36.5965L112.71 91.5343C112.71 94.4484 111.557 97.2432 109.506 99.3037C107.454 101.364 104.671 102.522 101.77 102.522L36.1286 102.522C33.227 102.522 30.4444 101.364 28.3927 99.3037C26.341 97.2432 25.1884 94.4484 25.1884 91.5343L25.1884 36.5965ZM30.6585 86.0406L30.6585 91.5343C30.6585 92.9914 31.2348 94.3888 32.2606 95.419C33.2865 96.4493 34.6778 97.0281 36.1286 97.0281L101.77 97.0281C103.221 97.0281 104.612 96.4493 105.638 95.419C106.664 94.3888 107.24 92.9914 107.24 91.5343L107.24 72.3061L86.5794 61.6097C86.0664 61.3516 85.4856 61.2621 84.9192 61.3538C84.3528 61.4455 83.8294 61.7137 83.4231 62.1206L63.129 82.5026L48.5785 72.7676C48.0532 72.4163 47.423 72.2583 46.7949 72.3204C46.1669 72.3825 45.5795 72.6608 45.1324 73.1082L30.6585 86.0406ZM58.009 50.3309C58.009 48.1454 57.1445 46.0493 55.6058 44.5039C54.067 42.9585 51.98 42.0903 49.8038 42.0903C47.6277 42.0903 45.5407 42.9585 44.0019 44.5039C42.4631 46.0493 41.5987 48.1454 41.5987 50.3309C41.5987 52.5165 42.4631 54.6126 44.0019 56.158C45.5407 57.7034 47.6277 58.5716 49.8038 58.5716C51.98 58.5716 54.067 57.7034 55.6058 56.158C57.1445 54.6126 58.009 52.5165 58.009 50.3309Z;M25.1884 44.5965C25.1884 41.6824 26.341 38.8876 28.3927 36.8271C30.4444 34.7665 33.227 33.6089 36.1286 33.6089L101.77 33.6089C104.671 33.6089 107.454 34.7665 109.506 36.8271C111.557 38.8876 112.71 41.6824 112.71 44.5965L112.71 99.5343C112.71 102.448 111.557 105.243 109.506 107.304C107.454 109.364 104.671 110.522 101.77 110.522L36.1286 110.522C33.227 110.522 30.4444 109.364 28.3927 107.304C26.341 105.243 25.1884 102.448 25.1884 99.5343L25.1884 44.5965ZM30.6585 94.0406L30.6585 99.5343C30.6585 100.991 31.2348 102.389 32.2606 103.419C33.2865 104.449 34.6778 105.028 36.1286 105.028L101.77 105.028C103.221 105.028 104.612 104.449 105.638 103.419C106.664 102.389 107.24 100.991 107.24 99.5343L107.24 80.3061L86.5794 69.6097C86.0664 69.3516 85.4856 69.2621 84.9192 69.3538C84.3528 69.4455 83.8294 69.7137 83.4231 70.1206L63.129 90.5026L48.5785 80.7676C48.0532 80.4163 47.423 80.2583 46.7949 80.3204C46.1669 80.3825 45.5795 80.6608 45.1324 81.1082L30.6585 94.0406ZM58.009 58.3309C58.009 56.1454 57.1445 54.0493 55.6058 52.5039C54.067 50.9585 51.98 50.0903 49.8038 50.0903C47.6277 50.0903 45.5407 50.9585 44.0019 52.5039C42.4631 54.0493 41.5987 56.1454 41.5987 58.3309C41.5987 60.5165 42.4631 62.6126 44.0019 64.158C45.5407 65.7034 47.6277 66.5716 49.8038 66.5716C51.98 66.5716 54.067 65.7034 55.6058 64.158C57.1445 62.6126 58.009 60.5165 58.009 58.3309Z" begin="0s" dur="2.5s" repeatCount="indefinite" calcMode="linear" keyTimes="0;0.5;1"/></path>
<rect x="24" y="117" width="167" height="41" rx="12" fill="#EBEBEB">
<animate attributeName="y" values="117;109;117" begin="0s" dur="2.5s" repeatCount="indefinite" calcMode="linear" keyTimes="0;0.5;1"/></rect>
<rect x="38" y="136" width="139" height="22" rx="2" fill="#CBCBCB" fill-opacity="0.5">
<animate attributeName="y" values="136;128;136" begin="0s" dur="2.5s" repeatCount="indefinite" calcMode="linear" keyTimes="0;0.5;1"/></rect>
<line x1="24" y1="127.807" x2="191" y2="127.807" stroke="#DBDBDB">
<animate attributeName="y1" values="127.807;119.807;127.807" begin="0s" dur="2.5s" repeatCount="indefinite" calcMode="linear" keyTimes="0;0.5;1"/>
<animate attributeName="y2" values="127.807;119.807;127.807" begin="0s" dur="2.5s" repeatCount="indefinite" calcMode="linear" keyTimes="0;0.5;1"/>
<animate attributeName="stroke-opacity" values="1;0.5;1" begin="0s" dur="2.5s" repeatCount="indefinite" calcMode="linear" keyTimes="0;0.5;1"/></line>
</g>
</g>
<rect x="0.5" y="0.5" width="224" height="157" rx="4.5" stroke="black" stroke-opacity="0.1"/>
<defs>
<filter id="filter0_d_60_202" x="14.6" y="10.6" width="194.8" height="137.8" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB">
<feFlood flood-opacity="0" result="BackgroundImageFix"/>
<feColorMatrix in="SourceAlpha" type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0" result="hardAlpha"/>
<feOffset/>
<feGaussianBlur stdDeviation="2.2"/>
<feComposite in2="hardAlpha" operator="out"/>
<feColorMatrix type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.25 0"/>
<feBlend mode="normal" in2="BackgroundImageFix" result="effect1_dropShadow_60_202">
</feBlend>
<feBlend mode="normal" in="SourceGraphic" in2="effect1_dropShadow_60_202" result="shape">
</feBlend>
</filter>
<clipPath id="clip0_60_202">
<rect width="225" height="158" rx="5" fill="white"/>
</clipPath>
<clipPath id="clip1_60_202">
<rect width="165" height="121" fill="white" transform="translate(25 23)"/>
</clipPath>
</defs>
</svg>