@adriansteffan/reactive 0.0.10 → 0.0.12

package/README.md

@@ -30,7 +30,6 @@ Premade components available so far:
 * Quest: SurveyJS questionnaires
     * ... all questiontypes supported by SurveyJS can be used
     * voicerecorder: a custom question type that allows participants to record voice
-* MasterMindleWrapper: (weird name atm, needs splitting up) Participants play a game similar to Mastermind with varying difficulties
 * Upload: Uploads the collected data on a button press by the participant 
 
 

package/dist/mod.d.ts

@@ -45,14 +45,6 @@ export declare interface FileUpload {
 
 export declare function getParam<T extends ParamType>(name: string, defaultValue: ParamValue<T> | undefined, type?: T): ParamValue<T> | undefined;
 
-export declare function MasterMindleWrapper({ next, blockIndex, feedback, timeLimit, maxGuesses, }: {
-    next: (data: object) => void;
-    blockIndex: number;
-    feedback: 1 | 2 | 3 | 4 | 5;
-    timeLimit: number;
-    maxGuesses: number;
-}): JSX_2.Element;
-
 export declare const MicCheck: ({ next }: {
     next: (data: object) => void;
 }) => JSX_2.Element;

package/dist/preset.css

@@ -0,0 +1,134 @@
+@import 'tailwindcss';
+
+@source '../dist/**/*.{js,ts,jsx,tsx}';
+
+@theme {
+  --font-*: initial;
+  --font-sans: Atkinson Hyperlegible, sans-serif;
+  --font-atkinson: Atkinson Hyperlegible, sans-serif;
+
+  --animate-slide-down: slideDown 0.8s ease-out forwards;
+  --animate-fade-in: fadeIn 0.5s ease-out forwards;
+
+  @keyframes slideDown {
+    0% {
+      transform: translateY(-10px);
+      opacity: 0;
+    }
+    100% {
+      transform: translateY(0);
+      opacity: 1;
+    }
+  }
+  @keyframes fadeIn {
+    0% {
+      opacity: 0;
+    }
+    100% {
+      opacity: 1;
+    }
+  }
+}
+
+
+@keyframes slideDown {
+  0% {
+    transform: translateY(-10px);
+    opacity: 0;
+  }
+  100% {
+    transform: translateY(0);
+    opacity: 1;
+  }
+}
+
+@keyframes fadeIn {
+  0% {
+    opacity: 0;
+  }
+  100% {
+    opacity: 1;
+  }
+}
+
+/*
+  The default border color has changed to `currentColor` in Tailwind CSS v4,
+  so we've added these compatibility styles to make sure everything still
+  looks the same as it did with Tailwind CSS v3.
+
+  If we ever want to remove these styles, we need to add an explicit border
+  color utility to any element that depends on these defaults.
+*/
+@layer base {
+  *,
+  ::after,
+  ::before,
+  ::backdrop,
+  ::file-selector-button {
+    border-color: var(--color-gray-200, currentColor);
+  }
+}
+
+:root {
+  --font-atkinson: 'Atkinson Hyperlegible', system-ui, sans-serif;
+}
+
+* {
+  -webkit-touch-callout: none;
+}
+
+@font-face {
+  font-family: 'Atkinson Hyperlegible';
+  src: url('/Atkinson_Hyperlegible/AtkinsonHyperlegible-Regular.ttf') format('truetype');
+  font-weight: 400;
+  font-style: normal;
+}
+
+@font-face {
+  font-family: 'Atkinson Hyperlegible';
+  src: url('/Atkinson_Hyperlegible/AtkinsonHyperlegible-Bold.ttf') format('truetype');
+  font-weight: 700;
+  font-style: normal;
+}
+
+@font-face {
+  font-family: 'Atkinson Hyperlegible';
+  src: url('/Atkinson_Hyperlegible/AtkinsonHyperlegible-Italic.ttf') format('truetype');
+  font-weight: 400;
+  font-style: italic;
+}
+
+@font-face {
+  font-family: 'Atkinson Hyperlegible';
+  src: url('/Atkinson_Hyperlegible/AtkinsonHyperlegible-BoldItalic.ttf') format('truetype');
+  font-weight: 700;
+  font-style: italic;
+}
+
+/* customization for the surveyjs elements - a bit hacky and broken*/
+.sd-root-modern {
+  background-color: white !important;
+  background-image: radial-gradient(#e5e7eb 1px, transparent 1px);
+  background-size: 16px 16px;
+  position: relative; /* Make sure position is set for proper rendering */
+  font-family: 'Atkinson Hyperlegible', sans-serif; /* Added this line */
+}
+
+.sd-root-modern * {
+  font-family: 'Atkinson Hyperlegible', sans-serif;
+}
+
+/* for the rating group panel, maybe we can move that into the component at some point*/
+.sd-row,
+.sd-clearfix {
+  padding-bottom: 20px !important;
+}
+
+/* fix pet peeve in surveyjs */
+@media (max-width: 639px) {
+  .sd-imagepicker__item--inline {
+    margin-left: auto;
+    margin-right: auto;
+    margin-top: 10px;
+  }
+}