frst-components 0.20.0

package/src/components/modal/modalVideo/index.tsx

@@ -0,0 +1,129 @@
+import { Grid, Box, Modal, Stack } from '@mui/material'
+import style from './modalVideo.module.css'
+import { CloseIcon } from '@shared/icons'
+import Rating from '@components/EBR/rating'
+import { useEffect, useMemo, useState } from 'react'
+import Video from '@components/LXP/video'
+
+interface ModalVideoProps {
+  open: boolean
+  recommendationId?: string
+  title?: string
+  nameVideo: string
+  videoUrl: string
+  timeBegin: number
+  language?: 'pt-BR' | 'pt-PT' | 'en-US' | 'es'
+  handleClose: () => void
+  handleChangeRating?: (recommendationId: string, rating: number) => void
+  showRating?: boolean
+  rating?: number
+  ratingDescription?: string
+  style?: React.CSSProperties
+}
+
+export default function ModalVideo(props: ModalVideoProps) {
+  const [IdVideo, setIdVideo] = useState('')
+  const [HashVideo, setHashVideo] = useState('')
+  const [currentRating, setCurrentRating] = useState(props.rating)
+
+  const getInformationsURL = () => {
+    let parts = props?.videoUrl.split('/')
+    let hash = parts[parts.length - 1]
+    let dataVideo = hash.split('?h=')
+    setIdVideo(dataVideo[0])
+    setHashVideo(dataVideo[1])
+  }
+
+  const convertTimeToString = (time: number) => {
+    let temp = time
+    let hora = Math.trunc(time / 3600)
+
+    temp -= hora * 3600
+    let min = Math.trunc(temp / 60)
+
+    temp -= min * 60
+
+    if (hora > 0) {
+      return `${hora}h${min}m${temp}s`
+    } else {
+      return `${min}m${temp}s`
+    }
+  }
+
+  useEffect(() => {
+    getInformationsURL()     
+    setCurrentRating(props.rating)   
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+  }, [props.videoUrl])
+
+  useEffect(() => {
+    if (props.rating) {
+      setCurrentRating(props.rating)
+    }
+  }, [props.rating])
+
+  return (
+    <Modal open={props.open} onClose={props.handleClose} >
+      <Box
+      id={`modal-video${(props.title? props.title : '').replace(/( )+/g, '')}`}
+        className={style.modalBox}
+        style={{
+          top: '50%',
+          left: '50%',
+          transform: 'translate(-50%, -50%)',
+          height: props.showRating ? '80%' : '400px',
+          maxHeight: props.showRating ? '620px' : '400px',
+          overflowY: 'auto'
+        }}
+      >
+        <Stack flexDirection="row" alignItems="flex-start" justifyContent="space-between" px={3}>
+          <Box textAlign="left" style={{paddingLeft: 6, }}>{props.title}</Box>
+          <Box className={style.fechar} onClick={props.handleClose}>
+            <CloseIcon />
+          </Box>
+        </Stack>
+
+        <Box p={3}>
+          {props.videoUrl && (
+            <Box width="100%">
+              <Video
+                videoId={IdVideo}
+                privateHash={HashVideo}
+                autoplay={1}
+                controls={1}
+                keyboard={1}
+                timeStart={convertTimeToString(props.timeBegin)}
+                showSpeedControl={1}
+                width={620}
+                height={400}
+              />
+            </Box>
+          )}
+
+          {props.showRating && (
+            <Box style={{ display: 'flex', justifyContent: 'flex-end' }}>
+              <Box style={{ maxWidth: 240 }}>
+                <p style={{ textAlign: 'left', fontSize: 14, fontWeight: 400 }}>{props.ratingDescription}</p>
+                <Box style={{ display: 'flex', justifyContent: 'flex-end' }}>
+                  <Rating
+                    isVisibleNumberRating
+                    marginStars="3.5px"
+                    orientation="horizontal"
+                    qtdStars={5}
+                    rating={currentRating}
+                    sizeStars={25}
+                    handleRating={(e) => {
+                      setCurrentRating(e)
+                      props.handleChangeRating(props.recommendationId, e)
+                    }}
+                    disabled={false}
+                  />
+                </Box>
+              </Box>
+            </Box>
+          )}
+        </Box>
+      </Box>
+    </Modal>
+  )
+}

package/src/components/modal/modalVideo/modalVideo.module.css

