Как позволить пользователю переключаться между цветовыми темами в Django

Итак, я работаю над сайтом на Django и хочу, чтобы посетители сайта могли нажать на нужную им тему. Я смог сделать это с помощью чистого Html/css и Javascipt, но теперь, когда я перенес все в Django, это не работает. Я думаю, может быть, это моя установка пути. Вот код в моем index.html

<h5 style="text-align: center;line-height: 0;">Personalize Theme</h5>

                {% load static %}
                <script type="text/javascript" src="../../static/pythonicThinking/script.js"></script>
                <div id="theme-options-wrapper">
                    <div data-mode="light" id="light-mode" class="theme-dot" ></div>
                    <div data-mode="blue" id="blue-mode" class="theme-dot"></div>
                    <div data-mode="green" id="green-mode" class="theme-dot"></div>
                    <div data-mode="purple" id="purple-mode" class="theme-dot"></div>
                </div>

                <p id="settings-note">*Theme settings will be saved for<br>your next visit</p>
            </div>

файл javacript

console.log('Its working')

let theme = localStorage.getItem('theme')

if(theme == null){
setTheme('light')
}else{
setTheme(theme)
}

let themeDots = document.getElementsByClassName('theme-dot')


for (var i=0; themeDots.length > i; i++){
themeDots[i].addEventListener('click', function(){
    let mode = this.dataset.mode
    console.log('Option clicked:', mode)
    setTheme(mode)
})
}

function setTheme(mode){
if(mode == 'light'){
    document.getElementById('theme-style').href = 'default.css'
}

if(mode == 'blue'){
    document.getElementById('theme-style').href = 'blue.css'
}

if(mode == 'green'){
    document.getElementById('theme-style').href = 'green.css'
}

if(mode == 'purple'){
    document.getElementById('theme-style').href = 'purple.css'
}

localStorage.setItem('theme', mode)
}

файл setting.py

# Static files (CSS, JavaScript, Images)


STATIC_URL = '/static/'
MEDIA_URL = '/media/'


MEDIA_ROOT = os.path.join(BASE_DIR, 'media')

STATICFILES_DIRS = (
os.path.join(BASE_DIR, 'static'),
)

файл urls.py from django.views.generic import RedirectView

urlpatterns = [
path('admin/', admin.site.urls),
path('pythonicthinking/', include('pythonicthinking.urls')),
]
urlpatterns += [
path('', RedirectView.as_view(url='pythonicthinking/', permanent=True)),
]

urlpatterns += static(settings.STATIC_URL, document_root=settings.STATIC_ROOT)
urlpatterns += static(settings.MEDIA_URL, document_root=settings.MEDIA_ROOT)

файл views.py from django.shortcuts import render

def home(request):
return render(request, 'pythonicthinking/index.html')

Мой defualt css работает, но когда я пытаюсь нажать на кнопки, чтобы изменить, я получаю эту ошибку

Refused to apply style from 'http://127.0.0.1:8000/pythonicthinking/purple.css' because its 
MIME type ('text/html') is not a supported stylesheet MIME type, and strict MIME checking is 
enabled

Вернуться на верх