Как применить CSS к файлам вывода StyleDocco

Question

Я использую grunt-styleguide с моим шаблоном, равным styledocco, для создания руководств по стилям CSS.

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

Моего хрюкать INIT для стилистического справочника:

styleguide: { 
     dist: { 
      options: { 
       framework: { 
        name: "styledocco" 
       }, 

       name: "FE KICKSTARTER V1.o" 
      }, 

      files: { 
       "assets/css/styleguide": "assets/css/**/*.less" 
      } 
     } 
    } 

Моих выходов следующим образом: применяются

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

Как это сделать?

Answer 1

@chris-vdp определенно ставит вас в правильном направлении. Комментарии в http://shekhardesigner.github.io/fe-kickstart/assets/css/styleguide/base-base.html не признаны действительными markdown. В вашем Меньше кода заменить:

/* Base 
=============== 

    This is a simple Base CSS 

    <div class="h1">H1 type headers</div> 

*/ 

с:

/* 
Base 
=============== 

This is a simple Base CSS 

    <div class="h1">H1 type headers</div> 

*/ 

После удаления wrong вкладки ваш стиль руководства будет выглядеть так, как показано ниже:

Answer 2

для базы базы Я бы попробовал что-то вроде.

/*Base 
=== 

This is a simple Base CSS 
``` 
<div class="h1">H1 type headers</div> 
``` 

*/ 
.h1 { 
    font-size:30px; 
    font-weight:normal; 
} 

/*Type 
=== 
Basic Typography styles 
``` 
<h2>h2 style might go like </h1> 
```  
*/ 

h2 { 
    font-family:'Source Sans Pro'; 
    color:#f90; 
} 

У меня были некоторые подобные проблемы, когда я начал. Вы можете видеть в своем источнике от github, что html ускользает. Также стоит отметить, что стилекоко очень специфичен в отношении пространств.