@@ -0,0 +1,27 @@
+.modalBox {
+  background-color: #fff;
+  max-width: 670px;
+  max-height: 80%;
+  padding-top: 20px;
+  position: relative;
+  border-radius: 10px;
+  font-family: 'Work Sans';
+}
+
+.fechar {
+  font-size: 13px;
+  color: #222222;
+}
+
+.container {
+  overflow: auto;
+  width: 100%;
+
+  display: flex;
+  justify-content: flex-start;
+  align-items: center;
+  flex-direction: column;
+  flex-wrap: noWrap;
+
+  margin-top: 10px;
+}

package/src/components/modal/modalVideo/modalVideo.stories.tsx

@@ -0,0 +1,41 @@
+import React from 'react'
+
+import ModalVideo from './index'
+
+// More on default export: https://storybook.js.org/docs/react/writing-stories/introduction#default-export
+export default {
+  title: 'Modal/ModalVideo',
+  component: ModalVideo
+}
+
+// More on component templates: https://storybook.js.org/docs/react/writing-stories/introduction#using-args
+
+const Template = (args) => {
+  return <ModalVideo {...args} />
+}
+
+export const ModalDefaultVideo = Template.bind({})
+ModalDefaultVideo.args = {
+  open: false,
+  handleClose: () => {},
+  title: 'Cultura da Inovação',
+  style: { textAlign: 'center', padding: 20 },
+  language: 'en-US',
+  videoUrl: 'https://player.vimeo.com/video/786061124?h=e346220ada&amp;badge=0&amp'
+}
+
+export const ModalVideoRating = Template.bind({})
+
+ModalVideoRating.args = {
+  open: false,
+  handleClose: () => {},
+  title: 'Cultura da Inovação',
+  style: { textAlign: 'center', padding: 20 },
+  language: 'en-US',
+  videoUrl: 'https://player.vimeo.com/video/786061124?h=e346220ada&amp;badge=0&amp',
+  showRating: true,
+  rating: 1,
+  ratingDescription: 'Avalie abaixo o quanto isso foi útil para você.',
+  recommendationId: '123',
+  handleChangeRating: (recommendationId, rating) => alert(`RecomendationId:${recommendationId} and Rating:${rating}`)
+}

package/src/components/modal/statusProblema/fecharIcon.tsx

@@ -0,0 +1,18 @@
+  ///-----------------------------------------
+  /// Componente
+  
+  /**
+   * 
+   * @componente 
+   */
+   export default function FecharIcon() {
+  
+    return (
+      <>    
+        <svg width="13" height="11" viewBox="0 0 13 11" fill="none" xmlns="http://www.w3.org/2000/svg">
+        <path d="M11.8346 0.630371L1.16797 9.43511" stroke="#222222" strokeWidth="1.2" strokeLinecap="round" strokeLinejoin="round"/>
+        <path d="M1.16797 0.630371L11.8346 9.43511" stroke="#222222" strokeWidth="1.2" strokeLinecap="round" strokeLinejoin="round"/>
+        </svg>
+      </>
+    )
+  }

package/src/components/modal/statusProblema/index.tsx

