Attribute-date class for Design System objects

Attribute-date is a class that inherits properties from the Attribute class, but applies specifically to those based on the Date data type / DateTime data type.

When generating the Work With pattern, this class allows those Attributes whose Data Type is Date or Date Time to be automatically assigned this specific class.

Sample

First, create an Attribute class in the Styles section of your Design System Object with the desired general style for the attributes:

        .Attribute {
             gx-label-class: attribute__label;
             border-style: solid;
             border-color: #8592A6;
             border-width: 1dip;
             border-radius: 4dip;
             margin-left: 16dip;
             margin-right: 16dip;
             margin-bottom: 8dip;
             background-color: $colors.surface;
             padding-left: 8dip;
             padding-right: 8dip;
             gx-show-edit-text-line: false;
             color: #3D4854;
             gx-invite-message-color: #8592A6;
             font-size: 16dip;
             font-family: $fonts.primary-regular;  
       }

Now, suppose that for the Attribute/Variable whose Control Type property = Radio Button, you want the borders not to be displayed and to have a lower margin, as shown below:

The class to be defined is as follows:

 .attribute-date {
          @include Attribute;
          border-style: none;
          margin-bottom: 7dip;
 }

See Also

Design System Class