diff --git a/docs/component/accordion.org b/docs/component/accordion.org
index 81bb88a..138b0f5 100644
--- a/docs/component/accordion.org
+++ b/docs/component/accordion.org
@@ -1,7 +1,7 @@
#+title: Using cl-sbt/accordion Macros in a Web Application
#+author: Marcus Kammer
#+email: marcus.kammer@mailbox.org
-#+date: [2023-09-02 Sat]
+#+date: 2024-02-04T13:09+01:00
* Introduction
The accordion component is a popular UI element that helps to organize and
@@ -41,87 +41,27 @@ can use the cl-sbt/accordion macros. These macros provide a convenient way to
generate the necessary HTML structure for accordion components. Here's how you
can integrate them into your project:
-#+begin_src lisp
- (defpackage my-web-app
- (:use :cl :cl-sbt/accordion)
+#+name: accordion-page
+#+begin_src lisp :results output file :file-ext html
+ (defpackage my-web-accordion-app
+ (:use :cl)
+ (:import-from :dev.metalisp.sbt :with-page)
+ (:import-from :dev.metalisp.sbt/component/accordion :accordion)
(:export :generate-accordion-page))
- (in-package :my-web-app)
+ (in-package :my-web-accordion-app)
(defun generate-accordion-page ()
- "Generates an HTML page with an accordion using cl-sbt/accordion macros."
- (spinneret:with-html-string
- (:html
- (:head
- (:title "Accordion Example")
- ;; Include Bootstrap CSS and JavaScript links here
- )
- (:body
- (:h1 "Accordion Example")
- (accordion "myAccordion"
- (:target "collapseOne" :name "Section 1" :show t :content "Content for section 1.")
- (:target "collapseTwo" :name "Section 2" :content "Content for section 2.")
- (:target "collapseThree" :name "Section 3" :content "Content for section 3."))
- ;; Include Bootstrap JavaScript initialization script here
- ))))
+ "Generates an HTML page with accordion using accordion macros."
+ (with-output-to-string (spinneret:*html*)
+ (with-page (:title "Accordion Example" :main-con t)
+ (accordion ()
+ ("Accordion Item #1" "This is the first item's accordion body. It is shown by default, until the collapse plugin adds the appropriate classes that we use to style each element. These classes control the overall appearance, as well as the showing and hiding via CSS transitions. You can modify any of this with custom CSS or overriding our default variables. It's also worth noting that just about any HTML can go within the .accordion-body, though the transition does limit overflow.")
+ ("Accordion Item #2" "This is the second item's accordion body. It is hidden by default, until the collapse plugin adds the appropriate classes that we use to style each element. These classes control the overall appearance, as well as the showing and hiding via CSS transitions. You can modify any of this with custom CSS or overriding our default variables. It's also worth noting that just about any HTML can go within the .accordion-body, though the transition does limit overflow.")))))
- (generate-accordion-page)
+ (format t (generate-accordion-page))
#+end_src
-#+RESULTS:
-#+begin_example
-
-
-
- Accordion Example
-
-
-
Accordion Example
-
-
-
-
-
-
-
- Content for section 1.
-
-
-
-
-
-
-
-
-
- Content for section 2.
-
-
-
-
-
-
-
-
-
- Content for section 3.
-
-
-
-
-
-
-#+end_example
-
This example demonstrates how to integrate the cl-sbt/accordion macros into a
web application to create an interactive accordion component. The macros help
generate the necessary HTML structure for the accordion, which allows users to
diff --git a/docs/pattern/questionnaire.org b/docs/pattern/questionnaire.org
index 20b55f3..416c640 100644
--- a/docs/pattern/questionnaire.org
+++ b/docs/pattern/questionnaire.org
@@ -1,7 +1,7 @@
#+title: Creating a Questionnaire using cl-sbt/questionnaire Macros in a Web Application
#+author: Marcus Kammer
#+email: marcus.kammer@mailbox.org
-#+date: 2024-01-28T11:38+01:00
+#+date: 2024-02-04T13:11+01:00
* Introduction
Questionnaires are powerful tools for gathering information and insights from
@@ -30,16 +30,16 @@ required for different types of questions in a questionnaire.
#+name: questionnaire-page
#+begin_src lisp :results output file :file-ext html
- (defpackage my-web-app
+ (defpackage my-web-questionnaire-app
(:use :cl)
(:import-from :dev.metalisp.sbt :with-page)
(:import-from :dev.metalisp.sbt/pattern/questionnaire :questionnaire)
- (:export :generate-button-page))
+ (:export :generate-questionnaire-page))
- (in-package :my-web-app)
+ (in-package :my-web-questionnaire-app)
(defun generate-questionnaire-page ()
- "Generates an HTML page with questionnaires using cl-sbt/questionnaire macros."
+ "Generates an HTML page with questionnaires using questionnaire macros."
(with-output-to-string (spinneret:*html*)
(with-page (:title "Questionnaire Example" :main-con t)
(questionnaire "/submit"
@@ -52,7 +52,6 @@ required for different types of questions in a questionnaire.
(:ask "How many hours per day, on average, do you spend browsing the internet?"
:group "webbrowsing"
:choices (:radio "Less than 1 hour" "1-3 hours" "3-5 hours" "5+ hours"))
- ;; Additional Questions
(:ask "What are your favorite brands?"
:group "brands"
:choices (:checkbox "Brand A" "Brand B" "Brand C" "None" :text "Other"))