ngdocs - как добавить стили в демонстрационный пример

Question

Я хотел бы добавить свои таблицы стилей CSS в демонстрационные примеры в документации по ngdocs.

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

Я попытался добавить свою таблицу стилей в параметры gruntfile ngdocs следующим образом:

ngdocs: {
    options : {
        scripts: [
            ...
        ],
        styles: [
            '<%=base%>/mycss/mylayout.css'
        ],
        dest: '<%=target%>docs'
    },
    api : {
        src: [
            ...
        ]
    }
}

Это добавляет mylayout.css в качестве тега ссылки к разметке index.html, как последний включенный тег ссылки в разделе head, но стили в нем переопределяют стили на всей странице. Не хорошо.

Что мне делать, чтобы мои стили работали в демоверсии, но не на остальной части страницы?

Спасибо за вашу помощь! Надеюсь, что это внесет вклад в очень ограниченную доступную информацию о ng-docs!

РЕДАКТИРОВАТЬ: В конечном итоге я создал новый файл css под названием myNgdocsLayout.css, в котором я написал несколько стилей, переопределяющих некоторые из mylayout.css, и в то же время разрешил применять стили mylayout.css к демонстрационной версии.

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

Answer 1

Можете ли вы добавить класс CSS (назовите его для вашего примера "myexample" в комментариях ngdocs, а затем из файла CSS используйте его перед всеми вашими стилями)?

 * @example
   <example module="rfx">
   <file name="index.html">
     <div class="myexample" >
       // my example code
     </div>
   </file>
   </example>
 */