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

Update docs

Browse source
This commit is contained in:
Marcus Kammer 2024-04-21 22:01:47 +02:00
parent 5d273e1d19
commit cd60d7bdba
Signed by: marcuskammer
GPG key ID: C374817BE285268F
2 changed files with 43 additions and 35 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

66
docs/pattern/questionnaire-page.html
View file

@ -10,10 +10,10 @@
<body>
<h1 class=visually-hidden>Questionnaire Example</h1>
<main class=container>
<form class=py-5 action=/submit method=post>
<form class=py-5 action=# method=post>
<fieldset>
<legend>How old are you?</legend>
<ol>
<ol style="list-style-type: none">
<li>
<!-- FORM/CHECKABLE -->
<div class=form-check>
@ -50,11 +50,10 @@
id=group-age-55> 55+</label>
</div>
</ol>
<hr class=my-4>
</fieldset>
<fieldset>
<legend>Gender</legend>
<ol>
<ol style="list-style-type: none">
<li>
<!-- FORM/CHECKABLE -->
<div class=form-check>
@ -93,18 +92,18 @@
value=other id=group-gender-other> Other</label>
</div>
<li>
<!-- FORM/CTRL -->
<!-- FORM/CTRL text gender -->
<div class=mb-3>
<label class="form-label group-gender" for=group-gender-other>Other</label>
<input class=form-control id=group-gender-other type=text
<label class="form-label group-gender"
for=group-gender-pleasespecify>Please specify</label>
<input class=form-control id=group-gender-pleasespecify type=text
name=group-gender>
</div>
</ol>
<hr class=my-4>
</fieldset>
<fieldset>
<legend>How many hours per day, on average, do you spend browsing the internet?</legend>
<ol>
<ol style="list-style-type: none">
<li>
<!-- FORM/CHECKABLE -->
<div class=form-check>
@ -138,11 +137,10 @@
value=5+-hours id=group-webbrowsing-5hours> 5+ hours</label>
</div>
</ol>
<hr class=my-4>
</fieldset>
<fieldset>
<legend>What are your favorite brands?</legend>
<ol>
<ol style="list-style-type: none">
<li>
<!-- FORM/CHECKABLE -->
<div class=form-check>
@ -172,18 +170,25 @@
value=none id=group-brands-none> None</label>
</div>
<li>
<!-- FORM/CTRL -->
<!-- FORM/CHECKABLE -->
<div class=form-check>
<label class="form-check-label group-brands" for=group-brands-other>
<input class=form-check-input type=checkbox name=group-brands
value=other id=group-brands-other> Other</label>
</div>
<li>
<!-- FORM/CTRL text brands -->
<div class=mb-3>
<label class="form-label group-brands" for=group-brands-other>Other</label>
<input class=form-control id=group-brands-other type=text
<label class="form-label group-brands"
for=group-brands-pleasespecify>Please specify</label>
<input class=form-control id=group-brands-pleasespecify type=text
name=group-brands>
</div>
</ol>
<hr class=my-4>
</fieldset>
<fieldset>
<legend>How often do you shop online?</legend>
<ol>
<ol style="list-style-type: none">
<li>
<!-- FORM/CHECKABLE -->
<div class=form-check>
@ -225,11 +230,10 @@
value=never id=group-shopping-never> Never</label>
</div>
</ol>
<hr class=my-4>
</fieldset>
<fieldset>
<legend>Which of the following devices do you own?</legend>
<ol>
<ol style="list-style-type: none">
<li>
<!-- FORM/CHECKABLE -->
<div class=form-check>
@ -270,11 +274,10 @@
value=none id=group-devices-none> None</label>
</div>
</ol>
<hr class=my-4>
</fieldset>
<fieldset>
<legend>What is your preferred method of payment for online purchases?</legend>
<ol>
<ol style="list-style-type: none">
<li>
<!-- FORM/CHECKABLE -->
<div class=form-check>
@ -316,11 +319,10 @@
value=cryptocurrency id=group-payment-cryptocurrency> Cryptocurrency</label>
</div>
</ol>
<hr class=my-4>
</fieldset>
<fieldset>
<legend>Which social media platforms do you use regularly?</legend>
<ol>
<ol style="list-style-type: none">
<li>
<!-- FORM/CHECKABLE -->
<div class=form-check>
@ -370,19 +372,26 @@
value=none id=group-socialmedia-none> None</label>
</div>
<li>
<!-- FORM/CTRL -->
<!-- FORM/CHECKABLE -->
<div class=form-check>
<label class="form-check-label group-socialmedia"
for=group-socialmedia-other>
<input class=form-check-input type=checkbox name=group-socialmedia
value=other id=group-socialmedia-other> Other</label>
</div>
<li>
<!-- FORM/CTRL text socialmedia -->
<div class=mb-3>
<label class="form-label group-socialmedia"
for=group-socialmedia-other>Other</label>
<input class=form-control id=group-socialmedia-other type=text
name=group-socialmedia>
for=group-socialmedia-pleasespecify>Please specify</label>
<input class=form-control id=group-socialmedia-pleasespecify
type=text name=group-socialmedia>
</div>
</ol>
<hr class=my-4>
</fieldset>
<fieldset>
<legend>How do you usually consume news?</legend>
<ol>
<ol style="list-style-type: none">
<li>
<!-- FORM/CHECKABLE -->
<div class=form-check>
@ -434,7 +443,6 @@
value=none id=group-newsconsumption-none> None</label>
</div>
</ol>
<hr class=my-4>
</fieldset>
<button class="btn btn-primary" type=submit>Submit</button>
</form>

