@cnamts/synapse 1.0.17 → 1.0.18

package/dist/types/vuetifyTypes.d.ts

@@ -1,3 +1,7 @@
 export type VariantType = 'text' | 'flat' | 'elevated' | 'tonal' | 'outlined' | 'plain';
 export type DensityType = 'comfortable' | 'compact';
 export type locationType = 'start' | 'end' | 'top' | 'bottom' | 'start center' | 'end center' | 'top center' | 'bottom center';
+export type IconType = 'info' | 'success' | 'warning' | 'error' | 'close' | 'calendar' | undefined;
+export type VariantStyle = 'outlined' | 'plain' | 'underlined' | 'filled' | 'solo' | 'solo-inverted' | 'solo-filled';
+export type ColorType = 'primary' | 'secondary' | 'success' | 'info' | 'warning' | 'error';
+export type ValidateOnType = 'eager' | 'lazy' | 'blur' | 'input' | 'submit' | 'invalid-input' | 'blur lazy' | 'input lazy' | 'submit lazy' | 'invalid-input lazy' | 'blur eager' | 'input eager' | 'submit eager' | 'invalid-input eager' | 'lazy blur' | 'lazy input' | 'lazy submit' | 'lazy invalid-input' | 'eager blur' | 'eager input' | 'eager submit' | 'eager invalid-input' | undefined;

package/dist/utils/amelipro/dateHelper/dateHelper.d.ts

@@ -21,13 +21,13 @@ export declare const dateMatchFrIso: (date: string | null | undefined) => boolea
  * @param {string} date - The date string to parse.
  * @returns {string[]} An array containing [year, month, day].
  */
-export declare const parseDate: (date: string) => string[];
+export declare const parseDate: (date: string) => (string | undefined)[];
 /**
  * Parses a string in the format 'DD/MM/YYYY' into an array of year, month, and day strings.
  * @param {string} date - The date string to parse.
  * @returns {string[]} An array containing [day, month, year].
  */
-export declare const parseDateToFr: (date: string) => string[];
+export declare const parseDateToFr: (date: string) => (string | undefined)[];
 /**
  * Formats a date string in the ISO 8601 basic format (YYYY-MM-DD) to the French format (DD/MM/YYYY).
  * @param {string} date - The date string to format.

package/dist/utils/functions/classToHex.d.ts

@@ -1 +1 @@
-export declare function classToHex(color: string): string;
+export declare function classToHex(color: string): string | undefined;

package/dist/utils/functions/downloadFile/index.d.ts

@@ -1,3 +1,3 @@
 import { BufferSource } from './types';
 /** Download a file */
-export declare function downloadFile(content: BufferSource | Blob | string, filename: string, type: string, utf8Bom?: boolean): void;
+export declare function downloadFile(content: BufferSource | Blob | string, filename: string, type: string | undefined, utf8Bom?: boolean): void;

package/dist/utils/localStorageUtility/index.d.ts

