@ama-pt/agora-design-system 0.6.0 → 0.7.0

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.
package/README.md CHANGED
@@ -60,3 +60,44 @@ module.exports = {
60
60
  ```
61
61
 
62
62
  - Run and test the app...
63
+
64
+ ## Overriding Tailwind configuration
65
+
66
+ To override any tailwind config you need to update the config file as explained in the following example:
67
+
68
+ ```js
69
+ const { AgoraTailwindConfig } = require('@ama-pt/agora-design-system');
70
+
71
+ const TailwindConfig = {
72
+ content: ['src/**/*.tsx'],
73
+ theme: {
74
+ ...AgoraTailwindConfig.theme,
75
+ colors: {
76
+ ...AgoraTailwindConfig.theme.colors,
77
+ primary: {
78
+ 50: '#FFF000',
79
+ 100: '#FFF000',
80
+ 200: '#FFF000',
81
+ 300: '#FFF000',
82
+ 400: '#FFF000',
83
+ 500: '#FFF000',
84
+ 600: '#FFF000',
85
+ 700: '#FFF000',
86
+ 800: '#FFF000',
87
+ 900: '#FFF000'
88
+ }
89
+ }
90
+ },
91
+ plugins: AgoraTailwindConfig.plugins,
92
+ corePlugins: {
93
+ preflight: false
94
+ }
95
+ };
96
+
97
+ /** @type {import('tailwindcss').Config} */
98
+ export default TailwindConfig;
99
+ ```
100
+
101
+ With this example we are transforming all primary color shades into yellow.
102
+
103
+ **corePlugins** - is used to disable de tailwind resets already done by the AgoraDS library.