@krrli/cm-designsystem 1.37.1 → 1.37.3

package/dist/components/form/Form.js

@@ -3,7 +3,7 @@ import * as RadixForm from "@radix-ui/react-form";
 import { tv } from "tailwind-variants";
 const formStyles = tv({
   slots: {
-    base: ["gap-16", "flex", "flex-col"],
+    base: ["gap-16", "flex", "flex-col", "w-full"],
     fields: ["gap-4", "flex", "flex-col"]
   }
 });

package/dist/components/logo-link/LogoLink.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"LogoLink.d.ts","sourceRoot":"","sources":["../../../src/components/logo-link/LogoLink.tsx"],"names":[],"mappings":"AAmCA;;GAEG;AACH,KAAK,aAAa,GAAG,KAAK,CAAC,wBAAwB,CAAC,GAAG,CAAC,GAAG;IACzD;;OAEG;IACH,IAAI,CAAC,EAAE,MAAM,CAAC;CACf,CAAC;AAEF,eAAO,MAAM,QAAQ,GAAI,oBAA0B,aAAa,4CAqB/D,CAAC"}
+{"version":3,"file":"LogoLink.d.ts","sourceRoot":"","sources":["../../../src/components/logo-link/LogoLink.tsx"],"names":[],"mappings":"AAuBA;;GAEG;AACH,KAAK,aAAa,GAAG,KAAK,CAAC,wBAAwB,CAAC,GAAG,CAAC,GAAG;IACzD;;OAEG;IACH,IAAI,CAAC,EAAE,MAAM,CAAC;CACf,CAAC;AAEF,eAAO,MAAM,QAAQ,GAAI,oBAA0B,aAAa,4CAQ/D,CAAC"}

package/dist/components/logo-link/LogoLink.js

@@ -1,59 +1,31 @@
-import { jsx, jsxs } from "react/jsx-runtime";
+import { jsxs, jsx } from "react/jsx-runtime";
 import { tv } from "tailwind-variants";
