update

frontEnd/public/styles/base/_typography.scss

@@ -0,0 +1,122 @@
+/* ==== 
+ --------- (2.02) typography styles start ---------
+ ==== */
+
+// Import IBM Plex Sans font
+@import url('https://fonts.googleapis.com/css2?family=IBM+Plex+Sans:ital,wght@0,300;0,400;0,500;0,600;0,700;1,400;1,500&family=IBM+Plex+Mono:wght@400;500;600&display=swap');
+
+// Global font family
+* {
+  font-family: var(--font-family-sans);
+}
+
+// paragraph styles - Enterprise compact
+p,
+th,
+td,
+li,
+input,
+textarea,
+select,
+label,
+blockquote,
+span {
+  font-size: 15px;
+  line-height: 22px;
+  font-weight: 400;
+  color: var(--template-color);
+  font-family: var(--font-family-sans);
+}
+
+.text-xl {
+  font-size: 20px;
+  line-height: 28px;
+}
+
+.text-xs {
+  font-size: 14px;
+  line-height: 22px;
+}
+
+// link styles
+a,
+button {
+  font-size: 16px;
+  line-height: 22px;
+  color: var(--template-color);
+  font-weight: 400;
+  cursor: pointer;
+  display: inline-flex;
+  gap: 8px;
+
+  &:hover {
+    color: var(--primary-color);
+  }
+}
+
+// heading styles - Enterprise compact
+h1,
+.text-xxl {
+  font-size: 42px;
+  line-height: 50px;
+  font-weight: 700;
+  font-family: var(--font-family-display);
+  letter-spacing: -0.02em;
+}
+
+h2 {
+  font-size: 32px;
+  line-height: 40px;
+  font-weight: 600;
+  font-family: var(--font-family-display);
+  letter-spacing: -0.01em;
+}
+
+h3 {
+  font-size: 24px;
+  line-height: 32px;
+  font-weight: 600;
+  font-family: var(--font-family-display);
+}
+
+h4 {
+  font-size: 20px;
+  line-height: 28px;
+  font-weight: 500;
+  font-family: var(--font-family-display);
+}
+
+h5 {
+  font-size: 16px;
+  line-height: 24px;
+  font-weight: 500;
+  font-family: var(--font-family-display);
+}
+
+h6 {
+  font-size: 14px;
+  line-height: 20px;
+  font-weight: 500;
+  font-family: var(--font-family-display);
+}
+
+h1,
+h2,
+h3,
+h4,
+h5,
+h6,
+p {
+  a,
+  span {
+    font-family: inherit;
+    font-size: inherit;
+    line-height: inherit;
+    font-weight: inherit;
+    color: inherit;
+  }
+}
+
+/* ==== 
+ --------- (2.02) typography styles end ---------
+ ==== */