Naming Groups Within Groups

Every group has a generalizable structure that we are going to use to further standardize the naming of groups within groups.

Below you will find a detailed outline of their different contexts and naming conventions:

Group Name	Context	Design Notes
GP {page} Container	This should be the first group on every page	This group should contain the base conditional logic that makes the whole page responsive.
GP {PG} Container	This group is primarily used as the first group label for any groups with multiple subsections or other complex groupings.	This group may not always be needed. A good context for such a group is when you have multiple "pages" nested and hidden within a single page. E.g. GP Users Container, GP Admin Container.
GP {PGI} Content OR GP {PGI} {CG} Content	This group is used as the container for simpler groups that primarily display content (e.g. text, img)	This will likely get used in most groups, particularly ones with minimal elements. It is usually one of the first nested groups under the parent group.
GP {PGI} Head	This is the header, upper, or first section within a group.	"Head" is used to avoid confusion with headers when searching. Common elements found in this group are: Titles/headings, helper text, icons, avatars/logos/images.
GP {PGI} Body	This is the main/central section within a group	Common elements found in this group are: repeating groups, plugins, reusable elements, long text sections, images, etc.
GP {PGI} Foot	This is the footer, lower, or last section within a group.	"Foot" is used to avoid confusion with footers when searching. Common elements found in this group are: socials, icons, links, etc.
GP {PGI} Card OR GP {PGI} RG Card (when used in a RG)	A card contains all the information of 1 thing (e.g. user, pricing option)	Cards are typically used in repeating groups, but may be used elsewhere. They should be the first group inside the repeating group. They typically have a background and a border as styling.
GP {PG} Cell or GP {PG} RG Cell or GP {PG} TBL Cell	A cell contains all the information of 1 instance or data point (chat message, admin or finance data)	Cells are used in tables, appear commonly in repeating groups, and may be used elsewhere. They should be the first group inside the TBL/RG/GP and pull data from databases or APIs. They typically have no background and or border as styling, but may have styling in use cases like chat.
RG {PG}, or RG {PG} {CG}	A repeating group is used to pull multiple data items.	Repeating groups should use predominantly transparent separators to create spacing between cards.