marcuskammer/dev.metalisp.sbt
1
1
Fork 0
Code Issues 1 Pull requests Projects 1 Releases Packages Wiki Activity Actions

Define dropdown package

Browse source
This commit is contained in:
Marcus Kammer 2023-07-11 19:46:14 +02:00
parent 721cf2f8ac
commit 612757638e
2 changed files with 41 additions and 11 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

50
src/component/dropdown.lisp
View file

@ -1,4 +1,43 @@
(in-package :cl-sbt)
;; The Bootstrap Dropdown component is a toggleable, contextual menu for
;; displaying lists of links and more. It's made interactive with the inclusion of
;; JavaScript, which allows it to convert a button into a dropdown menu.
;; Key Features:
;; Toggleable: It can be toggled to display or hide its list of links.
;; Contextual: The dropdown can be used in various contexts, such as navigation
;; bars, tabs, and buttons.
;; Flexible: Dropdowns can contain a wide variety of elements, not just links. For
;; example, you could include form elements or other complex sets of content.
;; Customizable: The appearance and behavior of the dropdown can be customized with Bootstrap's built-in classes.
;; In terms of structure, a Bootstrap dropdown typically consists of a button with
;; data-bs-toggle="dropdown" attribute to enable the dropdown functionality, and a
;; div or ul with class .dropdown-menu to create the actual dropdown menu. Each
;; item in the dropdown is typically enclosed in an a or button element with the
;; class .dropdown-item. Additionally, dropdowns can be made to expand
;; upwards (instead of downwards) by adding the .dropup class.
(defpackage cl-sbt-dropdown
(:use :cl)
(:export
:menu
:item
:dropdown))
(in-package :cl-sbt-dropdown)
(defmacro menu (&body body)
`(spinneret:with-html
(:ul :class "dropdown-menu"
,@body)))
(defmacro item (&body body)
`(spinneret:with-html
(:li (:a :class "dropdown-item" :href "#" ,@body))))
(defmacro dropdown ((&key (title "")) &body body)
`(spinneret:with-html
@ -9,12 +48,3 @@
:aria-expanded "false"
,title)
,@body)))
(defmacro dropdown-menu (&body body)
`(spinneret:with-html
(:ul :class "dropdown-menu"
,@body)))
(defmacro dropdown-item (&body body)
`(spinneret:with-html
(:li (:a :class "dropdown-item" :href "#" ,@body))))

2
src/main.lisp
View file

@ -1,6 +1,6 @@
(defpackage cl-sbt
(:use :cl)
(:export :badge :badge-pill-primary :badge-pill-secondary :badge-pill-success :badge-pill-danger :badge-pill-warning :badge-pill-info :badge-pill-light :badge-pill-dark :btn :btn-primary :btn-secondary :btn-success :btn-danger :btn-warning :btn-info :btn-light :btn-dark :btn-link :btn-outline-primary :btn-outline-secondary :btn-outline-success :btn-outline-danger :btn-outline-warning :btn-outline-info :btn-outline-light :btn-outline-dark :btn-outline-link :container :col-md :col-xs :col-sm :col-lg :icon :dropdown :dropdown-menu :dropdown-item :nav :nav-item :pagination :pagination-with-icons :row :table :table-striped :table-bordered :table-hover :table-condensed :well :with-page))
(:export :badge :badge-pill-primary :badge-pill-secondary :badge-pill-success :badge-pill-danger :badge-pill-warning :badge-pill-info :badge-pill-light :badge-pill-dark :btn :btn-primary :btn-secondary :btn-success :btn-danger :btn-warning :btn-info :btn-light :btn-dark :btn-link :btn-outline-primary :btn-outline-secondary :btn-outline-success :btn-outline-danger :btn-outline-warning :btn-outline-info :btn-outline-light :btn-outline-dark :btn-outline-link :container :col-md :col-xs :col-sm :col-lg :icon :nav :nav-item :pagination :pagination-with-icons :row :table :table-striped :table-bordered :table-hover :table-condensed :well :with-page))
(in-package :cl-sbt)