@npm_leadtech/legal-lib-components 7.82.52 → 7.83.1

package/dist/src/components/atoms/ExpertCard/ExpertCard.styled.js

@@ -4,63 +4,62 @@ export const ExpertCardStyled = styled.div `
   display: flex;
   align-items: center;
   justify-content: center;
-  margin-top: 10rem;
-
-  &:first-child {
-    margin-top: 5rem;
-  }
-
-  @media ${device['landscape-tablets']} {
-    margin-top: 5rem;
-  }
 
   .expert-card {
     &__box {
       background-color: white;
-      border-radius: 0.3rem;
-      box-shadow: var(--box-shadow-container);
-      padding: 7rem 2rem 0 2rem;
-      min-height: 13rem;
+      border-radius: 1rem;
+      //box-shadow: var(--box-shadow-container);
       display: flex;
-      flex-direction: column;
+      flex-direction: row;
       align-items: center;
       justify-content: flex-start;
-      width: 17.625rem;
-      margin-left: 0;
+      width: 330px;
+      padding: 16px;
+      align-items: center;
+      gap: 24px;
 
-      @media ${device['landscape-tablets']} {
-        margin-left: 2rem;
+      @media ${device['laptop']} {
+        width: 383px;
       }
     }
 
     &__image {
-      position: absolute;
-      transform: translateY(-115%);
-
+      min-width: 117px;
       img {
-        border-radius: 100%;
+        width: 117px;
+        height: auto;
+        border-radius: 8px;
       }
     }
 
+    &__texts {
+      display: flex;
+      flex-direction: column;
+      align-items: start;
+      justify-content: left;
+    }
+
     &__title {
       font-family: var(--font-sans);
       font-size: 18px;
       font-weight: 700;
       line-height: 1.5rem;
       letter-spacing: -0.3px;
-      text-align: center;
       width: 75%;
       text-decoration: none;
+      margin-bottom: 0.6rem;
+      min-width: fit-content;
     }
 
     &__description {
       font-family: var(--font-sans);
+      color: var(--neutral-neutral-1);
       font-size: 16px;
+      font-style: normal;
       font-weight: 400;
       line-height: 22px;
       letter-spacing: -0.3px;
-      text-align: center;
-      width: 75%;
     }
   }
 `;

package/dist/src/components/atoms/ExpertCard/ExpertCard.styled.ts

@@ -5,63 +5,62 @@ export const ExpertCardStyled = styled.div`
   display: flex;
   align-items: center;
   justify-content: center;
-  margin-top: 10rem;
-
-  &:first-child {
-    margin-top: 5rem;
-  }
-
-  @media ${device['landscape-tablets']} {
-    margin-top: 5rem;
-  }
 
   .expert-card {
     &__box {
       background-color: white;
-      border-radius: 0.3rem;
-      box-shadow: var(--box-shadow-container);
-      padding: 7rem 2rem 0 2rem;
-      min-height: 13rem;
+      border-radius: 1rem;
+      //box-shadow: var(--box-shadow-container);
       display: flex;
-      flex-direction: column;
+      flex-direction: row;
       align-items: center;
       justify-content: flex-start;
-      width: 17.625rem;
-      margin-left: 0;
+      width: 330px;
+      padding: 16px;
+      align-items: center;
+      gap: 24px;
 
-      @media ${device['landscape-tablets']} {
-        margin-left: 2rem;
+      @media ${device['laptop']} {
+        width: 383px;
       }
     }
 
     &__image {
-      position: absolute;
-      transform: translateY(-115%);
-
+      min-width: 117px;
       img {
-        border-radius: 100%;
+        width: 117px;
+        height: auto;
+        border-radius: 8px;
       }
     }
 
+    &__texts {
+      display: flex;
+      flex-direction: column;
+      align-items: start;
+      justify-content: left;
+    }
+
     &__title {
       font-family: var(--font-sans);
       font-size: 18px;
       font-weight: 700;
       line-height: 1.5rem;
       letter-spacing: -0.3px;
-      text-align: center;
       width: 75%;
       text-decoration: none;
+      margin-bottom: 0.6rem;
+      min-width: fit-content;
     }
 
     &__description {
       font-family: var(--font-sans);
+      color: var(--neutral-neutral-1);
       font-size: 16px;
+      font-style: normal;
       font-weight: 400;
       line-height: 22px;
       letter-spacing: -0.3px;
-      text-align: center;
-      width: 75%;
     }
   }
 `

package/dist/src/components/atoms/ExpertCard/ExpertCard.tsx

@@ -8,14 +8,15 @@ const ExpertCard: FC<ExpertCardProps> = ({ title, url, description, image }) =>
     <ExpertCardStyled className='expert-card'>
       <div className='expert-card__box'>
         <div className='expert-card__image'>{image}</div>
-        {url != null && (
-          <a className='expert-card__title' href={url}>
-            {title}
-          </a>
-        )}
-        {url == null && <p className='expert-card__title'>{title}</p>}
-
-        <p className='expert-card__description'>{description}</p>
+        <div className='expert-card__texts'>
+          {url != null && (
+            <a className='expert-card__title' href={url}>
+              {title}
+            </a>
+          )}
+          {url == null && <p className='expert-card__title'>{title}</p>}
+          <p className='expert-card__description'>{description}</p>
+        </div>
       </div>
     </ExpertCardStyled>
   )

