Add introduction with aws partner logo

56kcloud · Dec 4, 2023 · c8414f2 · c8414f2
1 parent eec8ef9
commit c8414f2
Show file tree

Hide file tree

Showing 14 changed files with 2,805 additions and 231 deletions.
diff --git a/apps/cms/package.json b/apps/cms/package.json
@@ -15,10 +15,10 @@
     "strapi": "strapi"
   },
   "dependencies": {
-    "@strapi/plugin-i18n": "^4.15.4",
-    "@strapi/plugin-users-permissions": "4.15.4",
-    "@strapi/provider-upload-aws-s3": "^4.15.4",
-    "@strapi/strapi": "4.15.4",
+    "@strapi/plugin-i18n": "^4.14.5",
+    "@strapi/plugin-users-permissions": "4.14.5",
+    "@strapi/provider-upload-aws-s3": "^4.14.5",
+    "@strapi/strapi": "4.14.5",
     "better-sqlite3": "9.1.1",
     "pg": "^8.11.3",
     "react": "^18.2.0",

diff --git a/apps/cms/src/api/home-page/content-types/home-page/schema.json b/apps/cms/src/api/home-page/content-types/home-page/schema.json
@@ -30,7 +30,8 @@
         "partner-sections.partner-logo-simple-with-title",
         "customer-sections.customer-logo-simple-with-title",
         "blog-sections.blog-three-column",
-        "contact-sections.contact-split-with-pattern"
+        "contact-sections.contact-split-with-pattern",
+        "content-section.introduction-with-logo"
       ],
       "required": true
     },

diff --git a/apps/cms/src/components/content-section/introduction-with-logo.json b/apps/cms/src/components/content-section/introduction-with-logo.json
@@ -0,0 +1,25 @@
+{
+  "collectionName": "components_content_section_introduction_with_logos",
+  "info": {
+    "displayName": "introduction-with-logo"
+  },
+  "options": {},
+  "attributes": {
+    "title": {
+      "type": "string",
+      "required": true
+    },
+    "description": {
+      "type": "text",
+      "required": true
+    },
+    "logo": {
+      "allowedTypes": [
+        "images"
+      ],
+      "type": "media",
+      "multiple": false,
+      "required": true
+    }
+  }
+}
diff --git a/apps/cms/types/generated/components.d.ts b/apps/cms/types/generated/components.d.ts
@@ -95,6 +95,18 @@ export interface ContentSectionContentTwoColumn extends Schema.Component {
   };
 }
 
