The new dynamic theme introduces modern styling, but some users may notice extra padding that affects their layout. If you’d like to remove this additional padding, follow the steps below.
Step 1: Get the files ready
Download and extract the provided ZIP file (Custom Dynamic Theme.zip) containing the custom CSS.
Do not rename folders or alter any subfolders. The solution relies on this precise directory structure for proper functionality.
Step 2: Host the CSS Files
The CSS files must be hosted so they are accessible via a URL. You have two options:
- Host locally on your K2 server using IIS (recommended for on-prem environments).
- Host on a custom inetpub, such as GitHub or any other web-accessible location.
If you choose to host on a custom inetpub:
- Copy the file’s URL.
- Open the URL in an incognito browser tab on your K2 server.
- If the file loads successfully, it means the CSS is publicly available and ready for use.
Note: Ensure the hosting source is not subject to rate limits. For example, when using GitHub, consider serving files via jsDelivr, a CDN with caching and no rate limitations. If you are using another CDN, verify it offers comparable reliability.
Step 3: Link the CSS in the Style Profile Designer
Once the files are hosted and accessible:
- Create and edit a new style profile.
- Navigate to the Developer tab in the Style Profile Designer.
- Link the hosted CSS file to your dynamic theme.
- Save the style profile.
Note: If you want more information on how to link a CSS file in the Developer tab of the Style Profile Designer, check out this article.
Step 4: Apply the style to your form
With the updated dynamic theme now free of additional padding, the final step is to apply the style profile to all relevant forms where it will be used.
With the style profile applied, your forms will now reflect the updated dynamic theme without the extra padding. This simple adjustment helps maintain a cleaner layout while preserving the benefits of the new styling framework.