Skip to content

Commit 2214eee

Browse files
authored
docs(common): Add KB for broken CSS styles after upgrade (#1135)
1 parent 2e28c13 commit 2214eee

File tree

2 files changed

+53
-0
lines changed

2 files changed

+53
-0
lines changed

knowledge-base/common-cannot-read-properties-of-null-reading-addeventlistener.md

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -64,4 +64,6 @@ The Blazor framework should normally take care of caching issues with static ass
6464

6565
## See Also
6666

67+
* [Telerik UI for Blazor version upgrade steps]({%slug upgrade-tutorial%})
6768
* [Troubleshooting JavaScript Errors]({%slug troubleshooting-js-errors%})
69+
* [Fix styling issues after component version update](%slug common-kb-upgrade-breaks-css-theme-styles%)
Lines changed: 51 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,51 @@
1+
---
2+
title: Version Update Breaks UI Component Styling
3+
description: How to resolve broken CSSS theme styles after version upgrade of Telerik UI for Blazor
4+
type: troubleshooting
5+
page_title: Version Update Breaks UI Component Styling
6+
slug: common-kb-upgrade-breaks-css-theme-styles
7+
position:
8+
tags: css, styling, upgrade
9+
ticketid: 1541420, 1564763, 1575968, 1578100
10+
res_type: kb
11+
---
12+
13+
## Environment
14+
15+
<table>
16+
<tbody>
17+
<tr>
18+
<td>Product</td>
19+
<td>Telerik UI for Blazor</td>
20+
</tr>
21+
</tbody>
22+
</table>
23+
24+
## Description
25+
26+
The UI components do not render and look properly after version update.
27+
28+
How to resolve UI (styling) issues after NuGet package version upgrade? Where do I get the new theme CSS stylesheet?
29+
30+
## Steps to Reproduce
31+
32+
Upgrade the Telerik UI for Blazor version (NuGet package). The component styling breaks. If the previous version is restored, the styling is OK.
33+
34+
## Cause\Possible Cause(s)
35+
36+
The application is using an outdated CSS theme or swatch.
37+
38+
## Solution
39+
40+
To resolve the problem, follow the [recommended UI for Blazor upgrade procedure]({%slug upgrade-tutorial%}):
41+
42+
* If using the [Telerik **CDN**]({%slug getting-started/what-you-need%}#cdn) - update the [stylesheet file URL]({%slug themes-swatch-distribution%}) to the correct version.
43+
* If using a **local** CSS file in `wwwroot` - replace the stylesheet with a compatible one. If the application is using a [**custom theme**, then recreate it]({%slug themes-custom%}#import-custom-theme).
44+
* If using **static assets** from the NuGet package - clear the browser cache.
45+
46+
A version update might break custom application CSS styles that are outside the Telerik theme. In this case, then check if the component HTML rendering or CSS classes have changed, and adjust the custom CSS code.
47+
48+
## See Also
49+
50+
* [Telerik UI for Blazor version upgrade steps]({%slug upgrade-tutorial%})
51+
* [Troubleshooting JavaScript errors after version upgrade]({%slug common-kb-cannot-read-properties-of-null-reading-addeventlistener%})

0 commit comments

Comments
 (0)