Switch Logo from images to icons
This commit is contained in:
Rafael
Thomas Zarebczan
parent
4158b99453
commit
f5ba2d5425
4 changed files with 175 additions and 39 deletions
|
|
@ -42,19 +42,170 @@ const buildIcon = (iconStrokes: React$Node, customSvgValues = {}) =>
|
|||
});
|
||||
|
||||
export const icons = {
|
||||
// The LBRY icon is different from the base icon set so don't use buildIcon()
|
||||
[ICONS.LBRY]: (props: IconProps) => (
|
||||
[ICONS.ODYSEE_LOGO]: (props: IconProps) => (
|
||||
<svg
|
||||
{...props}
|
||||
stroke="currentColor"
|
||||
fill="currentColor"
|
||||
id="Layer_1"
|
||||
strokeWidth="0"
|
||||
style={{ enableBackground: 'new 0 0 103.1 103.1' }}
|
||||
version="1.1"
|
||||
viewBox="0 0 103.1 103.1"
|
||||
x="0px"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
xmlnsXlink="http://www.w3.org/1999/xlink"
|
||||
xmlSpace="preserve"
|
||||
y="0px"
|
||||
viewBox="0 0 322 254"
|
||||
className="icon lbry-icon"
|
||||
>
|
||||
<path d="M296,85.9V100l-138.8,85.3L52.6,134l0.2-7.9l104,51.2L289,96.1v-5.8L164.2,30.1L25,116.2v38.5l131.8,65.2 l137.6-84.4l3.9,6l-141.1,86.4L18.1,159.1v-46.8l145.8-90.2C163.9,22.1,296,85.9,296,85.9z" />
|
||||
<path d="M294.3,150.9l2-12.6l-12.2-2.1l0.8-4.9l17.1,2.9l-2.8,17.5L294.3,150.9L294.3,150.9z" />
|
||||
<style type="text/css">
|
||||
{
|
||||
'.st0{fill:url(#SVGID_1_);}.st1{clip-path:url(#SVGID_00000146468834146730603410000007600185482987846543_);}.st2{fill:#FFFFFF;}'
|
||||
}
|
||||
</style>
|
||||
<g>
|
||||
<linearGradient
|
||||
id="SVGID_1_"
|
||||
gradientUnits="userSpaceOnUse"
|
||||
x1="37.1511"
|
||||
y1="1.7925"
|
||||
x2="79.9092"
|
||||
y2="149.7319"
|
||||
>
|
||||
<stop offset="0" style={{ stopColor: '#EF1970' }} />
|
||||
<stop offset="0.1438" style={{ stopColor: '#F23B5C' }} />
|
||||
<stop offset="0.445" style={{ stopColor: '#F77D35' }} />
|
||||
<stop offset="0.6983" style={{ stopColor: '#FCAD18' }} />
|
||||
<stop offset="0.8909" style={{ stopColor: '#FECB07' }} />
|
||||
<stop offset="1" style={{ stopColor: '#FFD600' }} />
|
||||
</linearGradient>
|
||||
<path
|
||||
className="st0"
|
||||
d="M51.5,103.1L51.5,103.1C23.1,103.1,0,80,0,51.5v0C0,23.1,23.1,0,51.5,0h0c28.5,0,51.5,23.1,51.5,51.5v0C103.1,80,80,103.1,51.5,103.1z"
|
||||
/>
|
||||
<g>
|
||||
<defs>
|
||||
<path
|
||||
id="SVGID_00000170984886341847456420000000262070696033326467_"
|
||||
d="M51.5,103.1L51.5,103.1C23.1,103.1,0,80,0,51.5v0C0,23.1,23.1,0,51.5,0h0c28.5,0,51.5,23.1,51.5,51.5v0C103.1,80,80,103.1,51.5,103.1z"
|
||||
/>
|
||||
</defs>
|
||||
<clipPath id="SVGID_00000173159025839821803030000017583277320152650913_">
|
||||
<use
|
||||
xlinkHref="#SVGID_00000170984886341847456420000000262070696033326467_"
|
||||
style={{ overflow: 'visible' }}
|
||||
/>
|
||||
</clipPath>
|
||||
<g style={{ clipPath: 'url(#SVGID_00000173159025839821803030000017583277320152650913_)' }}>
|
||||
<g>
|
||||
<g>
|
||||
<path
|
||||
className="st2"
|
||||
d="M8.7,40.1c0.5-0.3,0.6-0.9,0.3-1.3c-0.3-0.4-0.9-0.6-1.3-0.3c-0.4,0.3-0.6,0.9-0.3,1.3C7.7,40.3,8.3,40.5,8.7,40.1z M64.8,15c0.5-0.3,0.6-0.8,0.3-1.3c-0.3-0.4-0.9-0.6-1.3-0.3c-0.4,0.3-0.6,0.9-0.3,1.3C63.8,15.1,64.4,15.3,64.8,15z M76.7,51.4c-0.1,0.6,0.2,1.2,0.8,1.3c0.6,0.1,1.2-0.2,1.3-0.8c0.1-0.6-0.2-1.2-0.8-1.3C77.4,50.5,76.9,50.8,76.7,51.4z M60.9,88.2c-0.4-0.2-0.8,0.1-1,0.6c-0.1,0.5,0.2,0.9,0.6,1c0.5,0.1,0.9-0.2,1-0.6C61.7,88.7,61.4,88.3,60.9,88.2z M15.1,20.2c0.3,0.1,0.6-0.1,0.6-0.4c0.1-0.3-0.1-0.6-0.4-0.6c-0.3,0-0.6,0.1-0.6,0.4C14.6,19.9,14.8,20.2,15.1,20.2z M18.3,70.3c-0.4,0.1-0.7,0.4-0.6,0.8c0.1,0.4,0.4,0.7,0.8,0.6c0.4,0,0.6-0.4,0.6-0.8C19,70.5,18.7,70.2,18.3,70.3z M85.5,36l-0.6,2.6l-2.3,1.1l2.6,0.6l1.1,2.3l0.6-2.6l2.3-1.1l-2.6-0.6L85.5,36z M51.3,18.7c-0.6,0.2-0.8,0.8-0.6,1.4c0.5,1.2,0.5,1.8,0.3,3c-0.1,0.6,0.3,1.2,0.9,1.3c0.1,0,0.1,0,0.2,0c0.5,0,1-0.4,1-0.9c0.4-1.6,0.2-2.7-0.4-4.2C52.6,18.7,51.9,18.5,51.3,18.7z M50.8,14.4c-0.5-1-0.9-1.4-1-1.5c-0.4-0.4-1.1-0.4-1.5,0c-0.4,0.4-0.4,1.1,0,1.5c0,0,0.2,0.2,0.6,1c0.2,0.4,0.6,0.6,1,0.6c0.1,0,0.3,0,0.5-0.1C50.9,15.6,51.1,14.9,50.8,14.4zM89.2,85.1c-1.3-5.8-3.1-10.9-6.1-18.5c-2-5.2-8.8-11.6-13.1-14.8c-1.6-1.2-1.7-3.4-0.3-4.9C74,42.9,81.6,35,84,30.8c1.6-2.9,4.7-8.5,4.9-13.3C89.2,14,88.7,9.9,84,8c-4.3-1.7-7.1,0.9-7.1,0.9c-3,2.1-3.9,7.7-6.1,13.3c-2.4,6.5-6.3,7.3-8.3,7.3c-1.9,0-0.7-2.1-5.4-15.6c-4.7-13.4-17-11-26.3-5.4c-11.8,7.1-6.6,22.1-3.6,31.9c-1.6,1.6-7.9,2.8-13.5,5.9c-3.5,1.9-6.5,3.1-9.5,5.5c-4.1,3.3-5.9,7-4.4,12.1c0.3,1.1,1.4,2.9,3.6,4.1c3.3,1.5,8.3-0.7,15.8-6.3c5.5-3.7,11.9-5.6,11.9-5.6s4.6,7,8.8,15.3c4.2,8.3-4.6,11-5.5,11c-1,0-14.8-1.3-11.6,10.4c3,11.6,19.9,7.5,28.5,1.8s6.5-24.2,6.5-24.2c8.4-1.3,11,7.6,11.8,12.1c0.8,4.5-1,12.4,7.5,12.6c1.2,0,2.4-0.2,3.5-0.5c4.6-1.1,7.2-3.4,8.3-5.8C89.4,87.6,89.5,86.3,89.2,85.1z M46.9,30.1c-8.6,3.2-12.7-1-13.2-8.8c-0.6-8.8,7.6-11,7.6-11c9.1-3,11.5,1.3,13.7,7.8C57,24.6,55.4,26.9,46.9,30.1z"
|
||||
/>
|
||||
</g>
|
||||
</g>
|
||||
</g>
|
||||
</g>
|
||||
</g>
|
||||
</svg>
|
||||
),
|
||||
[ICONS.ODYSEE_WHITE_TEXT]: (props: IconProps) => (
|
||||
<svg
|
||||
{...props}
|
||||
data-name="Layer 1"
|
||||
id="Layer_1"
|
||||
strokeWidth="0"
|
||||
viewBox="0 0 397 119.1"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
xmlnsXlink="http://www.w3.org/1999/xlink"
|
||||
>
|
||||
<defs>
|
||||
<style>
|
||||
{'.cls-1{fill:none;}.cls-2{fill:#fff;}.cls-3{fill:url(#linear-gradient);}.cls-4{clip-path:url(#clip-path);}'}
|
||||
</style>
|
||||
<linearGradient id="linear-gradient" x1="45.6" y1="9.82" x2="88.36" y2="157.76" gradientUnits="userSpaceOnUse">
|
||||
<stop offset="0" stopColor="#ef1970" />
|
||||
<stop offset="0.14" stopColor="#f23b5c" />
|
||||
<stop offset="0.45" stopColor="#f77d35" />
|
||||
<stop offset="0.7" stopColor="#fcad18" />
|
||||
<stop offset="0.89" stopColor="#fecb07" />
|
||||
<stop offset="1" stopColor="#ffd600" />
|
||||
</linearGradient>
|
||||
<clipPath id="clip-path">
|
||||
<rect x="8.45" y="8.03" width="103.05" height="103.05" rx="51.52" />
|
||||
</clipPath>
|
||||
</defs>
|
||||
<path
|
||||
className="cls-2"
|
||||
d="M216,36.55A105.13,105.13,0,0,0,214.51,25c-.21-1.11-.45-2.47-.78-4.44s-.61-3.46-.83-4.51-.45-2-.68-2.85A5,5,0,0,0,211,10.74a4.62,4.62,0,0,0-1.61-1,6.27,6.27,0,0,0-2-.28c-.78,0-3.16,0-4.16,1.74-.39.67-.74,1.81-.74,5.57a14.41,14.41,0,0,0,.14,2.48l.14,1.12a40.39,40.39,0,0,0,.89,5.22,2.86,2.86,0,0,0,.12.35,11.3,11.3,0,0,0,.15,1.36,12.27,12.27,0,0,0,.56,2.47,6.14,6.14,0,0,1,.3,1.78c.48,5.45.35,6.88.3,7.28a1.07,1.07,0,0,1-.48.07c-1.4,0-15.06,4-18.61,6.36a22.12,22.12,0,0,0-7.78,8C176.52,56.48,176,74.82,176,75c-.09,4.22.64,6.82,2.27,8.14l.32.35a18.94,18.94,0,0,0,11.85,6.2,88.44,88.44,0,0,0,14.48.73c1.79,0,3.48,0,5.06,0h.3l7.36-2.4-.24-14C217.36,67.55,216.89,46.57,216,36.55ZM207.2,74.16c-.11.88-.2,1.55-.27,2a4.85,4.85,0,0,1-.28,1c-.07.17-.13.29-.14.33l-.24.1a2.82,2.82,0,0,1-.8.15c-.42,0-1,0-1.84,0a45.33,45.33,0,0,1-9.91-1.43,30.77,30.77,0,0,1-5.88-1.77h0c-.8-1.88,1.22-16,6.72-20.09s8.27-4.54,9.65-4.11c.38.12,1.54.48,2.33,3,.2,1,.41,7.6.52,11.15.08,2.47.14,4.51.19,5.14A22.23,22.23,0,0,1,207.2,74.16Z"
|
||||
/>
|
||||
<path
|
||||
className="cls-2"
|
||||
d="M251.17,34.44A8.26,8.26,0,0,0,248.7,38l0,.06a41,41,0,0,1-2.6,5.89,10.94,10.94,0,0,0-1.38,4.79A4.41,4.41,0,0,1,244.4,50a5.3,5.3,0,0,1-.55,1.17l-.44-.28a26.83,26.83,0,0,1-2.5-2.09c-1-1-2.35-2.29-4-4-7.07-7.19-11.28-9.75-14.07-8.62-1.59.65-2.4,2.31-2.4,4.94,0,1.63.85,3.69,2.61,6.27a96.53,96.53,0,0,0,7.64,9.36c5.21,5.9,8.73,7.54,10.36,8.23a21.38,21.38,0,0,1-.37,4.4,45.35,45.35,0,0,1-1.89,5.06,42,42,0,0,0-2.5,6.39,20.24,20.24,0,0,0-1.06,5.49c0,2.11.3,3.41,1,4.22a3.19,3.19,0,0,0,2.57,1.06,5.87,5.87,0,0,0,1.21-.13,7.75,7.75,0,0,0,3-1.1,5.46,5.46,0,0,0,2.12-2.15c.18-.34.58-1.13,1.19-2.37s1-2.08,1.24-2.56a25,25,0,0,0,1.92-5.43c.7-2.58,1.34-5.32,1.88-8.11s1.44-6,2.48-9.67,2-6.73,2.85-9.09c1.16-3.07,2-5.52,2.56-7.5a19.84,19.84,0,0,0,.88-5.21,5.07,5.07,0,0,0-1.35-3.85C257,32.86,253.27,32.86,251.17,34.44Z"
|
||||
/>
|
||||
<path
|
||||
className="cls-2"
|
||||
d="M296.7,35.06a3.39,3.39,0,0,0-1.31-.87A5.37,5.37,0,0,0,294,33.8c-.33,0-.87-.08-1.61-.12s-1.39-.06-2-.08-1.56,0-2.75,0c-6,0-10.18.83-12.84,2.55a17.31,17.31,0,0,0-7.18,8.16c-1.41,3.3-2.13,7.74-2.13,13.17l-.12,10.68,11,3.6c3.51,1.15,5.37,1.87,6.35,2.3a15.28,15.28,0,0,1-2.6.73,24.58,24.58,0,0,1-5.24.57,38,38,0,0,0-4.87.21A4.88,4.88,0,0,0,267,76.75a4,4,0,0,0-1,2.93A5.37,5.37,0,0,0,268.22,84a11.22,11.22,0,0,0,4.94,2,26.55,26.55,0,0,0,4.73.4l1.2,0a25.46,25.46,0,0,0,6.49-1.14,20.68,20.68,0,0,0,5.84-2.8,13.33,13.33,0,0,0,3.76-3.92,10.08,10.08,0,0,0,1.06-5,9,9,0,0,0-3.14-7.37c-1.87-1.5-5.33-3-10.56-4.44-5.54-1.67-6.51-2.49-6.7-2.71s-.7-1.29.68-4.65a23.14,23.14,0,0,1,5.14-7.64c2.55-2.54,3.78-3.27,4.28-3.48s1.66-.46,4.33-.08c1,.15,1.77.25,2.27.3a9.47,9.47,0,0,0,1.76,0,4.44,4.44,0,0,0,1.61-.37,2.83,2.83,0,0,0,1.24-1.33,4,4,0,0,0,.42-1.58c0-.35,0-.87,0-1.57V37.65a4,4,0,0,0-.26-1.4A3.59,3.59,0,0,0,296.7,35.06Z"
|
||||
/>
|
||||
<path
|
||||
className="cls-2"
|
||||
d="M341.77,41.73a8.9,8.9,0,0,0-1-1.91,13,13,0,0,0-1.64-2l-1.61-1.68a19.65,19.65,0,0,0-5.45-4.2,16.56,16.56,0,0,0-6.49-1,19.81,19.81,0,0,0-11.31,3.24h0a30.8,30.8,0,0,0-6.52,5.73,17.93,17.93,0,0,0-3.4,6.7,45.67,45.67,0,0,0-1.29,9.6c-.57,10.37,1.22,18.06,5.31,22.88,3.78,4.44,9.71,6.69,17.69,6.69.81,0,1.64,0,2.49-.07l3.38-.25a21.33,21.33,0,0,0,2.43-.32,7.45,7.45,0,0,0,2-.56,3.81,3.81,0,0,0,1.33-1.14,3.5,3.5,0,0,0,.74-1.75,14.71,14.71,0,0,0,.07-1.59c0-1.39-.17-3.34-1.63-4.21-.67-.39-1.77-.68-5.28-.24a16.13,16.13,0,0,1-9-1.7,13.27,13.27,0,0,1-6.38-5.67l-.84-1.58,5.84-.64a34.24,34.24,0,0,0,8-1.56,27.41,27.41,0,0,0,6.56-3.33c1.4-1,2.42-1.75,3.07-2.31a8.54,8.54,0,0,0,2-2.56,9.49,9.49,0,0,0,1.05-3.07c.13-.87.26-2.23.37-4.08q.12-1.87.12-3a18.62,18.62,0,0,0-.15-2.37A11.51,11.51,0,0,0,341.77,41.73ZM316.33,53.11l-1.68-1.74,4.24-4.11A32,32,0,0,1,323,43.63a20.31,20.31,0,0,1,2-1.27,5,5,0,0,1,1.52.92,18.22,18.22,0,0,1,2.93,2.8l2.54,3-2.26,2a14.46,14.46,0,0,1-3.48,2.14,17.43,17.43,0,0,1-4,1.4,9.45,9.45,0,0,1-3.66.14A5.19,5.19,0,0,1,316.33,53.11Z"
|
||||
/>
|
||||
<path
|
||||
className="cls-2"
|
||||
d="M387.35,46.9a10.38,10.38,0,0,0-.43-2,7.76,7.76,0,0,0-1-1.92,12.53,12.53,0,0,0-1.42-1.8l-1.82-1.91a19.86,19.86,0,0,0-5.46-4.2,16.66,16.66,0,0,0-6.48-1,19.84,19.84,0,0,0-11.32,3.24h0A31.34,31.34,0,0,0,352.91,43a18.23,18.23,0,0,0-3.4,6.7,45.1,45.1,0,0,0-1.28,9.6c-.57,10.37,1.21,18.07,5.31,22.88,3.77,4.44,9.71,6.69,17.68,6.69.81,0,1.64,0,2.49-.07l3.39-.25a19.3,19.3,0,0,0,2.43-.32,7.71,7.71,0,0,0,2-.55,3.82,3.82,0,0,0,1.34-1.14,3.54,3.54,0,0,0,.74-1.76,14.71,14.71,0,0,0,.07-1.59c0-1.39-.17-3.34-1.64-4.21-.67-.39-1.77-.68-5.27-.24a16.09,16.09,0,0,1-9-1.7,13.29,13.29,0,0,1-6.37-5.67l-.85-1.57,5.85-.65a34.15,34.15,0,0,0,8-1.56,27.23,27.23,0,0,0,6.56-3.33c1.4-1,2.43-1.75,3.07-2.3a8.82,8.82,0,0,0,2-2.56,9.87,9.87,0,0,0,1-3.08c.13-.87.26-2.23.37-4.08.08-1.25.11-2.24.11-3A18.62,18.62,0,0,0,387.35,46.9Zm-25.86,9.34-1.68-1.74L364,50.39a33.45,33.45,0,0,1,4.15-3.63,18.65,18.65,0,0,1,2-1.26,5,5,0,0,1,1.52.91,18.17,18.17,0,0,1,2.92,2.8l2.55,3-2.27,2a15.16,15.16,0,0,1-3.47,2.14,17.83,17.83,0,0,1-4,1.39,9.23,9.23,0,0,1-3.66.14A5.08,5.08,0,0,1,361.49,56.24Z"
|
||||
/>
|
||||
<path
|
||||
className="cls-2"
|
||||
d="M135.65,41.29a21.51,21.51,0,0,1,5.44-1,82,82,0,0,1,8.25-.4c4.56,0,7.65.16,9.28.62A14.23,14.23,0,0,1,164.13,44a16.32,16.32,0,0,1,3.68,5.32,31.66,31.66,0,0,1,1.73,8.12,48.43,48.43,0,0,1-.46,15.29q-1.43,7.38-4.3,9a60,60,0,0,0-7.43,5.2,13.3,13.3,0,0,1-5,2.69,22.19,22.19,0,0,1-6.71-.09,23.84,23.84,0,0,1-7.13-2.26A28.75,28.75,0,0,1,132,82.05q-1.89-1.86-2.7-2.7a14.72,14.72,0,0,1-1.73-2.23A11.59,11.59,0,0,1,126.4,75a15.75,15.75,0,0,1-.56-2.61,22.94,22.94,0,0,1-.29-3.4V64.15Q125.55,45.13,135.65,41.29Zm20,8.79q-4.53-4.3-5.66-4.3c-1.62,0-3.68,1-6.19,2.83a25.06,25.06,0,0,0-6.07,6.2q-3.8,5.53-3.42,10t5.1,9.61l5.23,5.67,6.41-2.93A17.64,17.64,0,0,0,159.5,70a14.09,14.09,0,0,0,1.71-10A18.78,18.78,0,0,0,155.67,50.08Z"
|
||||
/>
|
||||
<rect className="cls-3" x="8.45" y="8.03" width="103.05" height="103.05" rx="51.52" />
|
||||
<g className="cls-4">
|
||||
<path
|
||||
className="cls-2"
|
||||
d="M17.12,48.17a.9.9,0,0,0,.31-1.31,1,1,0,0,0-1.32-.3,1,1,0,0,0,1,1.61ZM73.24,23a.88.88,0,0,0,.3-1.32,1,1,0,0,0-1.31-.3,1,1,0,0,0-.3,1.31A1,1,0,0,0,73.24,23ZM85.17,59.4a1.09,1.09,0,1,0,1.32-.81A1.13,1.13,0,0,0,85.17,59.4ZM69.4,96.2c-.41-.2-.81.1-1,.61a.83.83,0,1,0,1-.61Zm-45.89-68a.51.51,0,1,0,.2-1c-.3,0-.61.1-.61.4A.45.45,0,0,0,23.51,28.19Zm3.22,50.12c-.41.1-.71.4-.61.81a.69.69,0,0,0,.81.6c.4,0,.61-.4.61-.81A.69.69,0,0,0,26.73,78.31ZM94,44l-.61,2.63L91,47.77l2.62.61,1.12,2.32.6-2.63L97.71,47l-2.63-.61ZM59.79,26.74a1,1,0,0,0-.6,1.41,4.59,4.59,0,0,1,.3,3,1.14,1.14,0,0,0,.91,1.31h.2a1,1,0,0,0,1-.91,6.14,6.14,0,0,0-.4-4.24A1,1,0,0,0,59.79,26.74Zm-.5-4.35a6,6,0,0,0-1-1.52,1.11,1.11,0,0,0-1.52,0,1.09,1.09,0,0,0,0,1.52,4.6,4.6,0,0,1,.61,1,1.18,1.18,0,0,0,1.51.51A1.15,1.15,0,0,0,59.29,22.39ZM97.66,93.14a128,128,0,0,0-6-18.49C89.59,69.43,82.85,63,78.5,59.8A3.16,3.16,0,0,1,78.19,55C82.44,50.9,90,43,92.45,38.87c1.6-2.92,4.75-8.46,4.89-13.26.31-3.57-.18-7.7-4.91-9.59a6.9,6.9,0,0,0-7.14.92c-3,2.06-4,7.7-6.07,13.32-2.44,6.48-6.28,7.3-8.31,7.3s-.7-2.14-5.35-15.59-17-11-26.29-5.44c-11.83,7.07-6.58,22.14-3.64,31.85C34,50,27.74,51.21,22.08,54.24c-3.52,1.89-6.53,3.11-9.47,5.47-4.09,3.29-5.86,7-4.44,12.06a7.22,7.22,0,0,0,3.58,4.09c3.34,1.52,8.26-.69,15.79-6.35A46.19,46.19,0,0,1,39.47,64s4.55,7,8.8,15.27-4.56,11-5.47,11S28,88.92,31.18,100.65s19.92,7.48,28.51,1.82,6.47-24.16,6.47-24.16C74.55,77,77.18,85.89,78,90.44s-1,12.44,7.48,12.64a13.28,13.28,0,0,0,3.54-.51c4.58-1.06,7.23-3.36,8.32-5.81A5.84,5.84,0,0,0,97.66,93.14Zm-42.32-55c-8.59,3.24-12.74-1-13.24-8.79-.61-8.8,7.58-11,7.58-11,9.1-3,11.53,1.31,13.65,7.78S63.84,34.93,55.34,38.16Z"
|
||||
/>
|
||||
</g>
|
||||
</svg>
|
||||
),
|
||||
[ICONS.ODYSEE_DARK_TEXT]: (props: IconProps) => (
|
||||
<svg
|
||||
{...props}
|
||||
data-name="Layer 1"
|
||||
id="Layer_1"
|
||||
strokeWidth="0"
|
||||
viewBox="0 0 397 119.1"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
xmlnsXlink="http://www.w3.org/1999/xlink"
|
||||
>
|
||||
<defs>
|
||||
<style>
|
||||
{'.cls-1{fill:none;}.cls-2{fill:url(#linear-gradient);}.cls-3{clip-path:url(#clip-path);}.cls-4{fill:#fff;}'}
|
||||
</style>
|
||||
<linearGradient id="linear-gradient" x1="45.6" y1="9.82" x2="88.36" y2="157.76" gradientUnits="userSpaceOnUse">
|
||||
<stop offset="0" stopColor="#ef1970" />
|
||||
<stop offset="0.14" stopColor="#f23b5c" />
|
||||
<stop offset="0.45" stopColor="#f77d35" />
|
||||
<stop offset="0.7" stopColor="#fcad18" />
|
||||
<stop offset="0.89" stopColor="#fecb07" />
|
||||
<stop offset="1" stopColor="#ffd600" />
|
||||
</linearGradient>
|
||||
<clipPath id="clip-path">
|
||||
<rect className="cls-1" x="8.45" y="8.03" width="103.05" height="103.05" rx="51.52" />
|
||||
</clipPath>
|
||||
</defs>
|
||||
<path d="M216,36.55A105.13,105.13,0,0,0,214.51,25c-.21-1.11-.45-2.47-.78-4.44s-.61-3.46-.83-4.51-.45-2-.68-2.85A5,5,0,0,0,211,10.74a4.62,4.62,0,0,0-1.61-1,6.27,6.27,0,0,0-2-.28c-.78,0-3.16,0-4.16,1.74-.39.67-.74,1.81-.74,5.57a14.41,14.41,0,0,0,.14,2.48l.14,1.12a40.39,40.39,0,0,0,.89,5.22,2.86,2.86,0,0,0,.12.35,11.3,11.3,0,0,0,.15,1.36,12.27,12.27,0,0,0,.56,2.47,6.14,6.14,0,0,1,.3,1.78c.48,5.45.35,6.88.3,7.28a1.07,1.07,0,0,1-.48.07c-1.4,0-15.06,4-18.61,6.36a22.12,22.12,0,0,0-7.78,8C176.52,56.48,176,74.82,176,75c-.09,4.22.64,6.82,2.27,8.14l.32.35a18.94,18.94,0,0,0,11.85,6.2,88.44,88.44,0,0,0,14.48.73c1.79,0,3.48,0,5.06,0h.3l7.36-2.4-.24-14C217.36,67.55,216.89,46.57,216,36.55ZM207.2,74.16c-.11.88-.2,1.55-.27,2a4.85,4.85,0,0,1-.28,1c-.07.17-.13.29-.14.33l-.24.1a2.82,2.82,0,0,1-.8.15c-.42,0-1,0-1.84,0a45.33,45.33,0,0,1-9.91-1.43,30.77,30.77,0,0,1-5.88-1.77h0c-.8-1.88,1.22-16,6.72-20.09s8.27-4.54,9.65-4.11c.38.12,1.54.48,2.33,3,.2,1,.41,7.6.52,11.15.08,2.47.14,4.51.19,5.14A22.23,22.23,0,0,1,207.2,74.16Z" />
|
||||
<path d="M251.17,34.44A8.26,8.26,0,0,0,248.7,38l0,.06a41,41,0,0,1-2.6,5.89,10.94,10.94,0,0,0-1.38,4.79A4.41,4.41,0,0,1,244.4,50a5.3,5.3,0,0,1-.55,1.17l-.44-.28a26.83,26.83,0,0,1-2.5-2.09c-1-1-2.35-2.29-4-4-7.07-7.19-11.28-9.75-14.07-8.62-1.59.65-2.4,2.31-2.4,4.94,0,1.63.85,3.69,2.61,6.27a96.53,96.53,0,0,0,7.64,9.36c5.21,5.9,8.73,7.54,10.36,8.23a21.38,21.38,0,0,1-.37,4.4,45.35,45.35,0,0,1-1.89,5.06,42,42,0,0,0-2.5,6.39,20.24,20.24,0,0,0-1.06,5.49c0,2.11.3,3.41,1,4.22a3.19,3.19,0,0,0,2.57,1.06,5.87,5.87,0,0,0,1.21-.13,7.75,7.75,0,0,0,3-1.1,5.46,5.46,0,0,0,2.12-2.15c.18-.34.58-1.13,1.19-2.37s1-2.08,1.24-2.56a25,25,0,0,0,1.92-5.43c.7-2.58,1.34-5.32,1.88-8.11s1.44-6,2.48-9.67,2-6.73,2.85-9.09c1.16-3.07,2-5.52,2.56-7.5a19.84,19.84,0,0,0,.88-5.21,5.07,5.07,0,0,0-1.35-3.85C257,32.86,253.27,32.86,251.17,34.44Z" />
|
||||
<path d="M296.7,35.06a3.39,3.39,0,0,0-1.31-.87A5.37,5.37,0,0,0,294,33.8c-.33,0-.87-.08-1.61-.12s-1.39-.06-2-.08-1.56,0-2.75,0c-6,0-10.18.83-12.84,2.55a17.31,17.31,0,0,0-7.18,8.16c-1.41,3.3-2.13,7.74-2.13,13.17l-.12,10.68,11,3.6c3.51,1.15,5.37,1.87,6.35,2.3a15.28,15.28,0,0,1-2.6.73,24.58,24.58,0,0,1-5.24.57,38,38,0,0,0-4.87.21A4.88,4.88,0,0,0,267,76.75a4,4,0,0,0-1,2.93A5.37,5.37,0,0,0,268.22,84a11.22,11.22,0,0,0,4.94,2,26.55,26.55,0,0,0,4.73.4l1.2,0a25.46,25.46,0,0,0,6.49-1.14,20.68,20.68,0,0,0,5.84-2.8,13.33,13.33,0,0,0,3.76-3.92,10.08,10.08,0,0,0,1.06-5,9,9,0,0,0-3.14-7.37c-1.87-1.5-5.33-3-10.56-4.44-5.54-1.67-6.51-2.49-6.7-2.71s-.7-1.29.68-4.65a23.14,23.14,0,0,1,5.14-7.64c2.55-2.54,3.78-3.27,4.28-3.48s1.66-.46,4.33-.08c1,.15,1.77.25,2.27.3a9.47,9.47,0,0,0,1.76,0,4.44,4.44,0,0,0,1.61-.37,2.83,2.83,0,0,0,1.24-1.33,4,4,0,0,0,.42-1.58c0-.35,0-.87,0-1.57V37.65a4,4,0,0,0-.26-1.4A3.59,3.59,0,0,0,296.7,35.06Z" />
|
||||
<path d="M341.77,41.73a8.9,8.9,0,0,0-1-1.91,13,13,0,0,0-1.64-2l-1.61-1.68a19.65,19.65,0,0,0-5.45-4.2,16.56,16.56,0,0,0-6.49-1,19.81,19.81,0,0,0-11.31,3.24h0a30.8,30.8,0,0,0-6.52,5.73,17.93,17.93,0,0,0-3.4,6.7,45.67,45.67,0,0,0-1.29,9.6c-.57,10.37,1.22,18.06,5.31,22.88,3.78,4.44,9.71,6.69,17.69,6.69.81,0,1.64,0,2.49-.07l3.38-.25a21.33,21.33,0,0,0,2.43-.32,7.45,7.45,0,0,0,2-.56,3.81,3.81,0,0,0,1.33-1.14,3.5,3.5,0,0,0,.74-1.75,14.71,14.71,0,0,0,.07-1.59c0-1.39-.17-3.34-1.63-4.21-.67-.39-1.77-.68-5.28-.24a16.13,16.13,0,0,1-9-1.7,13.27,13.27,0,0,1-6.38-5.67l-.84-1.58,5.84-.64a34.24,34.24,0,0,0,8-1.56,27.41,27.41,0,0,0,6.56-3.33c1.4-1,2.42-1.75,3.07-2.31a8.54,8.54,0,0,0,2-2.56,9.49,9.49,0,0,0,1.05-3.07c.13-.87.26-2.23.37-4.08q.12-1.87.12-3a18.62,18.62,0,0,0-.15-2.37A11.51,11.51,0,0,0,341.77,41.73ZM316.33,53.11l-1.68-1.74,4.24-4.11A32,32,0,0,1,323,43.63a20.31,20.31,0,0,1,2-1.27,5,5,0,0,1,1.52.92,18.22,18.22,0,0,1,2.93,2.8l2.54,3-2.26,2a14.46,14.46,0,0,1-3.48,2.14,17.43,17.43,0,0,1-4,1.4,9.45,9.45,0,0,1-3.66.14A5.19,5.19,0,0,1,316.33,53.11Z" />
|
||||
<path d="M387.35,46.9a10.38,10.38,0,0,0-.43-2,7.76,7.76,0,0,0-1-1.92,12.53,12.53,0,0,0-1.42-1.8l-1.82-1.91a19.86,19.86,0,0,0-5.46-4.2,16.66,16.66,0,0,0-6.48-1,19.84,19.84,0,0,0-11.32,3.24h0A31.34,31.34,0,0,0,352.91,43a18.23,18.23,0,0,0-3.4,6.7,45.1,45.1,0,0,0-1.28,9.6c-.57,10.37,1.21,18.07,5.31,22.88,3.77,4.44,9.71,6.69,17.68,6.69.81,0,1.64,0,2.49-.07l3.39-.25a19.3,19.3,0,0,0,2.43-.32,7.71,7.71,0,0,0,2-.55,3.82,3.82,0,0,0,1.34-1.14,3.54,3.54,0,0,0,.74-1.76,14.71,14.71,0,0,0,.07-1.59c0-1.39-.17-3.34-1.64-4.21-.67-.39-1.77-.68-5.27-.24a16.09,16.09,0,0,1-9-1.7,13.29,13.29,0,0,1-6.37-5.67l-.85-1.57,5.85-.65a34.15,34.15,0,0,0,8-1.56,27.23,27.23,0,0,0,6.56-3.33c1.4-1,2.43-1.75,3.07-2.3a8.82,8.82,0,0,0,2-2.56,9.87,9.87,0,0,0,1-3.08c.13-.87.26-2.23.37-4.08.08-1.25.11-2.24.11-3A18.62,18.62,0,0,0,387.35,46.9Zm-25.86,9.34-1.68-1.74L364,50.39a33.45,33.45,0,0,1,4.15-3.63,18.65,18.65,0,0,1,2-1.26,5,5,0,0,1,1.52.91,18.17,18.17,0,0,1,2.92,2.8l2.55,3-2.27,2a15.16,15.16,0,0,1-3.47,2.14,17.83,17.83,0,0,1-4,1.39,9.23,9.23,0,0,1-3.66.14A5.08,5.08,0,0,1,361.49,56.24Z" />
|
||||
<path d="M135.65,41.29a21.51,21.51,0,0,1,5.44-1,82,82,0,0,1,8.25-.4c4.56,0,7.65.16,9.28.62A14.23,14.23,0,0,1,164.13,44a16.32,16.32,0,0,1,3.68,5.32,31.66,31.66,0,0,1,1.73,8.12,48.43,48.43,0,0,1-.46,15.29q-1.43,7.38-4.3,9a60,60,0,0,0-7.43,5.2,13.3,13.3,0,0,1-5,2.69,22.19,22.19,0,0,1-6.71-.09,23.84,23.84,0,0,1-7.13-2.26A28.75,28.75,0,0,1,132,82.05q-1.89-1.86-2.7-2.7a14.72,14.72,0,0,1-1.73-2.23A11.59,11.59,0,0,1,126.4,75a15.75,15.75,0,0,1-.56-2.61,22.94,22.94,0,0,1-.29-3.4V64.15Q125.55,45.13,135.65,41.29Zm20,8.79q-4.53-4.3-5.66-4.3c-1.62,0-3.68,1-6.19,2.83a25.06,25.06,0,0,0-6.07,6.2q-3.8,5.53-3.42,10t5.1,9.61l5.23,5.67,6.41-2.93A17.64,17.64,0,0,0,159.5,70a14.09,14.09,0,0,0,1.71-10A18.78,18.78,0,0,0,155.67,50.08Z" />
|
||||
<rect className="cls-2" x="8.45" y="8.03" width="103.05" height="103.05" rx="51.52" />
|
||||
<g className="cls-3">
|
||||
<path
|
||||
className="cls-4"
|
||||
d="M17.12,48.17a.9.9,0,0,0,.31-1.31,1,1,0,0,0-1.32-.3,1,1,0,0,0,1,1.61ZM73.24,23a.88.88,0,0,0,.3-1.32,1,1,0,0,0-1.31-.3,1,1,0,0,0-.3,1.31A1,1,0,0,0,73.24,23ZM85.17,59.4a1.09,1.09,0,1,0,1.32-.81A1.13,1.13,0,0,0,85.17,59.4ZM69.4,96.2c-.41-.2-.81.1-1,.61a.83.83,0,1,0,1-.61Zm-45.89-68a.51.51,0,1,0,.2-1c-.3,0-.61.1-.61.4A.45.45,0,0,0,23.51,28.19Zm3.22,50.12c-.41.1-.71.4-.61.81a.69.69,0,0,0,.81.6c.4,0,.61-.4.61-.81A.69.69,0,0,0,26.73,78.31ZM94,44l-.61,2.63L91,47.77l2.62.61,1.12,2.32.6-2.63L97.71,47l-2.63-.61ZM59.29,22.39a6,6,0,0,0-1-1.52,1.11,1.11,0,0,0-1.52,0,1.09,1.09,0,0,0,0,1.52,4.6,4.6,0,0,1,.61,1,1.18,1.18,0,0,0,1.51.51A1.15,1.15,0,0,0,59.29,22.39Zm.5,4.35a1,1,0,0,0-.6,1.41,4.59,4.59,0,0,1,.3,3,1.14,1.14,0,0,0,.91,1.31h.2a1,1,0,0,0,1-.91,6.14,6.14,0,0,0-.4-4.24A1,1,0,0,0,59.79,26.74Zm37.87,66.4a128,128,0,0,0-6-18.49C89.59,69.43,82.85,63,78.5,59.8A3.16,3.16,0,0,1,78.19,55C82.44,50.9,90,43,92.45,38.87c1.6-2.92,4.75-8.46,4.89-13.26.31-3.57-.18-7.7-4.91-9.59a6.9,6.9,0,0,0-7.14.92c-3,2.06-4,7.7-6.07,13.32-2.44,6.48-6.28,7.3-8.31,7.3s-.7-2.14-5.35-15.59-17-11-26.29-5.44c-11.83,7.07-6.58,22.14-3.64,31.85C34,50,27.74,51.21,22.08,54.24c-3.52,1.89-6.53,3.11-9.47,5.47-4.09,3.29-5.86,7-4.44,12.06a7.22,7.22,0,0,0,3.58,4.09c3.34,1.52,8.26-.69,15.79-6.35A46.19,46.19,0,0,1,39.47,64s4.55,7,8.8,15.27-4.56,11-5.47,11S28,88.92,31.18,100.65s19.92,7.48,28.51,1.82,6.47-24.16,6.47-24.16C74.55,77,77.18,85.89,78,90.44s-1,12.44,7.48,12.64a13.28,13.28,0,0,0,3.54-.51c4.58-1.06,7.23-3.36,8.32-5.81A5.84,5.84,0,0,0,97.66,93.14Zm-42.32-55c-8.59,3.24-12.74-1-13.24-8.79-.61-8.8,7.58-11,7.58-11,9.1-3,11.53,1.31,13.65,7.78S63.84,34.93,55.34,38.16Z"
|
||||
/>
|
||||
</g>
|
||||
</svg>
|
||||
),
|
||||
[ICONS.LBC]: (props: IconProps) => {
|
||||
|
|
|
|||
|
|
@ -1,5 +1,4 @@
|
|||
// @flow
|
||||
import { LOGO_TITLE, LOGO, LOGO_WHITE_TEXT, LOGO_DARK_TEXT } from 'config';
|
||||
import { useIsMobile } from 'effects/use-screensize';
|
||||
import * as ICONS from 'constants/icons';
|
||||
import Icon from 'component/common/icon';
|
||||
|
|
@ -16,31 +15,13 @@ export default function Logo(props: Props) {
|
|||
const isMobile = useIsMobile();
|
||||
const isLightTheme = currentTheme === 'light';
|
||||
|
||||
const defaultWithLabel = (
|
||||
<>
|
||||
<Icon icon={ICONS.LBRY} />
|
||||
<div className="button__label">{LOGO_TITLE}</div>
|
||||
</>
|
||||
);
|
||||
|
||||
if (LOGO_WHITE_TEXT && (type === 'embed' || type === 'embed-ended')) {
|
||||
return <img className="embed__overlay-logo" src={LOGO_WHITE_TEXT} />;
|
||||
if (type === 'embed' || type === 'embed-ended') {
|
||||
return <Icon className="embed__overlay-logo" icon={ICONS.ODYSEE_WHITE_TEXT} />;
|
||||
}
|
||||
|
||||
if (type === 'small' || isMobile) {
|
||||
return <img className="header__navigation-logo" src={LOGO} height={200} width={200} />;
|
||||
return <Icon className="header__logo" icon={ICONS.ODYSEE_LOGO} />;
|
||||
}
|
||||
|
||||
if (LOGO_WHITE_TEXT && LOGO_DARK_TEXT) {
|
||||
return (
|
||||
<img
|
||||
className="header__navigation-logo"
|
||||
height={300}
|
||||
width={1000}
|
||||
src={isLightTheme ? LOGO_DARK_TEXT : LOGO_WHITE_TEXT}
|
||||
/>
|
||||
);
|
||||
}
|
||||
|
||||
return defaultWithLabel;
|
||||
return <Icon className="header__logo" icon={isLightTheme ? ICONS.ODYSEE_DARK_TEXT : ICONS.ODYSEE_WHITE_TEXT} />;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -2,7 +2,7 @@
|
|||
// https://github.com/carmelopullara/react-feather
|
||||
// Note: Icons should be named for their purpose, rather than the actual icon.
|
||||
// The goal being to reduce multiple uses of the same icon for different purposes.
|
||||
//
|
||||
|
||||
export const REWARDS = 'Award';
|
||||
export const LOCAL = 'Folder';
|
||||
export const ALERT = 'AlertCircle';
|
||||
|
|
@ -183,3 +183,6 @@ export const EMOJI = 'Emoji';
|
|||
export const STICKER = 'Sticker';
|
||||
export const EDUCATION = 'Education';
|
||||
export const POP_CULTURE = 'Pop Culture';
|
||||
export const ODYSEE_LOGO = 'OdyseeLogo';
|
||||
export const ODYSEE_WHITE_TEXT = 'OdyseeLogoWhiteText';
|
||||
export const ODYSEE_DARK_TEXT = 'OdyseeLogoDarkText';
|
||||
|
|
|
|||
|
|
@ -101,11 +101,15 @@
|
|||
display: flex;
|
||||
}
|
||||
|
||||
.header__navigation-logo {
|
||||
.header__logo {
|
||||
height: var(--height-button);
|
||||
max-width: -webkit-fit-content;
|
||||
max-width: -moz-fit-content;
|
||||
max-width: fit-content;
|
||||
|
||||
@media (max-width: $breakpoint-small) {
|
||||
height: var(--height-button-mobile);
|
||||
}
|
||||
}
|
||||
|
||||
.header__navigationItem {
|
||||
|
|
@ -225,14 +229,11 @@
|
|||
@extend .header__navigationItem;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
margin-left: var(--spacing-m);
|
||||
margin-right: var(--spacing-m);
|
||||
margin: 0 var(--spacing-s);
|
||||
color: var(--color-text);
|
||||
|
||||
// move to lbry theme?
|
||||
.lbry-icon {
|
||||
height: var(--height-button);
|
||||
width: var(--height-button);
|
||||
@media (min-width: $breakpoint-small) {
|
||||
width: 150px;
|
||||
}
|
||||
|
||||
@media (max-width: $breakpoint-small) {
|
||||
|
|
|
|||
Loading…
Reference in a new issue