Skip to content

Commit 9438356

Browse files
webstackdevwebstackdev
committed
Consent stylings
1 parent a8d26e2 commit 9438356

27 files changed

Lines changed: 1210 additions & 500 deletions

‎_TODO.md‎

Lines changed: 14 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -3,6 +3,11 @@
33

44
Clear All Workspace Chats
55

6+
## Case Study page layout example
7+
8+
https://www.meteorops.com/case-studies/deploy-identical-development-and-production-environments-using-terraform
9+
https://www.meteorops.com/case-studies
10+
611
## E2E Files with Skipped Tests
712

813
Blocked Categories (44 tests):
@@ -50,6 +55,7 @@ Right now we're using string literals to define HTML email templates for site ma
5055
Vercel AI Gateway, maybe could use for a chatbot:
5156

5257
https://vercel.com/kevin-browns-projects-dd474f73/astro-webstackbuilders-com/ai-gateway
58+
https://aws.plainenglish.io/how-to-build-a-chatbot-using-aws-lex-and-lambda-in-2026-aeeff5e13f4a
5359

5460
## Move containers to dev server from Playwright
5561

@@ -113,6 +119,9 @@ Need a tooltip component for consistency. List to add tooltips to:
113119
[mermaid init](https://github.com/hbstack/mermaid/blob/main/assets/hb/modules/mermaid/init.ts)
114120
[theming](https://mermaid.ai/open-source/config/theming.html)
115121

122+
https://mermaid.js.org/config/theming.html
123+
https://mermaid.js.org/config/directives.html
124+
116125
## Support Pages to Style
117126

118127
- /
@@ -121,6 +130,7 @@ Need a tooltip component for consistency. List to add tooltips to:
121130
- /consent
122131
- /contact
123132
- /downloads/[slug]
133+
- /newsletter
124134
- /newsletter/confirm/[token]
125135
- /offline
126136
- /privacy/my-data
@@ -129,6 +139,10 @@ Need a tooltip component for consistency. List to add tooltips to:
129139
- Bug reporter modal
130140
- Email templates
131141

142+
## Breadcrumb visual improvements
143+
144+
See comp images in Breadcrumbs component directory
145+
132146
## Keyboard Navigation
133147

134148
- Should header links be in the tab order?

‎src/components/Breadcrumbs/breadcrumb-1.png‎

18.6 KB
Loading

‎src/components/Breadcrumbs/breadcrumb-2.jpg‎

26.9 KB
Loading

‎src/components/Breadcrumbs/breadcrumb-3.jpg‎

20 KB
Loading

‎src/components/Forms/Contact/index.astro‎

Lines changed: 4 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -9,8 +9,10 @@ import './validation.css'
99
1010
export type Props = {
1111
content: {
12-
title: string
13-
message: string
12+
header: {
13+
title: string
14+
description: string
15+
}
1416
}
1517
}
1618

‎src/components/Icon/icons/apple.astro‎

Lines changed: 26 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,26 @@
1+
---
2+
export type Props = {
3+
color: string
4+
classes?: string
5+
size: number
6+
accessible: boolean
7+
focusable: boolean
8+
isListMarker?: boolean
9+
}
10+
11+
const { color, classes, size, accessible, focusable, isListMarker } = Astro.props
12+
---
13+
14+
<svg
15+
xmlns="http://www.w3.org/2000/svg"
16+
viewBox="0 0 24 24"
17+
class:list={["shrink-0", `w-${size} h-${size}`, `text-${color}`, classes, isListMarker ? "mt-0.5" : ""]}
18+
fill="currentColor"
19+
stroke="none"
20+
aria-hidden={accessible ? "false" : "true"}
21+
focusable={focusable ? "true" : "false"}
22+
role="img"
23+
>
24+
{accessible && <title>apple icon</title>}
25+
<path style="stroke-width:1.19813" d="m 17.728295,20.967185 c -0.994443,1.485674 -2.048793,2.995311 -3.65428,2.995311 -1.605487,0 -2.120681,-0.946517 -3.941831,-0.946517 -1.8211497,0 -2.3962495,0.922555 -3.9178681,0.982461 C 4.6926972,24.058347 3.4586286,22.380971 2.500129,20.931241 0.45133532,17.971873 -1.0942458,12.544367 0.99049159,8.8541428 A 5.8468494,5.8468494 0 0 1 5.8788409,5.8468494 c 1.5335998,0 2.9953121,1.0423686 3.9418308,1.0423686 0.9465183,0 2.7077623,-1.2819936 4.5648553,-1.0902936 a 5.5592993,5.5592993 0 0 1 4.361176,2.3962496 5.4634494,5.4634494 0 0 0 -2.57597,4.564856 5.2837305,5.2837305 0 0 0 3.210975,4.792499 13.23928,13.23928 0 0 1 -1.653413,3.390694 M 10.887003,1.7971872 A 5.4514681,5.4514681 0 0 1 14.40949,0 5.2477868,5.2477868 0 0 1 13.211365,3.8220182 4.3731558,4.3731558 0 0 1 9.6169906,5.5233556 5.1159932,5.1159932 0 0 1 10.887003,1.7971872 Z" />
26+
</svg>

‎src/components/Icon/icons/avatar.astro‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -13,7 +13,7 @@ const { color, classes, size, accessible, focusable, isListMarker } = Astro.prop
1313

1414
<svg
1515
xmlns="http://www.w3.org/2000/svg"
16-
class:list={["shrink-0", `w-${size} h-${size}`, color, classes, isListMarker ? "mt-0.5" : ""]}
16+
class:list={["shrink-0", `w-${size} h-${size}`, `text-${color}`, classes, isListMarker ? "mt-0.5" : ""]}
1717
fill="none"
1818
stroke="currentColor"
1919
viewBox="0 0 24 24"

‎src/components/Icon/icons/chrome.astro‎

Lines changed: 29 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,29 @@
1+
---
2+
export type Props = {
3+
color: string
4+
classes?: string
5+
size: number
6+
accessible: boolean
7+
focusable: boolean
8+
isListMarker?: boolean
9+
}
10+
11+
const { color, classes, size, accessible, focusable, isListMarker } = Astro.props
12+
---
13+
14+
<svg
15+
xmlns="http://www.w3.org/2000/svg"
16+
viewBox="0 0 24 24"
17+
class:list={["shrink-0", `w-${size} h-${size}`, `text-${color}`, classes, isListMarker ? "mt-0.5" : ""]}
18+
fill="currentColor"
19+
stroke="none"
20+
aria-hidden={accessible ? "false" : "true"}
21+
focusable={focusable ? "true" : "false"}
22+
role="img"
23+
>
24+
{accessible && <title>chrome browser icon</title>}
25+
<path style="stroke-width:1.20004" d="M 11.774433,5.8802057 C 15.206554,5.1361797 18.686675,5.028176 22.130796,5.5921957 20.006722,2.232078 16.26259,0 11.990441,0 8.2583463,0 4.9222296,1.7040597 2.7141523,4.3801533 c 0.5280183,1.5600534 1.200042,3.0481067 2.00407,4.4641564 0.4560167,0.81603 1.6200567,0.7800266 2.0880733,-0.024001 1.0200367,-1.71606 2.8560634,-2.8681 4.9681374,-2.940103 z" />
26+
<path style="stroke-width:1.20004" d="M 6.8548853,15.266214 C 4.4548013,12.698124 2.5827356,9.770022 1.2986906,6.5299207 -0.50137235,10.082033 -0.48937169,14.438185 1.706705,18.098313 c 1.9200673,3.204114 5.088178,5.196182 8.520274,5.7122 1.068037,-1.260043 2.00407,-2.60409 2.808097,-4.00814 0.468017,-0.81603 -0.168,-1.788063 -1.10404,-1.788063 -2.00407,0.012 -3.936114,-0.972034 -5.0761507,-2.748096 z" />
27+
<path style="stroke-width:1.20004" d="m 7.875269,11.99826 c 0,0.732027 0.18,1.41605 0.55202,2.064073 0.7320266,1.260044 2.08806,2.052074 3.552112,2.052074 1.46405,0 2.8321,-0.792027 3.552125,-2.052074 0.372013,-0.648023 0.56402,-1.332046 0.56402,-2.064073 0,-2.26808 -1.848064,-4.1041797 -4.116144,-4.1041797 -2.2560804,-0.012 -4.104132,1.8361 -4.104133,4.1041797 z" />
28+
<path style="stroke-width:1.20004" d="m 23.199673,7.7034417 c -1.644056,-0.3480134 -3.312116,-0.54002 -4.968174,-0.56402 -0.948033,-0.012001 -1.488053,1.0200366 -1.020036,1.8480633 0.480016,0.8520167 0.756026,1.836053 0.756026,2.88009 0,1.008037 -0.264,2.00407 -0.756026,2.8921 -1.128039,3.456123 -2.808098,6.52823 -5.028175,9.240325 6.540229,-0.108 11.808413,-5.43619 11.808413,-12.00042 0,-1.512053 -0.276,-2.96409 -0.792028,-4.2961383 z" />
29+
</svg>

‎src/components/Icon/icons/clock.astro‎

Lines changed: 39 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,39 @@
1+
---
2+
export type Props = {
3+
color: string
4+
classes?: string
5+
size: number
6+
accessible: boolean
7+
focusable: boolean
8+
isListMarker?: boolean
9+
}
10+
11+
const { color, classes, size, accessible, focusable, isListMarker } = Astro.props
12+
---
13+
14+
<svg
15+
xmlns="http://www.w3.org/2000/svg"
16+
viewBox="0 0 24 24"
17+
class:list={["shrink-0", `w-${size} h-${size}`, `text-${color}`, classes, isListMarker ? "mt-0.5" : ""]}
18+
fill="currentColor"
19+
stroke="none"
20+
aria-hidden={accessible ? "false" : "true"}
21+
focusable={focusable ? "true" : "false"}
22+
role="img"
23+
>
24+
{accessible && <title>clock with hands icon</title>}
25+
<path style="stroke-width:0.046875" d="m 8.4915469,10.563094 3.0387191,2.344265 0.04228,0.02424 0.01894,0.01059 c 0.262782,0.146343 0.610641,0.06877 0.842578,-0.186516 l 0.02025,-0.01941 3.724313,-4.4063441 c 0.21206,-0.2376533 0.215576,-0.5797939 0.0093,-0.7632158 -0.206765,-0.1838437 -0.545812,-0.1397343 -0.757031,0.097875 L 11.949563,11.383594 9.2618438,9.5119688 C 9.0105,9.3268125 8.6335781,9.4127813 8.4205781,9.7033125 8.2080469,9.993 8.2393125,10.378359 8.4915469,10.563094 Z" />
26+
<path style="stroke-width:0.046875" d="m 4.708125,11.999531 c 0,-0.160968 0.00352,-0.321843 0.020531,-0.479718 H 2.8210781 c -0.011672,0.157828 -0.014766,0.31875 -0.014766,0.479718 0,0.164016 0.00309,0.322313 0.014766,0.480563 h 1.9075781 c -0.017016,-0.15825 -0.020531,-0.31875 -0.020531,-0.480563 z" />
27+
<path style="stroke-width:0.046875" d="M 8.0819531,5.8498594 C 8.2622812,5.7356719 8.4463594,5.6280937 8.6332969,5.5324219 l 0.07275,-0.035297 -0.950625,-1.6507031 C 7.5175781,3.966328 7.285875,4.099453 7.0610156,4.2454218 l 0.9510469,1.6515937 z" />
28+
<path style="stroke-width:0.046875" d="M 3.8468438,7.755 5.49825,8.7055781 5.8979531,8.0120625 4.2458906,7.0610156 C 4.0999219,7.285875 3.9669844,7.5169219 3.8468438,7.755 Z" />
29+
<path style="stroke-width:0.046875" d="m 18.467812,15.366281 c -0.09919,0.187407 -0.203484,0.370782 -0.320812,0.548485 l -0.04758,0.06966 1.651875,0.951 c 0.146156,-0.224859 0.279281,-0.452813 0.402281,-0.690469 l -1.647656,-0.95414 z" />
30+
<path style="stroke-width:0.046875" d="m 5.5330781,15.363187 -0.038156,-0.07233 -1.6480781,0.950625 c 0.1172812,0.237657 0.2530312,0.469125 0.399,0.693985 l 1.6520624,-0.951 -0.048094,-0.06966 C 5.7359062,15.737063 5.6283281,15.553688 5.5330781,15.363187 Z" />
31+
<path style="stroke-width:0.046875" d="M 8.0819531,18.146578 8.0120625,18.099 7.0610156,19.751016 c 0.2249063,0.145968 0.4565625,0.282187 0.6944063,0.402562 l 0.950625,-1.651594 -0.07275,-0.03525 C 8.4463125,18.371438 8.2622344,18.263859 8.0819531,18.146578 Z" />
32+
<path style="stroke-width:0.046875" d="m 15.291047,5.4945 0.694219,0.4025625 0.950812,-1.6515938 C 16.711406,4.0995 16.482609,3.966375 16.245609,3.8464687 Z" />
33+
<path style="stroke-width:0.046875" d="m 11.520281,19.271297 v 1.905187 c 0.158297,0.01406 0.31875,0.01716 0.479485,0.01716 0.161343,0 0.322078,-0.0031 0.479906,-0.01716 v -1.905187 -0.01983 h -0.959391 z" />
34+
<path style="stroke-width:0.046875" d="M 12.479672,4.7286562 V 2.8235156 c -0.157828,-0.014156 -0.318563,-0.017203 -0.479906,-0.017203 -0.160735,0 -0.321188,0.00305 -0.479485,0.017203 v 1.9051406 0.019828 h 0.959391 z" />
35+
<path style="stroke-width:0.046875" d="m 15.291047,18.505031 0.954562,1.6485 c 0.237,-0.12389 0.465797,-0.256594 0.690469,-0.402562 l -0.950812,-1.652016 z" />
36+
<path style="stroke-width:0.046875" d="M 20.153578,7.755 C 20.033016,7.5169219 19.897406,7.2859219 19.751297,7.0610156 l -1.651875,0.9510469 0.403172,0.6935156 z" />
37+
<path style="stroke-width:0.046875" d="m 21.179109,11.519859 h -1.907343 -0.01983 v 0.960282 h 0.01983 1.907343 c 0.01191,-0.15825 0.01458,-0.31875 0.01458,-0.480563 -4.7e-5,-0.160969 -0.0027,-0.321891 -0.01458,-0.479719 z" />
38+
<path style="stroke-width:0.046875" d="M 11.999766,0 C 5.3719219,4.21875e-4 4.2187e-4,5.3723437 0,12 4.2187e-4,18.627656 5.3719219,23.999531 11.999766,24 18.627609,23.999531 23.999109,18.627656 23.999531,12 23.999109,5.3723437 18.627609,4.21875e-4 11.999766,0 Z m 0,22.451531 C 9.111,22.451062 6.5028281,21.283125 4.6094062,19.390359 2.7168281,17.496281 1.5486562,14.888297 1.5484219,12 1.5486562,9.1116562 2.7168281,6.5032969 4.6093594,4.6100625 6.5028281,2.7167813 9.111,1.5488438 11.999766,1.5484219 c 2.888343,4.687e-4 5.496468,1.1684062 7.390359,3.0616406 1.892578,1.8932344 3.06075,4.501125 3.060938,7.3899375 -2.35e-4,2.888297 -1.168407,5.496281 -3.060938,7.390359 -1.893891,1.892813 -4.502016,3.06075 -7.390359,3.061172 z" />
39+
</svg>

‎src/components/Icon/icons/database.astro‎

Lines changed: 30 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,30 @@
1+
---
2+
export type Props = {
3+
color: string
4+
classes?: string
5+
size: number
6+
accessible: boolean
7+
focusable: boolean
8+
isListMarker?: boolean
9+
}
10+
11+
const { color, classes, size, accessible, focusable, isListMarker } = Astro.props
12+
---
13+
14+
<svg
15+
xmlns="http://www.w3.org/2000/svg"
16+
viewBox="0 0 24 24"
17+
class:list={["shrink-0", `w-${size} h-${size}`, `text-${color}`, classes, isListMarker ? "mt-0.5" : ""]}
18+
fill="none"
19+
stroke="currentColor"
20+
aria-hidden={accessible ? "false" : "true"}
21+
focusable={focusable ? "true" : "false"}
22+
role="img"
23+
>
24+
{accessible && <title>database icon</title>}
25+
<path stroke-width="1.67442" stroke-linecap="round" d="M 0.83720999,18.697674 V 5.302326" />
26+
<path stroke-width="1.67442" stroke-linecap="round" d="M 18.697674,5.302326 V 18.697674" />
27+
<path stroke-width="1.67442" d="m 9.767442,9.767442 c 4.932056,0 8.930232,-1.9991 8.930232,-4.465116 0,-2.4660167 -3.998176,-4.46511601 -8.930232,-4.46511601 -4.9320333,0 -8.93023201,1.99909931 -8.93023201,4.46511601 0,2.4660166 3.99819871,4.465116 8.93023201,4.465116 z" />
28+
<path stroke-width="1.67442" d="m 18.697674,12 c 0,2.465973 -3.998176,4.465116 -8.930232,4.465116 -4.9320333,0 -8.93023201,-1.999143 -8.93023201,-4.465116" />
29+
<path stroke-width="1.67442" d="m 18.697674,18.697674 c 0,2.465973 -3.998176,4.465116 -8.930232,4.465116 -4.9320333,0 -8.93023201,-1.999143 -8.93023201,-4.465116" />
30+
</svg>

0 commit comments

Comments
 (0)