package/dist/src/components/atoms/FeatureItem/FeatureItem.d.ts

@@ -0,0 +1,3 @@
+import { FeatureItemProps } from './FeatureItemProps';
+import React from 'react';
+export declare const FeatureItem: React.FC<FeatureItemProps>;

package/dist/src/components/atoms/FeatureItem/FeatureItem.js

@@ -0,0 +1,5 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { FeatureCard } from './FeatureItem.styled';
+export const FeatureItem = ({ feature }) => {
+    return (_jsxs(FeatureCard, { children: [_jsx("img", { className: 'feature-icon', src: feature?.icon?.url, alt: 'Feature Icon', width: 16, height: 16 }), _jsx("span", { className: 'feature-description', children: feature?.description })] }));
+};

package/dist/src/components/atoms/FeatureItem/FeatureItem.styled.d.ts

@@ -0,0 +1 @@
+export declare const FeatureCard: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").LiHTMLAttributes<HTMLLIElement>, HTMLLIElement>, never>> & string;

package/dist/src/components/atoms/FeatureItem/FeatureItem.styled.js

@@ -0,0 +1,18 @@
+import styled from 'styled-components';
+export const FeatureCard = styled.li `
+  display: flex;
+  flex-direction: column;
+  flex: 1;
+  padding: 1rem 0.5rem 1rem 1rem;
+  border-radius: 1rem;
+  background-color: white;
+
+  .feature-icon {
+    margin-bottom: 0.5rem;
+  }
+
+  .feature-description {
+    font-size: 14px;
+    font-weight: 400;
+  }
+`;

package/dist/src/components/atoms/FeatureItem/FeatureItem.styled.ts

@@ -0,0 +1,19 @@
+import styled from 'styled-components'
+
+export const FeatureCard = styled.li`
+  display: flex;
+  flex-direction: column;
+  flex: 1;
+  padding: 1rem 0.5rem 1rem 1rem;
+  border-radius: 1rem;
+  background-color: white;
+
+  .feature-icon {
+    margin-bottom: 0.5rem;
+  }
+
+  .feature-description {
+    font-size: 14px;
+    font-weight: 400;
+  }
+`

package/dist/src/components/atoms/FeatureItem/FeatureItem.tsx

@@ -0,0 +1,12 @@
+import { FeatureCard } from './FeatureItem.styled'
+import { FeatureItemProps } from './FeatureItemProps'
+import React from 'react'
+
+export const FeatureItem: React.FC<FeatureItemProps> = ({ feature }) => {
+  return (
+    <FeatureCard>
+      <img className='feature-icon' src={feature?.icon?.url} alt='Feature Icon' width={16} height={16} />
+      <span className='feature-description'>{feature?.description}</span>
+    </FeatureCard>
+  )
+}

package/dist/src/components/atoms/FeatureItem/FeatureItemProps.d.ts

@@ -0,0 +1,9 @@
+export interface FeatureItemProps {
+    feature: FeatureItemProp;
+}
+export interface FeatureItemProp {
+    description?: string;
+    icon: {
+        url?: string;
+    };
+}

package/dist/src/components/atoms/FeatureItem/FeatureItemProps.ts

@@ -0,0 +1,10 @@
+export interface FeatureItemProps {
+  feature: FeatureItemProp
+}
+
+export interface FeatureItemProp {
+  description?: string
+  icon: {
+    url?: string
+  }
+}

package/dist/src/components/atoms/FeatureItem/index.d.ts

@@ -0,0 +1,2 @@
+export * from './FeatureItem';
+export * from './FeatureItemProps';

package/dist/src/components/atoms/FeatureItem/index.js

@@ -0,0 +1,2 @@
+export * from './FeatureItem';
+export * from './FeatureItemProps';

package/dist/src/components/atoms/FeatureItem/index.ts

@@ -0,0 +1,2 @@
+export * from './FeatureItem'
+export * from './FeatureItemProps'

package/dist/src/components/atoms/FeatureRatafiaCard/FeatureRatafiaCard.js

