Extending an existing theme

You cannot modify a predefined Guidewire theme, but you can base a new theme on an existing one and then extend it.

The following are suggested ways to create a new theme based on an existing theme.
  • Duplicate the existing theme file, and then use that file as the basis of your new theme.
  • Create a new theme file, and then import the existing theme into it.

See also

Extend an existing theme by duplicating it

Extend an existing theme file by duplicating it into a new file and then modifying it.

Procedure

  1. In Guidewire Studio, navigate to configuration > webresources > sass > themes.
  2. Right-click the Guidewire theme file that you want to duplicate, and then click Copy.
  3. Right-click the themes folder, and then click Paste.
  4. In the Copy dialog, in the New name text box, type the name of the new theme file.
  5. Click OK.
  6. Double-click your new theme file to open it and edit it.
  7. Modify the defined styles or add new styles as desired.

What to do next

See also

Extend an existing theme by importing it

Extend an existing theme file by importing it into another theme file and then adding styles that override it.

Procedure

  1. In Guidewire Studio, create a new, empty theme file.
  2. Edit the new theme file, and place an @import statement at the top of the file to import the existing theme.
    For example, to import the base gw-theme--green-white-web.scss theme file into your new theme file, add the following line to the top of your file:
    @import "./gw-theme--green-white-web";
  3. In your new theme file, after the @import statement, add new style definitions that override the styles defined in the imported theme.
  4. Add any new style definitions as desired.

What to do next

See also