+export interface ContentSectionIntroductionWithLogo extends Schema.Component {
+  collectionName: 'components_content_section_introduction_with_logos';
+  info: {
+    displayName: 'introduction-with-logo';
+  };
+  attributes: {
+    title: Attribute.String & Attribute.Required;
+    description: Attribute.Text & Attribute.Required;
+    logo: Attribute.Media & Attribute.Required;
+  };
+}
+
 export interface CtaSectionsJoinOurTeam extends Schema.Component {
   collectionName: 'components_cta_sections_join_our_teams';
   info: {
@@ -637,6 +649,7 @@ declare module '@strapi/types' {
       'contact-sections.contact-split-with-pattern': ContactSectionsContactSplitWithPattern;
       'content-section.content-markdown': ContentSectionContentMarkdown;
       'content-section.content-two-column': ContentSectionContentTwoColumn;
+      'content-section.introduction-with-logo': ContentSectionIntroductionWithLogo;
       'cta-sections.join-our-team': CtaSectionsJoinOurTeam;
       'cta.button': CtaButton;
       'customer-sections.customer-logo-simple-with-title': CustomerSectionsCustomerLogoSimpleWithTitle;

diff --git a/apps/cms/types/generated/contentTypes.d.ts b/apps/cms/types/generated/contentTypes.d.ts
@@ -931,7 +931,8 @@ export interface ApiHomePageHomePage extends Schema.SingleType {
         'partner-sections.partner-logo-simple-with-title',
         'customer-sections.customer-logo-simple-with-title',
         'blog-sections.blog-three-column',
-        'contact-sections.contact-split-with-pattern'
+        'contact-sections.contact-split-with-pattern',
+        'content-section.introduction-with-logo'
       ]
     > &
       Attribute.Required &

diff --git a/apps/www/src/components/ui/atoms/avatar/index.tsx b/apps/www/src/components/ui/atoms/avatar/index.tsx
@@ -19,7 +19,7 @@ export default function Avatar({size, image}: AvatarProps) {
       <div className='relative w-full h-full overflow-hidden rounded-full bg-white/20'>
         {image && <Image
           src={image.url}
-          placeholder='blur'
+          placeholder={image.placeholder ? 'blur' : 'empty'}
           blurDataURL={image.placeholder}
           alt={image.alternateText || image.name}
           width={image.width}

diff --git a/apps/www/src/components/ui/molecules/cards/cover/index.tsx b/apps/www/src/components/ui/molecules/cards/cover/index.tsx
@@ -44,7 +44,7 @@ export default function CardCover({image, fixedHeight, className}: CardCoverProp
         src={image.url}
         alt={image.alternateText || image.name}
         onLoad={() => {setIsLoaded(true)}}
-        placeholder='blur'
+        placeholder={image.placeholder ? 'blur' : 'empty'}
         blurDataURL={image.placeholder}
         fill
         className={cn('object-cover', isLoaded && 'bg-white')}

diff --git a/apps/www/src/components/ui/molecules/cards/rectangle/index.tsx b/apps/www/src/components/ui/molecules/cards/rectangle/index.tsx
@@ -21,7 +21,7 @@ export default function RectangleCard({number, image, title, className}: Rectang
             src={image.url}
             width={image.width}
             height={image.height}
-            placeholder='blur'
+            placeholder={image.placeholder ? 'blur' : 'empty'}
             blurDataURL={image.placeholder}
             alt={title}
           />

diff --git a/apps/www/src/components/ui/organisms/content-sections/introduction-with-logo/index.tsx b/apps/www/src/components/ui/organisms/content-sections/introduction-with-logo/index.tsx
@@ -0,0 +1,32 @@
+import {ImageProps} from '@/models/image.model'
+import Image from 'next/image'
+
+export type IntroductionWithLogoProps = {
+    title: string
+    description: string
+    logo: ImageProps
+}
+
+const IntroductionWithLogo = (props: IntroductionWithLogoProps) => {
+  return (
+    <div className='py-20 lg:py-[104px]'>
+      <div className='px-6 mx-auto max-w-7xl lg:px-8'>
+        <div className='flex gap-10 px-6 py-8 lg:px-12 rounded-xl bg-slate-800 lg:py-14'>
+          <div className='w-3/4'>
+            <div className='text-2xl font-medium text-white sm:text-3xl'>{props.title}</div>
+            <div className='mt-2 text-[18px] leading-8 text-slate-400 font-light'>{props.description}</div>
+          </div>
+          <div className='flex items-center justify-center w-1/4'>
+            <Image
+              src={props.logo.url} 
+              width={135}
+              height={135}
+              alt={props.logo.alternateText || props.logo.name}
+            />
+          </div>
+        </div>
+      </div>
+    </div>
+  )
+}
+export default IntroductionWithLogo
diff --git a/...ww/src/components/ui/organisms/hero-sections/hero-simple-center-with-background/index.tsx b/...ww/src/components/ui/organisms/hero-sections/hero-simple-center-with-background/index.tsx
@@ -65,7 +65,7 @@ export default function HeroSimpleCenterWithBackground(props: SimpleCenteredWith
             <Image
               alt={'Background'}
               src={props.image.url}
-              placeholder='blur'
+              placeholder={props.image.placeholder ? 'blur' : 'empty'}
               blurDataURL={props.image.placeholder}
               width={props.image.width}
               height={props.image.height}

diff --git a/apps/www/src/components/ui/organisms/image-sections/image-simple.tsx b/apps/www/src/components/ui/organisms/image-sections/image-simple.tsx
@@ -12,7 +12,7 @@ export default function ImageSimple(props: ImageSimpleProps) {
         src={props.image.url}
         width={props.image.width}
         height={props.image.height}
-        placeholder='blur'
+        placeholder={props.image.placeholder ? 'blur' : 'empty'}
         blurDataURL={props.image.placeholder}
         alt={props.image.alternateText || props.image.name}
         className='aspect-[9/4] w-full object-cover xl:rounded-3xl'

diff --git a/apps/www/src/components/ui/organisms/team-sections/team-three-column/index.tsx b/apps/www/src/components/ui/organisms/team-sections/team-three-column/index.tsx
@@ -27,7 +27,7 @@ export default function TeamThreeColumn(props: TeamThreeColumnProps) {
               src={TeamMember.avatar.url}
               width={TeamMember.avatar.width}
               height={TeamMember.avatar.height}
-              placeholder='blur'
+              placeholder={TeamMember.avatar.placeholder ? 'blur' : 'empty'}
               blurDataURL={TeamMember.avatar.placeholder}
               alt={TeamMember.name}
               className='aspect-[14/13] w-full rounded-2xl object-cover'

diff --git a/apps/www/src/utils/cms/renderer/components.tsx b/apps/www/src/utils/cms/renderer/components.tsx
@@ -13,6 +13,7 @@ import HeaderWithCards from '@/components/ui/organisms/header-sections/header-wi
 import HeroSimpleCenter from '@/components/ui/organisms/hero-sections/hero-simple-center'
 import HeroSimpleCenterWithBackground from '@/components/ui/organisms/hero-sections/hero-simple-center-with-background'
 import ImageSimple from '@/components/ui/organisms/image-sections/image-simple'
+import IntroductionWithLogo from '@/components/ui/organisms/content-sections/introduction-with-logo'
 import JoinOurTeam from '@/components/ui/organisms/cta-sections/join-our-team'
 import PartnerLogosSimpleWithTitle from '@/components/ui/organisms/partner-sections/partner-logos-simple-with-title'
 import ServiceThreeColumnWithLargeIcons from
@@ -50,7 +51,8 @@ export const componentBlueprints: ComponentBlueprints = {
   'tag-filter': TagFilter,
   'team-member-card': TeamMemberCard,
   'header-with-cards': HeaderWithCards,
-  'content-markdown': ContentMarkdown
+  'content-markdown': ContentMarkdown,
+  'introduction-with-logo': IntroductionWithLogo
 }
 export type ComponentBlueprint = {
   component: keyof ComponentBlueprints