@manamerge/mana-atomic-ui 1.0.160 → 1.0.162

package/dist/themes/themes/ManamergeTheme.ts

@@ -27,9 +27,6 @@ import pint3 from "./manamerge/layouts/pint3";
 // vSizes
 import fontsizes from "./manamerge/miscellaneous/fontsizes";
 
-// colorPalette
-import colors from "./manamerge/miscellaneous/colorpalette";
-
 // Styling
 // import filterListTheme from "./manamerge/styling/filter-list-theme.css.js";
 // import chatTheme from "./manamerge/styling/chat-theme.css.js";
@@ -147,8 +144,6 @@ export const ManamergeTheme = {
     breakpoints,
     // vSizes
     fontsizes,
-    // colorPalette
-    colors,
 
     pages: {
         vod: {

package/dist/themes/themes/manamerge/atoms/heading.ts

@@ -1,4 +1,5 @@
 import colors from "../miscellaneous/colorpalette";
+import fontsizes from "../miscellaneous/fontsizes";
 
 const heading = {
     "Heading-primary-h1": {
@@ -7,21 +8,24 @@ const heading = {
             lineHeight: "34px",
             fontWeight: 700,
             color: colors.one.b,
-            margin: "0px"
+            margin: "0px",
+            fontFamily: "ManamergeGilmer"
         },
         tablet: {
             fontSize: "34px",
             lineHeight: "40px",
             fontWeight: 700,
             color: colors.one.b,
-            margin: "0px"
+            margin: "0px",
+            fontFamily: "ManamergeGilmer"
         },
         desktop: {
             fontSize: "36px",
             lineHeight: "40px",
             fontWeight: 700,
             color: colors.one.b,
-            margin: "0px"
+            margin: "0px",
+            fontFamily: "ManamergeGilmer"
         }
     },
     "Heading-primary-h2": {
@@ -30,21 +34,24 @@ const heading = {
             lineHeight: "30px",
             fontWeight: 700,
             color: colors.one.b,
-            margin: "0px"
+            margin: "0px",
+            fontFamily: "ManamergeGilmer"
         },
         tablet: {
             fontSize: "28px",
             lineHeight: "34px",
             fontWeight: 700,
             color: colors.one.b,
-            margin: "0px"
+            margin: "0px",
+            fontFamily: "ManamergeGilmer"
         },
         desktop: {
             fontSize: "30px",
             lineHeight: "34px",
             fontWeight: 700,
             color: colors.one.b,
-            margin: "0px"
+            margin: "0px",
+            fontFamily: "ManamergeGilmer"
         }
     },
     "Heading-primary-h3": {
@@ -53,21 +60,24 @@ const heading = {
             lineHeight: "25px",
             fontWeight: 700,
             color: colors.one.b,
-            margin: "0px"
+            margin: "0px",
+            fontFamily: "ManamergeGilmer"
         },
         tablet: {
             fontSize: "20px",
             lineHeight: "25px",
             fontWeight: 700,
             color: colors.one.b,
-            margin: "0px"
+            margin: "0px",
+            fontFamily: "ManamergeGilmer"
         },
         desktop: {
             fontSize: "24px",
             lineHeight: "30px",
             fontWeight: 700,
             color: colors.one.b,
-            margin: "0px"
+            margin: "0px",
+            fontFamily: "ManamergeGilmer"
         }
     },
     "Heading-primary-h4": {
@@ -76,21 +86,24 @@ const heading = {
             lineHeight: "23px",
             fontWeight: 700,
             color: colors.one.b,
-            margin: "0px"
+            margin: "0px",
+            fontFamily: "ManamergeGilmer"
         },
         tablet: {
             fontSize: "18px",
             lineHeight: "24px",
             fontWeight: 700,
             color: colors.one.b,
-            margin: "0px"
+            margin: "0px",
+            fontFamily: "ManamergeGilmer"
         },
         desktop: {
             fontSize: "20px",
             lineHeight: "25px",
             fontWeight: 700,
             color: colors.one.b,
-            margin: "0px"
+            margin: "0px",
+            fontFamily: "ManamergeGilmer"
         }
     },
     "Heading-primary-h5": {
@@ -99,21 +112,24 @@ const heading = {
             lineHeight: "20px",
             fontWeight: 700,
             color: colors.one.b,
-            margin: "0px"
+            margin: "0px",
+            fontFamily: "ManamergeGilmer"
         },
         tablet: {
             fontSize: "16px",
             lineHeight: "20px",
             fontWeight: 700,
             color: colors.one.b,
-            margin: "0px"
+            margin: "0px",
+            fontFamily: "ManamergeGilmer"
         },
         desktop: {
             fontSize: "16px",
             lineHeight: "20px",
             fontWeight: 700,
             color: colors.one.b,
-            margin: "0px"
+            margin: "0px",
+            fontFamily: "ManamergeGilmer"
         }
     },
     "Heading-primary-h6": {
@@ -122,159 +138,180 @@ const heading = {
             lineHeight: "20px",
             fontWeight: 700,
             color: colors.one.b,
-            margin: "0px"
+            margin: "0px",
+            fontFamily: "ManamergeGilmer"
         },
         tablet: {
             fontSize: "14px",
             lineHeight: "20px",
             fontWeight: 700,
             color: colors.one.b,
-            margin: "0px"
+            margin: "0px",
+            fontFamily: "ManamergeGilmer"
         },
         desktop: {
             fontSize: "14px",
             lineHeight: "20px",
             fontWeight: 700,
             color: colors.one.b,
-            margin: "0px"
+            margin: "0px",
+            fontFamily: "ManamergeGilmer"
         }
     },
     "Heading-secondary-h1": {
         mobile: {
             fontSize: "30px",
             lineHeight: "34px",
-            fontWeight: 700,
-            color: colors.four.a,
-            margin: "0px"
+            fontWeight: 400,
+            color: colors.one.b,
+            margin: "0px",
+            fontFamily: "Springwood"
         },
         tablet: {
             fontSize: "34px",
             lineHeight: "40px",
-            fontWeight: 700,
-            color: colors.four.a,
-            margin: "0px"
+            fontWeight: 400,
+            color: colors.one.b,
+            margin: "0px",
+            fontFamily: "Springwood"
         },
         desktop: {
             fontSize: "36px",
             lineHeight: "40px",
-            fontWeight: 700,
-            color: colors.four.a,
-            margin: "0px"
+            fontWeight: 400,
+            color: colors.one.b,
+            margin: "0px",
+            fontFamily: "Springwood"
         }
     },
     "Heading-secondary-h2": {
         mobile: {
             fontSize: "24px",
             lineHeight: "30px",
-            fontWeight: 700,
-            color: colors.four.a,
-            margin: "0px"
+            fontWeight: 400,
+            color: colors.one.b,
+            margin: "0px",
+            fontFamily: "Springwood"
         },
         tablet: {
             fontSize: "28px",
             lineHeight: "34px",
-            fontWeight: 700,
-            color: colors.four.a,
-            margin: "0px"
+            fontWeight: 400,
+            color: colors.one.b,
+            margin: "0px",
+            fontFamily: "Springwood"
         },
         desktop: {
             fontSize: "30px",
             lineHeight: "34px",
-            fontWeight: 700,
-            color: colors.four.a,
-            margin: "0px"
+            fontWeight: 400,
+            color: colors.one.b,
+            margin: "0px",
+            fontFamily: "Springwood"
         }
     },
     "Heading-secondary-h3": {
         mobile: {
             fontSize: "20px",
             lineHeight: "25px",
-            fontWeight: 700,
-            color: colors.four.a,
-            margin: "0px"
+            fontWeight: 400,
+            color: colors.one.b,
+            margin: "0px",
+            fontFamily: "Springwood"
         },
         tablet: {
             fontSize: "20px",
             lineHeight: "25px",
-            fontWeight: 700,
-            color: colors.four.a,
-            margin: "0px"
+            fontWeight: 400,
+            color: colors.one.b,
+            margin: "0px",
+            fontFamily: "Springwood"
         },
         desktop: {
             fontSize: "24px",
             lineHeight: "30px",
-            fontWeight: 700,
-            color: colors.four.a,
-            margin: "0px"
+            fontWeight: 400,
+            color: colors.one.b,
+            margin: "0px",
+            fontFamily: "Springwood"
         }
     },
     "Heading-secondary-h4": {
         mobile: {
             fontSize: "18px",
             lineHeight: "23px",
-            fontWeight: 700,
-            color: colors.four.a,
-            margin: "0px"
+            fontWeight: 400,
+            color: colors.one.b,
+            margin: "0px",
+            fontFamily: "Springwood"
         },
         tablet: {
             fontSize: "18px",
             lineHeight: "24px",
-            fontWeight: 700,
-            color: colors.four.a,
-            margin: "0px"
+            fontWeight: 400,
+            color: colors.one.b,
+            margin: "0px",
+            fontFamily: "Springwood"
         },
         desktop: {
             fontSize: "20px",
             lineHeight: "25px",
-            fontWeight: 700,
-            color: colors.four.a,
-            margin: "0px"
+            fontWeight: 400,
+            color: colors.one.b,
+            margin: "0px",
+            fontFamily: "Springwood"
         }
     },
     "Heading-secondary-h5": {
         mobile: {
             fontSize: "16px",
             lineHeight: "20px",
-            fontWeight: 700,
-            color: colors.four.a,
-            margin: "0px"
+            fontWeight: 400,
+            color: colors.one.b,
+            margin: "0px",
+            fontFamily: "Springwood"
         },
         tablet: {
             fontSize: "16px",
             lineHeight: "20px",
-            fontWeight: 700,
-            color: colors.four.a,
-            margin: "0px"
+            fontWeight: 400,
+            color: colors.one.b,
+            margin: "0px",
+            fontFamily: "Springwood"
         },
         desktop: {
             fontSize: "16px",
             lineHeight: "20px",
-            fontWeight: 700,
-            color: colors.four.a,
-            margin: "0px"
+            fontWeight: 400,
+            color: colors.one.b,
+            margin: "0px",
+            fontFamily: "Springwood"
         }
     },
     "Heading-secondary-h6": {
         mobile: {
             fontSize: "14px",
             lineHeight: "20px",
-            fontWeight: 700,
-            color: colors.four.a,
-            margin: "0px"
+            fontWeight: 400,
+            color: colors.one.b,
+            margin: "0px",
+            fontFamily: "Springwood"
         },
         tablet: {
             fontSize: "14px",
             lineHeight: "20px",
-            fontWeight: 700,
-            color: colors.four.a,
-            margin: "0px"
+            fontWeight: 400,
+            color: colors.one.b,
+            margin: "0px",
+            fontFamily: "Springwood"
         },
         desktop: {
             fontSize: "14px",
             lineHeight: "20px",
-            fontWeight: 700,
-            color: colors.four.a,
-            margin: "0px"
+            fontWeight: 400,
+            color: colors.one.b,
+            margin: "0px",
+            fontFamily: "Springwood"
         }
     }
 };

package/dist/themes/themes/manamerge/atoms/text.ts

@@ -3,60 +3,60 @@ import fontsizes from "../miscellaneous/fontsizes";
 
 const text = {
     "Text-primary-light": {
-        vFontSize: fontsizes.xs,
+        fontSize: fontsizes.xs,
         lineHeight: "18px",
         fontWeight: 300,
-        vColor: colors.one.b,
+        color: colors.one.b,
         margin: "0px",
         fontFamily: "ManamergeGilmer"
     },
     "Text-primary-regular": {
-        vFontSize: fontsizes.sm,
+        fontSize: fontsizes.sm,
         lineHeight: "25px",
         fontWeight: 400,
-        vColor: colors.one.b,
+        color: colors.one.b,
         margin: "0px",
         fontFamily: "ManamergeGilmer"
     },
     "Text-primary-medium": {
-        vFontSize: fontsizes.md,
+        fontSize: fontsizes.md,
         lineHeight: "28px",
         fontWeight: 500,
-        vColor: colors.one.b,
+        color: colors.one.b,
         margin: "0px",
         fontFamily: "ManamergeGilmer"
     },
     "Text-primary-bold": {
-        vFontSize: fontsizes.lg,
+        fontSize: fontsizes.lg,
         lineHeight: "28px",
         fontWeight: 700,
-        vColor: colors.one.b,
+        color: colors.one.b,
         margin: "0px",
         fontFamily: "ManamergeGilmer"
     },
     "Text-primary-heavy": {
-        vFontSize: fontsizes.xl,
+        fontSize: fontsizes.xl,
         lineHeight: "28px",
         fontWeight: 900,
-        vColor: colors.one.b,
+        color: colors.one.b,
         margin: "0px",
         fontFamily: "ManamergeGilmer"
     },
 
     "Text-secondary-regular": {
-        vFontSize: fontsizes.sm,
+        fontSize: fontsizes.sm,
         lineHeight: "25px",
         fontWeight: 400,
-        vColor: colors.one.h,
+        color: colors.one.b,
         margin: "0px",
         fontFamily: "Springwood"
     },
     "Text-secondary-italic": {
-        vFontSize: fontsizes.lg,
+        fontSize: fontsizes.lg,
         lineHeight: "25px",
         fontWeight: 400,
         fontStyle: "italic",
-        vColor: colors.one.h,
+        color: colors.one.b,
         margin: "0px",
         fontFamily: "Springwood"
     }

package/dist/themes/themes/manamerge/molecules/breakerTape.ts

@@ -1,17 +1,21 @@
+import colors from "../miscellaneous/colorpalette";
+import vFontSizes from "../miscellaneous/fontsizes";
+
 const breakerTape = {
     "BreakerTape-primary": {
         icon: {
             variant: "medium",
-            fill: "gold",
-            stroke: "gold",
+            fill: colors.one.g,
+            stroke: colors.one.g,
             hover: {
-                stroke: "gold",
-                fill: "gold"
+                fill: colors.one.g,
+                stroke: colors.one.g
             }
         },
         text: {
-            variant: "secondary-bold",
-            color: "#111"
+            variant: "primary-medium",
+            color: colors.one.h,
+            fontSize: vFontSizes.sm
         },
         tapeContent: {
             alignItems: "center",
@@ -21,7 +25,7 @@ const breakerTape = {
         tapeContainer: {
             width: "100%",
             transform: "rotate(-3deg)",
-            background: `linear-gradient(to right,rgb(255, 120, 120),rgb(255, 101, 247))`,
+            background: `linear-gradient(to right,#c6fba6,#80c3ba)`,
             padding: "10px 0",
             margin: "45px 0 0 0"
         }

package/dist/themes/themes/manamerge/molecules/header.ts

@@ -1,8 +1,7 @@
-import colors from "../miscellaneous/colorpalette";
-
 const header = {
     "Header-primary": {
-        height: "550px",
+        height: "350px",
+        backgroundColor: "rgba(250, 97, 97, 0.71)",
         justifyContent: "center",
         bannerColor: "lightgray",
         wrapperHeader: {
@@ -26,16 +25,11 @@ const header = {
                 stroke: "none"
             }
         },
-        atomTextBanner: {
-            variant: "primary-medium",
-            color: colors.one.h
-        },
         atomHeading: {
-            variant: "secondary",
-            as: "h1"
+            variant: "secondary-h1"
         },
         atomTextTitle: {
-            variant: "primary-medium"
+            variant: "secondary-medium"
         },
         atomButtonLeft: {
             variant: "primary",
@@ -43,7 +37,7 @@ const header = {
         },
         atomButtonRight: {
             variant: "secondary",
-            flexDirection: "row"
+            flexDirection: "row-reverse"
         },
         atomIconLeft: {
             variant: "small"
@@ -57,11 +51,12 @@ const header = {
     },
     "Header-secondary": {
         height: "300px",
-        backgroundColor: "rgba(186, 250, 97, 0.71)",
+        backgroundColor: "rgba(186, 250, 97, 0.49)",
         justifyContent: "flex-start",
         bannerColor: "lightgray",
         wrapperHeader: {
-            alignItems: "flex-start"
+            alignItems: "flex-start",
+            padding: "75px"
         },
 
         atomIconDot: {
@@ -74,19 +69,20 @@ const header = {
             }
         },
         atomHeading: {
-            variant: "secondary-h1"
+            variant: "primary",
+            asTag: "h1"
         },
         atomTextTitle: {
-            variant: "secondary-medium"
+            variant: "primary-medium"
         },
         wrapperTextTitle: {
             alignItems: "flex-start"
         },
         gradientStyles: {
             orientation: "180deg",
-            primaryColor: "rgba(0, 128, 0, 0) 0%",
-            secondaryColor: "rgba(0, 55, 128, 0.4) 50%",
-            tertiaryColor: "rgba(128, 0, 0, 0.7) 100%"
+            primaryColor: "rgba(255, 255, 255, 0) 50%",
+            secondaryColor: "rgb(128, 195, 186, 0.2) 70%",
+            tertiaryColor: "rgb(198, 251, 166, 0.3) 100%"
         }
     }
 };

package/dist/types/components/Atoms/Heading/Heading.d.ts

@@ -2,6 +2,7 @@ import React, { ReactNode } from "react";
 export interface HeadingTypes {
     variant?: string;
     children: ReactNode;
-    as?: "h1" | "h2" | "h3" | "h4" | "h5" | "h6";
+    vColor?: string;
+    asTag?: "h1" | "h2" | "h3" | "h4" | "h5" | "h6";
 }
 export declare const Heading: React.FC<HeadingTypes>;

package/dist/types/components/Atoms/Text/Text.d.ts

@@ -1,10 +1,9 @@
 import React from "react";
 export interface TextTypes {
-    variant?: string;
+    variant?: "primary-light" | "primary-regular" | "primary-medium" | "primary-bold" | "primary-heavy" | "secondary-regular" | "secondary-italic";
     children?: string;
     htmlFor?: string;
     margin?: string;
-    color?: string;
     lineHeight?: string;
     fontWeight?: string | number;
     tag?: keyof JSX.IntrinsicElements;

package/dist/types/components/Molecules/Header/Header.css.d.ts

@@ -16,9 +16,6 @@ export declare const AtomIconTop: import("styled-components/dist/types").IStyled
 export declare const AtomIconDot: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("styled-components/dist/types").Substitute<import("styled-components/dist/types").Substitute<import("../../Atoms/Icon/Icon").IconTypes, import("../../Atoms/Icon/Icon").IconTypes>, {
     moleculeVariant: string;
 }>, never>> & string & Omit<import("react").FC<import("../../Atoms/Icon/Icon").IconTypes>, keyof import("react").Component<any, {}, any>>;
-export declare const AtomTextBanner: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("styled-components/dist/types").Substitute<import("styled-components/dist/types").Substitute<import("../../Atoms/Text/Text").TextTypes, import("../../Atoms/Text/Text").TextTypes>, {
-    moleculeVariant: string;
-}>, never>> & string & Omit<import("react").FC<import("../../Atoms/Text/Text").TextTypes>, keyof import("react").Component<any, {}, any>>;
 export declare const AtomHeading: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("styled-components/dist/types").Substitute<import("styled-components/dist/types").Substitute<import("../../Atoms/Heading/Heading").HeadingTypes, import("../../Atoms/Heading/Heading").HeadingTypes>, {
     moleculeVariant: string;
 }>, never>> & string & Omit<import("react").FC<import("../../Atoms/Heading/Heading").HeadingTypes>, keyof import("react").Component<any, {}, any>>;