Updating to NEW COLOR SCHEME 3

docs/docs/auto-docs/components/EventCalendar/EventHeader/functions/default.md

@@ -6,7 +6,7 @@
 
 > **default**(`__namedParameters`): `JSX.Element`
 
-Defined in: [src/components/EventCalendar/EventHeader.tsx:45](https://github.com/PalisadoesFoundation/talawa-admin/blob/main/src/components/EventCalendar/EventHeader.tsx#L45)
+Defined in: [src/components/EventCalendar/EventHeader.tsx:47](https://github.com/PalisadoesFoundation/talawa-admin/blob/main/src/components/EventCalendar/EventHeader.tsx#L47)
 
 EventHeader component displays the header for the event calendar.
 It includes a search field, view type dropdown, event type dropdown, and a button to create an event.
@@ -37,5 +37,7 @@ class (e.g., .addButton) is now applied.
 
 ### Global CSS Classes used:
 - `.dropdown`
+- `.btnsContainer`
+- `.btnsBlock`
 
 For more details on the reusable classes, refer to the global CSS file.

docs/docs/auto-docs/components/UpdateSession/UpdateSession/functions/default.md

@@ -6,7 +6,7 @@
 
 > **default**(`props`, `deprecatedLegacyContext`?): `ReactNode`
 
-Defined in: [src/components/UpdateSession/UpdateSession.tsx:29](https://github.com/PalisadoesFoundation/talawa-admin/blob/main/src/components/UpdateSession/UpdateSession.tsx#L29)
+Defined in: [src/components/UpdateSession/UpdateSession.tsx:46](https://github.com/PalisadoesFoundation/talawa-admin/blob/main/src/components/UpdateSession/UpdateSession.tsx#L46)
 
 ## Parameters
 

docs/docs/auto-docs/components/UserPortal/DonationCard/DonationCard/functions/default.md

@@ -6,7 +6,7 @@
 
 > **default**(`props`): `JSX.Element`
 
-Defined in: [src/components/UserPortal/DonationCard/DonationCard.tsx:19](https://github.com/PalisadoesFoundation/talawa-admin/blob/main/src/components/UserPortal/DonationCard/DonationCard.tsx#L19)
+Defined in: [src/components/UserPortal/DonationCard/DonationCard.tsx:36](https://github.com/PalisadoesFoundation/talawa-admin/blob/main/src/components/UserPortal/DonationCard/DonationCard.tsx#L36)
 
 Displays a card with details about a donation.
 
@@ -26,3 +26,20 @@ The properties passed to the component.
 `JSX.Element`
 
 The rendered donation card component.
+
+## CSS Strategy Explanation:
+
+To ensure consistency across the application and reduce duplication, common styles
+(such as button styles) have been moved to the global CSS file. Instead of using
+component-specific classes (e.g., `.greenregbtnOrganizationFundCampaign`, `.greenregbtnPledge`), a single reusable
+class (e.g., .addButton) is now applied.
+
+### Benefits:
+- **Reduces redundant CSS code.
+- **Improves maintainability by centralizing common styles.
+- **Ensures consistent styling across components.
+
+### Global CSS Classes used:
+- `.addButton`
+
+For more details on the reusable classes, refer to the global CSS file.

docs/docs/auto-docs/components/UserPortal/PeopleCard/PeopleCard/functions/default.md

@@ -6,7 +6,7 @@
 
 > **default**(`props`): `JSX.Element`
 
-Defined in: [src/components/UserPortal/PeopleCard/PeopleCard.tsx:30](https://github.com/PalisadoesFoundation/talawa-admin/blob/main/src/components/UserPortal/PeopleCard/PeopleCard.tsx#L30)
+Defined in: [src/components/UserPortal/PeopleCard/PeopleCard.tsx:47](https://github.com/PalisadoesFoundation/talawa-admin/blob/main/src/components/UserPortal/PeopleCard/PeopleCard.tsx#L47)
 
 PeopleCard component displays information about a person within an organization.
 
@@ -30,3 +30,20 @@ The properties passed to the component.
 `JSX.Element`
 
 JSX.Element representing a card with the person's details.
+
+## CSS Strategy Explanation:
+
+To ensure consistency across the application and reduce duplication, common styles
+(such as button styles) have been moved to the global CSS file. Instead of using
+component-specific classes (e.g., `.greenregbtnOrganizationFundCampaign`, `.greenregbtnPledge`), a single reusable
+class (e.g., .addButton) is now applied.
+
+### Benefits:
+- **Reduces redundant CSS code.
+- **Improves maintainability by centralizing common styles.
+- **Ensures consistent styling across components.
+
+### Global CSS Classes used:
+- `.blueText`
+
+For more details on the reusable classes, refer to the global CSS file.

docs/docs/auto-docs/components/UserPortal/PostCard/PostCard/functions/default.md

@@ -6,7 +6,7 @@
 
 > **default**(`props`): `JSX.Element`
 
-Defined in: [src/components/UserPortal/PostCard/PostCard.tsx:69](https://github.com/PalisadoesFoundation/talawa-admin/blob/main/src/components/UserPortal/PostCard/PostCard.tsx#L69)
+Defined in: [src/components/UserPortal/PostCard/PostCard.tsx:86](https://github.com/PalisadoesFoundation/talawa-admin/blob/main/src/components/UserPortal/PostCard/PostCard.tsx#L86)
 
 PostCard component displays an individual post, including its details, interactions, and comments.
 
@@ -30,3 +30,20 @@ The properties passed to the component including post details, comments, and rel
 `JSX.Element`
 
 JSX.Element representing a post card with interactive features.
+
+## CSS Strategy Explanation:
+
+To ensure consistency across the application and reduce duplication, common styles
+(such as button styles) have been moved to the global CSS file. Instead of using
+component-specific classes (e.g., `.greenregbtnOrganizationFundCampaign`, `.greenregbtnPledge`), a single reusable
+class (e.g., .addButton) is now applied.
+
+### Benefits:
+- **Reduces redundant CSS code.
+- **Improves maintainability by centralizing common styles.
+- **Ensures consistent styling across components.
+
+### Global CSS Classes used:
+- `.addButton`
+
+For more details on the reusable classes, refer to the global CSS file.

docs/docs/auto-docs/components/UserPortal/PromotedPost/PromotedPost/functions/default.md

@@ -6,7 +6,7 @@
 
 > **default**(`props`): `JSX.Element`
 
-Defined in: [src/components/UserPortal/PromotedPost/PromotedPost.tsx:23](https://github.com/PalisadoesFoundation/talawa-admin/blob/main/src/components/UserPortal/PromotedPost/PromotedPost.tsx#L23)
+Defined in: [src/components/UserPortal/PromotedPost/PromotedPost.tsx:41](https://github.com/PalisadoesFoundation/talawa-admin/blob/main/src/components/UserPortal/PromotedPost/PromotedPost.tsx#L41)
 
 PromotedPost component displays a card representing promoted content.
 
@@ -28,3 +28,21 @@ Properties passed to the component including an image, title, and ID.
 `JSX.Element`
 
 JSX.Element representing a card with promoted content.
+
+## CSS Strategy Explanation:
+
+To ensure consistency across the application and reduce duplication, common styles
+(such as button styles) have been moved to the global CSS file. Instead of using
+component-specific classes (e.g., `.greenregbtnOrganizationFundCampaign`, `.greenregbtnPledge`), a single reusable
+class (e.g., .addButton) is now applied.
+
+### Benefits:
+- **Reduces redundant CSS code.
+- **Improves maintainability by centralizing common styles.
+- **Ensures consistent styling across components.
+
+### Global CSS Classes used:
+- `.cardHeaderPromotedPost`
+- `.imageContainerPromotedPost`
+
+For more details on the reusable classes, refer to the global CSS file.

docs/docs/auto-docs/components/UserPortal/StartPostModal/StartPostModal/functions/default.md

@@ -6,7 +6,7 @@
 
 > **default**(`__namedParameters`): `Element`
 
-Defined in: [src/components/UserPortal/StartPostModal/StartPostModal.tsx:40](https://github.com/PalisadoesFoundation/talawa-admin/blob/main/src/components/UserPortal/StartPostModal/StartPostModal.tsx#L40)
+Defined in: [src/components/UserPortal/StartPostModal/StartPostModal.tsx:59](https://github.com/PalisadoesFoundation/talawa-admin/blob/main/src/components/UserPortal/StartPostModal/StartPostModal.tsx#L59)
 
 A modal component for creating a new post.
 
@@ -26,3 +26,22 @@ This modal includes:
 `Element`
 
 JSX.Element - The rendered modal component.
+
+## CSS Strategy Explanation:
+
+To ensure consistency across the application and reduce duplication, common styles
+(such as button styles) have been moved to the global CSS file. Instead of using
+component-specific classes (e.g., `.greenregbtnOrganizationFundCampaign`, `.greenregbtnPledge`), a single reusable
+class (e.g., .addButton) is now applied.
+
+### Benefits:
+- **Reduces redundant CSS code.
+- **Improves maintainability by centralizing common styles.
+- **Ensures consistent styling across components.
+
+### Global CSS Classes used:
+- `.modalHeader`
+- `.inputField`
+- `.addButton`
+
+For more details on the reusable classes, refer to the global CSS file.

docs/docs/auto-docs/components/UsersTableItem/UsersTableItem/functions/default.md

@@ -6,7 +6,7 @@
 
 > **default**(`props`): `Element`
 
-Defined in: [src/components/UsersTableItem/UsersTableItem.tsx:23](https://github.com/PalisadoesFoundation/talawa-admin/blob/main/src/components/UsersTableItem/UsersTableItem.tsx#L23)
+Defined in: [src/components/UsersTableItem/UsersTableItem.tsx:47](https://github.com/PalisadoesFoundation/talawa-admin/blob/main/src/components/UsersTableItem/UsersTableItem.tsx#L47)
 
 ## Parameters
 

docs/docs/auto-docs/screens/CommunityProfile/CommunityProfile/functions/default.md

@@ -6,7 +6,7 @@
 
 > **default**(): `Element`
 
-Defined in: [src/screens/CommunityProfile/CommunityProfile.tsx:40](https://github.com/PalisadoesFoundation/talawa-admin/blob/main/src/screens/CommunityProfile/CommunityProfile.tsx#L40)
+Defined in: [src/screens/CommunityProfile/CommunityProfile.tsx:59](https://github.com/PalisadoesFoundation/talawa-admin/blob/main/src/screens/CommunityProfile/CommunityProfile.tsx#L59)
 
 `CommunityProfile` component allows users to view and update their community profile details.
 
@@ -26,3 +26,22 @@ JSX.Element - The `CommunityProfile` component.
 ```tsx
 <CommunityProfile />
 ```
+
+## CSS Strategy Explanation:
+
+To ensure consistency across the application and reduce duplication, common styles
+(such as button styles) have been moved to the global CSS file. Instead of using
+component-specific classes (e.g., `.greenregbtnOrganizationFundCampaign`, `.greenregbtnPledge`), a single reusable
+class (e.g., .addButton) is now applied.
+
+### Benefits:
+- **Reduces redundant CSS code.
+- **Improves maintainability by centralizing common styles.
+- **Ensures consistent styling across components.
+
+### Global CSS Classes used:
+- `.inputField`
+- `.outlineButton`
+- `.addButton`
+
+For more details on the reusable classes, refer to the global CSS file.

docs/docs/auto-docs/screens/OrgList/OrgList/functions/default.md

@@ -6,7 +6,7 @@
 
 > **default**(): `JSX.Element`
 
-Defined in: [src/screens/OrgList/OrgList.tsx:53](https://github.com/PalisadoesFoundation/talawa-admin/blob/main/src/screens/OrgList/OrgList.tsx#L53)
+Defined in: [src/screens/OrgList/OrgList.tsx:58](https://github.com/PalisadoesFoundation/talawa-admin/blob/main/src/screens/OrgList/OrgList.tsx#L58)
 
 ## CSS Strategy Explanation:
 
@@ -23,6 +23,11 @@ class (e.g., .addButton) is now applied.
 ### Global CSS Classes used:
 - `.inputField`
 - `.searchButton`
+- `.btnsContainer`
+- `.input`
+- `.btnsBlock`
+- `.dropdown`
+- `.modalHeader`
 
 For more details on the reusable classes, refer to the global CSS file.
 

docs/docs/auto-docs/screens/OrgList/OrganizationModal/functions/default.md

@@ -6,7 +6,7 @@
 
 > **default**(`props`, `deprecatedLegacyContext`?): `ReactNode`
 
-Defined in: [src/screens/OrgList/OrganizationModal.tsx:55](https://github.com/PalisadoesFoundation/talawa-admin/blob/main/src/screens/OrgList/OrganizationModal.tsx#L55)
+Defined in: [src/screens/OrgList/OrganizationModal.tsx:75](https://github.com/PalisadoesFoundation/talawa-admin/blob/main/src/screens/OrgList/OrganizationModal.tsx#L75)
 
 Represents the organization modal component.
 

docs/docs/auto-docs/screens/UserPortal/Campaigns/Campaigns/functions/default.md

@@ -6,7 +6,7 @@
 
 > **default**(): `Element`
 
-Defined in: [src/screens/UserPortal/Campaigns/Campaigns.tsx:30](https://github.com/PalisadoesFoundation/talawa-admin/blob/main/src/screens/UserPortal/Campaigns/Campaigns.tsx#L30)
+Defined in: [src/screens/UserPortal/Campaigns/Campaigns.tsx:53](https://github.com/PalisadoesFoundation/talawa-admin/blob/main/src/screens/UserPortal/Campaigns/Campaigns.tsx#L53)
 
 The `Campaigns` component displays a list of fundraising campaigns for a specific organization.
 It allows users to search, sort, and view details about each campaign. Users can also add pledges to active campaigns.
@@ -16,3 +16,26 @@ It allows users to search, sort, and view details about each campaign. Users can
 `Element`
 
 The rendered component displaying the campaigns.
+
+## CSS Strategy Explanation:
+
+To ensure consistency across the application and reduce duplication, common styles
+(such as button styles) have been moved to the global CSS file. Instead of using
+component-specific classes (e.g., `.greenregbtnOrganizationFundCampaign`, `.greenregbtnPledge`), a single reusable
+class (e.g., .addButton) is now applied.
+
+### Benefits:
+- **Reduces redundant CSS code.
+- **Improves maintainability by centralizing common styles.
+- **Ensures consistent styling across components.
+
+### Global CSS Classes used:
+- `.btnsContainer`
+- `.input`
+- `.inputField`
+- `.searchButton`
+- `.btnsBlock`
+- `.regularBtn`
+- `.outlineBtn`
+
+For more details on the reusable classes, refer to the global CSS file.

docs/docs/auto-docs/screens/UserPortal/Donate/Donate/functions/default.md

@@ -6,7 +6,7 @@
 
 > **default**(): `JSX.Element`
 
-Defined in: [src/screens/UserPortal/Donate/Donate.tsx:65](https://github.com/PalisadoesFoundation/talawa-admin/blob/main/src/screens/UserPortal/Donate/Donate.tsx#L65)
+Defined in: [src/screens/UserPortal/Donate/Donate.tsx:84](https://github.com/PalisadoesFoundation/talawa-admin/blob/main/src/screens/UserPortal/Donate/Donate.tsx#L84)
 
 `donate` component allows users to make donations to an organization and view their previous donations.
 
@@ -34,3 +34,22 @@ It includes:
 `JSX.Element`
 
 The rendered component.
+
+## CSS Strategy Explanation:
+
+To ensure consistency across the application and reduce duplication, common styles
+(such as button styles) have been moved to the global CSS file. Instead of using
+component-specific classes (e.g., `.greenregbtnOrganizationFundCampaign`, `.greenregbtnPledge`), a single reusable
+class (e.g., .addButton) is now applied.
+
+### Benefits:
+- **Reduces redundant CSS code.
+- **Improves maintainability by centralizing common styles.
+- **Ensures consistent styling across components.
+
+### Global CSS Classes used:
+- `.inputField`
+- `.searchButton`
+- `.addButton`
+
+For more details on the reusable classes, refer to the global CSS file.

docs/docs/auto-docs/screens/UserPortal/Events/Events/functions/default.md

@@ -6,7 +6,7 @@
 
 > **default**(): `JSX.Element`
 
-Defined in: [src/screens/UserPortal/Events/Events.tsx:43](https://github.com/PalisadoesFoundation/talawa-admin/blob/main/src/screens/UserPortal/Events/Events.tsx#L43)
+Defined in: [src/screens/UserPortal/Events/Events.tsx:62](https://github.com/PalisadoesFoundation/talawa-admin/blob/main/src/screens/UserPortal/Events/Events.tsx#L62)
 
 Component to manage and display events for an organization.
 
@@ -18,3 +18,22 @@ It includes a calendar view, a form to create new events, and various filters an
 `JSX.Element`
 
 The JSX element for the events management interface.
+
+## CSS Strategy Explanation:
+
+To ensure consistency across the application and reduce duplication, common styles
+(such as button styles) have been moved to the global CSS file. Instead of using
+component-specific classes (e.g., `.greenregbtnOrganizationFundCampaign`, `.greenregbtnPledge`), a single reusable
+class (e.g., .addButton) is now applied.
+
+### Benefits:
+- **Reduces redundant CSS code.
+- **Improves maintainability by centralizing common styles.
+- **Ensures consistent styling across components.
+
+### Global CSS Classes used:
+- `.inputField`
+- `.switch`
+- `.addButton`
+
+For more details on the reusable classes, refer to the global CSS file.

docs/docs/auto-docs/screens/UserPortal/Organizations/Organizations/functions/default.md

@@ -6,7 +6,7 @@
 
 > **default**(): `JSX.Element`
 
-Defined in: [src/screens/UserPortal/Organizations/Organizations.tsx:78](https://github.com/PalisadoesFoundation/talawa-admin/blob/main/src/screens/UserPortal/Organizations/Organizations.tsx#L78)
+Defined in: [src/screens/UserPortal/Organizations/Organizations.tsx:102](https://github.com/PalisadoesFoundation/talawa-admin/blob/main/src/screens/UserPortal/Organizations/Organizations.tsx#L102)
 
 Component for displaying and managing user organizations.
 

docs/docs/auto-docs/screens/UserPortal/People/People/functions/default.md

@@ -6,12 +6,34 @@
 
 > **default**(): `JSX.Element`
 
-Defined in: [src/screens/UserPortal/People/People.tsx:40](https://github.com/PalisadoesFoundation/talawa-admin/blob/main/src/screens/UserPortal/People/People.tsx#L40)
+Defined in: [src/screens/UserPortal/People/People.tsx:62](https://github.com/PalisadoesFoundation/talawa-admin/blob/main/src/screens/UserPortal/People/People.tsx#L62)
 
 `People` component displays a list of people associated with an organization.
 It allows users to filter between all members and admins, search for members by their first name,
 and paginate through the list.
 
+## CSS Strategy Explanation:
+
+To ensure consistency across the application and reduce duplication, common styles
+(such as button styles) have been moved to the global CSS file. Instead of using
+component-specific classes (e.g., `.greenregbtnOrganizationFundCampaign`, `.greenregbtnPledge`), a single reusable
+class (e.g., .addButton) is now applied.
+
+### Benefits:
+- **Reduces redundant CSS code.
+- **Improves maintainability by centralizing common styles.
+- **Ensures consistent styling across components.
+
+### Global CSS Classes used:
+- `.btnsContainer`
+- `.input`
+- `.inputField`
+- `.searchButton`
+- `.btnsBlock`
+- `.dropdown`
+
+For more details on the reusable classes, refer to the global CSS file.
+
 ## Returns
 
 `JSX.Element`