@pzh-ui/css 0.0.16 → 0.0.17

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@pzh-ui/css",
-    "version": "0.0.16",
+    "version": "0.0.17",
     "description": "Contains default styling for projects whitin Provincie Zuid-Holland.",
     "license": "ISC",
     "publishConfig": {
@@ -16,9 +16,10 @@
         "@rollup/plugin-typescript": "^8.3.1",
         "@tailwindcss/custom-forms": "^0.2.1",
         "@tailwindcss/forms": "^0.5.0",
-        "@tailwindcss/line-clamp": "^0.3.1"
+        "@tailwindcss/line-clamp": "^0.3.1",
+        "react-datepicker": "^4.7.0"
     },
-    "gitHead": "d571b5dd1d0bd88cfe71a85c84f9f155e4d9e885",
+    "gitHead": "8dc2a9aa4ea3a425ac7d0b2f384570032f6af27b",
     "devDependencies": {
         "tailwindcss": "^3.0.23"
     }

package/src/tailwind.css

@@ -808,22 +808,14 @@ select{
   margin-bottom: 0.5rem;
 }
 
-.ml-1{
-  margin-left: 0.25rem;
-}
-
-.mb-6{
-  margin-bottom: 1.5rem;
-}
-
-.mb-4{
-  margin-bottom: 1rem;
-}
-
 .mt-2{
   margin-top: 0.5rem;
 }
 
+.ml-1{
+  margin-left: 0.25rem;
+}
+
 .block{
   display: block;
 }
@@ -888,6 +880,10 @@ select{
   max-width: 72rem;
 }
 
+.max-w-\[2rem\]{
+  max-width: 2rem;
+}
+
 .translate-y-2{
   --tw-translate-y: 0.5rem;
   transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
@@ -1066,16 +1062,16 @@ select{
   padding-right: 1.5rem;
 }
 
-.py-1{
-  padding-top: 0.25rem;
-  padding-bottom: 0.25rem;
-}
-
 .py-6{
   padding-top: 1.5rem;
   padding-bottom: 1.5rem;
 }
 
+.py-1{
+  padding-top: 0.25rem;
+  padding-bottom: 0.25rem;
+}
+
 .pr-16{
   padding-right: 4rem;
 }
@@ -1172,14 +1168,14 @@ select{
   font-size: 1rem;
 }
 
-.text-\[0\.8rem\]{
-  font-size: 0.8rem;
-}
-
 .text-\[16px\]{
   font-size: 16px;
 }
 
+.text-\[0\.8rem\]{
+  font-size: 0.8rem;
+}
+
 .italic{
   font-style: italic;
 }
@@ -1215,28 +1211,28 @@ select{
   color: rgb(22 17 59 / var(--tw-text-opacity));
 }
 
-.text-pzh-red{
+.text-pzh-green{
   --tw-text-opacity: 1;
-  color: rgb(209 31 61 / var(--tw-text-opacity));
+  color: rgb(0 128 77 / var(--tw-text-opacity));
 }
 
-.text-pzh-green{
+.text-pzh-red{
   --tw-text-opacity: 1;
-  color: rgb(0 128 77 / var(--tw-text-opacity));
+  color: rgb(209 31 61 / var(--tw-text-opacity));
 }
 
 .text-opacity-35{
   --tw-text-opacity: 0.35;
 }
 
-.text-opacity-55{
-  --tw-text-opacity: 0.55;
-}
-
 .text-opacity-50{
   --tw-text-opacity: 0.5;
 }
 
+.text-opacity-55{
+  --tw-text-opacity: 0.55;
+}
+
 .underline{
   -webkit-text-decoration-line: underline;
           text-decoration-line: underline;
@@ -1624,6 +1620,11 @@ h6,
   color: rgb(22 17 59 / var(--tw-text-opacity));
 }
 
+.react-datepicker__day--keyboard-selected:hover{
+  background-color: rgb(22 17 59 / var(--tw-bg-opacity));
+  --tw-bg-opacity: 0.1;
+}
+
 .react-datepicker__day--selected, .react-datepicker__day--selected:hover{
   --tw-bg-opacity: 1;
   background-color: rgb(0 128 77 / var(--tw-bg-opacity));

package/src/tailwind.src.css

@@ -163,6 +163,10 @@ h6,
     @apply bg-pzh-blue-dark bg-opacity-10 text-pzh-blue-dark;
 }
 
+.react-datepicker__day--keyboard-selected:hover {
+    @apply bg-pzh-blue-dark bg-opacity-10;
+}
+
 .react-datepicker__day--selected,
 .react-datepicker__day--selected:hover {
     @apply bg-pzh-green bold;