theme-orange

The OUDS Theme Orange module provides the concrete implementation of the Orange design system theme. It maps the abstract definitions from the Theme Contract to the specific Raw Tokens of the Orange brand.

It serves as the "factory" that assembles the specific visual identity of Orange.

Purpose

While the core module provides the mechanisms to access the theme, and theme-contract defines what a theme is, theme-orange defines what the Orange theme looks like.

• Implementation: It implements the interfaces defined in theme-contract (OudsColorSemanticTokens, OudsFontSemanticTokens, etc.).

• Mapping: It assigns specific values from Orange raw tokens (e.g., ColorOrange500) or global raw tokens (e.g., ColorFunctionalBlack) to semantic slots (e.g., contentBrandPrimaryDark, contentDefaultLight).

Usage

To use the Orange theme in your application, follow these steps:

1. Add the dependency

Ensure the theme-orange module is included in your module's build.gradle.kts file in addition to the core module:

dependencies {
    // ...
    implementation("com.orange.ouds.android:ouds-core:0.4.0")
    implementation("com.orange.ouds.android:ouds-theme-orange:0.4.0")
    // ...
}

dependencies {
    // ...
    implementation 'com.orange.ouds.android:ouds-core:0.4.0'
    implementation 'com.orange.ouds.android:ouds-theme-orange:0.4.0'
    // ...
}

2. Initialize and Customize the Theme

In your application, you must provide the OrangeTheme instance to the OudsTheme composable. This effectively "injects" the Orange visual style into the OUDS system.

Use OudsTheme as a replacement for the traditional MaterialTheme.

OudsTheme(theme = OrangeTheme(roundedCornerButtons = true, roundedCornerTextInputs = true)) {
    // Use OUDS Android or Material components here for an interface
    // matching the Orange Unified Design System with the customized Orange theme
}

In the example above, you can see that Orange theme includes several customizable elements such as the possibility of having rounded corners on certain components rather than rectangular ones.

Relationship with other modules

Tokens versions

This module implements the design specifications versioned below:

🤖 Note: The majority of the files in this module (specifically within the tokens packages) are automatically generated by Tokenator based on the design definitions.

Any manual changes to these files will be lost during the next synchronization.