12
docs/pattern/questionnaire.org
View file

@ -1,7 +1,7 @@
#+title: Creating a Questionnaire using dev.metalisp.sbt/component/questionnaire Macros in a Web Application
#+author: Marcus Kammer
#+email: marcus.kammer@mailbox.org
#+date: [2024-04-17 09:36]
#+date: [2024-04-21 18:55]
* Introduction
Questionnaires are powerful tools for gathering information and insights from
@ -39,7 +39,7 @@ required for different types of questions in a questionnaire.
(defpackage my-web-questionnaire-app
(:use :cl)
(:import-from :dev.metalisp.sbt :with-page)
(:import-from :dev.metalisp.sbt/pattern/questionnaire :questionnaire)
(:import-from :dev.metalisp.sbt/questionnaire :questionnaire)
(:export :generate-questionnaire-page))
#+end_src
@ -54,14 +54,14 @@ required for different types of questions in a questionnaire.
"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"
(questionnaire "#" "none"
(:ask "How old are you?"
:group "age"
:choices (:radio "18-24" "25-34" "35-44" "45-54" "55+"))
(:ask "Gender"
:group "gender"
:choices (:radio "Male" "Female" "Non-binary" "Prefer not to say" "Other" :text "Other"))
:choices (:radio "Male" "Female" "Non-binary" "Prefer not to say" "Other" :text "Please specify"))
(:ask "How many hours per day, on average, do you spend browsing the internet?"
:group "webbrowsing"
@ -69,7 +69,7 @@ required for different types of questions in a questionnaire.
(:ask "What are your favorite brands?"
:group "brands"
:choices (:checkbox "Brand A" "Brand B" "Brand C" "None" :text "Other"))
:choices (:checkbox "Brand A" "Brand B" "Brand C" "None" "Other" :text "Please specify"))
(:ask "How often do you shop online?"
:group "shopping"
@ -85,7 +85,7 @@ required for different types of questions in a questionnaire.
(:ask "Which social media platforms do you use regularly?"
:group "socialmedia"
:choices (:checkbox "Facebook" "Twitter" "Instagram" "LinkedIn" "TikTok" "None" :text "Other"))
:choices (:checkbox "Facebook" "Twitter" "Instagram" "LinkedIn" "TikTok" "None" "Other" :text "Please specify"))
(:ask "How do you usually consume news?"
:group "newsconsumption"