Skip to content

Commit 827707c

Browse files
codementumcodementum
committed
two column demographics
1 parent 5ff3526 commit 827707c

4 files changed

Lines changed: 142 additions & 0 deletions

File tree

‎public/color-palette-study/assets/demographics-compact.css‎

Lines changed: 77 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,77 @@
1+
#gender .mantine-InputWrapper-label,
2+
#age .mantine-InputWrapper-label,
3+
#education .mantine-InputWrapper-label,
4+
#gender .mantine-InputWrapper-label .mantine-Text-root,
5+
#age .mantine-InputWrapper-label .mantine-Text-root,
6+
#education .mantine-InputWrapper-label .mantine-Text-root {
7+
font-size: 0.88rem !important;
8+
--text-fz: 0.88rem !important;
9+
line-height: 1.12 !important;
10+
}
11+
12+
#gender .mantine-Radio-label,
13+
#age .mantine-Radio-label,
14+
#education .mantine-Radio-label,
15+
#gender .mantine-Input-input,
16+
#age .mantine-Input-input,
17+
#education .mantine-Input-input,
18+
#gender .mantine-InputWrapper-description,
19+
#age .mantine-InputWrapper-description,
20+
#education .mantine-InputWrapper-description {
21+
font-size: 0.79rem !important;
22+
--text-fz: 0.79rem !important;
23+
line-height: 1.12 !important;
24+
}
25+
26+
#gender .no-last-child-bottom-padding :is(p, li),
27+
#age .no-last-child-bottom-padding :is(p, li),
28+
#education .no-last-child-bottom-padding :is(p, li) {
29+
margin-bottom: 0.125rem;
30+
}
31+
32+
#gender .mantine-Group-root,
33+
#age .mantine-Group-root,
34+
#education .mantine-Group-root {
35+
gap: 0.25rem !important;
36+
}
37+
38+
#gender.response,
39+
#age.response,
40+
#education.response {
41+
margin-bottom: 0.4rem !important;
42+
}
43+
44+
#gender .mantine-InputWrapper-root,
45+
#age .mantine-InputWrapper-root,
46+
#education .mantine-InputWrapper-root {
47+
--input-margin-top: 0.15rem;
48+
}
49+
50+
#gender .mantine-Radio-root,
51+
#age .mantine-Radio-root,
52+
#education .mantine-Radio-root {
53+
margin-top: 0.05rem !important;
54+
margin-bottom: 0.05rem !important;
55+
}
56+
57+
#gender .mantine-Stack-root,
58+
#age .mantine-Stack-root,
59+
#education .mantine-Stack-root {
60+
display: grid !important;
61+
grid-template-columns: repeat(2, minmax(250px, 320px));
62+
justify-content: start;
63+
column-gap: 0.35rem !important;
64+
row-gap: 0.15rem !important;
65+
}
66+
67+
#gender .mantine-Stack-root > div,
68+
#age .mantine-Stack-root > div,
69+
#education .mantine-Stack-root > div {
70+
min-width: 0;
71+
}
72+
73+
#gender .mantine-Input-input,
74+
#age .mantine-Input-input,
75+
#education .mantine-Input-input {
76+
width: 100%;
77+
}

‎public/color-palette-study/config.json‎

Lines changed: 58 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -89,6 +89,63 @@
8989
}
9090
]
9191
},
92+
"demographics": {
93+
"type": "questionnaire",
94+
"description": "Basic demographic questions including gender, age, and education",
95+
"response": [
96+
{
97+
"id": "gender",
98+
"prompt": "What is your **gender**?",
99+
"required": true,
100+
"location": "aboveStimulus",
101+
"type": "radio",
102+
"withOther": true,
103+
"stylesheetPath": "color-palette-study/assets/demographics-compact.css",
104+
"options": [
105+
"Woman",
106+
"Man",
107+
"Non-binary / Genderqueer / Third gender",
108+
"Genderfluid / Gender non-conforming",
109+
"Questioning",
110+
"Prefer not to say"
111+
]
112+
},
113+
{
114+
"id": "age",
115+
"prompt": "What is your **age**?",
116+
"required": true,
117+
"location": "aboveStimulus",
118+
"type": "radio",
119+
"stylesheetPath": "color-palette-study/assets/demographics-compact.css",
120+
"options": [
121+
"Under 18 years",
122+
"18-24 years",
123+
"25-34 years",
124+
"35-44 years",
125+
"45-54 years",
126+
"55-64 years",
127+
"65 years or older",
128+
"Prefer not to say"
129+
]
130+
},
131+
{
132+
"id": "education",
133+
"prompt": "What is the **highest degree or level of education** you have completed?",
134+
"required": true,
135+
"location": "aboveStimulus",
136+
"type": "radio",
137+
"withOther": true,
138+
"stylesheetPath": "color-palette-study/assets/demographics-compact.css",
139+
"options": [
140+
"Less than high school",
141+
"High school diploma or equivalent",
142+
"Bachelor's degree or equivalent",
143+
"Master's degree or equivalent",
144+
"Doctoral degree or equivalent"
145+
]
146+
}
147+
]
148+
},
92149
"introduction": {
93150
"type": "markdown",
94151
"path": "color-palette-study/assets/introduction.md",
@@ -11098,6 +11155,7 @@
1109811155
"order": "fixed",
1109911156
"components": [
1110011157
"consent",
11158+
"demographics",
1110111159
"introduction",
1110211160
{
1110311161
"id": "block_1",

‎public/global.json‎

Lines changed: 4 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -57,6 +57,7 @@
5757
"aireplicate-vibe-exp3",
5858
"visualization-vibes",
5959
"decision-theory-study",
60+
"color-palette-study",
6061
"study-independents-declarations"
6162
],
6263
"configs": {
@@ -240,6 +241,9 @@
240241
"decision-theory-study": {
241242
"path": "decision-theory-study/config.json"
242243
},
244+
"color-palette-study": {
245+
"path": "color-palette-study/config.json"
246+
},
243247
"study-independents-declarations": {
244248
"path": "study-independents-declarations/config.json"
245249
},

‎public/libraries/demographics/config.json‎

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -5,6 +5,9 @@
55
"demographics": {
66
"type": "questionnaire",
77
"description": "Basic demographic questions including gender, age, and education",
8+
"style": {
9+
"fontSize": "10px"
10+
},
811
"response": [
912
{
1013
"id": "gender",

0 commit comments

Comments
 (0)