solid blocks

Твердые блоки

Строительные блоки пользовательского интерфейса для SolidJS

Основные понятия

Ценные компоненты вместо компонентов без добавленного значения

Обертывающие элементы, такие как заголовки, текст или изображения в пользовательских компонентах, просто расточительны. Компоненты будут предоставлены только в том случае, если они имеют добавленную стоимость по сравнению с их родными элементами. Дополнительная стоимость может быть

• пользовательский опыт
• доступность
• Опыт разработчика
• производительность

Если ни одно из этих преимуществ не может быть предоставлено, предпочтительнее использовать собственные элементы HTML или способности SolidJS, такие как портал.

Компоненты со стилем вместо стиля компонентов

Непосредственное использование CSS в настоящее время осуждается, но не по праву. Хорошо обработанные CSS легко превзойдут стиль компонентов. Это должно сделать это с

• Минимальное кровотечение (префикс класса sb-[component] , сброс CSS, основные стили, переменные темы)
• Семантические имена классов, .primary.sb-button
• Тщательное рассмотрение A11Y
• работает как можно больше в средах без JS (SSR)
• Тема, а также темный режим, встроенный переключатель режима возможна
• Тодо: отзывчивый макет

Использование

yarn
yarn dev

Использовать компоненты

 import { Accordion , AccordionHeader } from "solid-blocks" ;

const MyApp = ( ) => {
  return (
    < Accordion >
      < AccordionHeader > Accordion </ AccordionHeader >
      < p > Hidden </ p >
    </ Accordion >
  ) ;
} ;