npm - @edu-tosel/design - Versions diffs - 1.0.155 → 1.0.157 - Mend

@edu-tosel/design 1.0.155 → 1.0.157

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (39) hide show

package/README.md +42 -42
package/asset/SVG.tsx +29 -29
package/asset/html/gomito-promotion.html +116 -116
package/asset/html/speaking-series-promotion.html +58 -58
package/asset/sizes.ts +202 -202
package/asset/svg/Close.tsx +32 -32
package/asset/svg/Direction.tsx +76 -76
package/asset/svg/Email.tsx +20 -20
package/asset/svg/Eye.tsx +48 -48
package/asset/svg/Icon.tsx +195 -195
package/asset/svg/Image.tsx +24 -24
package/asset/svg/Notification.tsx +34 -34
package/asset/svg/Operation.tsx +130 -130
package/asset/svg/Phone.tsx +20 -20
package/asset/svg/Profile.tsx +27 -27
package/asset/svg/Symbol.tsx +60 -60
package/asset/svg/TOSEL.tsx +63 -63
package/card/design/Card.design.js +4 -2
package/card/design/RollCard.design.js +1 -1
package/card/template/InfoCard/Finance.js +1 -1
package/card/template/InfoCard/Student.d.ts +2 -2
package/card/template/InfoCard/Student.js +4 -11
package/card/template/NavCard.js +1 -1
package/card/template/ProgressCard/Large.js +1 -1
package/globals.css +269 -269
package/interface/Property.d.ts +1 -1
package/layout/design/Row.design/index.js +1 -0
package/layout/index.d.ts +1 -0
package/layout/index.js +1 -0
package/layout/template/Event/One.js +39 -1
package/layout/template/MonthlyProgressReport/Report.d.ts +36 -0
package/layout/template/MonthlyProgressReport/Report.js +80 -0
package/layout/template/MonthlyProgressReport/index.d.ts +5 -0
package/layout/template/MonthlyProgressReport/index.js +5 -0
package/layout/template/home/layout/Footer.js +1 -1
package/layout/template/home/layout/Navigation.js +1 -1
package/package.json +2 -1
package/tailwind.config.ts +675 -672
package/version.txt +1 -1

package/tailwind.config.ts CHANGED Viewed