@@ -9,7 +9,7 @@ export declare class LocalStorageUtility {
     private CONTROL_ITEM_KEY;
     constructor(version?: number, expiration?: number, prefix?: string);
     get length(): number;
-    key(n: number): string;
+    key(n: number): string | undefined;
     getItem<T = any>(key: string): T | null;
     setItem<T>(key: string, value: T): void;
     removeItem(key: string): void;

package/dist/vuetifyConfig.d.ts

@@ -1,10 +1,10 @@
 export declare const createVuetifyInstance: () => {
-    install: (app: import('vue').App<any>) => void;
+    install: (app: import('vue').App) => void;
     unmount: () => void;
     defaults: import('vue').Ref<import('vuetify').DefaultsInstance, import('vuetify').DefaultsInstance>;
     display: import('vuetify').DisplayInstance;
     theme: import('vuetify').ThemeInstance & {
-        install: (app: import('vue').App<any>) => void;
+        install: (app: import('vue').App) => void;
     };
     icons: {
         defaultSet: string;
@@ -12,14 +12,14 @@ export declare const createVuetifyInstance: () => {
         sets: Record<string, import('vuetify').IconSet>;
     };
     locale: {
-        isRtl: import('vue').Ref<boolean, boolean>;
-        rtl: import('vue').Ref<Record<string, boolean>, Record<string, boolean>>;
-        rtlClasses: import('vue').Ref<string, string>;
+        isRtl: import('vue').Ref<boolean>;
+        rtl: import('vue').Ref<Record<string, boolean>>;
+        rtlClasses: import('vue').Ref<string>;
         name: string;
         decimalSeparator: import('vue').ShallowRef<string>;
-        messages: import('vue').Ref<import('vuetify').LocaleMessages, import('vuetify').LocaleMessages>;
-        current: import('vue').Ref<string, string>;
-        fallback: import('vue').Ref<string, string>;
+        messages: import('vue').Ref<import('vuetify').LocaleMessages>;
+        current: import('vue').Ref<string>;
+        fallback: import('vue').Ref<string>;
         t: (key: string, ...params: unknown[]) => string;
         n: (value: number) => string;
         provide: (props: import('vuetify').LocaleOptions) => import('vuetify').LocaleInstance;
@@ -30,7 +30,7 @@ export declare const createVuetifyInstance: () => {
                 locale: any;
                 formats?: any;
             }) => import('vuetify').DateInstance) | import('vuetify').DateInstance;
-            formats?: Record<string, any> | undefined;
+            formats?: Record<string, any>;
             locale: Record<string, any>;
         };
         instance: {
@@ -42,7 +42,7 @@ export declare const createVuetifyInstance: () => {
             toISO: (date: unknown) => string;
             startOfDay: (date: unknown) => unknown;
             endOfDay: (date: unknown) => unknown;
-            startOfWeek: (date: unknown, firstDayOfWeek?: string | number | undefined) => unknown;
+            startOfWeek: (date: unknown, firstDayOfWeek?: number | string) => unknown;
             endOfWeek: (date: unknown) => unknown;
             startOfMonth: (date: unknown) => unknown;
             endOfMonth: (date: unknown) => unknown;
@@ -64,10 +64,10 @@ export declare const createVuetifyInstance: () => {
             addMonths: (date: unknown, amount: number) => unknown;
             getYear: (date: unknown) => number;
             setYear: (date: unknown, year: number) => unknown;
-            getDiff: (date: unknown, comparing: unknown, unit?: string | undefined) => number;
-            getWeekArray: (date: unknown, firstDayOfWeek?: string | number | undefined) => unknown[][];
-            getWeekdays: (firstDayOfWeek?: string | number | undefined, weekdayFormat?: "long" | "short" | "narrow" | undefined) => string[];
-            getWeek: (date: unknown, firstDayOfWeek?: string | number | undefined, firstWeekMinSize?: number | undefined) => number;
+            getDiff: (date: unknown, comparing: unknown, unit?: string) => number;
+            getWeekArray: (date: unknown, firstDayOfWeek?: number | string) => unknown[][];
+            getWeekdays: (firstDayOfWeek?: number | string, weekdayFormat?: "long" | "short" | "narrow") => string[];
+            getWeek: (date: unknown, firstDayOfWeek?: number | string, firstWeekMinSize?: number) => number;
             getMonth: (date: unknown) => number;
             setMonth: (date: unknown, month: number) => unknown;
             getDate: (date: unknown) => number;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@cnamts/synapse",
-  "version": "1.0.17",
+  "version": "1.0.18",
   "private": false,
   "description": "CNAM DS v3",
   "type": "module",
@@ -73,7 +73,7 @@
     "@vitejs/plugin-vue": "5.2.1",
     "@vitest/coverage-v8": "^3.2.4",
     "@vue/test-utils": "^2.4.6",
-    "@vue/tsconfig": "^0.5.1",
+    "@vue/tsconfig": "~0.8.0",
     "auto-changelog": "^2.4.0",
     "axe-core": "^4.11.0",
     "axios": "^1.7.7",
@@ -95,7 +95,7 @@
     "stylelint-config-recommended-scss": "^14.1.0",
     "stylelint-config-recommended-vue": "^1.5.0",
     "stylelint-config-standard-scss": "^14.0.0",
-    "typescript": "5.4.2",
+    "typescript": "~5.9.3",
     "typescript-eslint": "^8.11.0",
     "vite": "^5.3.5",
     "vite-plugin-dts": "^4.0.1",

package/src/assets/apTokens.scss

@@ -0,0 +1,307 @@
+/*
+ * CNAM Design System
+ * Tokens and settings for the AMELI PRO theme.
+ * This file must not contain any styles as it will be duplicated many times.
+ */
+
+// Primitives
+$amber-darken-80: #502c01;
+$amber-darken-60: #784201;
+$amber-darken-40: #9f5801;
+$amber-darken-20: #c76e02;
+$amber-base: #ef8402;
+$amber-lighten-20: #f2992c;
+$amber-lighten-40: #f4ad56;
+$amber-lighten-60: #f7c281;
+$amber-lighten-80: #fad6ab;
+$amber-lighten-90: #fce6cc;
+$amber-lighten-97: #fffaf5;
+$yellow-darken-80: #302407;
+$yellow-darken-60: #60480e;
+$yellow-darken-40: #906b15;
+$yellow-darken-20: #c08f1c;
+$yellow-base: #f0b323;
+$yellow-lighten-20: #f3c24f;
+$yellow-lighten-40: #f6d17b;
+$yellow-lighten-60: #f9e1a7;
+$yellow-lighten-80: #fcf0d3;
+$yellow-lighten-90: #fdf7e9;
+$yellow-lighten-97: #fffdf8;
+$green-darken-80: #112717;
+$green-darken-60: #224e2d;
+$green-darken-40: #347444;
+$green-darken-20: #459b5a;
+$green-base: #56c271;
+$green-lighten-20: #78ce8d;
+$green-lighten-40: #9adaaa;
+$green-lighten-60: #bbe7c6;
+$green-lighten-80: #ddf3e3;
+$green-lighten-90: #eef9f1;
+$green-lighten-97: #fafdfb;
+$turquoise-darken-80: #00221c;
+$turquoise-darken-60: #004439;
+$turquoise-darken-40: #006755;
+$turquoise-darken-20: #008972;
+$turquoise-base: #00ab8e;
+$turquoise-lighten-20: #33bca5;
+$turquoise-lighten-40: #66cdbb;
+$turquoise-lighten-60: #99ddd2;
+$turquoise-lighten-80: #cceee8;
+$turquoise-lighten-90: #e5f7f4;
+$turquoise-lighten-97: #f7fcfc;
+$blue-darken-80: #020d1f;
+$blue-darken-60: #051a3e;
+$blue-darken-40: #07275c;
+$blue-darken-20: #0a347b;
+$blue-base: #0c419a;
+$blue-lighten-20: #3d67ae;
+$blue-lighten-40: #6d8dc2;
+$blue-lighten-60: #9eb3d7;
+$blue-lighten-80: #ced9eb;
+$blue-lighten-90: #e7ecf5;
+$blue-lighten-97: #f8f9fc;
+$cyan-darken-80: #00212d;
+$cyan-darken-60: #004259;
+$cyan-darken-40: #006386;
+$cyan-darken-20: #0084b2;
+$cyan-base: #00a5df;
+$cyan-lighten-20: #33b7e5;
+$cyan-lighten-40: #66c9ec;
+$cyan-lighten-60: #99dbf2;
+$cyan-lighten-80: #ccedf9;
+$cyan-lighten-90: #e5f6fc;
+$cyan-lighten-97: #f7fcfe;
+$forest-green-darken-80: #002821;
+$forest-green-darken-60: #003c32;
+$forest-green-darken-40: #005042;
+$forest-green-darken-20: #006453;
+$forest-green-base: #007863;
+$forest-green-lighten-20: #2a8f7d;
+$forest-green-lighten-40: #55a597;
+$forest-green-lighten-60: #80bcb1;
+$forest-green-lighten-80: #aad2cb;
+$forest-green-lighten-90: #cce4e0;
+$forest-green-lighten-97: #eefffc;
+$parma-darken-80: #171c26;
+$parma-darken-60: #2f384d;
+$parma-darken-40: #465473;
+$parma-darken-20: #5e709a;
+$parma-base: #758cc0;
+$parma-lighten-20: #91a3cd;
+$parma-lighten-40: #acbad9;
+$parma-lighten-60: #c8d1e6;
+$parma-lighten-80: #e3e8f2;
+$parma-lighten-90: #f1f3f9;
+$parma-lighten-97: #fbfcfd;
+$mauve-darken-80: #201224;
+$mauve-darken-60: #402449;
+$mauve-darken-40: #60376d;
+$mauve-darken-20: #804992;
+$mauve-base: #a05bb6;
+$mauve-lighten-20: #b37cc5;
+$mauve-lighten-40: #c69dd3;
+$mauve-lighten-60: #d9bde2;
+$mauve-lighten-80: #ecdef0;
+$mauve-lighten-90: #f5eff8;
+$mauve-lighten-97: #fcfafd;
+$pink-darken-80: #2d051a;
+$pink-darken-60: #5a0a34;
+$pink-darken-40: #87104d;
+$pink-darken-20: #b41567;
+$pink-base: #e11a81;
+$pink-lighten-20: #e7489a;
+$pink-lighten-40: #ed76b3;
+$pink-lighten-60: #f3a3cd;
+$pink-lighten-80: #f9d1e6;
+$pink-lighten-90: #fce8f2;
+$pink-lighten-97: #fef8fb;
+$red-darken-80: #4d0000;
+$red-darken-60: #740000;
+$red-darken-40: #9b0000;
+$red-darken-20: #b30e0e;
+$red-base: #e80000;
+$red-lighten-20: #ec2a2a;
+$red-lighten-40: #ff5e5e;
+$red-lighten-60: #f48080;
+$red-lighten-80: #f7aaaa;
+$red-lighten-90: #facccc;
+$red-lighten-97: #fff4f4;
+$grey-darken-80: #111212;
+$grey-darken-60: #222324;
+$grey-darken-40: #323535;
+$grey-darken-20: #434647;
+$grey-base: #545859;
+$grey-lighten-20: #76797a;
+$grey-lighten-40: #989b9b;
+$grey-lighten-60: #bbbcbd;
+$grey-lighten-80: #dddede;
+$grey-lighten-90: #eee;
+$grey-lighten-97: #fafafa;
+$white-20: rgb(255 255 255 / 20%);
+$white-38: rgb(255 255 255 / 38%);
+$white-40: rgb(255 255 255 / 40%);
+$white-70: rgb(255 255 255 / 70%);
+$white-base: #fff;
+$white-08: rgb(255 255 255 / 8%);
+$white-00: rgb(255 255 255 / 0%);
+$none-value: undefined;
+$transparent-blue-18: rgb(12 65 154 / 18%);
+$transparent-blue-08: rgb(12 65 154 / 8%);
+$transparent-blue-00: rgb(12 65 154 / 0%);
+
+// Semantic Tokens
+$primary-darker-2: #004259;
+$primary-darker: #006386;
+$primary-base: #0084b2;
+$primary: #0084b2;
+$primary-light: #00a5df;
+$primary-lighter-2: #33b7e5;
+$primary-lighter-3: #66c9ec;
+$primary-lighter-4: #e5f6fc;
+$primary-lighter-5: #f7fcfe;
+$secondary: #004259;
+$neutral-black: #111212;
+$neutral-black-lighter: #545859;
+$neutral-black-lighter-2: #989b9b;
+$neutral-grey: #dddede;
+$neutral-white: #fff;
+$neutral-white-alpha: rgb(255 255 255 / 70%);
+$neutral-white-alpha-lighter: rgb(255 255 255 / 40%);
+$neutral-white-alpha-lighter-2: rgb(255 255 255 / 20%);
+$neutral-white-alpha-lighter-3: rgb(255 255 255 / 8%);
+$info-info-lightest: #f1f3f9;
+$info-info-lighter: #e3e8f2;
+$info-default: #465473;
+$success-lightest: #eefffc;
+$success-lighter: #cce4e0;
+$success-default: #007863;
+$success-darker: #005042;
+$warning-lightest: #fdf7e9;
+$warning-lighter: #fcf0d3;
+$warning-default: #f0b323;
+$warning-darker: #60480e;
+$danger-lightest: #facccc;
+$danger-lighter: #f7aaaa;
+$danger-default: #b30e0e;
+$user-professionnel: #66c9ec;
+$user-assure: #ed76b3;
+$user-entreprise: #f0b323;
+
+// Contextual Tokens
+$colors-background: #fff;
+$colors-border: #ddd;
+$colors-text: #333;
+$colors-icon: #666;
+$colors-overlay: rgb(0 0 0 / 50%);
+$colors-interactive: #007bff;
+$gap-0: 0;
+$gap-1: 4px;
+$gap-2: 8px;
+$gap-3: 12px;
+$gap-4: 16px;
+$gap-5: 20px;
+$gap-6: 24px;
+$gap-7: 28px;
+$gap-8: 32px;
+$gap-9: 36px;
+$gap-10: 40px;
+$gap-11: 44px;
+$gap-12: 48px;
+$gap-13: 52px;
+$gap-14: 56px;
+$gap-15: 60px;
+$gap-16: 64px;
+$icon-size-xsmall: 8px;
+$icon-size-small: 16px;
+$icon-size-default: 24px;
+$icon-size-large: 32px;
+$radius-rounded-0: 0;
+$radius-rounded: 4px;
+$radius-rounded-lg: 8px;
+$radius-rounded-pill: 64px;
+$padding-0: 0;
+$padding-2: 8px;
+$padding-3: 12px;
+$padding-4: 16px;
+$padding-6: 24px;
+$padding-8: 32px;
+$padding-10: 40px;
+$padding-14: 56px;
+$padding-16: 64px;
+$font-size-title: 24px;
+$font-size-alt-title: 20px;
+$font-size-body-text: 16px;
+$font-size-link-label: 14px;
+
+// Additional Contextual Tokens
+$colors-background-main: #e7ecf5;
+$colors-background-surface: #fff;
+$colors-background-main-alt: #fff;
+$colors-background-surface-alt: #e7ecf5;
+$colors-background-raised: #f8f9fc;
+$colors-background-accent: #0084b2;
+$colors-background-accent-contrasted: #004259;
+$colors-background-accent-alt: #545859;
+$colors-background-info: #ced9eb;
+$colors-background-info-subdued: #e7ecf5;
+$colors-background-info-contrasted: #465473;
+$colors-background-success: #aad2cb;
+$colors-background-success-subdued: #cce4e0;
+$colors-background-success-contrasted: #007863;
+$colors-background-warning: #fcf0d3;
+$colors-background-warning-subdued: #fdf7e9;
+$colors-background-warning-contrasted: #f0b323;
+$colors-background-error: #f7aaaa;
+$colors-background-error-subdued: #facccc;
+$colors-background-error-contrasted: #b30e0e;
+$colors-background-disabled: #dddede;
+$colors-background-disabled-ondark: rgb(255 255 255 / 8%);
+$colors-background-assure: #ed76b3;
+$colors-background-professionnel: #66c9ec;
+$colors-background-entreprise: #f0b323;
+$colors-border-darker: #222324;
+$colors-border-base: #989b9b;
+$colors-border-subdued: #dddede;
+$colors-border-accent: #0084b2;
+$colors-border-accent-contrasted: #006386;
+$colors-border-accent-ondark: #fff;
+$colors-border-info: #465473;
+$colors-border-success: #007863;
+$colors-border-warning: #60480e;
+$colors-border-error: #b30e0e;
+$colors-border-ondark: rgb(255 255 255 / 70%);
+$colors-border-disabled: #dddede;
+$colors-border-disabled-ondark: rgb(255 255 255 / 40%);
+$colors-text-base: #222324;
+$colors-text-accent: #0084b2;
+$colors-text-accent-contrasted: #006386;
+$colors-text-subdued: #545859;
+$colors-text-info: #465473;
+$colors-text-success: #007863;
+$colors-text-warning: #60480e;
+$colors-text-error: #b30e0e;
+$colors-text-disabled: #989b9b;
+$colors-text-ondark: #fff;
+$colors-text-subdued-ondark: rgb(255 255 255 / 70%);
+$colors-text-disabled-ondark: rgb(255 255 255 / 40%);
+$colors-icon-base: #222324;
+$colors-icon-subdued: #545859;
+$colors-icon-subdued-ondark: rgb(255 255 255 / 70%);
+$colors-icon-accent: #0084b2;
+$colors-icon-accent-contrasted: #006386;
+$colors-icon-info: #465473;
+$colors-icon-success: #007863;
+$colors-icon-warning: #60480e;
+$colors-icon-error: #b30e0e;
+$colors-icon-ondark: #fff;
+$colors-icon-disabled: #989b9b;
+$colors-icon-disabled-ondark: rgb(255 255 255 / 40%);
+$colors-overlay-fullpage: #222324;
+$colors-overlay-ondark: #006386;
+$colors-overlay-onlight: #fff;
+$colors-interactive-default: rgb(255 255 255 / 0%);
+$colors-interactive-hover: #e5f6fc;
+$colors-interactive-pressed: #ccedf9;
+$colors-interactive-focus: #e5f6fc;
+$colors-interactive-disabled: rgb(255 255 255 / 0%);
+$colors-interactive-hover-on-selected: #ced9eb;

package/src/assets/overrides/_btns.scss

@@ -1,7 +1,6 @@
 .v-btn {
 	text-transform: inherit !important;
 	font-weight: 700 !important;
-	letter-spacing: 0 !important;
 	-webkit-font-smoothing: antialiased;
 	-moz-osx-font-smoothing: grayscale;
 }

package/src/assets/overrides/_elevations.scss

@@ -94,7 +94,8 @@ $ap-elevation: (
 }
 
 // Apply theme-based AP
-.theme-ap {
+.theme-ap,
+.theme-ap2026 {
 	@each $key, $value in $ap-elevation {
 		--elevation-#{$key}: #{$value};
 	}

package/src/assets/overrides/_icons.scss

@@ -0,0 +1,10 @@
+@use '@/assets/apTokens';
+
+.v-theme--ap.v-btn--icon .v-icon {
+	color: apTokens.$primary-base;
+	transition: color 0.2s ease;
+
+	&:hover {
+		color: apTokens.$secondary;
+	}
+}

package/src/assets/overrides/_radius.scss

@@ -54,10 +54,15 @@ $radius-keys: (0, 'sm', 'md', 'lg', 'xl', 'pill', 'circle');
 	}
 }
 
-// ✅ Apply theme-based ap
-.theme-ap {
+// ✅ Apply theme-based ap and ap2026
+.theme-ap,
+.theme-ap2026 {
 	@each $key, $value in $ap-radius {
 		--radius-#{$key}: #{$value};
+
+		.v-field {
+			border-radius: var(--radius-md) !important;
+		}
 	}
 }
 

package/src/assets/overrides/_spacers.scss

@@ -127,7 +127,8 @@ $ap-spacers: (
 	}
 }
 
-.theme-ap {
+.theme-ap,
+theme-ap2026 {
 	@each $key, $value in $ap-spacers {
 		--spacing-#{$key}: #{$value};
 	}

package/src/assets/overrides/_tooltips.scss

@@ -1,10 +1,17 @@
-@use '@/assets/amelipro/apTokens';
+@use '@/assets/amelipro/apTokens2026';
+@use '@/assets/apTokens';
 
 .v-tooltip .v-overlay__content {
 	background-color: rgb(0 0 0 / 70%) !important;
 }
 
+.v-theme--ap2026.v-tooltip .v-overlay__content {
+	background-color: apTokens2026.$ap-white !important;
+	border: 1px solid apTokens2026.$ap-parme-darken1 !important;
+}
+
 .v-theme--ap.v-tooltip .v-overlay__content {
-	background-color: apTokens.$ap-white !important;
-	border: 1px solid apTokens.$ap-parme-darken1 !important;
+	color: apTokens.$colors-text-base;
+	border: 1px solid apTokens.$colors-border-base;
+	background-color: apTokens.$colors-background-surface !important;
 }

package/src/assets/overrides/_typography.scss

@@ -1,5 +1,6 @@
 /* Typography styles for CNAM and PA themes */
 @use '@/assets/tokens.scss' as *;
+@use '@/assets/amelipro/apTokens2026' as *;
 
 .theme-cnam,
 .theme-pa {
@@ -194,3 +195,152 @@
 		font-size: $font-size-link-label;
 	}
 }
+
+.theme-ap,
+.theme-ap2026 {
+	p {
+		font-size: $font-size-xs;
+	}
+
+	a {
+		font-size: $font-size-xs;
+		color: $ap-blue-darken1;
+
+		&:hover {
+			color: $ap-blue-darken2;
+			text-decoration: underline;
+		}
+	}
+
+	[class*='text-'] {
+		font-family: Arial, Helvetica, sans-serif !important;
+		font-weight: $ap-font-weight-regular;
+		line-height: 1.3 !important;
+	}
+
+	// sets the service title text style
+	[class*='text-service-title'] {
+		font-family: Arial, Helvetica, sans-serif !important;
+		font-size: $font-size-xxl !important;
+		font-weight: $ap-font-weight-bold !important;
+		text-transform: uppercase !important;
+
+		@media #{$media-down-md} {
+			font-size: $font-size-md !important;
+		}
+	}
+
+	// sets classes font sizes
+	[class*='text-'][class*='-h1'],
+	h1 {
+		font-size: $font-size-xxl !important;
+		font-weight: $ap-font-weight-bold !important;
+	}
+
+	[class*='text-'][class*='-h2'],
+	h2 {
+		font-size: $font-size-lg !important;
+		font-weight: $ap-font-weight-bold;
+	}
+
+	[class*='text-'][class*='-h3'],
+	h3 {
+		font-size: $font-size-md !important;
+	}
+
+	[class*='text-'][class*='-h4'],
+	h4 {
+		font-size: $font-size-sm !important;
+		font-weight: $ap-font-weight-bold;
+	}
+
+	[class*='text-'][class*='-h5'],
+	[class*='text-'][class*='-h6'],
+	h5,
+	h6 {
+		font-size: $font-size-sm !important;
+		font-weight: $ap-font-weight-bold;
+	}
+
+	[class*='text-'][class*='-subtitle-1'],
+	[class*='text-'][class*='-subtitle-2'],
+	[class*='text-'][class*='-body-1'],
+	[class*='text-'][class*='-body-2'],
+	[class*='text-'][class*='-button'],
+	[class*='text-'][class*='-overline'] {
+		font-size: $font-size-xs !important;
+	}
+
+	[class*='text-'][class*='-caption'] {
+		font-size: $font-size-xxs !important;
+	}
+
+	// sets font weight
+	[class*='text-'][class*='-subtitle-1'],
+	[class*='text-'][class*='-subtitle-2'] {
+		font-weight: $ap-font-weight-bold;
+	}
+
+	[class*='font-weight-bold'] {
+		font-weight: $ap-font-weight-bold !important;
+	}
+
+	.font-size-xxs {
+		font-size: $font-size-xxs;
+	}
+
+	.font-size-xs {
+		font-size: $font-size-xs;
+	}
+
+	.font-size-sm {
+		font-size: $font-size-sm;
+	}
+
+	.font-size-md {
+		font-size: $font-size-md;
+	}
+
+	.font-size-lg {
+		font-size: $font-size-lg;
+	}
+
+	.font-size-xl {
+		font-size: $font-size-xl;
+	}
+
+	.font-size-xxl {
+		font-size: $font-size-xxl;
+	}
+
+	.relative {
+		position: relative;
+	}
+
+	.list-style-none {
+		margin: 0;
+		padding: 0 !important;
+		list-style: none !important;
+	}
+
+	.w-100 {
+		width: 100%;
+	}
+
+	.h-100 {
+		height: 100%;
+	}
+
+	.pointer {
+		cursor: pointer;
+	}
+
+	.v-field--active .v-label.v-field-label {
+		font-weight: 700 !important;
+	}
+}
+
+// Font Styles
+.theme--ap.v-sheet {
+	color: $ap-grey-darken1;
+}