Changing the Selected Bootstrap Theme

If you have an MVC project created with ePortal Developer 6.1 or earlier, and you wish to use the Unisys Modern Bootstrap Theme, do the following:

  1. If you have not already done so, upgrade your project as described in Upgrading Projects.

  2. Install the NuGet package Unisys.modern.bootstrap.theme into your MVC project as follows:

    1. Open the existing solution in Visual Studio.

    2. Right-click the MVC project in Solution Explorer and select Manage NuGet Packages….

    3. From the Package source list, select Unisys ClearPath ePortal Packages and click Browse.

    4. In the left pane, select Unisys.modern.bootstrap.theme, and then click Install in the right pane.

      The Preview dialog appears.

    5. Click OK to start the installation.

  3. Edit the file Site.css to set the correct padding on the top of the body element as follows:

    1. In Solution Explorer, navigate to the Content folder under the MVC project.

    2. Double-click the file Site.css to open it in the editor.

    3. In the editor window, set padding-top on the body element to 65px.

    4. Save the file.

Conversely, if you are using the Unisys Modern Bootstrap Theme, but you want to revert to the Default Bootstrap Theme, do the following:

  1. Open the existing solution in Visual Studio.

  2. Edit the file BundleConfig.cs to specify the correct files to include on each page, as follows:

    1. In Solution Explorer, navigate to the App_Start folder under the MVC project.

    2. Double-click the file BundleConfig.cs to open it in the editor.

    3. In the editor window, find the occurrences of unisys.modern.bootstrap and replace with bootstrap.

    4. Save the file.

  3. Edit the file Site.css to set the correct padding on the top of the body element as follows:

    1. In Solution Explorer, navigate to the Content folder under the MVC project.

    2. Double-click the file Site.css to open it in the editor.

    3. In the editor window, set padding-top on the body element to 50px.

    4. Save the file.

To use some other theme, consult the documentation for that theme. In general, you might need to edit the BundleConfig.cs file in the App_Start folder to control which files are included on each web page in your project.