@@ -1,672 +1,675 @@
-import tailwindcssAnimate from "tailwindcss-animate";
-import type { Config } from "tailwindcss";
-import type { PluginAPI } from "tailwindcss/types/config";
-// import twElements from "tw-elements/dist/plugin";
-// import tailwindcssDirectionalShadows from "tailwindcss-directional-shadows";
-export default {
-  content: [
-    // "./node_modules/tw-elements/dist/js/**/*.js",
-    "./index.html",
-    "./src/**/*.{js,jsx,ts,tsx}",
-  ],
-  theme: {
-    extend: {
-      fontFamily: {
-        "pretendard-medium": ["pretendard-medium"],
-        "pretendard-bold": ["pretendard-bold"],
-        "pretendard-light": ["pretendard-light"],
-        "pretendard-var": ["PretendardVariable"],
-        kostar: ["kostar"],
-        nicomoji: ["nicomoji"],
-        megrim: ["megrim"],
-        "times-newer-roman-bold": ["times-newer-roman-bold"],
-        "times-newer-roman-bolditalic": ["times-newer-roman-bolditalic"],
-      },
-      backgroundImage: {
-        "image-space": "url('/images/space/space.png')",
-      },
-      scrollbar: {
-        hidden: "hidden",
-      },
-      boxShadow: {
-        main: "0 2px 10px 0px rgba(0, 0, 0, 0.14)",
-        'main-small': "0 0px 5px 0px rgba(0, 0, 0, 0.1)",
-        "main-hover": "0 10px 12px 0px rgba(0, 0, 0, 0.3)",
-        green: "0 0px 10px 0px rgba(16, 86, 82, 0.38)",
-      },
-      keyframes: {
-        grow: {
-          '0%': { height: '60px' },
-          '100%': { height: '120px' },
-        },
-        shrink: {
-          '0%': { height: '120px' },
-          '100%': { height: '60px' },
-        },
-        slideBackground: {
-          "0%, 100%": { backgroundPosition: "left center" },
-          "50%": { backgroundPosition: "right center" },
-        },
-        fadeIn: {
-          from: { opacity: "0" },
-          to: { opacity: "1" },
-        },
-        fadeOut: {
-          from: { opacity: "1" },
-          to: { opacity: "0" },
-        },
-        increaseWidth: {
-          from: { width: "0%" },
-          to: { width: "33.3%" },
-        },
-        decreaseWidth: {
-          from: { width: "33.3%" },
-          to: { width: "0%" },
-        },
-      },
-      animation: {
-        grow: 'grow 0.2s ease-in-out forwards',
-        shrink: 'shrink 0.2s ease-in-out forwards',
-      },
-      colors: {
-        "white-off": "#F5F5F5",
-        "red-burgundy": "#933652",
-        "crimson-burgundy": "#910023",
-        "crimson-burgundy-light": "#EDDFE2",
-        "crimson-dark": "#760023",
-        "red-crimson": "#760023",
-        "red-velvet": "#AC647A",
-        "green-dark": "#105652",
-        "green-light": "#DFE5E4",
-        "blue-sky": "#44C5F3",
-        "blue-navy": "#173A8B",
-        "blue-navy-light": "#E1E4EB",
-        "blue-pastel": "#CED6E6",
-        "violet-light": "#9979F6",
-        "gray-light": "#F0F0F0",
-        "gray-light-super": "#D9D9D9",
-        "gray-medium": "#7F7F7F",
-        "gray-dim": "#4C4C4C",
-        "gray-dark": "#4C4C4C",
-        "silver-lavender": "#E7E9F2",
-        "silver-latte": "#FBF3E4",
-        "silver-pale": "#DFD8CA",
-        // Brand Colors
-        "cocoon-green": "#00E35B",
-        "ps-pink": "#E3006E",
-        "ps-pink-light": "#FFBADB",
-        "st-orange": "#ED6A00",
-        "st-orange-light": "#F5D2B6",
-        "ba-yellow": "#FCCE30",
-        "ba-yellow-light": "#FFEFB7",
-        "jr-blue": "#52A2DA",
-        "jr-blue-light": "#D6EEFF",
-        "hj-blue": "#385EAB",
-        "hj-blue-light": "#A8BFE5",
-        // Gradation Colors
-      },
-      maxHeight: {
-        44: "11rem",
-        "9/10": "90%",
-      },
-      maxWidth: {
-        256: "64rem",
-        262: "65.5rem",
-        290: "72.5rem",
-      },
-      spacing: {
-        "sun-calc": "calc(50% - 6rem)",
-        0.5: "0.125rem",
-        1: "0.25rem",
-        1.25: "0.3125rem",
-        1.5: "0.375rem",
-        2.125: "0.53125rem",
-        2.25: "0.5625rem",
-        2.5: "0.625rem",
-        2.625: "0.65625rem",
-        2.75: "0.6875rem",
-        3.5: "0.875rem",
-        3.75: "0.9375rem",
-        4.25: "1.0625rem",
-        4.375: "1.09375rem",
-        4.5: "1.125rem",
-        4.75: "1.1875rem",
-        5.25: "1.3125rem",
-        5.5: "1.375rem",
-        5.75: "1.4375rem",
-        6.25: "1.5625rem",
-        6.4: "1.6rem",
-        6.5: "1.625rem",
-        6.75: "1.6875rem",
-        7: "1.75rem",
-        7.5: "1.875rem",
-        8: "2rem",
-        8.5: "2.125rem",
-        9: "2.25rem",
-        9.25: "2.3125rem",
-        9.5: "2.375rem",
-        10: "2.5rem",
-        10.25: "2.5625rem",
-        10.5: "2.625rem",
-        11: "2.75rem",
-        11.25: "2.8125rem",
-        11.375: "2.84375rem",
-        11.5: "2.875rem",
-        12: "3rem",
-        12.25: "3.0625rem",
-        12.5: "3.125rem",
-        13: "3.25rem",
-        13.25: "3.3125rem",
-        13.5: "3.375rem",
-        13.75: "3.4375rem",
-        14: "3.5rem",
-        14.125: "3.53125rem",
-        14.25: "3.5625rem",
-        14.5: "3.625rem",
-        15: "3.75rem",
-        15.5: "3.875rem",
-        16: "4rem",
-        17: "4.25rem",
-        17.75: "4.4375rem",
-        18: "4.5rem",
-        18.5: "4.625rem",
-        18.75: "4.6875rem",
-        19: "4.75rem",
-        19.25: "4.8125rem",
-        19.5: "4.875rem",
-        20: "5rem",
-        20.5: "5.125rem",
-        20.75: "5.1875rem",
-        21: "5.25rem",
-        21.5: "5.375rem",
-        21.75: "5.4375rem",
-        22: "5.5rem",
-        22.5: "5.625rem",
-        23: "5.75rem",
-        23.25: "5.8125rem",
-        23.5: "5.875rem",
-        23.75: "5.9375rem",
-        25: "6.25rem",
-        25.75: "6.4375rem",
-        26: "6.5rem",
-        27: "6.75rem",
-        27.5: "6.875rem",
-        28.78: "7.195rem",
-        29: "7.25rem",
-        30: "7.5rem",
-        32.5: "8.125rem",
-        34: "8.5rem",
-        36: "9rem",
-        36.5: "9.125rem",
-        36.75: "9.1875rem",
-        38: "9.5rem",
-        39.5: "9.875rem",
-        40: "10rem",
-        41: "10.25rem",
-        42: "10.5rem",
-        43: "10.75rem",
-        44: "11rem",
-        45: "11.25rem",
-        46: "11.5rem",
-        46.5: "11.625rem",
-        47.5: "11.875rem",
-        48: "12rem",
-        49: "12.25rem",
-        50: "12.5rem",
-        51: "12.75rem",
-        52: "13rem",
-        52.5: "13.125rem",
-        53.75: "13.4375rem",
-        54: "13.5rem",
-        55: "13.75rem",
-        56: "14rem",
-        57.5: "14.375rem",
-        62: "15.5rem",
-        64: "16rem",
-        65: "16.25rem",
-        67.5: "16.875rem",
-        68: "17rem",
-        69: "17.25rem",
-        70: "17.5rem",
-        72: "18rem",
-        73: "18.25rem",
-        75: "18.75rem",
-        76: "19rem",
-        78: "20rem",
-        81: "20.25rem",
-        82: "20.5rem",
-        84: "21rem",
-        85: "21.25rem",
-        88: "22rem",
-        88.5: "22.125rem",
-        90: "22.5rem",
-        92: "23rem",
-        93: "23.25rem",
-        93.25: "23.3125rem",
-        95: "23.75rem",
-        96: "24rem",
-        98: "24.5rem",
-        100: "25rem",
-        102.5: "25.625rem",
-        104: "26rem",
-        104.5: "26.125rem",
-        106: "26.5rem",
-        108: "27rem",
-        110: "27.5rem",
-        112: "28rem",
-        112.5: "28.125rem",
-        114: "28.5rem",
-        116: "29rem",
-        120: "30rem",
-        122: "30.5rem",
-        124: "31rem",
-        125: "31.25rem",
-        125.5: "31.375rem",
-        126: "31.5rem",
-        127.5: "31.875rem",
-        128: "32rem",
-        132: "33rem",
-        135: "33.75rem",
-        136: "34rem",
-        138.5: "34.625rem",
-        138.75: "34.6875rem",
-        140: "35rem",
-        144: "36rem",
-        145: "36.25rem",
-        145.25: "36.375rem",
-        146: "36.5rem",
-        147: "36.75rem",
-        148: "37rem",
-        150: "37.5rem",
-        151.5: "37.875rem",
-        151.75: "37.9375rem",
-        152: "38rem",
-        153: "38.25rem",
-        158: "39.5rem",
-        159: "39.75rem",
-        160: "40rem",
-        164: "41rem",
-        168: "42rem",
-        171.5: "42.875rem",
-        172: "43rem",
-        176: "44rem",
-        178: "44.5rem",
-        180: "45rem",
-        182: "45.5rem",
-        184: "46rem",
-        186: "46.5rem",
-        187.5: "46.875rem",
-        188: "47rem",
-        190: "47.5rem",
-        192: "48rem",
-        200: "50rem",
-        216: "54rem",
-        220: "55rem",
-        224: "56rem",
-        225: "56.25rem",
-        228: "57rem",
-        232: "58rem",
-        240: "60rem",
-        247.5: "61.875rem",
-        248: "62rem",
-        255: "63.75rem",
-        256: "64rem",
-        260: "65rem",
-        264: "66rem",
-        272: "68rem",
-        280: "70rem",
-        288: "72rem",
-        300: "75rem",
-        312: "78rem",
-        320: "80rem",
-        360: "90rem",
-        386: "96.5rem",
-        408: "102rem",
-        480: "120rem",
-        500: "125rem",
-        520: "140rem",
-      },
-      backgroundSize: {
-        auto: "auto",
-        cover: "cover",
-        contain: "contain",
-        16: "4rem",
-        64: "16rem",
-        80: "20rem",
-        88: "22rem",
-        92: "23rem",
-        96: "24rem",
-        100: "25rem",
-        128: "32rem",
-      },
-      borderRadius: {
-        lgx: "0.625rem",
-      },
-      transitionDelay: {
-        450: "450ms",
-        600: "600ms",
-        750: "750ms",
-        800: "800ms",
-        900: "900ms",
-        1000: "1000ms",
-        1050: "1050ms",
-        1100: "1100ms",
-        1150: "1150ms",
-        1200: "1200ms",
-        1250: "1250ms",
-        1300: "1300ms",
-        1350: "1350ms",
-        1400: "1400ms",
-        1500: "1500ms",
-        1600: "1600ms",
-        1650: "1650ms",
-        1700: "1700ms",
-        1750: "1750ms",
-        1800: "1800ms",
-        1950: "1950ms",
-        2000: "2000ms",
-        2100: "2100ms",
-        2200: "2200ms",
-        2250: "2250ms",
-        2400: "2400ms",
-        2500: "2500ms",
-        2550: "2550ms",
-        2600: "2600ms",
-        2700: "2700ms",
-        2800: "2800ms",
-        3000: "3000ms",
-        3300: "3300ms",
-        3900: "3900ms",
-        4000: "4000ms",
-        5000: "5000ms",
-      },
-      transitionDuration: {
-        300: "300ms",
-        1000: "1000ms",
-        2000: "2000ms",
-        5000: "5000ms",
-        60000: "60000ms",
-        300000: "300000ms",
-      },
-      borderWidth: {
-        1: "1px",
-        2: "2px",
-        3: "3px",
-        4: "4px",
-        5: "5px",
-        6: "6px",
-        7: "7px",
-        8: "8px",
-      },
-      opacity: {
-        32: ".32",
-      },
-      scale: {
-        101: "1.01",
-        110: "1.1",
-        120: "1.2",
-        200: "2",
-      },
-      skew: {
-        20: "20deg",
-        30: "30deg",
-        39: "39deg",
-        45: "45deg",
-        60: "60deg",
-      },
-      brightness: {
-        10: ".1",
-        20: ".2",
-        30: ".3",
-        40: ".4",
-      },
-      fontSize: {
-        "2xs": "0.625rem",
-        xs: "0.75rem",
-        sm: "0.875rem",
-        base: "1rem",
-        lg: "1.125rem",
-        xl: "1.25rem",
-        "2xl": "1.5rem",
-        "3xl": "1.875rem",
-        "4xl": "2.25rem",
-        "5xl": "3rem",
-        "6xl": "3.75rem",
-        "7xl": "4.5rem",
-        "8xl": "6rem",
-        "9xl": "8rem",
-        "10xl": "10rem",
-        "11xl": "12rem",
-      },
-      screens: {
-        xxxs: "332px",
-        xxs: "393px",
-        xs: "480px",
-        sm: "640px",
-        md: "768px", // IPad Mini
-        mmd: "840px",
-        xm: "964px", // IPad Air, IPad Pro 11.
-        lg: "1024px", // IPad Mini Horizontal Viewport
-        ml: "1160px", // IPad Air, IPad Pro 11.
-        xl: "1280px",
-        "2xl": "1536px",
-      },
-      inset: {
-        "1/20": "5%",
-        "1/10": "10%",
-        "2/10": "5%",
-        "1/5": "20%",
-        "2/5": "40%",
-        "4/5": "80%",
-        "1/4": "25%",
-        "1/3": "33.3333333%",
-        "5/100": "5%",
-        "10/100": "10%",
-        "15/100": "15%",
-        "36/100": "36%",
-        "43/100": "43%",
-        "46/100": "46%",
-      },
-      width: {
-        90: "22.5rem",
-        120: "30rem",
-        176: "44rem",
-        "2/3": "66.6666667%",
-        "1/7": "14.2857143%",
-        "2/7": "28.5714286%",
-        "3/7": "42.8571429%",
-        "4/7": "57.1428571%",
-        "1/8": "12.5%",
-        "3/10": "30%",
-        "1/10": "10%",
-        "4/10": "40%",
-        "6/10": "60%",
-        "7/10": "70%",
-        "9/10": "90%",
-        // percentile width
-        "1/100": "1%",
-        "2/100": "2%",
-        "3/100": "3%",
-        "4/100": "4%",
-        "5/100": "5%",
-        "6/100": "6%",
-        "7/100": "7%",
-        "8/100": "8%",
-        "9/100": "9%",
-        "10/100": "10%",
-        "11/100": "11%",
-        "12/100": "12%",
-        "13/100": "13%",
-        "14/100": "14%",
-        "15/100": "15%",
-        "16/100": "16%",
-        "17/100": "17%",
-        "18/100": "18%",
-        "19/100": "19%",
-        "20/100": "20%",
-        "21/100": "21%",
-        "22/100": "22%",
-        "23/100": "23%",
-        "24/100": "24%",
-        "25/100": "25%",
-        "26/100": "26%",
-        "27/100": "27%",
-        "28/100": "28%",
-        "29/100": "29%",
-        "30/100": "30%",
-        "31/100": "31%",
-        "32/100": "32%",
-        "33/100": "33%",
-        "34/100": "34%",
-        "35/100": "35%",
-        "36/100": "36%",
-        "37/100": "37%",
-        "38/100": "38%",
-        "39/100": "39%",
-        "40/100": "40%",
-        "41/100": "41%",
-        "42/100": "42%",
-        "43/100": "43%",
-        "44/100": "44%",
-        "45/100": "45%",
-        "46/100": "46%",
-        "47/100": "47%",
-        "48/100": "48%",
-        "49/100": "49%",
-        "50/100": "50%",
-        "51/100": "51%",
-        "52/100": "52%",
-        "53/100": "53%",
-        "54/100": "54%",
-        "55/100": "55%",
-        "56/100": "56%",
-        "57/100": "57%",
-        "58/100": "58%",
-        "59/100": "59%",
-        "60/100": "60%",
-        "61/100": "61%",
-        "62/100": "62%",
-        "63/100": "63%",
-        "64/100": "64%",
-        "65/100": "65%",
-        "66/100": "66%",
-        "67/100": "67%",
-        "68/100": "68%",
-        "69/100": "69%",
-        "70/100": "70%",
-        "71/100": "71%",
-        "72/100": "72%",
-        "73/100": "73%",
-        "74/100": "74%",
-        "75/100": "75%",
-        "76/100": "76%",
-        "77/100": "77%",
-        "78/100": "78%",
-        "79/100": "79%",
-        "80/100": "80%",
-        "81/100": "81%",
-        "82/100": "82%",
-        "83/100": "83%",
-        "84/100": "84%",
-        "85/100": "85%",
-        "86/100": "86%",
-        "87/100": "87%",
-        "88/100": "88%",
-        "89/100": "89%",
-        "90/100": "90%",
-        "91/100": "91%",
-        "92/100": "92%",
-        "93/100": "93%",
-        "94/100": "94%",
-        "95/100": "95%",
-        "96/100": "96%",
-        "97/100": "97%",
-        "98/100": "98%",
-        "99/100": "99%",
-        "100/100": "100%",
-      },
-      height: {
-        "2/3": "66.6666667%",
-        "4/7": "57.1428571%",
-        "3/7": "42.8571429%",
-        "5/12": "41.6666667%",
-        "1/10": "10%",
-        "3/10": "30%",
-        "4/10": "40%",
-        "6/10": "60%",
-        "7/10": "70%",
-        "9/10": "90%",
-      },
-      zIndex: {
-        "100": "100",
-        "90": "90",
-        "50": "50",
-        "49": "49",
-        "48": "48",
-        "47": "47",
-        "46": "46",
-        "45": "45",
-        "44": "44",
-        "43": "43",
-        "42": "42",
-        "41": "41",
-        "40": "40",
-        "30": "30",
-        "20": "20",
-        "10": "10",
-        "0": "0",
-      },
-    },
-  },
-  safelist: [
-    {
-      pattern: /top-.*/,
-    },
-    {
-      pattern: /-top-.*/,
-    },
-    {
-      pattern: /bottom*.*/,
-    },
-    {
-      pattern: /left-.*/,
-    },
-    {
-      pattern: /-left-.*/,
-    },
-    {
-      pattern: /right*.*/,
-    },
-    {
-      pattern: /delay-.*/,
-    },
-  ],
-  plugins: [
-    tailwindcssAnimate,
-    function ({ addUtilities }: PluginAPI) {
-      addUtilities(
-        {
-          ".scrollbar-hidden::-webkit-scrollbar": {
-            display: "none", // For WebKit browsers
-          },
-          ".scrollbar-hidden": {
-            "-ms-overflow-style": "none", // For Internet Explorer and Edge
-            "scrollbar-width": "none", // For Firefox
-          },
-        },
-        {
-          respectPrefix: false,
-          respectImportant: false,
-        }
-      );
-    },
-  ],
-  darkMode: "selector",
-} satisfies Config;
+import tailwindcssAnimate from "tailwindcss-animate";
+import type { Config } from "tailwindcss";
+import type { PluginAPI } from "tailwindcss/types/config";
+// import twElements from "tw-elements/dist/plugin";
+// import tailwindcssDirectionalShadows from "tailwindcss-directional-shadows";
+export default {
+  content: [
+    // "./node_modules/tw-elements/dist/js/**/*.js",
+    "./index.html",
+    "./src/**/*.{js,jsx,ts,tsx}",
+  ],
+  theme: {
+    extend: {
+      fontFamily: {
+        "pretendard-medium": ["pretendard-medium"],
+        "pretendard-bold": ["pretendard-bold"],
+        "pretendard-light": ["pretendard-light"],
+        "pretendard-var": ["PretendardVariable"],
+        kostar: ["kostar"],
+        nicomoji: ["nicomoji"],
+        megrim: ["megrim"],
+        "times-newer-roman-bold": ["times-newer-roman-bold"],
+        "times-newer-roman-bolditalic": ["times-newer-roman-bolditalic"],
+      },
+      backgroundImage: {
+        "image-space": "url('/images/space/space.png')",
+      },
+      scrollbar: {
+        hidden: "hidden",
+      },
+      boxShadow: {
+        main: "0 2px 10px 0px rgba(0, 0, 0, 0.14)",
+        "main-small": "0 0px 5px 0px rgba(0, 0, 0, 0.1)",
+        "main-hover": "0 10px 12px 0px rgba(0, 0, 0, 0.3)",
+        green: "0 0px 10px 0px rgba(16, 86, 82, 0.38)",
+      },
+      keyframes: {
+        grow: {
+          "0%": { height: "60px" },
+          "100%": { height: "120px" },
+        },
+        shrink: {
+          "0%": { height: "120px" },
+          "100%": { height: "60px" },
+        },
+        slideBackground: {
+          "0%, 100%": { backgroundPosition: "left center" },
+          "50%": { backgroundPosition: "right center" },
+        },
+        fadeIn: {
+          from: { opacity: "0" },
+          to: { opacity: "1" },
+        },
+        fadeOut: {
+          from: { opacity: "1" },
+          to: { opacity: "0" },
+        },
+        increaseWidth: {
+          from: { width: "0%" },
+          to: { width: "33.3%" },
+        },
+        decreaseWidth: {
+          from: { width: "33.3%" },
+          to: { width: "0%" },
+        },
+      },
+      animation: {
+        grow: "grow 0.2s ease-in-out forwards",
+        shrink: "shrink 0.2s ease-in-out forwards",
+      },
+      colors: {
+        "white-off": "#F5F5F5",
+        "red-burgundy": "#933652",
+        "crimson-burgundy": "#910023",
+        "crimson-burgundy-light": "#EDDFE2",
+        "crimson-dark": "#760023",
+        "red-crimson": "#760023",
+        "red-velvet": "#AC647A",
+        "green-dark": "#105652",
+        "green-light": "#DFE5E4",
+        "blue-sky": "#44C5F3",
+        "blue-navy": "#173A8B",
+        "blue-navy-light": "#E1E4EB",
+        "blue-pastel": "#CED6E6",
+        "violet-light": "#9979F6",
+        "gray-light": "#F0F0F0",
+        "gray-light-super": "#D9D9D9",
+        "gray-medium": "#7F7F7F",
+        "gray-dim": "#4C4C4C",
+        "gray-dark": "#4C4C4C",
+        "silver-lavender": "#E7E9F2",
+        "silver-latte": "#FBF3E4",
+        "silver-pale": "#DFD8CA",
+        // Brand Colors
+        "cocoon-green": "#00E35B",
+        "ps-pink": "#E3006E",
+        "ps-pink-light": "#FFBADB",
+        "st-orange": "#ED6A00",
+        "st-orange-light": "#F5D2B6",
+        "ba-yellow": "#FCCE30",
+        "ba-yellow-light": "#FFEFB7",
+        "jr-blue": "#52A2DA",
+        "jr-blue-light": "#D6EEFF",
+        "hj-blue": "#385EAB",
+        "hj-blue-light": "#A8BFE5",
+        // Gradation Colors
+      },
+      maxHeight: {
+        44: "11rem",
+        "9/10": "90%",
+      },
+      maxWidth: {
+        256: "64rem",
+        262: "65.5rem",
+        290: "72.5rem",
+      },
+      spacing: {
+        "sun-calc": "calc(50% - 6rem)",
+        0.5: "0.125rem",
+        1: "0.25rem",
+        1.25: "0.3125rem",
+        1.5: "0.375rem",
+        2.125: "0.53125rem",
+        2.25: "0.5625rem",
+        2.5: "0.625rem",
+        2.625: "0.65625rem",
+        2.75: "0.6875rem",
+        3.5: "0.875rem",
+        3.75: "0.9375rem",
+        4.25: "1.0625rem",
+        4.375: "1.09375rem",
+        4.5: "1.125rem",
+        4.75: "1.1875rem",
+        5.25: "1.3125rem",
+        5.5: "1.375rem",
+        5.75: "1.4375rem",
+        6.25: "1.5625rem",
+        6.4: "1.6rem",
+        6.5: "1.625rem",
+        6.75: "1.6875rem",
+        7: "1.75rem",
+        7.5: "1.875rem",
+        8: "2rem",
+        8.5: "2.125rem",
+        9: "2.25rem",
+        9.25: "2.3125rem",
+        9.5: "2.375rem",
+        10: "2.5rem",
+        10.25: "2.5625rem",
+        10.5: "2.625rem",
+        11: "2.75rem",
+        11.25: "2.8125rem",
+        11.375: "2.84375rem",
+        11.5: "2.875rem",
+        12: "3rem",
+        12.25: "3.0625rem",
+        12.5: "3.125rem",
+        13: "3.25rem",
+        13.25: "3.3125rem",
+        13.5: "3.375rem",
+        13.75: "3.4375rem",
+        14: "3.5rem",
+        14.125: "3.53125rem",
+        14.25: "3.5625rem",
+        14.5: "3.625rem",
+        15: "3.75rem",
+        15.5: "3.875rem",
+        16: "4rem",
+        17: "4.25rem",
+        17.75: "4.4375rem",
+        18: "4.5rem",
+        18.5: "4.625rem",
+        18.75: "4.6875rem",
+        19: "4.75rem",
+        19.25: "4.8125rem",
+        19.5: "4.875rem",
+        20: "5rem",
+        20.5: "5.125rem",
+        20.75: "5.1875rem",
+        21: "5.25rem",
+        21.5: "5.375rem",
+        21.75: "5.4375rem",
+        22: "5.5rem",
+        22.5: "5.625rem",
+        23: "5.75rem",
+        23.25: "5.8125rem",
+        23.5: "5.875rem",
+        23.75: "5.9375rem",
+        25: "6.25rem",
+        25.75: "6.4375rem",
+        26: "6.5rem",
+        27: "6.75rem",
+        27.5: "6.875rem",
+        28.78: "7.195rem",
+        29: "7.25rem",
+        30: "7.5rem",
+        32.5: "8.125rem",
+        34: "8.5rem",
+        36: "9rem",
+        36.5: "9.125rem",
+        36.75: "9.1875rem",
+        38: "9.5rem",
+        39.5: "9.875rem",
+        40: "10rem",
+        41: "10.25rem",
+        42: "10.5rem",
+        43: "10.75rem",
+        44: "11rem",
+        45: "11.25rem",
+        46: "11.5rem",
+        46.5: "11.625rem",
+        47.5: "11.875rem",
+        48: "12rem",
+        49: "12.25rem",
+        50: "12.5rem",
+        51: "12.75rem",
+        52: "13rem",
+        52.5: "13.125rem",
+        53.75: "13.4375rem",
+        54: "13.5rem",
+        55: "13.75rem",
+        56: "14rem",
+        57.5: "14.375rem",
+        62: "15.5rem",
+        64: "16rem",
+        65: "16.25rem",
+        67.5: "16.875rem",
+        68: "17rem",
+        69: "17.25rem",
+        70: "17.5rem",
+        72: "18rem",
+        73: "18.25rem",
+        75: "18.75rem",
+        76: "19rem",
+        78: "20rem",
+        81: "20.25rem",
+        82: "20.5rem",
+        84: "21rem",
+        85: "21.25rem",
+        88: "22rem",
+        88.5: "22.125rem",
+        90: "22.5rem",
+        92: "23rem",
+        93: "23.25rem",
+        93.25: "23.3125rem",
+        95: "23.75rem",
+        96: "24rem",
+        98: "24.5rem",
+        100: "25rem",
+        102.5: "25.625rem",
+        104: "26rem",
+        104.5: "26.125rem",
+        106: "26.5rem",
+        108: "27rem",
+        110: "27.5rem",
+        112: "28rem",
+        112.5: "28.125rem",
+        114: "28.5rem",
+        116: "29rem",
+        120: "30rem",
+        122: "30.5rem",
+        124: "31rem",
+        125: "31.25rem",
+        125.5: "31.375rem",
+        126: "31.5rem",
+        127.5: "31.875rem",
+        128: "32rem",
+        132: "33rem",
+        135: "33.75rem",
+        136: "34rem",
+        138.5: "34.625rem",
+        138.75: "34.6875rem",
+        140: "35rem",
+        144: "36rem",
+        145: "36.25rem",
+        145.25: "36.375rem",
+        146: "36.5rem",
+        147: "36.75rem",
+        148: "37rem",
+        150: "37.5rem",
+        151.5: "37.875rem",
+        151.75: "37.9375rem",
+        152: "38rem",
+        153: "38.25rem",
+        154: "38.5rem",
+        155: "38.75rem",
+        156: "39rem",
+        157: "39.25rem",
+        158: "39.5rem",
+        159: "39.75rem",
+        160: "40rem",
+        164: "41rem",
+        168: "42rem",
+        171.5: "42.875rem",
+        172: "43rem",
+        176: "44rem",
+        178: "44.5rem",
+        180: "45rem",
+        182: "45.5rem",
+        184: "46rem",
+        186: "46.5rem",
+        187.5: "46.875rem",
+        188: "47rem",
+        190: "47.5rem",
+        192: "48rem",
+        200: "50rem",
+        216: "54rem",
+        220: "55rem",
+        224: "56rem",
+        225: "56.25rem",
+        228: "57rem",
+        232: "58rem",
+        240: "60rem",
+        247.5: "61.875rem",
+        248: "62rem",
+        255: "63.75rem",
+        256: "64rem",
+        260: "65rem",
+        264: "66rem",
+        272: "68rem",
+        280: "70rem",
+        288: "72rem",
+        300: "75rem",
+        312: "78rem",
+        320: "80rem",
+        360: "90rem",
+        386: "96.5rem",
+        408: "102rem",
+        480: "120rem",
+        500: "125rem",
+        520: "140rem",
+      },
+      backgroundSize: {
+        auto: "auto",
+        cover: "cover",
+        contain: "contain",
+        16: "4rem",
+        64: "16rem",
+        80: "20rem",
+        88: "22rem",
+        92: "23rem",
+        96: "24rem",
+        100: "25rem",
+        128: "32rem",
+      },
+      borderRadius: {
+        lgx: "0.625rem",
+      },
+      transitionDelay: {
+        450: "450ms",
+        600: "600ms",
+        750: "750ms",
+        800: "800ms",
+        900: "900ms",
+        1000: "1000ms",
+        1050: "1050ms",
+        1100: "1100ms",
+        1150: "1150ms",
+        1200: "1200ms",
+        1250: "1250ms",
+        1300: "1300ms",
+        1350: "1350ms",
+        1400: "1400ms",
+        1500: "1500ms",
+        1600: "1600ms",
+        1650: "1650ms",
+        1700: "1700ms",
+        1750: "1750ms",
+        1800: "1800ms",
+        1950: "1950ms",
+        2000: "2000ms",
+        2100: "2100ms",
+        2200: "2200ms",
+        2250: "2250ms",
+        2400: "2400ms",
+        2500: "2500ms",
+        2550: "2550ms",
+        2600: "2600ms",
+        2700: "2700ms",
+        2800: "2800ms",
+        3000: "3000ms",
+        3300: "3300ms",
+        3900: "3900ms",
+        4000: "4000ms",
+        5000: "5000ms",
+      },
+      transitionDuration: {
+        300: "300ms",
+        1000: "1000ms",
+        2000: "2000ms",
+        5000: "5000ms",
+        60000: "60000ms",
+        300000: "300000ms",
+      },
+      borderWidth: {
+        1: "1px",
+        2: "2px",
+        3: "3px",
+        4: "4px",
+        5: "5px",
+        6: "6px",
+        7: "7px",
+        8: "8px",
+      },
+      opacity: {
+        32: ".32",
+      },
+      scale: {
+        101: "1.01",
+        110: "1.1",
+        120: "1.2",
+        200: "2",
+      },
+      skew: {
+        20: "20deg",
+        30: "30deg",
+        39: "39deg",
+        45: "45deg",
+        60: "60deg",
+      },
+      brightness: {
+        10: ".1",
+        20: ".2",
+        30: ".3",
+        40: ".4",
+      },
+      fontSize: {
+        "2xs": "0.625rem",
+        xs: "0.75rem",
+        sm: "0.875rem",
+        base: "1rem",
+        lg: "1.125rem",
+        xl: "1.25rem",
+        "2xl": "1.5rem",
+        "3xl": "1.875rem",
+        "4xl": "2.25rem",
+        "5xl": "3rem",
+        "6xl": "3.75rem",
+        "7xl": "4.5rem",
+        "8xl": "6rem",
+        "9xl": "8rem",
+        "10xl": "10rem",
+        "11xl": "12rem",
+      },
+      screens: {
+        xxxs: "332px",
+        xxs: "393px",
+        xs: "480px",
+        sm: "640px",
+        md: "768px", // IPad Mini
+        mmd: "840px",
+        xm: "964px", // IPad Air, IPad Pro 11.
+        lg: "1024px", // IPad Mini Horizontal Viewport
+        ml: "1160px", // IPad Air, IPad Pro 11.
+        xl: "1280px",
+        "2xl": "1536px",
+      },
+      inset: {
+        "1/20": "5%",
+        "1/10": "10%",
+        "2/10": "5%",
+        "1/5": "20%",
+        "2/5": "40%",
+        "4/5": "80%",
+        "1/4": "25%",
+        "1/3": "33.3333333%",
+        "5/100": "5%",
+        "10/100": "10%",
+        "15/100": "15%",
+        "36/100": "36%",
+        "43/100": "43%",
+        "46/100": "46%",
+      },
+      width: {
+        90: "22.5rem",
+        120: "30rem",
+        176: "44rem",
+        "2/3": "66.6666667%",
+        "1/7": "14.2857143%",
+        "2/7": "28.5714286%",
+        "3/7": "42.8571429%",
+        "4/7": "57.1428571%",
+        "1/8": "12.5%",
+        "3/10": "30%",
+        "1/10": "10%",
+        "4/10": "40%",
+        "6/10": "60%",
+        "7/10": "70%",
+        "9/10": "90%",
+        // percentile width
+        "1/100": "1%",
+        "2/100": "2%",
+        "3/100": "3%",
+        "4/100": "4%",
+        "5/100": "5%",
+        "6/100": "6%",
+        "7/100": "7%",
+        "8/100": "8%",
+        "9/100": "9%",
+        "10/100": "10%",
+        "11/100": "11%",
+        "12/100": "12%",
+        "13/100": "13%",
+        "14/100": "14%",
+        "15/100": "15%",
+        "16/100": "16%",
+        "17/100": "17%",
+        "18/100": "18%",
+        "19/100": "19%",
+        "20/100": "20%",
+        "21/100": "21%",
+        "22/100": "22%",
+        "23/100": "23%",
+        "24/100": "24%",
+        "25/100": "25%",
+        "26/100": "26%",
+        "27/100": "27%",
+        "28/100": "28%",
+        "29/100": "29%",
+        "30/100": "30%",
+        "31/100": "31%",
+        "32/100": "32%",
+        "33/100": "33%",
+        "34/100": "34%",
+        "35/100": "35%",
+        "36/100": "36%",
+        "37/100": "37%",
+        "38/100": "38%",
+        "39/100": "39%",
+        "40/100": "40%",
+        "41/100": "41%",
+        "42/100": "42%",
+        "43/100": "43%",
+        "44/100": "44%",
+        "45/100": "45%",
+        "46/100": "46%",
+        "47/100": "47%",
+        "48/100": "48%",
+        "49/100": "49%",
+        "50/100": "50%",
+        "51/100": "51%",
+        "52/100": "52%",
+        "53/100": "53%",
+        "54/100": "54%",
+        "55/100": "55%",
+        "56/100": "56%",
+        "57/100": "57%",
+        "58/100": "58%",
+        "59/100": "59%",
+        "60/100": "60%",
+        "61/100": "61%",
+        "62/100": "62%",
+        "63/100": "63%",
+        "64/100": "64%",
+        "65/100": "65%",
+        "66/100": "66%",
+        "67/100": "67%",
+        "68/100": "68%",
+        "69/100": "69%",
+        "70/100": "70%",
+        "71/100": "71%",
+        "72/100": "72%",
+        "73/100": "73%",
+        "74/100": "74%",
+        "75/100": "75%",
+        "76/100": "76%",
+        "77/100": "77%",
+        "78/100": "78%",
+        "79/100": "79%",
+        "80/100": "80%",
+        "81/100": "81%",
+        "82/100": "82%",
+        "83/100": "83%",
+        "84/100": "84%",
+        "85/100": "85%",
+        "86/100": "86%",
+        "87/100": "87%",
+        "88/100": "88%",
+        "89/100": "89%",
+        "90/100": "90%",
+        "91/100": "91%",
+        "92/100": "92%",
+        "93/100": "93%",
+        "94/100": "94%",
+        "95/100": "95%",
+        "96/100": "96%",
+        "97/100": "97%",
+        "98/100": "98%",
+        "99/100": "99%",
+        "100/100": "100%",
+      },
+      height: {
+        "2/3": "66.6666667%",
+        "4/7": "57.1428571%",
+        "3/7": "42.8571429%",
+        "5/12": "41.6666667%",
+        "1/10": "10%",
+        "3/10": "30%",
+        "4/10": "40%",
+        "6/10": "60%",
+        "7/10": "70%",
+        "9/10": "90%",
+      },
+      zIndex: {
+        "100": "100",
+        "90": "90",
+        "50": "50",
+        "49": "49",
+        "48": "48",
+        "47": "47",
+        "46": "46",
+        "45": "45",
+        "44": "44",
+        "43": "43",
+        "42": "42",
+        "41": "41",
+        "40": "40",
+        "30": "30",
+        "20": "20",
+        "10": "10",
+        "0": "0",
+      },
+    },
+  },
+  safelist: [
+    {
+      pattern: /top-.*/,
+    },
+    {
+      pattern: /-top-.*/,
+    },
+    {
+      pattern: /bottom*.*/,
+    },
+    {
+      pattern: /left-.*/,
+    },
+    {
+      pattern: /-left-.*/,
+    },
+    {
+      pattern: /right*.*/,
+    },
+    {
+      pattern: /delay-.*/,
+    },
+  ],
+  plugins: [
+    tailwindcssAnimate,
+    function ({ addUtilities }: PluginAPI) {
+      addUtilities(
+        {
+          ".scrollbar-hidden::-webkit-scrollbar": {
+            display: "none", // For WebKit browsers
+          },
+          ".scrollbar-hidden": {
+            "-ms-overflow-style": "none", // For Internet Explorer and Edge
+            "scrollbar-width": "none", // For Firefox
+          },
+        },
+        {
+          respectPrefix: false,
+          respectImportant: false,
+        }
+      );
+    },
+  ],
+  darkMode: "selector",
+} satisfies Config;