feat: setup tailwind, postcss and custom css utilities

postcss.config.cjs

@@ -0,0 +1,6 @@
+module.exports = {
+  plugins: {
+    tailwindcss: {},
+    autoprefixer: {},
+  },
+};

src/index.css

@@ -0,0 +1,55 @@
+@tailwind base;
+@tailwind components;
+@tailwind utilities;
+
+@layer components {
+  .hyphenate {
+    hyphens: auto;
+  }
+
+  .text-height {
+    height: 1em;
+    width: auto;
+  }
+
+  .sortable-drag-card {
+    @apply card card-bordered card-compact bg-white;
+    opacity: 0.8 !important;
+  }
+
+  .sortable-ghost-card {
+    @apply indicator w-full;
+  }
+
+  .sortable-ghost-card .card {
+    @apply border-accent;
+  }
+
+  .file-input::file-selector-button {
+    @apply btn btn-xs;
+  }
+
+  .select-list {
+    position: absolute;
+    z-index: 999;
+  }
+
+  .input-group .solid-select-container * {
+    border-radius: 0;
+  }
+
+  .tr-bg-transparent td,
+  .tr-bg-transparent th {
+    @apply bg-transparent;
+  }
+}
+
+@layer base {
+  td {
+    @apply bg-clip-padding;
+  }
+
+  .ignore-white-space .white-space {
+    @apply whitespace-nowrap;
+  }
+}

tailwind.config.cjs

@@ -0,0 +1,29 @@
+module.exports = {
+  content: ["./src/**/*.{html,js,jsx,ts,tsx}"],
+  theme: {
+    extend: {
+      colors: {
+        "lufrai-primary-darker": "#003c36",
+        "lufrai-primary": "#2c837a",
+        "lufrai-primary-light": "#59a59d",
+        "swiss-red": "#FF0000", // the old one: "#E11A27"
+      },
+      screens: {
+        sm: "640px",
+        // => @media (min-width: 640px) { ... }
+
+        md: "768px",
+        // => @media (min-width: 768px) { ... }
+
+        lg: "1024px",
+        // => @media (min-width: 1024px) { ... }
+
+        xl: "1280px",
+        // => @media (min-width: 1280px) { ... }
+
+        xxl: "1680px",
+      },
+    },
+  },
+  plugins: [require("@tailwindcss/typography"), require("daisyui")],
+};