wip: Bunch of changes for v4

From the top of my head (but I'll write this up later):

- We keep the info about the designs in the design
- We use a new about.json file for this
- The auto-generated data.mjs file is no more
- Linedrawings we use in the design picker use the front
- Linedrawings should respect square aspect ration
- Migrated components to use the 'tw-' prefic for tailwind CSS classes
  to avoid conflicts with docusaurus styles

packages/react/components/Account/Control.mjs

@@ -52,14 +52,14 @@ export const Control = ({ welcome = false }) => {
     : false
 
   return (
-    <div className="w-full">
+    <div className="tw-w-full">
       <ListInput
         id="account-control"
         label="What user experience do you prefer?"
         list={[1, 2, 3, 4, 5].map((val) => ({
           val,
           label: (
-            <div className="flex flex-row items-center w-full justify-between">
+            <div className="tw-flex tw-flex-row tw-items-center tw-w-full tw-justify-between">
               <span>{controlDesc[val].title}</span>
               <ControlScore control={val} />
             </div>
@@ -71,17 +71,17 @@ export const Control = ({ welcome = false }) => {
       />
       {welcome ? (
         <>
-          <IconButton href={nextHref} className="mt-4">
+          <IconButton href={nextHref} className="tw-mt-4">
             <RightIcon stroke={3} /> Continue
           </IconButton>
           {welcomeSteps[control].length > 1 ? (
             <>
               <progress
-                className="daisy-progress daisy-progress-primary w-full mt-12"
+                className="tw-daisy-progress tw-daisy-progress-primary tw-w-full tw-mt-12"
                 value={100 / welcomeSteps[control].length}
                 max="100"
               ></progress>
-              <span className="pt-4 text-sm font-bold opacity-50">
+              <span className="tw-pt-4 tw-text-sm tw-font-bold tw-opacity-50">
                 1 / {welcomeSteps[control].length}
               </span>
               <WelcomeIcons done={[]} todo={welcomeSteps[control].slice(1)} current="" />