Хорошо сформированный CSS для LESS - PullRequest
Новая
       6

Хорошо сформированный CSS для LESS

0 голосов
/ 05 декабря 2011

Как UX-дизайнер, я пытаюсь оптимизировать рабочий процесс. Я хочу перейти от HTML к хорошо сформированному CSS в LESS так быстро, как только смогу. Идея: опубликовать свой HTML, сгенерировать CSS, скомпилировать TO less, добавить свойства для стиля и затем перекомпилировать в CSS для развертывания.

HTML: 

<header>
   <nav>
     <ul>
       <li><a></a></li>
       <li><a></a></li>
       <li><a></a></li>
     </ul>
   </nav>
<header>

Вывод CSS с использованием http://lab.xms.pl/css-generator/

header {  }
header nav {  }
header nav ul {  }
header nav ul li {  }
header nav ul li a {  }

Затем LESS-версия создается с каким-то компилятором (ЭТО ТО, ЧТО МНЕ НУЖНО) 

header{
**declarations**
  nav{
  **declarations**
    ul{
    **declarations**        
      li{
      **declarations**
        a{
         **declarations**
         }
        }
       }
      }
     }

Наконец, перекомпилируйте в обычный CSS, когда разработка закончена и готова к развертыванию с помощью такого инструмента, как http://wearekiss.com/simpless (просто пример, я уверен, что таких инструментов много)

Я понимаю, что есть вещи, которые нужно учитывать, такие как миксины против правил конкатенации с такими инструментами, как Cleancss, но для меня самая большая проблема с вложением, так как повторять правила специфичности снова и снова - самое ужасное для построения / рассмотрения.

Чтобы убрать неиспользуемый CSS, мы могли бы использовать unused-css (dot) com или аналогичный инструмент.

У кого-нибудь есть инструмент для выполнения такой задачи? Кто-нибудь будет заинтересован в создании этого?

Мысли-предложения-встречи с нами приветствуются. Автоматизация только этой задачи, по крайней мере, могла бы действительно поднять многих из нас на следующий уровень, поэтому, пожалуйста, не списывайте со счетов, тщательно обдумайте то, что я предлагаю, прежде чем кричать «НАПИШИТЕ ЭТО», «УСТУПАЙТЕ» и т. Д.

Заранее спасибо и надеюсь услышать хорошие отзывы.

1 Ответ

1 голос
/ 06 декабря 2011

Реализация PHP препроцессора LESS имеет инструмент под названием Lessify.Вы можете скачать его с проекта git repo или и запустить онлайн .Я надеюсь, что это то, что вам нужно.

...