ASP.Net загрузчик и App_Themes

Question

Я создал сайт начальной загрузки с хорошей панелью навигации и версткой. Я хочу использовать темы asp.net, где я могу изменить внешний вид приложения.

Проблема в том, что многие классы в начальной загрузке не обязательно являются семантическими, поэтому трудно применить CSS к фрагменту HTML, который имеет какое-то назначение, которое в противном случае могло бы быть идентифицировано семантически названным классом.

Это хорошо видно по загрузочной панели навигации, для которой требуются классы navbar-light или navbar-dark, которые управляют цветом текста различных типов элементов в панели навигации.

Если мне нужна одна тема с темным фоном / светлым текстом и одна тема со светлым фоном / темным текстом, это сложно сделать с помощью начальной загрузки, поскольку эти классы должны быть указаны в разметке.

Разве я не использую эти классы, не дублирую этот раздел начальной загрузки scss и не создаю что-то более совместимое с темами, или есть более подходящие подходы?

Вот пример:

<nav class="navbar navbar-expand-md navbar-dark bg-dark mb-0 flex-wrap pt-1 pb-1 shadow-none ">
    <div class="d-flex flex-nowrap flex-fill minw-0">
        <a class="app-link navbar-brand text-truncate mr-auto mt-auto mb-auto d-flex align-items-center" href="../../../"/>
        <img class="app-logo mt-auto mb-auto" src="../../../App_Themes/IHClean/img/app/applogo.svg">
            <span class="text-truncate font-weight-normal">Non-semantic Css</span>
        </a>

        <button class="navbar-toggler my-1 ml-auto bg-dark-heavy" type="button" data-toggle="collapse" data-target=".navbar-collapse" aria-controls="navbarCollapse" aria-expanded="false" aria-label="Toggle navigation">
            <span class="navbar-toggler-icon"/>
        </button>
    </div>

    <div class="collapse navbar-collapse flex-wrap d-md-inline-flex justify-content-end">
        <div class="d-md-inline-flex">
            <ul class="navbar-nav nav">
                <li class="active nav-item">
                    <a href="../../../" class="nav-link icon-mmnu-home">Home</a>
                </li>
                <li class="nav-item">
                    <a href="../../../Samples" class="nav-link icon-mmnu-info">Samples

                        <span class="badge badge-balloon badge-light">
                            <span class="d-xs-inline d-sm-none text-primary">XS</span>
                            <span class="d-none d-md-none d-sm-inline text-success">SM</span>
                            <span class="d-none d-md-inline d-lg-none text-danger">MD</span>
                            <span class="d-none d-lg-inline d-xl-none text-warning">LG</span>
                            <span class="d-none d-xl-inline text-dark">XL</span>
                        </span>
                    </a>
                </li>
            </ul>
        </div>
        <div class="d-md-inline-flex">
        </div>
    </div>
</nav>

Класс navbar-dark требует светлого фона, иначе текст не будет отображаться. Если я хочу иметь возможность использовать ASP.Net Themes в приложении веб-форм, я ограничен тем, как я могу применять цвета темы из-за использования navbar-dark. Я не могу с легкостью перевернуть тьму на свете и все же сохранить семантику. Возможно, мне просто нужно отказаться от семантики и переопределить темные переменные navbar.