-import hoverLogoDefault from "../branding/hover-logo-default.svg.js";
-import hoverLogoHovered from "../branding/hover-logo-hovered.svg.js";
+import { Mumble } from "../icons/generated/Mumble.js";
 const logoStyles = tv({
   slots: {
-    link: [
-      "focus-ring-neutral",
-      "inline-flex",
-      "items-center",
-      "gap-2",
-      "align-middle"
-    ],
-    container: ["group", "relative", "w-auto"],
-    default: [
-      "transition-all",
-      "duration-200",
-      "select-none",
-      "block",
+    base: ["flex", "items-center", "focus-ring-neutral", "gap-3", "group"],
+    icon: [
+      "text-white",
+      "w-10",
       "h-10",
-      "w-auto",
-      "group-hover:hidden"
+      "group-hover:scale-125",
+      "transition-transform"
     ],
-    hover: [
-      "transition-all",
-      "duration-200",
-      "select-none",
-      "hidden",
-      "h-11",
-      "w-auto",
-      "group-hover:block"
+    text: [
+      "text-white",
+      "text-[40px]/[100%]",
+      "font-bold",
+      "tracking-[-0.1rem]",
+      "font-bold"
     ]
   }
 });
 const LogoLink = ({ href = "/", ...props }) => {
   const styles = logoStyles();
-  return /* @__PURE__ */ jsx("a", { href, className: styles.link(), ...props, children: /* @__PURE__ */ jsxs("div", { className: styles.container(), children: [
-    /* @__PURE__ */ jsx(
-      "img",
-      {
-        src: hoverLogoDefault,
-        alt: "Logo Default",
-        className: styles.default(),
-        draggable: false
-      }
-    ),
-    /* @__PURE__ */ jsx(
-      "img",
-      {
-        src: hoverLogoHovered,
-        alt: "Logo Hovered",
-        className: styles.hover(),
-        draggable: false
-      }
-    )
-  ] }) });
+  return /* @__PURE__ */ jsxs("a", { href, className: styles.base(), ...props, children: [
+    /* @__PURE__ */ jsx(Mumble, { className: styles.icon() }),
+    /* @__PURE__ */ jsx("span", { className: styles.text(), children: "Mumble" })
+  ] });
 };
 export {
   LogoLink

package/dist/components/modal/Modal.d.ts

@@ -5,8 +5,8 @@ declare const modalStyles: import('tailwind-variants').TVReturnType<{
         [key: string]: import('tailwind-merge').ClassNameValue | {
             title?: import('tailwind-merge').ClassNameValue;
             content?: import('tailwind-merge').ClassNameValue;
-            container?: import('tailwind-merge').ClassNameValue;
             overlay?: import('tailwind-merge').ClassNameValue;
+            container?: import('tailwind-merge').ClassNameValue;
             actions?: import('tailwind-merge').ClassNameValue;
         };
     };
@@ -15,8 +15,8 @@ declare const modalStyles: import('tailwind-variants').TVReturnType<{
         [x: string]: import('tailwind-merge').ClassNameValue | {
             title?: import('tailwind-merge').ClassNameValue;
             content?: import('tailwind-merge').ClassNameValue;
-            container?: import('tailwind-merge').ClassNameValue;
             overlay?: import('tailwind-merge').ClassNameValue;
+            container?: import('tailwind-merge').ClassNameValue;
             actions?: import('tailwind-merge').ClassNameValue;
         };
     };
@@ -31,8 +31,8 @@ declare const modalStyles: import('tailwind-variants').TVReturnType<{
         [key: string]: import('tailwind-merge').ClassNameValue | {
             title?: import('tailwind-merge').ClassNameValue;
             content?: import('tailwind-merge').ClassNameValue;
-            container?: import('tailwind-merge').ClassNameValue;
             overlay?: import('tailwind-merge').ClassNameValue;
+            container?: import('tailwind-merge').ClassNameValue;
             actions?: import('tailwind-merge').ClassNameValue;
         };
     };

package/dist/compositions/user-recommendation/UserRecommendation.js

@@ -5,8 +5,8 @@ import { Avatar } from "../../components/avatar/Avatar.js";
 import { Button } from "../../components/button/Button.js";
 import { IconButton } from "../../components/icon-button/IconButton.js";
 import { Label } from "../../components/typography/Label.js";
-import { Mumble } from "../../components/icons/generated/Mumble.js";
 import { Profile } from "../../components/icons/generated/Profile.js";
+import { Mumble } from "../../components/icons/generated/Mumble.js";
 const userRecommendationStyles = tv({
   slots: {
     base: [

package/dist/styles.css

@@ -508,10 +508,6 @@
     height: calc(var(--spacing) * 10);
   }
 
-  .h-11 {
-    height: calc(var(--spacing) * 11);
-  }
-
   .h-16 {
     height: calc(var(--spacing) * 16);
   }
@@ -580,10 +576,6 @@
     width: calc(100% - 2rem);
   }
 
-  .w-auto {
-    width: auto;
-  }
-
   .w-fit {
     width: fit-content;
   }
@@ -1109,10 +1101,6 @@
     padding-left: calc(var(--spacing) * 6);
   }
 
-  .align-middle {
-    vertical-align: middle;
-  }
-
   .text-\[14px\]\/\[100\%\] {
     font-size: 14px;
     line-height: 100%;
@@ -1158,6 +1146,11 @@
     line-height: 125%;
   }
 
+  .text-\[40px\]\/\[100\%\] {
+    font-size: 40px;
+    line-height: 100%;
+  }
+
   .text-\[40px\]\/\[125\%\] {
     font-size: 40px;
     line-height: 125%;
@@ -1183,6 +1176,11 @@
     font-weight: var(--font-weight-semibold);
   }
 
+  .tracking-\[-0\.1rem\] {
+    --tw-tracking: -.1rem;
+    letter-spacing: -.1rem;
+  }
+
   .tracking-normal {
     --tw-tracking: var(--tracking-normal);
     letter-spacing: var(--tracking-normal);
@@ -1417,11 +1415,6 @@
     transition-duration: .15s;
   }
 
-  .duration-200 {
-    --tw-duration: .2s;
-    transition-duration: .2s;
-  }
-
   .duration-300 {
     --tw-duration: .3s;
     transition-duration: .3s;
@@ -1447,22 +1440,16 @@
     transition-timing-function: var(--ease-out);
   }
 
-  .select-none {
-    -webkit-user-select: none;
-    user-select: none;
-  }
-
   :is(.\*\*\:cursor-pointer *) {
     cursor: pointer;
   }
 
   @media (hover: hover) {
-    .group-hover\:block:is(:where(.group):hover *) {
-      display: block;
-    }
-
-    .group-hover\:hidden:is(:where(.group):hover *) {
-      display: none;
+    .group-hover\:scale-125:is(:where(.group):hover *) {
+      --tw-scale-x: 125%;
+      --tw-scale-y: 125%;
+      --tw-scale-z: 125%;
+      scale: var(--tw-scale-x) var(--tw-scale-y);
     }
 
     .group-hover\:rotate-0:is(:where(.group):hover *) {

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@krrli/cm-designsystem",
   "repository": "https://github.com/ost-cas-fea-25-26/cm-designsystem",
-  "version": "1.37.1",
+  "version": "1.37.3",
   "type": "module",
   "main": "dist/index.js",
   "module": "dist/index.js",