Lucidum has been acquired by Cyderes → [Read the announcement]

Lucidum has been acquired by Cyderes → [Read the announcement]

View Categories

Theme Management

Estimated Reading Time: 6 min read

The Theme Management page (Settings > Theme Management) allows you to customize aspects of the Lucidum user interface.

NOTE: For additional ways to customize the Lucidum user interface, see User Preferences.

Viewing the List of Themes #

To view the list of existing themes:

  1. Go to Settings >Theme Management. The Theme Management page appears.

    theme_management.png

  2. The Theme Management page displays the following:
    • Name. Name of the Theme.
    • Created By. Displays the user avatar for the user who created the theme. If the user does not have an avatar, the user’s first initial is displayed. Mousing over the avatar displays the user’s user name.
    • Actions. The actions you can perform on a theme.
      • Apply (paper and pen icon). Applies the theme to your Lucidum instance.
      • Edit (pencil icon). Opens the theme for editing. You can edit only themes you created.
      • Delete (trash can icon). Deletes the theme. You can delete only themes you created.
    • You can sort and filter by the Name column and the Created By column. Clicking on the three vertical dots in each column displays a menu. From the menu, you can
      • Sort by ASC. Sort the results by this column, in ascending order.
      • Sort by DESC. Sort the results by this column, in descending order.
      • Pin to left. The column is pinned to the left border. When you scroll left to right to view all the columns, this column stays on the left border.
      • Pin to right. The column is pinned to the right border. When you scroll left to right to view all the columns, this column stays on the right border.
      • Filter. Allows you to filter the table by one or more columns.
      • Hide Column. Removes the column from the page.
      • Manage columns. You can include or not include one or more columns in the results table.

Applying a Theme #

To apply a theme to your Lucidum instance:

  1. Go to Settings >Theme Management. The Theme Management page appears.

    theme_management_apply_27.0.png

  2. In the Theme Management page, find the theme you want to apply. Click the Apply (paper and pen) icon.

Creating a New Theme #

To create a new theme:

  1. Go to Settings >Theme Management. The Theme Management page appears.
  2. In the Theme Management page, click the Add Theme (plus-sign) icon in the upper right.
  3. The Add Theme page appears:

    theme_management_add_27.0.png

  4. In the Add Theme page, enter values in the following fields:
    • Logo. Click the Edit Logo (pencil) icon to specify a new image to display in the header bar. The image must be of type .SVG and be less than 200KB in size.
    • Display Name. Name of the new theme. This name will appear in the list of themes in the Theme Management page.
    • Header Bar Color. The color of the top bar of Lucidum. Clicking on the square opens a color-picker where you can choose a new color.
    • Header Bar Text Color. The text color in the top bar of Lucidum. Clicking on the square opens a color-picker where you can choose a new color.
    • Header Bar Button Color. Color for buttons that appear in the header. For example, the Query button. Clicking on the square opens a color-picker where you can choose a new color.
    • The Status Colors pane includes the icon for each status, so you can view the color applied to the icon.
      • Success Color. Color for the text and checkmark icon, which indicates “success” or “enabled”. Clicking on the square opens a color-picker where you can choose a new color.
      • Info Color. Color for the text and “i” icon, which indicates “information”. Clicking on the square opens a color-picker where you can choose a new color.
      • Warning Color. Color for the ext and warning icon, which indicates “warning”. Clicking on the square opens a color-picker where you can choose a new color.
      • Error Color. Color for the ext and “X” icon, which indicates “failure”, “error”, or “disable. Clicking on the square opens a color-picker where you can choose a new color.
    • The Light Mode pane specifies the colors to use for the following elements following when using Light Mode:
      • Primary Color. The background color for primary buttons. Clicking on the square opens a color-picker where you can choose a new color.
      • Primary Button Text Color. The text color in primary buttons. Clicking on the square opens a color-picker where you can choose a new color.
      • Secondary Color. The color for page dividers and loading indicators. Clicking on the square opens a color-picker where you can choose a new color.
      • Link Color. All links appear in this color. Clicking on the square opens a color-picker where you can choose a new color.
    • The Dark Mode pane specifies the colors to use for the following elements following when using Dark Mode:
      • Primary Color. The background color for primary buttons. Clicking on the square opens a color-picker where you can choose a new color.
      • Primary Button Text Color. The text color in primary buttons. Clicking on the square opens a color-picker where you can choose a new color.
      • Secondary Color. The color for page dividers and loading indicators. Clicking on the square opens a color-picker where you can choose a new color.
      • Link Color. All links appear in this color. Clicking on the square opens a color-picker where you can choose a new color.
  5. Click the Add button.
  6. The new theme appears in the Theme Management page.

Map #

These images provide a map for the theme settings.

theme_management_map1_27.0.png

theme_management_map2_27.0.png

theme_management_map3_27.0.png

  1. Logo. Click the Edit Logo (pencil) icon to specify a new image to display in the header bar.
  2. Header Bar Color. The color of the top bar of Lucidum.
  3. Header Bar Text Color. The text color in the top bar of Lucidum.
  4. Header Bar Button Color. Background color for the Query button.
  5. Header Bar Button Text Color. Text color for the Query button.
  6. Success Color. The color that appears to indicate “successful” or “enabled”.
  7. Info Color. The color that appears for information icons and information text.
  8. Warning Color. The color that appears for the warning icon and text.
  9. Error Color. The color that appears to indicate “failure” or “error”.
  10. Primary Color. The background color for primary buttons.
  11. Primary Button Text Color. The text color for primary buttons.
  12. Secondary Color. The color for secondary icons and text, page dividers, and loading indicators.
  13. Link Color. Links appear in this color.

Editing a Theme #

NOTE: You can edit only themes you created.

To edit a theme:

  1. Go to Settings >Theme Management. The Theme Management page appears.

    theme_management_edit1_27.0.png

  2. In the Theme Management page, find the theme you want to apply. Click its Edit (pencil) icon.
  3. The Edit Theme page appears, where you can change the value of one or more fields.

    theme_management_edit2_27.0.png

  4. Click Save to save your changes to the Theme. If the theme is active, click its Apply (paper and pen) icon to apply the updated theme.

Deleting a Theme #

NOTE: You can delete only themes you created.

To delete a theme:

  1. Go to Settings >Theme Management. The Theme Management page appears.

    theme_management_delete_27.0.png

  2. In the Theme Management page, find the theme you want to apply. Click the Delete (trash cans) icon.
What are your Feelings