@@ -1,6 +1,6 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { FeatureRatafiaCardStyled } from './FeatureRatafiaCard.styled';
 export const FeatureRatafiaCard = ({ title, icon, description, isReleased = true, notReleasedText }) => {
-    return (_jsx(FeatureRatafiaCardStyled, { className: 'feature-ratafia-card', children: _jsx("div", { className: isReleased ? 'feature-ratafia-card-released' : 'feature-ratafia-card-not-released', children: _jsxs("div", { className: 'feature-ratafia-card__wrapper', children: [_jsxs("div", { className: 'feature-ratafia-card__wrapper__header', children: [_jsxs("div", { className: 'feature-ratafia-card__wrapper__header__title', children: [icon !== null && _jsx("div", { className: 'feature-ratafia-card__wrapper__header__title__icon', children: icon }), _jsx("h3", { className: 'sans-serif --big --bold-weight feature-ratafia-card__wrapper__header__title__text', children: title })] }), !isReleased && (_jsx("p", { className: 'sans-serif --small --bold-weight feature-ratafia-card__wrapper__header__not-released', children: notReleasedText }))] }), _jsx("p", { className: 'sans-serif --medium feature-ratafia-card__wrapper__description', children: description })] }) }) }));
+    return (_jsx(FeatureRatafiaCardStyled, { className: 'feature-ratafia-card', children: _jsx("div", { className: isReleased ? 'feature-ratafia-card-released' : 'feature-ratafia-card-not-released', children: _jsxs("div", { className: 'feature-ratafia-card__wrapper', children: [_jsxs("div", { className: 'feature-ratafia-card__wrapper__header', children: [_jsxs("div", { className: 'feature-ratafia-card__wrapper__header__title', children: [icon !== null && _jsx("div", { className: 'feature-ratafia-card__wrapper__header__title__icon', children: icon }), _jsx("p", { className: 'sans-serif --big --bold-weight feature-ratafia-card__wrapper__header__title__text', children: title })] }), !isReleased && (_jsx("p", { className: 'sans-serif --small --bold-weight feature-ratafia-card__wrapper__header__not-released', children: notReleasedText }))] }), _jsx("p", { className: 'sans-serif --medium feature-ratafia-card__wrapper__description', children: description })] }) }) }));
 };
 export default FeatureRatafiaCard;

package/dist/src/components/atoms/FeatureRatafiaCard/FeatureRatafiaCard.tsx

