Угловое изменение переменных объекта scss

Question

эй, у меня следующая проблема:

в моем ионном / угловом приложении у меня есть основной (тема) scss, где я определил основные цвета для приложения примерно так:

$colors: (
  primary:    #92c7ff,
  secondary:  #32db64,
  danger:     #6c1d23,
  light:      #f4f4f4,
  dark:       #222,
  btnColor:   #32db64,

);

и те, которые я использую двумя способами

1) направить на элемент

<button ion-button block type="submit" [disabled]="!loginForm.form.valid" color="btnColor">

или 2) как ссылку в другом определении scss:

.background {       
        background: color($colors, light);
        background-repeat: no-repeat;
        background-size: 100% 100%;
    }

в моем случае мой пользователь может определить дизайн своего приложения на моем веб-сервере.Если они войдут, их индивидуальный дизайн должен быть загружен.Они должны только иметь возможность редактировать цвета, и они должны быть каким-то образом переопределены в приложении, так что все цвета, на которые ссылаются из основного scss, больше не будут использоваться, кроме моего определенного.Я нашел эту статью: https://nddt -webdevelopment.de / angularjs / angular-5-dynamic-css-component Где можно добавить пользовательские CSS.и я начал это так, но здесь мне нужно создать много правил CSS и не иметь полного контроля.Например, та же самая кнопка, что и раньше, будет отображаться в приложении следующим образом:

<button block="" color="btnColor" ion-button="" type="submit" class="disable-hover button button-md button-default button-default-md button-block button-block-md button-md-btnColor" ng-reflect-color="btnColor" ng-reflect-block="">

здесь я могу найти тег ng-refle-color.Если бы я мог перехватить это отражение и дать свою ценность, было бы неплохо.В противном случае мне нужно будет создать новое правило (как я это делал сейчас):

.button-md-btnColor { background-color: orange; }

это работает, но это не очень хороший способ - также у меня есть проблема, что я должен создать эти правила для каждогоionic-элемент, который я использую как, потому что есть много разных классов:

.item-md-btnColor { background-color: orange; }

одна идея состоит в том, что я добавляю собственный класс цвета, который может работать.но я думаю, что перехват - лучший и самый чистый способ.