List
Контейнер ul, ol, dl или menu с элементами ListItem.
github.com/fastygo/templ/ui
List рендерит контейнеры ul, ol, dl или menu. ListItem рендерит одну строку li внутри List.
Маркированный
- Первый пункт
- Второй пункт
import "github.com/fastygo/templ/ui"
templ Example() {
@ui.List(ui.ListProps{Class: "gap-2"}) {
@ui.ListItem(ui.ListItemProps{}) { Первый пункт }
@ui.ListItem(ui.ListItemProps{}) { Второй пункт }
}
}
import "github.com/fastygo/templ/ui"
templ Example() {
@ui.List(ui.ListProps{Class: "gap-2"}) {
@ui.ListItem(ui.ListItemProps{}) { Первый пункт }
@ui.ListItem(ui.ListItemProps{}) { Второй пункт }
}
}
Нумерованный
- Шаг один
- Шаг два
import "github.com/fastygo/templ/ui"
templ Example() {
@ui.List(ui.ListProps{Tag: "ol", Class: "list-decimal pl-4 gap-2"}) {
@ui.ListItem(ui.ListItemProps{Value: 1}) { Шаг один }
@ui.ListItem(ui.ListItemProps{Value: 2}) { Шаг два }
}
}
import "github.com/fastygo/templ/ui"
templ Example() {
@ui.List(ui.ListProps{Tag: "ol", Class: "list-decimal pl-4 gap-2"}) {
@ui.ListItem(ui.ListItemProps{Value: 1}) { Шаг один }
@ui.ListItem(ui.ListItemProps{Value: 2}) { Шаг два }
}
}
API
Tag · string — ul | ol | dl | menu
Class · string — Дополнительные utility-классы
ListItem · component — Один элемент li внутри List