K2BTools Tutorial - Exercise 11.2 - Customizing the Design System

In the last excersice, we selected a design system that was predefined. Now, we are going to customize that design system by changing a few properties inside of it.

  1. Open the design system configuration and go to "Master Page" tab.
    1. Select the "Fixed left menu".
    2. Change the application name to "K2B Tools".
    3. Disable the notifications component.
      MasterPage1
      Master Page

  2. Go to "Tipography & spacing" tab.
    1. Change "Object title" height to "1.625 em" and font to "1.286 em".
      ObjectTitle1
      Object Title

  3. Go to "Work With" tab.
    1. Modify "Update/Delete position" to "Top (Right)"
    2. Change "Actions position" to "Right".
    3. Set "Actions Visibility" to "OnRowHover".
      MasterPage2
      Work With

  4. Go to "Form" tab and change "Field label position" property to left.
    FieldLabelPosition1
    Field label position

  5. Click on finish, wait for the changes to apply and then Build the application (F5). See the results on runtime.