@@ -17,9 +17,9 @@ export const FeatureRatafiaCard: React.FC<FeatureRatafiaCardProps> = ({
           <div className='feature-ratafia-card__wrapper__header'>
             <div className='feature-ratafia-card__wrapper__header__title'>
               {icon !== null && <div className='feature-ratafia-card__wrapper__header__title__icon'>{icon}</div>}
-              <h3 className='sans-serif --big --bold-weight feature-ratafia-card__wrapper__header__title__text'>
+              <p className='sans-serif --big --bold-weight feature-ratafia-card__wrapper__header__title__text'>
                 {title}
-              </h3>
+              </p>
             </div>
             {!isReleased && (
               <p className='sans-serif --small --bold-weight feature-ratafia-card__wrapper__header__not-released'>

package/dist/src/components/atoms/FixedFooter/FixedFooter.d.ts

@@ -1,3 +1,7 @@
 import { FixedFooterProps } from './FixedFooterProps';
 import React from 'react';
+/**
+ * @deprecated Este componentes será removido en el futuro. Use `Footer` en su lugar.
+ * @deprecatedSince 7.8.0
+ */
 export declare const FixedFooter: React.FC<FixedFooterProps>;

package/dist/src/components/atoms/FixedFooter/FixedFooter.js

@@ -12,6 +12,10 @@ import linkedin from '../../../../images/svg/linkedin.svg';
 import pinterest from '../../../../images/svg/pinterest.svg';
 import securityIconBlack from '../../../../images/svg/icon-24-px-security_black.svg';
 import x from '../../../../images/svg/x.svg';
+/**
+ * @deprecated Este componentes será removido en el futuro. Use `Footer` en su lugar.
+ * @deprecatedSince 7.8.0
+ */
 export const FixedFooter = ({ footerData = {
     findUs: 'Find Us'
 }, config = {
@@ -70,5 +74,5 @@ export const FixedFooter = ({ footerData = {
     show: false,
     content: _jsx(_Fragment, {})
 } }) => {
-    return (_jsxs(FixedFooterStyled, { children: [preFooter.show && (_jsx("section", { className: 'prefooter', children: _jsx("div", { className: 'wrapper', children: _jsxs("div", { className: 'prefooter-container', children: [_jsx("div", { className: 'serif --hero prefooter__title', children: preFooter.title }), _jsx("div", { className: 'prefooter--columns', children: preFooter.columns.map((column, index) => (_jsx("p", { className: 'prefooter--columns__text', children: column }, index))) }), preFooter.hasButton && (_jsx(Button, { label: preFooter.buttonLabel, onClick: preFooter.buttonClick, link: preFooter.buttonLink, dataQa: 'cta-footer', isExternal: true, hasNoFollow: true }))] }) }) })), config.isSEMPage && config.isMobile && (_jsx("footer", { className: 'sem-footer', children: _jsxs("section", { className: 'sem-footer__wrapper', children: [_jsx("ul", { className: 'sem-footer__legal-links', children: companyBlock.links }), _jsxs("div", { className: 'sem-footer__contact-info', children: [_jsxs("div", { className: 'sem-footer__contact-info__phone', children: [_jsx(PhoneIcon, { width: 20, height: 20, fill: 'white' }), _jsxs("b", { children: [config.sitePhone, " "] })] }), _jsx("div", { className: 'sem-footer__contact-info__schedule', children: config.siteSchedule })] }), _jsx("div", { className: 'fixed-container', children: footer.createDocumentBlock })] }) })), !config.isSEMPage && (_jsxs("footer", { children: [!config.hide && !config.noFooter ? (_jsxs(_Fragment, { children: [_jsx("div", { className: 'language-selector-mobile-container', children: languageSelector.show === true && languageSelector.content }), _jsxs("section", { className: 'footer__wrapper', children: [_jsxs("div", { className: 'footer__products', children: [_jsx("p", { className: 'sans-serif --small footer-links__title', children: productsBlock.title }), productsBlock.productsCategories, _jsx("div", { className: 'sans-serif --extra-small product-categories', children: productsBlock.allProductsLink })] }), _jsxs("div", { className: 'footer__popular-documents', children: [_jsx("p", { className: 'sans-serif --small footer-links__title', children: popularDocumentsBlock.title }), _jsx("ul", { children: popularDocumentsBlock.popularDocuments }), config.isTablet && (_jsxs("div", { className: 'footer__help__tablet', children: [_jsx("p", { className: 'sans-serif --small footer-links__title', children: helpBlock.title }), _jsx("ul", { children: helpBlock.links })] }))] }), (config.isMobile || config.isDesktop) && (_jsxs("div", { className: 'footer__company', children: [_jsx("p", { className: 'sans-serif --small footer-links__title', children: companyBlock.title }), _jsx("ul", { children: companyBlock.links })] })), _jsx("div", { className: 'footer__company__resources__findUs', children: config.isTablet && (_jsxs(_Fragment, { children: [_jsx("p", { className: 'sans-serif --small footer-links__title', children: companyBlock.title }), _jsx("ul", { children: companyBlock.links }), !config.isJonSnow && config.hasGrav && config.isTablet && (_jsxs("div", { className: 'footer__resources', children: [_jsx("p", { className: 'sans-serif --small footer-links__title', children: resourcesBlock.title }), _jsx("ul", { children: resourcesBlock.links })] }))] })) }), !config.isTablet && (_jsx("div", { className: 'footer__help__resources', children: _jsxs("div", { children: [_jsxs("div", { className: 'footer__help', children: [_jsx("p", { className: 'sans-serif --small footer-links__title', children: helpBlock.title }), _jsx("ul", { children: helpBlock.links })] }), !config.isJonSnow && config.hasGrav && (_jsxs("div", { className: 'footer__resources', children: [_jsx("p", { className: 'sans-serif --small footer-links__title', children: resourcesBlock.title }), _jsx("ul", { children: resourcesBlock.links })] }))] }) })), _jsxs("div", { className: 'footer__findUs', children: [_jsxs("div", { className: 'find-us-container', children: [!config.isJonSnow && (_jsxs(_Fragment, { children: [_jsxs("div", { className: 'find-us-content', children: [_jsx("p", { className: 'sans-serif --small footer-links__title', children: footerData?.findUs }), _jsxs("ul", { children: [_jsx("li", { children: _jsx("a", { href: 'https://www.facebook.com/lawdistrictlegal', rel: 'noopener noreferrer', target: '_blank', children: _jsx("img", { src: facebook, alt: 'Facebook logo', width: '32', height: '32' }) }) }), _jsx("li", { children: _jsx("a", { href: 'https://twitter.com/district_law', rel: 'noopener noreferrer', target: '_blank', children: _jsx("img", { src: x, alt: 'Twitter logo', width: '32', height: '32' }) }) }), _jsx("li", { children: _jsx("a", { href: 'https://www.linkedin.com/company/law-district/', rel: 'noopener noreferrer', target: '_blank', children: _jsx("img", { src: linkedin, alt: 'Linkedin logo', width: '32', height: '32' }) }) }), _jsx("li", { children: _jsx("a", { href: 'https://www.pinterest.com/lawdistrict/', rel: 'noopener noreferrer', target: '_blank', children: _jsx("img", { src: pinterest, alt: 'Pinterest logo', width: '32', height: '32' }) }) })] })] }), _jsxs("div", { className: 'footer-contact-box', children: [_jsx("span", { className: 'footer-contact-box_phone', children: config.sitePhone }), _jsx(Button, { centered: true, isExternal: true, link: `tel:${config.sitePhone}`, givenClass: 'footer-contact-box-button', label: config.sitePhone, dataQa: 'footer_contact_box' }), _jsx("span", { className: 'footer-contact-box_schedule', children: config.siteSchedule.replace(/(\d)/, '\n$1') })] })] })), _jsx("div", { className: 'footer__logo', children: _jsx(Logo, { className: 'footer__lawdistrict', siteName: config.siteName, width: '138', height: '24', type: 'white' }) })] }), config.hasTrustPilot && footer.trustPilotWidget] }), !config.isJonSnow && (_jsxs("div", { className: 'footer-mobile-contact-box', children: [_jsx("span", { className: 'footer-mobile-contact-box_phone', children: config.sitePhone }), _jsx(Button, { centered: true, isExternal: true, link: `tel:${config.sitePhone}`, givenClass: 'footer-mobile-contact-box-button', label: config.sitePhone, dataQa: 'footer_contact_box' }), config.siteSchedule && (_jsx("p", { className: 'footer-mobile-contact-box_schedule', children: config.siteSchedule }))] }))] })] })) : null, config.hasContactBar && (_jsx(WideInfoBar, { children: _jsxs(_Fragment, { children: [_jsxs("div", { className: `contact-bar-wrapper ${(config.isJonSnow || config.isAnonymousPayment) && 'hidden'}`, children: [_jsx(IconWeb, {}), _jsxs("div", { className: 'contact-bar-wrapper__text', children: [_jsxs("div", { className: 'is-mobile', children: [_jsx("a", { className: 'phone', href: `tel:${config.sitePhone}`, children: _jsx("strong", { children: config.sitePhone }) }), ` - ${config.siteSchedule}`] }), _jsxs("div", { className: 'no-mobile', children: [_jsx("strong", { children: config.sitePhone }), " - ", config.siteSchedule] })] })] }), _jsxs("div", { className: 'contact-bar-wrapper', children: [_jsx("img", { src: securityIconBlack, alt: '' }), _jsx("p", { className: 'contact-bar-wrapper__text', children: footer.securityText })] }), _jsxs("div", { className: 'contact-bar-wrapper', children: [_jsx("img", { src: guaranteeIconGrey, alt: '' }), _jsx("p", { className: 'contact-bar-wrapper__text', children: footer.guaranteeText })] })] }) })), footer.disclaimerText && _jsx(Disclaimer, { text: footer.disclaimerText, siteUrl: config.siteUrl }), _jsx("div", { className: 'fixed-container', children: footer.createDocumentBlock })] })), footer.bottomFixedBlock] }));
+    return (_jsxs(FixedFooterStyled, { children: [preFooter.show && (_jsx("section", { className: 'prefooter', children: _jsx("div", { className: 'wrapper', children: _jsxs("div", { className: 'prefooter-container', children: [_jsx("div", { className: 'serif --hero prefooter__title', children: preFooter.title }), _jsx("div", { className: 'prefooter--columns', children: preFooter.columns.map((column, index) => (_jsx("p", { className: 'prefooter--columns__text', children: column }, index))) }), preFooter.hasButton && (_jsx(Button, { label: preFooter.buttonLabel, onClick: preFooter.buttonClick, link: preFooter.buttonLink, dataQa: 'cta-footer', isExternal: true, hasNoFollow: true }))] }) }) })), config.isSEMPage && config.isMobile && (_jsx("footer", { className: 'sem-footer', children: _jsxs("section", { className: 'sem-footer__wrapper', children: [_jsx("ul", { className: 'sem-footer__legal-links', children: companyBlock.links }), _jsxs("div", { className: 'sem-footer__contact-info', children: [_jsxs("div", { className: 'sem-footer__contact-info__phone', children: [_jsx(PhoneIcon, { width: 20, height: 20, fill: 'white' }), _jsxs("b", { children: [config.sitePhone, " "] })] }), _jsx("div", { className: 'sem-footer__contact-info__schedule', children: config.siteSchedule })] }), _jsx("div", { className: 'fixed-container', children: footer.createDocumentBlock })] }) })), !config.isSEMPage && (_jsxs("footer", { children: [!config.hide && !config.noFooter ? (_jsxs(_Fragment, { children: [_jsx("div", { className: 'language-selector-mobile-container', children: languageSelector.show === true && languageSelector.content }), _jsxs("section", { className: 'footer__wrapper', children: [_jsxs("div", { className: 'footer__products', children: [_jsx("p", { className: 'sans-serif --small footer-links__title', children: productsBlock.title }), productsBlock.productsCategories, _jsx("div", { className: 'sans-serif --extra-small product-categories', children: productsBlock.allProductsLink })] }), _jsxs("div", { className: 'footer__popular-documents', children: [_jsx("p", { className: 'sans-serif --small footer-links__title', children: popularDocumentsBlock.title }), _jsx("ul", { children: popularDocumentsBlock.popularDocuments }), config.isTablet && (_jsxs("div", { className: 'footer__help__tablet', children: [_jsx("p", { className: 'sans-serif --small footer-links__title', children: helpBlock.title }), _jsx("ul", { children: helpBlock.links })] }))] }), (config.isMobile || config.isDesktop) && (_jsxs("div", { className: 'footer__company', children: [_jsx("p", { className: 'sans-serif --small footer-links__title', children: companyBlock.title }), _jsx("ul", { children: companyBlock.links })] })), _jsx("div", { className: 'footer__company__resources__findUs', children: config.isTablet && (_jsxs(_Fragment, { children: [_jsx("p", { className: 'sans-serif --small footer-links__title', children: companyBlock.title }), _jsx("ul", { children: companyBlock.links }), !config.isJonSnow && config.hasGrav && config.isTablet && (_jsxs("div", { className: 'footer__resources', children: [_jsx("p", { className: 'sans-serif --small footer-links__title', children: resourcesBlock.title }), _jsx("ul", { children: resourcesBlock.links })] }))] })) }), !config.isTablet && (_jsx("div", { className: 'footer__help__resources', children: _jsxs("div", { children: [_jsxs("div", { className: 'footer__help', children: [_jsx("p", { className: 'sans-serif --small footer-links__title', children: helpBlock.title }), _jsx("ul", { children: helpBlock.links })] }), !config.isJonSnow && config.hasGrav && (_jsxs("div", { className: 'footer__resources', children: [_jsx("p", { className: 'sans-serif --small footer-links__title', children: resourcesBlock.title }), _jsx("ul", { children: resourcesBlock.links })] }))] }) })), _jsxs("div", { className: 'footer__findUs', children: [_jsxs("div", { className: 'find-us-container', children: [!config.isJonSnow && (_jsxs(_Fragment, { children: [_jsxs("div", { className: 'find-us-content', children: [_jsx("p", { className: 'sans-serif --small footer-links__title', children: footerData?.findUs }), _jsxs("ul", { children: [_jsx("li", { children: _jsx("a", { href: 'https://www.facebook.com/lawdistrictlegal', rel: 'noopener noreferrer', target: '_blank', children: _jsx("img", { src: facebook, alt: 'Facebook logo', width: '32', height: '32' }) }) }), _jsx("li", { children: _jsx("a", { href: 'https://twitter.com/district_law', rel: 'noopener noreferrer', target: '_blank', children: _jsx("img", { src: x, alt: 'Twitter logo', width: '32', height: '32' }) }) }), _jsx("li", { children: _jsx("a", { href: 'https://www.linkedin.com/company/law-district/', rel: 'noopener noreferrer', target: '_blank', children: _jsx("img", { src: linkedin, alt: 'Linkedin logo', width: '32', height: '32' }) }) }), _jsx("li", { children: _jsx("a", { href: 'https://www.pinterest.com/lawdistrict/', rel: 'noopener noreferrer', target: '_blank', children: _jsx("img", { src: pinterest, alt: 'Pinterest logo', width: '32', height: '32' }) }) })] })] }), _jsxs("div", { className: 'footer-contact-box', children: [_jsx("span", { className: 'footer-contact-box_phone', children: config.sitePhone }), _jsx(Button, { centered: true, isExternal: true, link: `tel:${config.sitePhone}`, givenClass: 'footer-contact-box-button', label: config.sitePhone, dataQa: 'footer_contact_box' }), _jsx("span", { className: 'footer-contact-box_schedule', children: config.siteSchedule.replace(/(\d)/, '\n$1') })] })] })), _jsx("div", { className: 'footer__logo', children: _jsx(Logo, { className: 'footer__logo-image', siteName: config.siteName, width: '138', height: '24', type: 'white' }) })] }), config.hasTrustPilot && footer.trustPilotWidget] }), !config.isJonSnow && (_jsxs("div", { className: 'footer-mobile-contact-box', children: [_jsx("span", { className: 'footer-mobile-contact-box_phone', children: config.sitePhone }), _jsx(Button, { centered: true, isExternal: true, link: `tel:${config.sitePhone}`, givenClass: 'footer-mobile-contact-box-button', label: config.sitePhone, dataQa: 'footer_contact_box' }), config.siteSchedule && (_jsx("p", { className: 'footer-mobile-contact-box_schedule', children: config.siteSchedule }))] }))] })] })) : null, config.hasContactBar && (_jsx(WideInfoBar, { children: _jsxs(_Fragment, { children: [_jsxs("div", { className: `contact-bar-wrapper ${(config.isJonSnow || config.isAnonymousPayment) && 'hidden'}`, children: [_jsx(IconWeb, {}), _jsxs("div", { className: 'contact-bar-wrapper__text', children: [_jsxs("div", { className: 'is-mobile', children: [_jsx("a", { className: 'phone', href: `tel:${config.sitePhone}`, children: _jsx("strong", { children: config.sitePhone }) }), ` - ${config.siteSchedule}`] }), _jsxs("div", { className: 'no-mobile', children: [_jsx("strong", { children: config.sitePhone }), " - ", config.siteSchedule] })] })] }), _jsxs("div", { className: 'contact-bar-wrapper', children: [_jsx("img", { src: securityIconBlack, alt: '' }), _jsx("p", { className: 'contact-bar-wrapper__text', children: footer.securityText })] }), _jsxs("div", { className: 'contact-bar-wrapper', children: [_jsx("img", { src: guaranteeIconGrey, alt: '' }), _jsx("p", { className: 'contact-bar-wrapper__text', children: footer.guaranteeText })] })] }) })), footer.disclaimerText && _jsx(Disclaimer, { text: footer.disclaimerText, siteUrl: config.siteUrl }), _jsx("div", { className: 'fixed-container', children: footer.createDocumentBlock })] })), footer.bottomFixedBlock] }));
 };

package/dist/src/components/atoms/FixedFooter/FixedFooter.styled.js

@@ -1,3 +1,4 @@
+import { size } from '../../../globalStyles/breakpoints';
 import styled from 'styled-components';
 export const FixedFooterStyled = styled.div `
   .prefooter {
@@ -55,7 +56,7 @@ export const FixedFooterStyled = styled.div `
     margin: auto;
     padding: 2.75rem 1rem 1rem;
   }
-  @media (min-width: 720px) {
+  @media (min-width: 1024px) {
     footer .language-selector-mobile-container {
       display: none;
     }
@@ -745,6 +746,19 @@ export const FixedFooterStyled = styled.div `
   .contact-bar-wrapper {
     display: flex;
     align-items: center;
+    flex: 1;
+    min-width: 0;
+  }
+  @media (min-width: 768px) {
+    .contact-bar-wrapper {
+      flex: 1;
+      min-width: 0;
+    }
+  }
+  @media (min-width: ${size.sm}) {
+    .contact-bar-wrapper {
+      flex: none;
+    }
   }
   .contact-bar-wrapper.hidden {
     display: none;
@@ -753,10 +767,20 @@ export const FixedFooterStyled = styled.div `
     width: -moz-max-content;
     width: max-content;
     margin: 0.25rem;
+    flex: 1;
+    min-width: 0;
   }
-  @media (min-width: 720px) {
+  @media (min-width: 768px) {
+    .contact-bar-wrapper__text {
+      margin: 0.5rem;
+      flex: 1;
+      min-width: 0;
+    }
+  }
+  @media (min-width: ${size.sm}) {
     .contact-bar-wrapper__text {
       margin: 1rem 0.5rem;
+      flex: none;
     }
   }
   .contact-bar-wrapper__text .phone {
@@ -799,14 +823,24 @@ export const FixedFooterStyled = styled.div `
       justify-content: space-between;
       padding: 1rem 2rem;
 
+      @media (min-width: 768px) {
+        flex-flow: row;
+        font-size: 0.9rem;
+        padding: 1rem 2rem;
+        gap: 1rem;
+        flex-wrap: wrap;
+      }
+
       @media (min-width: 720px) {
         flex-flow: row;
         font-size: 0.9rem;
         padding: 0;
+        gap: 0.5rem;
       }
 
-      @media {
+      @media (min-width: 960px) {
         padding: 0;
+        gap: 1rem;
       }
     }
   }

package/dist/src/components/atoms/FixedFooter/FixedFooter.styled.ts

@@ -1,3 +1,4 @@
+import { size } from '../../../globalStyles/breakpoints'
 import styled from 'styled-components'
 
 export const FixedFooterStyled = styled.div`
@@ -56,7 +57,7 @@ export const FixedFooterStyled = styled.div`
     margin: auto;
     padding: 2.75rem 1rem 1rem;
   }
-  @media (min-width: 720px) {
+  @media (min-width: 1024px) {
     footer .language-selector-mobile-container {
       display: none;
     }
@@ -746,6 +747,19 @@ export const FixedFooterStyled = styled.div`
   .contact-bar-wrapper {
     display: flex;
     align-items: center;
+    flex: 1;
+    min-width: 0;
+  }
+  @media (min-width: 768px) {
+    .contact-bar-wrapper {
+      flex: 1;
+      min-width: 0;
+    }
+  }
+  @media (min-width: ${size.sm}) {
+    .contact-bar-wrapper {
+      flex: none;
+    }
   }
   .contact-bar-wrapper.hidden {
     display: none;
@@ -754,10 +768,20 @@ export const FixedFooterStyled = styled.div`
     width: -moz-max-content;
     width: max-content;
     margin: 0.25rem;
+    flex: 1;
+    min-width: 0;
   }
-  @media (min-width: 720px) {
+  @media (min-width: 768px) {
+    .contact-bar-wrapper__text {
+      margin: 0.5rem;
+      flex: 1;
+      min-width: 0;
+    }
+  }
+  @media (min-width: ${size.sm}) {
     .contact-bar-wrapper__text {
       margin: 1rem 0.5rem;
+      flex: none;
     }
   }
   .contact-bar-wrapper__text .phone {
@@ -800,14 +824,24 @@ export const FixedFooterStyled = styled.div`
       justify-content: space-between;
       padding: 1rem 2rem;
 
+      @media (min-width: 768px) {
+        flex-flow: row;
+        font-size: 0.9rem;
+        padding: 1rem 2rem;
+        gap: 1rem;
+        flex-wrap: wrap;
+      }
+
       @media (min-width: 720px) {
         flex-flow: row;
         font-size: 0.9rem;
         padding: 0;
+        gap: 0.5rem;
       }
 
-      @media {
+      @media (min-width: 960px) {
         padding: 0;
+        gap: 1rem;
       }
     }
   }

package/dist/src/components/atoms/FixedFooter/FixedFooter.tsx

@@ -14,6 +14,10 @@ import pinterest from '../../../../images/svg/pinterest.svg'
 import securityIconBlack from '../../../../images/svg/icon-24-px-security_black.svg'
 import x from '../../../../images/svg/x.svg'
 
+/**
+ * @deprecated Este componentes será removido en el futuro. Use `Footer` en su lugar.
+ * @deprecatedSince 7.8.0
+ */
 export const FixedFooter: React.FC<FixedFooterProps> = ({
   footerData = {
     findUs: 'Find Us'
@@ -245,7 +249,7 @@ export const FixedFooter: React.FC<FixedFooterProps> = ({
                     )}
                     <div className={'footer__logo'}>
                       <Logo
-                        className='footer__lawdistrict'
+                        className='footer__logo-image'
                         siteName={config.siteName}
                         width='138'
                         height='24'

package/dist/src/components/atoms/IconImage/IconImage.js

@@ -1,5 +1,5 @@
 import { jsx as _jsx } from "react/jsx-runtime";
-const IconImage = ({ iconName, baseSrcUrl = undefined, givenClass, iconFormat = 'svg' }) => {
-    return (_jsx("img", { className: givenClass, src: `${baseSrcUrl ?? process.env.ASSETS_URL + '/'}${iconName}.${iconFormat}`, alt: '', role: 'img' }));
+const IconImage = ({ iconName, baseSrcUrl = 'https://assets.lawdistrict.com/', givenClass, iconFormat = 'svg' }) => {
+    return _jsx("img", { className: givenClass, src: `${baseSrcUrl}${iconName}.${iconFormat}`, alt: '', role: 'img' });
 };
 export default IconImage;

package/dist/src/components/atoms/IconImage/IconImage.tsx

@@ -2,15 +2,13 @@ import React from 'react'
 
 import { type IconImageProps } from './IconImageProps.types'
 
-const IconImage: React.FC<IconImageProps> = ({ iconName, baseSrcUrl = undefined, givenClass, iconFormat = 'svg' }) => {
-  return (
-    <img
-      className={givenClass}
-      src={`${baseSrcUrl ?? process.env.ASSETS_URL + '/'}${iconName}.${iconFormat}`}
-      alt=''
-      role='img'
-    />
-  )
+const IconImage: React.FC<IconImageProps> = ({
+  iconName,
+  baseSrcUrl = 'https://assets.lawdistrict.com/',
+  givenClass,
+  iconFormat = 'svg'
+}) => {
+  return <img className={givenClass} src={`${baseSrcUrl}${iconName}.${iconFormat}`} alt='' role='img' />
 }
 
 export default IconImage

package/dist/src/components/atoms/IconTextInfoSection/IconTextInfoSection.js

@@ -2,5 +2,5 @@ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import React from 'react';
 import { IconTextInfoSectionStyled } from './IconTextInfoSection.styled';
 export const IconTextInfoSection = ({ items, classnames = '' }) => {
-    return (_jsx(IconTextInfoSectionStyled, { className: `icon-text-info-section bottom-side ${classnames}`, children: items.map(({ text, src }, index) => (_jsxs(React.Fragment, { children: [_jsxs("div", { className: 'box', children: [_jsx("div", { className: 'item-image', children: _jsx("img", { className: 'image', src: src, alt: 'create' }) }), _jsx("div", { className: 'item-text', children: _jsx("p", { className: 'no-margin', children: text }) })] }), items.length - 1 !== index && _jsx("div", { className: 'icon-text-info-section__separator' })] }, `${src}-${index}`))) }));
+    return (_jsx(IconTextInfoSectionStyled, { className: `icon-text-info-section bottom-side ${classnames}`, children: items.map(({ text, src }, index) => (_jsxs(React.Fragment, { children: [_jsxs("div", { className: 'box', children: [_jsx("div", { className: 'item-image', children: _jsx("img", { className: 'image', src: src, alt: text, title: text }) }), _jsx("div", { className: 'item-text', children: _jsx("p", { className: 'no-margin', children: text }) })] }), items.length - 1 !== index && _jsx("div", { className: 'icon-text-info-section__separator' })] }, `${src}-${index}`))) }));
 };

package/dist/src/components/atoms/IconTextInfoSection/IconTextInfoSection.tsx

@@ -10,7 +10,7 @@ export const IconTextInfoSection: React.FC<IconTextInfoSectionProps> = ({ items,
         <React.Fragment key={`${src}-${index}`}>
           <div className='box'>
             <div className='item-image'>
-              <img className='image' src={src} alt='create'></img>
+              <img className='image' src={src} alt={text} title={text}></img>
             </div>
             <div className='item-text'>
               <p className='no-margin'>{text}</p>

package/dist/src/components/atoms/JumbotronStatic/JumbotronStatic.js

@@ -1,5 +1,6 @@
 import { jsx as _jsx } from "react/jsx-runtime";
 import { JumbotronStaticStyled } from './JumbotronStatic.styled';
-export const JumbotronStatic = ({ title }) => {
-    return (_jsx(JumbotronStaticStyled, { className: 'jumbotron--static', children: _jsx("h1", { className: 'serif --super-hero', children: title }) }));
+export const JumbotronStatic = ({ title, locale }) => {
+    const shorterTitle = locale?.includes('DE') ? 'shorter-text' : '';
+    return (_jsx(JumbotronStaticStyled, { className: 'jumbotron--static', children: _jsx("h1", { className: `${shorterTitle} serif --super-hero`, children: title }) }));
 };

package/dist/src/components/atoms/JumbotronStatic/JumbotronStatic.styled.js

@@ -4,4 +4,10 @@ export const JumbotronStaticStyled = styled.section `
   margin: 0 auto;
   background-color: var(--primary-main-light-6);
   padding: 2.5rem 1rem 4rem;
+
+  .shorter-text.serif {
+    &.--super-hero {
+      font-size: 1.75rem;
+    }
+  }
 `;