From 45558625fe38d3c5d908b61bd98425eb152d741c Mon Sep 17 00:00:00 2001 From: raghu Date: Thu, 27 Feb 2025 20:42:29 -0500 Subject: [PATCH] move custome theme scss inside app --- src/app/styles/_theme-colors.scss | 137 ++++++++++++++++++++++++++++++ src/styles.scss | 2 +- 2 files changed, 138 insertions(+), 1 deletion(-) create mode 100644 src/app/styles/_theme-colors.scss diff --git a/src/app/styles/_theme-colors.scss b/src/app/styles/_theme-colors.scss new file mode 100644 index 0000000..5c2410a --- /dev/null +++ b/src/app/styles/_theme-colors.scss @@ -0,0 +1,137 @@ +// This file was generated by running 'ng generate @angular/material:theme-color'. +// Proceed with caution if making changes to this file. + +@use 'sass:map'; +@use '@angular/material' as mat; + +// Note: Color palettes are generated from primary: 3c096c +$_palettes: ( + primary: ( + 0: #000000, + 10: #2b0053, + 20: #441573, + 25: #4f237f, + 30: #5b308c, + 35: #683d98, + 40: #7449a5, + 50: #8e62c0, + 60: #a97cdc, + 70: #c597f9, + 80: #dbb8ff, + 90: #efdbff, + 95: #f9edff, + 98: #fff7ff, + 99: #fffbff, + 100: #ffffff, + ), + secondary: ( + 0: #000000, + 10: #241435, + 20: #39294c, + 25: #453457, + 30: #513f64, + 35: #5d4b70, + 40: #69577d, + 50: #826f97, + 60: #9d89b1, + 70: #b8a3cd, + 80: #d4bee9, + 90: #efdbff, + 95: #f9edff, + 98: #fff7ff, + 99: #fffbff, + 100: #ffffff, + ), + tertiary: ( + 0: #000000, + 10: #3b002e, + 20: #5c0a4a, + 25: #6a1956, + 30: #782562, + 35: #86326e, + 40: #953e7b, + 50: #b25795, + 60: #d070b0, + 70: #ee8acc, + 80: #ffade0, + 90: #ffd8ed, + 95: #ffecf4, + 98: #fff8f9, + 99: #fffbff, + 100: #ffffff, + ), + neutral: ( + 0: #000000, + 10: #1e1a20, + 20: #332f36, + 25: #3e3a41, + 30: #4a454c, + 35: #555158, + 40: #625d64, + 50: #7b757d, + 60: #958f97, + 70: #b0a9b1, + 80: #cbc4cd, + 90: #e8e0e9, + 95: #f6eef7, + 98: #fff7ff, + 99: #fffbff, + 100: #ffffff, + 4: #100d13, + 6: #151218, + 12: #221e24, + 17: #2c292f, + 22: #37333a, + 24: #3c383e, + 87: #dfd8e0, + 92: #eee6ee, + 94: #f3ebf4, + 96: #f9f1fa, + ), + neutral-variant: ( + 0: #000000, + 10: #1f1924, + 20: #342e3a, + 25: #3f3945, + 30: #4b4450, + 35: #57505c, + 40: #635c68, + 50: #7c7482, + 60: #968e9c, + 70: #b1a8b6, + 80: #cdc3d2, + 90: #eadfee, + 95: #f8edfd, + 98: #fff7ff, + 99: #fffbff, + 100: #ffffff, + ), + error: ( + 0: #000000, + 10: #410002, + 20: #690005, + 25: #7e0007, + 30: #93000a, + 35: #a80710, + 40: #ba1a1a, + 50: #de3730, + 60: #ff5449, + 70: #ff897d, + 80: #ffb4ab, + 90: #ffdad6, + 95: #ffedea, + 98: #fff8f7, + 99: #fffbff, + 100: #ffffff, + ), +); + +$_rest: ( + secondary: map.get($_palettes, secondary), + neutral: map.get($_palettes, neutral), + neutral-variant: map.get($_palettes, neutral-variant), + error: map.get($_palettes, error), +); + +$primary-palette: map.merge(map.get($_palettes, primary), $_rest); +$tertiary-palette: map.merge(map.get($_palettes, tertiary), $_rest); \ No newline at end of file diff --git a/src/styles.scss b/src/styles.scss index 329550c..7a04e6e 100644 --- a/src/styles.scss +++ b/src/styles.scss @@ -1,7 +1,7 @@ // Custom Theming for Angular Material // For more information: https://material.angular.io/guide/theming @use "@angular/material" as mat; -@use "../theme-colors" as rc-theme; +@use "./app/styles/theme-colors" as rc-theme; html { @include mat.theme(