Aller au contenu principal

Styled Typography Components

Description

The Typography components are predefined styled wrappers based on the Typography component from Liberty Core. These components provide consistent styling for displaying text across different UI elements.

Styled Typography Components

Component NameDescription
Typo_LoadingA styled text component for displaying loading messages.
Typo_ListItemTextA styled list item text with selection styles.
Typo_ExportTitleA bold and stylized title for export sections.
Typo_AppsNameA styled application name with a custom font.

Props

Typo_Loading

PropTypeDefaultDescription
colorEStandardColor | stringinheritCustom text color.
isThemeColorbooleanfalseIf true, applies the theme's default color.

Example Usage

Styled Loading Text

import { Typo_Loading } from '@nomana-it/liberty-core';

export const LoadingExample = () => {
return (
<Typo_Loading color="error" isThemeColor={false}>
Loading, please wait...
</Typo_Loading>
);
};

Styled List Item Text

import { Typo_ListItemText } from '@nomana-it/liberty-core';

export const ListItemExample = () => {
return (
<Typo_ListItemText selected={true}>
Selected List Item
</Typo_ListItemText>
);
};

Notes

  • Typo_Loading provides consistent text styling for loading indicators.
  • Typo_ListItemText styles list items with bold highlights when selected.
  • Typo_ExportTitle ensures consistent styling for export titles.
  • Typo_AppsName customizes application names with a unique font.

🔗 GitHub Repository (Core): Liberty Core
🔗 GitHub Repository (Test Project): Liberty Test
📖 Live Documentation: Liberty Core Docs
💖 Sponsor & Support: Sponsor Liberty Core