@@ -0,0 +1,124 @@
+import { useState, useLayoutEffect } from 'react'
+import { Box, Modal } from '@mui/material'
+import style from './statusProblema.module.css'
+import Button from '../../buttons/index'
+import Avatar from '../../avatar/index'
+import problemaFRST from './problemaFRST.png'   
+import {
+    StatusProblemaSawBadgeIcon,
+    StatusProblemaSendIcon,
+    StatusProblemaEdit
+} from '../../../shared/icons'
+import {CloseIcon} from '../../../shared/icons'
+
+type enumStatus = 'guest' | 'reviewed' | 'adjustments'
+
+interface ModalStatusProblemaProps {
+    open: boolean,
+    title?: string,
+    description?: string,
+    approves: any[],
+    language?: 'pt-BR' | 'pt-PT' | 'en-US' | 'es' 
+    handleClose: () => void,
+    style: React.CSSProperties
+    
+}
+
+interface ApprovesItemProps{
+    avatar?: string,
+    nomeAvatar: string,
+    dataAvatar: string,
+    statusApprove: enumStatus,
+    size: string
+    avatarSize: string
+}
+
+function ApprovesItem(props: ApprovesItemProps){
+
+        return (
+            <>
+                <div className={style.containerItem}>
+                    <div className={style.avatar} style={{width: props.size}}>
+                        <Avatar src={props.avatar} size={props.avatarSize} />
+                    </div>
+                    {
+                        props.statusApprove === 'reviewed' ?
+                        <div>
+                            <StatusProblemaSawBadgeIcon />
+                        </div>
+                        : props.statusApprove === 'adjustments' ?
+                        <div>
+                            <StatusProblemaEdit/>
+                        </div>
+                        : 
+                        <div><StatusProblemaSendIcon /></div>
+                    } 
+                    <div style={{width: props.size}} className={style.status_logo}>
+                        <Avatar src={problemaFRST} size={props.avatarSize}  />
+                    </div>
+                </div>
+                <div className={style.containerItem} style={{ marginTop: '8px' }}>
+                    <div className={style.containerData} style={{ width: props.size }}>
+                        <span className={style.name}>{props.nomeAvatar}</span>
+                        <span className={style.sub_title}>{props.dataAvatar}</span>
+                    </div>
+                </div>
+            </>
+        )
+    
+}
+
+export default function ModalStatusProblema(props: ModalStatusProblemaProps) {
+    
+    // Função para pegar o width da tela
+    const [size, setSize] = useState([0, 0])
+    useLayoutEffect(() => {
+        function updateSize() {
+        setSize([window.innerWidth, window.innerHeight]);
+        }
+        window.addEventListener('resize', updateSize);
+        updateSize();
+        return () => window.removeEventListener('resize', updateSize);
+    }, []);
+    
+    const BREAKWIDTH = 500;
+    
+    return (
+        <Modal open={props.open} onClose={props.handleClose}>
+            <Box className={style.modalBox} style={{top: '50%', left: '50%', transform: 'translate(-50%, -50%)', ...props.style}}>
+                <div className={style.fechar} onClick={props.handleClose}>
+                    <CloseIcon />
+                </div>
+                <div className={style.titulo}>
+                    {props.title}
+                </div>
+                <div className={style.container} style={{height: props.approves.length >= 3 ? 555 : 185 * props.approves.length}}>
+                    {props.approves.map((item, index) => (                 
+                        <ApprovesItem
+                            avatarSize={(size[0] >= BREAKWIDTH) ? '120px' : '100px'}
+                            size={(size[0] >= BREAKWIDTH) ? '160px' : '120px'}
+                            nomeAvatar={item.nome}
+                            dataAvatar={item.data}
+                            statusApprove={item.approve}
+                            avatar={item.avatarFoto}
+                            key={index}
+                        />
+                    ))}
+                </div>
+                <div className={style.modal_controls_wrapper}>
+                    <div className={style.descricao}>
+                        {props.description}
+                    </div>
+                    <div className={style.conclusao}>
+                        <Button 
+                            variant='primary'
+                            label={props.language === 'en-US' ? 'ok, close' : 'Ok, entendi'}
+                            handleClick={props.handleClose}
+                            style={{ width: '100%', minWidth: '140px' }}
+                        />
+                    </div>
+                </div> 
+            </Box>
+        </Modal>
+    )
+}

package/src/components/modal/statusProblema/statusProblema.module.css

