feat: add transform system

src/TransformGrid/index.tsx

@@ -3,11 +3,11 @@ import { motion } from "framer-motion";
 
 import style from './style.module.scss'
 import { TransformGridItem } from "../TransformGridItem";
-import { transforms } from "../Transforms/Transform";
+import { transforms, wrapTransform } from "../Transforms/Transform";
 
 export const TransformGrid: FC = () =>
   <ul className={style.grid}>
-    {transforms.map((v, i) =>
+    {transforms.map((transform, i) =>
       <motion.li
         key={i}
         initial={{ opacity: 0 }}
@@ -15,7 +15,7 @@ export const TransformGrid: FC = () =>
         transition={{ delay: i * 0.1 + 1.5 }} >
 
         <TransformGridItem
-          transform={v}/>
+          transform={wrapTransform(transform)}/>
 
       </motion.li>
     )}

src/TransformGrid/style.module.scss

@@ -1,7 +1,9 @@
 .grid {
   padding: 10px;
+
   display: grid;
   grid-template-columns: repeat(auto-fit, minmax(400px, 1fr));
+  align-content: flex-start;
   
   gap: 10px;
   height: 100%;