@dcodegroup-au/dsg-vue
Version:
Front-end Vue/Tailwind DSG for UntitledUI.
81 lines (80 loc) • 2.35 kB
TypeScript
/**
* --------------------------------------------------------------------------
* Brand Typography Plugin for Untitled UI Kit for Kanopi
* --------------------------------------------------------------------------
* This plugin adds custom typography classes to the TailwindCSS framework
* based on the Untitled UI Kit for Kanopi.
*
* Adding this to the plugin section of your TailwindCSS configuration will
* allow you to use the following class names and styles based on the
* `typography` array below.
*
* With this method, we can have multiple class aliases for each typography
* style, allowing for more flexibility in class naming whilst maintaining
* support for TailwindCSS intellisense in your code editor.
*
* --------------------------------------------------------------------------
*
* TO DO: Consider sizing changes on different breakpoints and also add
* spacing utilities for typography.
*
* --------------------------------------------------------------------------
*/
declare const headingFontSizes: {
"display-2xl": {
fontSize: string;
lineHeight: string;
letterSpacing: string;
};
"display-xl": {
fontSize: string;
lineHeight: string;
letterSpacing: string;
};
"display-lg": {
fontSize: string;
lineHeight: string;
letterSpacing: string;
};
"display-md": {
fontSize: string;
lineHeight: string;
letterSpacing: string;
};
"display-sm": {
fontSize: string;
lineHeight: string;
};
"display-xs": {
fontSize: string;
lineHeight: string;
};
};
declare const bodyFontSizes: {
xl: {
fontSize: string;
lineHeight: string;
};
lg: {
fontSize: string;
lineHeight: string;
};
md: {
fontSize: string;
lineHeight: string;
};
sm: {
fontSize: string;
lineHeight: string;
};
xs: {
fontSize: string;
lineHeight: string;
};
};
declare const TypographyPlugin: {
handler: import('tailwindcss/types/config').PluginCreator;
config?: Partial<import('tailwindcss/types/config').Config>;
};
export { headingFontSizes as DsgTypographyHeadingSizes, bodyFontSizes as DsgTypographyBodySizes };
export default TypographyPlugin;