@@ -0,0 +1,154 @@
+.modalBox{
+    background-color: #FFF;
+    width: 800px;
+    min-height: 400px;
+    max-height: 80%;
+    padding-top: 20px;
+    padding-bottom: 20px;
+
+    display: flex;
+    justify-content: center;
+    align-items: center;
+    flex-direction: column;
+    position: relative;
+
+    border-radius: 10px;
+
+    font-family: 'Work Sans';
+
+}
+
+.fechar{
+    font-size: 12px;
+    padding: 8px;
+    display: flex;
+    justify-content: right;
+    align-items: center;
+    position: absolute;
+    top: 0;
+    right: 0;
+    margin-top: 0px;
+    cursor: default;
+    margin-top: 10px;
+    margin-right: 10px;
+}
+
+.titulo{
+    width: 100%;
+    margin-top: 10px;
+    display: flex;
+    justify-content: flex-start;
+    align-items: center;
+    padding-left: 24px;
+    font-family: 'Work Sans';
+    font-style: normal;
+    font-weight: 700;
+    font-size: 24px;
+    line-height: 130%;
+    text-align: center;
+    letter-spacing: 0.01em;
+    color: #222222;
+}
+
+.container {
+    overflow: auto;
+    min-width: 100%;
+    max-width: 100%;
+    
+    
+    display: flex;
+    justify-content: flex-start;
+    align-items: center;
+    flex-direction: column;
+    flex-wrap: noWrap;
+
+    margin-top: 20px;
+    margin-left: 0px;
+
+    border: 1px solid #BDBDBD;
+    border-left: 0px;
+    padding-bottom: 16px;
+}
+
+.containerItem {
+    width: 400px;
+    margin-top: 24px;
+    display: flex;
+    justify-content: space-between;
+    align-items: center;
+}
+
+.containerData {
+    text-align: center;
+    display: flex;
+    justify-content: center;
+    align-items: center;
+    flex-direction: column;
+}
+
+@media (max-width: 500px) {    
+    .containerItem {
+        width: 90vw;
+    }
+}
+
+.avatar{
+
+    font-size: 14px;
+    text-align: center;
+    display: flex;
+    flex-direction: column;
+    justify-content: center;
+    align-items: center;
+}
+
+.descricao{    
+    text-align: left;
+    display: flex;
+    justify-content: center;
+    align-items: center;
+    font-family: 'PT Sans';
+    font-style: normal;
+    font-weight: 400;
+    font-size: 16px;
+    line-height: 110%;
+}
+
+
+.modal_controls_wrapper {
+    gap: 23px;
+    width: 100%;
+    display: flex;
+    justify-content: center;
+    align-items: center;
+    margin-top: 20px;
+    padding: 0 24px;
+}
+
+.status_logo {
+    display: flex;
+    justify-content: center;
+    align-items: center;
+}
+
+.name {
+    font-family: 'Work Sans';
+    font-style: normal;
+    font-weight: 600;
+    font-size: 16px;
+    line-height: 20px;
+    display: flex;
+    align-items: center;
+    text-align: center;
+    letter-spacing: -0.02em;
+    color: #FF4D0D;
+}
+
+.sub_title {
+    font-family: 'PT Sans';
+    font-style: normal;
+    font-weight: 400;
+    font-size: 14px;
+    line-height: 18px;
+    text-align: center;
+}

package/src/components/modal/statusProblema/statusProblema.stories.tsx

@@ -0,0 +1,27 @@
+import React from 'react'
+
+import ModalStatusProblema from './index'
+
+// More on default export: https://storybook.js.org/docs/react/writing-stories/introduction#default-export
+export default {
+    title: 'Modal/ModalstatusProblema',
+    component: ModalStatusProblema,
+}
+
+// More on component templates: https://storybook.js.org/docs/react/writing-stories/introduction#using-args
+const Template = (args) => <ModalStatusProblema {...args} />
+
+export const Teste1 = Template.bind({})
+Teste1.args = {
+  open: true,
+  title: 'Parabéns, o seu problema foi aprovado!',
+  description: 'Estas são as pessoas que foram convidadas para revisar se o objetivo deste desafio está alinhado às metas da empresa.  Caso esteja, ele constará como “verificado”.',
+  approves:[
+    { nome: 'Marlon Pereira', data: 'Revisão concluída: desafio verificado',   approve: 'reviewed', avatar:'https://i.pinimg.com/474x/2b/27/2f/2b272f528c3e14054436edd0d8bd2a26.jpg'  },
+    { nome: 'Marlon Pereira', data: 'Revisão concluída: desafio precisa de ajustes',   approve: 'adjustments', avatar:''  },
+    { nome: 'Marlon Pereira', data: 'Convite enviado: revisão ainda não realizada',   approve: 'guest'  },
+   
+  ],
+  language: 'en-US'
+
+}

package/src/components/quantidadeDesafios/imgSetas/setasDesafios.svg

