🚚 Move ProductCard and UserCard

closer to their feature

frontend/src/features/register/ProductCard.module.css

@@ -0,0 +1,52 @@
+.product {
+  display: flex;
+  border: none;
+  /*border: 1px solid var(--background);*/
+  background: rgb(35, 15, 41);
+  border-radius: 4px;
+  transition: background-color 0.1s ease-out, border 0.1s ease-out;
+  position: relative;
+  align-items: flex-start;
+  padding: 1rem;
+}
+
+.product:hover,
+.active.product {
+  background-color: var(--background);
+  box-shadow: 0 0 4px var(--background), 0 0 11px var(--background), 0 0 19px var(--background);
+}
+
+.productText {
+  white-space: nowrap;
+  text-overflow: ellipsis;
+  overflow: hidden;
+  font-size: 1.2rem;
+  text-shadow: none;
+  color: white;
+}
+
+.amount {
+  position: absolute;
+  z-index: 1;
+  top: 0;
+  bottom: 0;
+  right: 0;
+  padding: 10px 12px 8px 8px;
+  border-left: 1px solid transparent;
+  color: transparent;
+  font-size: 2rem;
+  font-weight: bold;
+  line-height: 1;
+  background-color: transparent;
+  border-top-right-radius: 4px;
+  border-bottom-right-radius: 4px;
+  display: none;
+}
+
+.active .amount {
+  display: block;
+  color: var(--background);
+  text-shadow: none;
+  border-left-color: rgb(35, 15, 41);
+  background-color: var(--sun-end);
+}