Update to use stylesheets instead.

Sitecore · Apr 4, 2024 · 9084da7 · 9084da7
1 parent 36f6037
commit 9084da7
Show file tree

Hide file tree

Showing 8 changed files with 25 additions and 12 deletions.
diff --git a/src/Project/Sugcon2024/Sugcon/src/assets/sass/components/index.scss b/src/Project/Sugcon2024/Sugcon/src/assets/sass/components/index.scss
@@ -15,5 +15,6 @@
 @import 'link-list';
 @import 'rich-text';
 @import 'people-grid';
+@import 'speakers-grid';
 @import 'icon-link-list';
 
diff --git a/...ject/Sugcon2024/Sugcon/src/assets/sass/components/people-grid/_people-grid-container.scss b/...ject/Sugcon2024/Sugcon/src/assets/sass/components/people-grid/_people-grid-container.scss
@@ -0,0 +1,11 @@
+.people-grid-container {
+  &:not(.red-linear-gradient) {
+    color: #000;
+
+    & .person-job-role,
+    & .person-company {
+      color: #707070;
+    }
+  }
+}
+
diff --git a/src/Project/Sugcon2024/Sugcon/src/assets/sass/components/people-grid/index.scss b/src/Project/Sugcon2024/Sugcon/src/assets/sass/components/people-grid/index.scss
@@ -1 +1,2 @@
 @import 'red-linear-gradient';
+@import 'people-grid-container';
diff --git a/.../Sugcon2024/Sugcon/src/assets/sass/components/speakers-grid/_speakers-grid-container.scss b/.../Sugcon2024/Sugcon/src/assets/sass/components/speakers-grid/_speakers-grid-container.scss
@@ -0,0 +1,6 @@
+.speakers-grid-container {
+  & .person-job-role,
+  & .person-company {
+    color: #707070;
+  }
+}
diff --git a/src/Project/Sugcon2024/Sugcon/src/assets/sass/components/speakers-grid/index.scss b/src/Project/Sugcon2024/Sugcon/src/assets/sass/components/speakers-grid/index.scss
@@ -0,0 +1,2 @@
+@import 'speakers-grid-container';
+
diff --git a/src/Project/Sugcon2024/Sugcon/src/components/Basic Components/Person.tsx b/src/Project/Sugcon2024/Sugcon/src/components/Basic Components/Person.tsx
@@ -83,18 +83,10 @@ export const Default = (props: PersonProps): JSX.Element => {
           <JssText field={props.fields.Name} />
         </Heading>
       )}
-      <Text
-        fontSize={props.isPeopleGrid ? '18px' : '16px'}
-        color={props.isPeopleGrid ? 'inherit' : 'sugcon.gray.500'}
-        mb={0}
-      >
+      <Text className="person-job-role" mb={0}>
         <JssText field={props.fields.JobRole} />
       </Text>
-      <Text
-        fontSize={props.isPeopleGrid ? '18px' : '16px'}
-        color={props.isPeopleGrid ? 'inherit' : 'sugcon.gray.500'}
-        mb="13px"
-      >
+      <Text className="person-company" mb="13px">
         <JssText field={props.fields.Company} />
       </Text>
       {(isEditorActive() ||

diff --git a/src/Project/Sugcon2024/Sugcon/src/components/List Components/PeopleGrid.tsx b/src/Project/Sugcon2024/Sugcon/src/components/List Components/PeopleGrid.tsx
@@ -47,7 +47,7 @@ export const Default = (props: PeopleGridProps): JSX.Element => {
   }
 
   return (
-    <Box w="100%" mt={20} className={clsx(props?.params?.Styles)}>
+    <Box w="100%" mt={20} className={clsx('people-grid-container', props?.params?.Styles)}>
       <LayoutFlex flexGrow="1" flexDirection="column" align="start">
         <Heading as={JssText} field={props.fields.Headline} tag="h2" size="lg" />
 

diff --git a/src/Project/Sugcon2024/Sugcon/src/components/List Components/SpeakersGrid.tsx b/src/Project/Sugcon2024/Sugcon/src/components/List Components/SpeakersGrid.tsx
@@ -127,7 +127,7 @@ export const Default = (props: PeopleGridProps): JSX.Element => {
   }
 
   return (
-    <Box w="100%" pr="0" pl="0" className={clsx(props?.params?.Styles)}>
+    <Box w="100%" pr="0" pl="0" className={clsx('speakers-grid-container', props?.params?.Styles)}>
       <Heading as={JssText} field={props.fields.Headline} tag="h2" size="lg" />
 
       <SimpleGrid