@@ -0,0 +1,60 @@
+<svg width="963" height="263" viewBox="0 0 963 263" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path fill-rule="evenodd" clip-rule="evenodd" d="M216.193 97.0901C216.215 97.0496 216.236 97.009 216.257 96.9683C216.284 96.9226 216.311 96.8765 216.337 96.83C221.489 87.6471 228.888 79.883 237.877 74.288C248.401 67.7372 260.632 64.4542 273.022 64.8544C285.412 65.2545 297.405 69.3197 307.485 76.536C314.824 81.7905 320.909 88.5438 325.363 96.3055C325.461 96.5912 325.584 96.8726 325.732 97.1468C327.894 101.128 330.046 106.558 332.401 113.07C333.335 115.651 334.318 118.455 335.34 121.37L335.341 121.371C336.806 125.549 338.351 129.955 339.944 134.259C345.398 149 352.259 165.007 362.243 176.165C362.487 176.438 362.752 176.68 363.033 176.891C365.857 179.929 368.944 182.735 372.269 185.274C383.43 193.796 396.799 198.942 410.794 200.104C424.789 201.265 438.824 198.393 451.237 191.827C462.069 186.098 471.27 177.767 478.034 167.617C479.675 165.155 478.753 161.874 476.178 160.417C473.603 158.96 470.354 159.882 468.682 162.323C462.948 170.7 455.25 177.586 446.228 182.357C435.624 187.966 423.635 190.419 411.68 189.427C399.725 188.435 388.305 184.039 378.77 176.759C375.89 174.56 373.218 172.125 370.778 169.487C370.645 169.292 370.498 169.104 370.337 168.924C361.858 159.448 355.576 145.211 350.129 130.49C348.534 126.18 347.081 122.033 345.664 117.99L345.663 117.987C344.641 115.07 343.638 112.207 342.614 109.376C341.117 105.238 339.61 101.265 338.047 97.6967C337.972 97.3245 337.852 96.9539 337.684 96.5907C332.357 85.0977 324.134 75.1465 313.785 67.7369C301.965 59.2747 287.901 54.5075 273.371 54.0383C258.842 53.5691 244.5 57.4188 232.158 65.1008C221.693 71.6149 213.065 80.6366 207.029 91.3046C206.891 91.495 206.764 91.6965 206.648 91.9087C204.057 96.6825 201.664 102.838 199.297 109.417C198.261 112.297 197.248 115.207 196.214 118.174L196.214 118.175L196.214 118.175C194.8 122.233 193.351 126.396 191.757 130.729C186.289 145.6 179.99 159.968 171.518 169.436C171.357 169.616 171.21 169.804 171.077 169.999C168.638 172.637 165.965 175.072 163.085 177.271C153.55 184.551 142.13 188.947 130.175 189.94C118.22 190.932 106.231 188.478 95.6265 182.869C86.6051 178.098 78.9073 171.213 73.1725 162.835C71.5013 160.394 68.2514 159.473 65.6767 160.93C63.1019 162.387 62.1798 165.668 63.8205 168.13C70.5846 178.279 79.7862 186.611 90.6175 192.34C103.031 198.905 117.066 201.778 131.061 200.616C145.056 199.455 158.425 194.309 169.586 185.786C172.911 183.248 175.998 180.442 178.821 177.404C179.103 177.192 179.368 176.95 179.612 176.678C189.603 165.512 196.481 149.351 201.95 134.477C203.538 130.159 205.081 125.732 206.544 121.534L206.545 121.533L206.545 121.533C207.579 118.566 208.574 115.713 209.516 113.093C211.878 106.526 214.034 101.066 216.193 97.0901Z" fill="url(#paint0_linear_273_25256)"/>
+<path fill-rule="evenodd" clip-rule="evenodd" d="M357.677 96.9443C355.102 95.4872 354.18 92.206 355.82 89.7442C361.341 81.4603 368.499 74.368 376.872 68.9151C386.744 62.4858 398.018 58.5239 409.742 57.3634C421.466 56.2028 433.297 57.8775 444.238 62.2464C452.714 65.6308 460.463 70.5551 467.105 76.7476L473.789 70.9159L478.747 96.1782L454.39 87.8403L458.982 83.8346C453.493 78.8956 447.161 74.9492 440.265 72.1959C430.919 68.4638 420.812 67.0332 410.797 68.0246C400.782 69.016 391.152 72.4004 382.718 77.8926C375.785 82.4081 369.827 88.2395 365.172 95.0386C363.501 97.4798 360.251 98.4013 357.677 96.9443Z" fill="url(#paint1_linear_273_25256)"/>
+<path fill-rule="evenodd" clip-rule="evenodd" d="M65.6767 96.9443C63.102 95.4872 62.1798 92.206 63.8205 89.7442C69.3413 81.4603 76.4987 74.368 84.8719 68.9151C94.7443 62.4858 106.018 58.5239 117.742 57.3634C129.466 56.2028 141.297 57.8775 152.238 62.2465C160.714 65.6308 168.463 70.5551 175.105 76.7476L181.789 70.9159L186.747 96.1782L162.39 87.8403L166.981 83.8346C161.493 78.8956 155.161 74.9493 148.265 72.1959C138.919 68.4638 128.812 67.0332 118.797 68.0246C108.782 69.016 99.1517 72.4004 90.7183 77.8926C83.7846 82.4081 77.8268 88.2396 73.1724 95.0386C71.5013 97.4798 68.2514 98.4013 65.6767 96.9443Z" fill="url(#paint2_linear_273_25256)"/>
+<path fill-rule="evenodd" clip-rule="evenodd" d="M649.677 96.9443C647.102 95.4872 646.18 92.206 647.82 89.7442C653.341 81.4603 660.499 74.368 668.872 68.9151C678.744 62.4858 690.018 58.5239 701.742 57.3634C713.466 56.2028 725.297 57.8775 736.238 62.2465C744.714 65.6309 752.463 70.5552 759.105 76.7477L765.789 70.916L770.747 96.1784L746.39 87.8405L750.982 83.8347C745.493 78.8957 739.161 74.9493 732.265 72.1959C722.919 68.4638 712.812 67.0332 702.797 68.0246C692.782 69.016 683.152 72.4004 674.718 77.8926C667.785 82.4081 661.827 88.2396 657.172 95.0386C655.501 97.4798 652.251 98.4013 649.677 96.9443Z" fill="url(#paint3_linear_273_25256)"/>
+<path fill-rule="evenodd" clip-rule="evenodd" d="M503.677 164.704C501.102 166.161 500.18 169.442 501.82 171.904C507.341 180.188 514.499 187.28 522.872 192.733C532.744 199.163 544.018 203.125 555.742 204.285C567.466 205.446 579.297 203.771 590.238 199.402C598.714 196.018 606.463 191.093 613.105 184.901L619.789 190.733L624.747 165.47L600.39 173.808L604.982 177.814C599.493 182.753 593.161 186.699 586.265 189.453C576.919 193.185 566.812 194.615 556.797 193.624C546.782 192.632 537.152 189.248 528.718 183.756C521.785 179.24 515.827 173.409 511.172 166.61C509.501 164.169 506.251 163.247 503.677 164.704Z" fill="url(#paint4_linear_273_25256)"/>
+<path fill-rule="evenodd" clip-rule="evenodd" d="M211.677 164.704C209.102 166.161 208.18 169.442 209.82 171.904C215.341 180.188 222.499 187.28 230.872 192.733C240.744 199.163 252.018 203.124 263.742 204.285C275.466 205.446 287.297 203.771 298.238 199.402C306.714 196.018 314.463 191.093 321.105 184.901L327.789 190.733L332.747 165.47L308.39 173.808L312.982 177.814C307.493 182.753 301.161 186.699 294.265 189.452C284.919 193.185 274.812 194.615 264.797 193.624C254.782 192.632 245.152 189.248 236.718 183.756C229.785 179.24 223.827 173.409 219.172 166.61C217.501 164.169 214.251 163.247 211.677 164.704Z" fill="url(#paint5_linear_273_25256)"/>
+<path fill-rule="evenodd" clip-rule="evenodd" d="M795.677 164.704C793.102 166.161 792.18 169.442 793.82 171.904C799.341 180.188 806.499 187.28 814.872 192.733C824.744 199.163 836.018 203.124 847.742 204.285C859.466 205.446 871.297 203.771 882.238 199.402C890.714 196.018 898.463 191.093 905.105 184.901L911.789 190.732L916.747 165.47L892.39 173.808L896.982 177.814C891.493 182.753 885.161 186.699 878.265 189.452C868.919 193.185 858.812 194.615 848.797 193.624C838.782 192.632 829.152 189.248 820.718 183.756C813.785 179.24 807.827 173.409 803.172 166.61C801.501 164.169 798.251 163.247 795.677 164.704Z" fill="url(#paint6_linear_273_25256)"/>
+<path fill-rule="evenodd" clip-rule="evenodd" d="M508.193 97.0901C508.215 97.0495 508.236 97.0089 508.257 96.968C508.268 96.95 508.279 96.9318 508.289 96.9137C508.305 96.8859 508.321 96.858 508.337 96.83C513.489 87.6471 520.888 79.883 529.877 74.288C540.401 67.7372 552.632 64.4542 565.022 64.8544C577.412 65.2545 589.405 69.3197 599.485 76.536C606.824 81.7905 612.909 88.5437 617.363 96.3054C617.461 96.5911 617.583 96.8726 617.732 97.1468C619.894 101.128 622.046 106.558 624.401 113.07C625.335 115.651 626.318 118.455 627.34 121.37L627.341 121.371C628.806 125.549 630.351 129.955 631.944 134.259C637.398 149 644.259 165.007 654.243 176.165C654.487 176.438 654.752 176.68 655.033 176.891C657.857 179.929 660.944 182.735 664.269 185.274C675.43 193.796 688.799 198.942 702.794 200.104C716.789 201.265 730.824 198.393 743.237 191.827C754.069 186.098 763.27 177.767 770.034 167.617C771.675 165.155 770.753 161.874 768.178 160.417C765.603 158.96 762.354 159.882 760.682 162.323C754.948 170.7 747.25 177.586 738.228 182.357C727.624 187.966 715.635 190.419 703.68 189.427C691.725 188.435 680.305 184.039 670.77 176.759C667.89 174.56 665.218 172.125 662.778 169.487C662.645 169.292 662.498 169.104 662.337 168.924C653.858 159.448 647.576 145.211 642.129 130.49C640.534 126.18 639.081 122.033 637.664 117.99L637.663 117.987C636.641 115.07 635.638 112.207 634.614 109.376C633.117 105.238 631.61 101.266 630.047 97.6968C629.972 97.3246 629.852 96.9539 629.684 96.5907C624.357 85.0977 616.134 75.1465 605.785 67.7369C593.965 59.2747 579.901 54.5075 565.371 54.0383C550.842 53.5691 536.5 57.4188 524.158 65.1008C513.693 71.615 505.065 80.6367 499.029 91.3048C498.891 91.4951 498.764 91.6965 498.648 91.9088C496.057 96.6825 493.664 102.838 491.297 109.417C490.262 112.296 489.248 115.205 488.215 118.171L488.214 118.174L488.214 118.175L488.214 118.175L488.214 118.175L488.213 118.176C486.8 122.233 485.35 126.396 483.757 130.729C478.289 145.6 471.99 159.968 463.518 169.436C463.357 169.617 463.21 169.805 463.077 169.999C460.637 172.637 457.965 175.072 455.085 177.271C445.55 184.551 434.13 188.948 422.175 189.94C410.22 190.932 398.231 188.478 387.626 182.87C378.605 178.098 370.907 171.213 365.172 162.835C363.501 160.394 360.251 159.473 357.677 160.93C355.102 162.387 354.18 165.668 355.82 168.13C362.585 178.279 371.786 186.611 382.618 192.34C395.031 198.906 409.066 201.778 423.061 200.616C437.056 199.455 450.425 194.309 461.586 185.786C464.911 183.248 467.998 180.442 470.822 177.404C471.103 177.192 471.368 176.95 471.612 176.678C481.603 165.512 488.481 149.351 493.95 134.477C495.538 130.159 497.081 125.732 498.544 121.534L498.545 121.533C499.579 118.566 500.574 115.713 501.516 113.093C503.878 106.526 506.034 101.066 508.193 97.0901Z" fill="url(#paint7_linear_273_25256)"/>
+<path fill-rule="evenodd" clip-rule="evenodd" d="M800.193 97.0901C800.215 97.0498 800.236 97.0094 800.257 96.9688C800.267 96.952 800.277 96.9351 800.287 96.9182C800.304 96.889 800.32 96.8596 800.337 96.8301C804.772 88.9248 810.881 82.0559 818.26 76.7176C827.104 70.3195 837.466 66.3419 848.319 65.1786C859.173 64.0154 870.142 65.7068 880.141 70.0854C887.402 73.2649 893.968 77.7812 899.511 83.3724L894.39 87.84L918.747 96.1779L913.789 70.9156L907.68 76.2458C901.079 69.4618 893.208 63.9938 884.482 60.1725C872.757 55.0379 859.894 53.0545 847.166 54.4186C834.439 55.7827 822.288 60.447 811.917 67.9498C803.336 74.1579 796.22 82.1312 791.029 91.3044C790.891 91.4948 790.764 91.6964 790.648 91.9087C788.057 96.6825 785.664 102.838 783.297 109.417C782.262 112.296 781.248 115.205 780.215 118.17L780.214 118.175L780.213 118.177L780.211 118.182C778.799 122.238 777.35 126.398 775.757 130.729C770.289 145.6 763.99 159.968 755.518 169.436C755.357 169.617 755.21 169.805 755.077 169.999C752.637 172.637 749.965 175.072 747.085 177.271C737.55 184.551 726.13 188.948 714.175 189.94C702.22 190.932 690.231 188.478 679.626 182.87C670.605 178.098 662.907 171.213 657.172 162.835C655.501 160.394 652.251 159.473 649.677 160.93C647.102 162.387 646.18 165.668 647.82 168.13C654.585 178.279 663.786 186.611 674.618 192.34C687.031 198.906 701.066 201.778 715.061 200.616C729.056 199.455 742.425 194.309 753.586 185.786C756.911 183.248 759.998 180.442 762.822 177.404C763.103 177.192 763.368 176.95 763.612 176.678C773.603 165.512 780.481 149.351 785.95 134.477C787.537 130.162 789.078 125.74 790.541 121.545L790.543 121.54L790.545 121.534L790.545 121.533C791.579 118.566 792.574 115.713 793.516 113.093C795.878 106.526 798.034 101.066 800.193 97.0901Z" fill="url(#paint8_linear_273_25256)"/>
+<defs>
+<linearGradient id="paint0_linear_273_25256" x1="348.5" y1="54" x2="65.8358" y2="154.645" gradientUnits="userSpaceOnUse">
+<stop stop-color="#FF9934"/>
+<stop offset="0.220452" stop-color="#F26818"/>
+<stop offset="0.56498" stop-color="#FF9934"/>
+<stop offset="0.942956" stop-color="#F26818"/>
+</linearGradient>
+<linearGradient id="paint1_linear_273_25256" x1="464" y1="98.0002" x2="349" y2="98.0002" gradientUnits="userSpaceOnUse">
+<stop stop-color="#F46E1D"/>
+<stop offset="0.575197" stop-color="#FF9934"/>
+<stop offset="0.865824" stop-color="#FF9934"/>
+</linearGradient>
+<linearGradient id="paint2_linear_273_25256" x1="191" y1="98.0002" x2="36" y2="98.0002" gradientUnits="userSpaceOnUse">
+<stop offset="0.176509" stop-color="#F26818"/>
+<stop offset="0.462825" stop-color="#FF9934"/>
+<stop offset="1" stop-color="#FF9934"/>
+</linearGradient>
+<linearGradient id="paint3_linear_273_25256" x1="771" y1="98.0005" x2="627.5" y2="102.5" gradientUnits="userSpaceOnUse">
+<stop offset="0.123715" stop-color="#F26818"/>
+<stop offset="0.597062" stop-color="#FF9934"/>
+<stop offset="0.919352" stop-color="#FF9934"/>
+</linearGradient>
+<linearGradient id="paint4_linear_273_25256" x1="488" y1="205" x2="630.5" y2="205" gradientUnits="userSpaceOnUse">
+<stop stop-color="#FE933C"/>
+<stop offset="0.555386" stop-color="#FF9934"/>
+<stop offset="0.958184" stop-color="#F26818"/>
+</linearGradient>
+<linearGradient id="paint5_linear_273_25256" x1="209" y1="205" x2="325" y2="205" gradientUnits="userSpaceOnUse">
+<stop stop-color="#FE933C"/>
+<stop offset="0.514298" stop-color="#FE933C"/>
+<stop offset="1" stop-color="#F26818"/>
+</linearGradient>
+<linearGradient id="paint6_linear_273_25256" x1="769.5" y1="205" x2="952" y2="205" gradientUnits="userSpaceOnUse">
+<stop offset="0.0695406" stop-color="#FF9934"/>
+<stop offset="0.51453" stop-color="#FF9934"/>
+<stop offset="0.69546" stop-color="#F26818"/>
+</linearGradient>
+<linearGradient id="paint7_linear_273_25256" x1="438.5" y1="53.9999" x2="591.706" y2="-42.1116" gradientUnits="userSpaceOnUse">
+<stop stop-color="#FF9934"/>
+<stop offset="0.45849" stop-color="#F26818"/>
+<stop offset="0.973031" stop-color="#FF9934"/>
+</linearGradient>
+<linearGradient id="paint8_linear_273_25256" x1="1022.5" y1="57.0969" x2="786.808" y2="185.826" gradientUnits="userSpaceOnUse">
+<stop offset="0.423653" stop-color="#F26818"/>
+<stop offset="0.521793" stop-color="#FF9934"/>
+<stop offset="0.931515" stop-color="#F26818"/>
+<stop offset="1" stop-color="#FE933C"/>
+</linearGradient>
+</defs>
+</svg>