Перейти к содержимому
Разделы
Язык, сейчас Русский
Дизайн-система Rastrillo

Иконки

12 slug'ов, поставленных как встроенный SVG и вкомпилированных в бинарник: ни шага сборки, ни второго источника, и работают вовсе без сети. Размер каждого берётся от текста рядом по собственному правилу .icon в tokens.css — это тот размер, который вы видите здесь. Slug, на который никто не отвечает, не рисует ничего, так что опечатка стоит пропавшей иконки, а не страницы, умершей посреди ответа.

  • alert-triangle{{icon "alert-triangle"}}lucide.dev/icons/triangle-alert
  • check{{icon "check"}}lucide.dev/icons/check
  • check-circle{{icon "check-circle"}}lucide.dev/icons/circle-check
  • chevron-down{{icon "chevron-down"}}lucide.dev/icons/chevron-down
  • help-circle{{icon "help-circle"}}lucide.dev/icons/circle-help
  • info{{icon "info"}}lucide.dev/icons/info
  • kebab{{icon "kebab"}}lucide.dev/icons/ellipsis-vertical
  • menu{{icon "menu"}}lucide.dev/icons/menu
  • plus{{icon "plus"}}lucide.dev/icons/plus
  • x{{icon "x"}}lucide.dev/icons/x
  • x-circle{{icon "x-circle"}}lucide.dev/icons/circle-x

Имена — собственные для rastrillo

5 из 12 отличаются от имени, которое публикует lucide.dev, так что даже набор Lucide несёт собственный перевод. Там, где последняя строка под иконкой не повторяет её имя, — это один из них. Выигрыш в том, что один и тот же вызов означает один и тот же глиф, какой бы набор ни выбрало приложение, и поставляемые partial не меняются при смене набора.

kebab и menu — та пара, которую стоит не путать: kebab — это три точки, означающие «ещё действия для этой строки», а menu — три линии, означающие навигацию. Оболочки при сворачивании используют menu.

Откуда взяты глифы

Lucide, поставленный по лицензии ISC и закреплённый в исходниках, а не подгружаемый во время работы. rastrillo new --icons=font-awesome вместо этого генерирует Font Awesome Free: источник, из которого приложение может черпать, а не зависимость этого фреймворка. Здесь его ничто не загружает, а Pro — платный продукт, который rastrillo не может поставить за вас.

Полный набор — на lucide.dev (откроется в новой вкладке).

Иконка, которой нет во фреймворке

Пакет icons, который пишет rastrillo new, — это исходники, принадлежащие приложению: добавьте глиф туда и вызывайте как любой другой. Передайте его Icon и Assets в ui.Pages как icon и iconAssets, и ваш набор встанет впереди собственного набора фреймворка.

Funcs: template.FuncMap{"icon": icons.Icon, "iconAssets": icons.Assets, "asset": assets.Path},

Передавайте оба, всегда. С одним только icon iconAssets остаётся на значении фреймворка по умолчанию, и доставка cdn или js ломается без какой-либо ошибки.