Style Sheet screen (Form-Based App)

Lets app designers configure custom CSS for an app.

Background and Setup

Examples

  • (Example) Use Custom CSS in an eForm
  • (Example) Use Custom CSS in a Form Control
  • Advanced Examples

    For more advanced or complex examples or specific information about how to solve a specific business problem or use case, AgilePoint recommends the following resources:

    • AgilePoint Community Forums - A free, AgilePoint-moderated, crowd-sourcing user forum where you can ask questions about specific techniques, the solutions to use cases, workarounds, or other topics that may not be covered in the Product Documentation.
    • Video Portal - Video walkthroughs for a range of simple and advanced tasks in AgilePoint NX.
    • Professional Services - If you can not find the information you need for your specific business problem, mentoring is available through AgilePoint Professional Services.
    • Personalized Training - AgilePoint can provide personalized training for your organization. To request personalized training, contact AgilePoint Sales.

How to Start

  1. Click App Builder.

    Build Apps screen
  2. On the Application Explorer screen, click [App Name] > Shared Resources > Style Sheets.

    Select Style Sheets
  3. Click New.

    Click New

Style Sheet screen

Creates a CSS file.

Figure: Style Sheet screen

Style Sheet screen

Fields

Field NameDefinition

File Name
Function:
Specifies the name that shows for the CSS file.
Accepted Values:
One line of text that can have spaces.
Default Value:
None

Description
Function:
Specifies an optional text description for the CSS file.
Accepted Values:
More than one line of text.
Default Value:
None

Style Sheet screen

Configures a custom CSS code snippet to use in an app.

Figure: Style Sheet screen

Style Sheet screen

Fields

Field NameDefinition

CSS Snippet
Function:
Specifies CSS code that changes the look and feel for an app.
Accepted Values:
The CSS code.
Default Value:
None
Example:
.center {
  text-align: center;
  color: red;
}