Issue
I'm trying to achieve those theme change solutions: https://www.baeldung.com/spring-mvc-themes or http://acodigo.blogspot.com/2017/04/spring-mvc-themeresolver.html but with Thymeleaf instead of the .jsp.
But I can't see any style change on my application.
I think the problem is href/th:href attribute.
I have tried many solutions but can't change href="<spring:theme code='styleSheet'/>" from .jsp in a valid Thymeleaf expression.
And this bellow is the only solution that works.
th:href="${@environment.getProperty('stylesheet')}" But there are still no styles in HTML, and when I run inspect element there are no .css files included.
Here is the code example:
@Configuration
public class ThemeConfig implements WebMvcConfigurer {
@Bean
public ThemeResolver themeResolver() {
CookieThemeResolver themeResolver = new CookieThemeResolver();
themeResolver.setDefaultThemeName("light");
return themeResolver;
}
@Bean
public ThemeChangeInterceptor themeChangeInterceptor() {
ThemeChangeInterceptor interceptor = new ThemeChangeInterceptor();
interceptor.setParamName("theme");
return interceptor;
}
@Override
public void addInterceptors(InterceptorRegistry registry) {
registry.addInterceptor(themeChangeInterceptor());
}
}
Html
<head>
...
<link rel="stylesheet" type="text/css" th:href="${@environment.getProperty('stylesheet')}">
...
</head>
<body>
...
<div class="dropdown-container ms-4">
<a th:href="@{?theme=dark}">[[#{dashboard.theme-dark}]]</a>
<a th:href="@{?theme=light}">[[#{dashboard.theme-light}]]</a>
<a th:href="@{?theme=blue}">[[#{dashboard.theme-blue}]]</a>
</div>
...</body>
dark.properties (I have also tried: stylesheet=dark.css, stylesheet=/themes/dark.css, etc..)
stylesheet=/css/themes/dark.css
background=black
dark.css
footer{
height: 100px;
background-color: red;
}
Solution
Since Theme support is deprecated in Spring 6 I will use JavaScript as an easy workaround.
Answered By - Developer
Answer Checked By - David Goodson (JavaFixing Volunteer)
