@trackunit/css-tailwind 1.9.7 → 1.9.10

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@trackunit/css-tailwind",
-  "version": "1.9.7",
+  "version": "1.9.10",
   "main": "./index.cjs.js",
   "repository": "https://github.com/Trackunit/manager",
   "license": "SEE LICENSE IN LICENSE.txt",
@@ -9,10 +9,10 @@
   },
   "dependencies": {
     "tailwindcss": "3.4.3",
-    "@trackunit/css-component-tokens": "1.9.7",
-    "@trackunit/css-tailwind-custom-properties-plugin": "1.9.7",
-    "@trackunit/ui-design-tokens": "1.9.7",
-    "@trackunit/css-core": "1.9.7",
+    "@trackunit/css-component-tokens": "1.9.10",
+    "@trackunit/css-tailwind-custom-properties-plugin": "1.9.10",
+    "@trackunit/ui-design-tokens": "1.9.10",
+    "@trackunit/css-core": "1.9.10",
     "@tailwindcss/typography": "^0.5.10"
   },
   "type": "commonjs",

package/tailwind-base.generated.css

@@ -450,10 +450,10 @@
 
 /* libs/css/core/src/lib/react-calendar.css */
 .react-calendar {
-  width: 350px;
-  max-width: 100%;
+  width: 330px;
   background: white;
   line-height: 1.125em;
+  padding: var(--spacing-4) var(--spacing-3);
 }
 .react-calendar--doubleView {
   width: 700px;
@@ -490,19 +490,23 @@
 .react-calendar__navigation button {
   min-width: 44px;
   background: none;
+  border-radius: 8px;
+}
+.react-calendar__navigation__arrow {
+  color: rgb(var(--color-neutral-400) / var(--tw-bg-opacity));
 }
 .react-calendar__navigation button:disabled {
-  background-color: #f0f0f0;
+  background-color: rgb(var(--color-neutral-50) / var(--tw-bg-opacity));
 }
 .react-calendar__navigation button:enabled:hover,
 .react-calendar__navigation button:enabled:focus {
-  background-color: #e6e6e6;
+  background-color: rgb(var(--color-neutral-200) / var(--tw-bg-opacity));
 }
 .react-calendar__month-view__weekdays {
   text-align: center;
   font: inherit;
   font-size: 0.75em;
-  color: #94a3b8;
+  color: rgb(var(--color-neutral-400) / var(--tw-bg-opacity));
   font-weight: bold;
 }
 .react-calendar__viewContainer abbr:where([title]) {
@@ -522,12 +526,13 @@
 .react-calendar__month-view__days {
   row-gap: 8px;
 }
-.react-calendar__month-view__days__day--weekend {
+.react-calendar__month-view__days__day--neighboringMonth.react-calendar__tile--active {
+  background: rgb(var(--color-primary-50) / 0.5);
 }
 .react-calendar__month-view__days__day--neighboringMonth,
 .react-calendar__decade-view__years__year--neighboringDecade,
 .react-calendar__century-view__decades__decade--neighboringCentury {
-  color: #757575;
+  color: rgb(var(--color-neutral-500) / var(--tw-bg-opacity));
 }
 .react-calendar__year-view .react-calendar__tile,
 .react-calendar__decade-view .react-calendar__tile,
@@ -535,6 +540,7 @@
   padding: 2em 0.5em;
 }
 .react-calendar__tile {
+  position: relative;
   max-width: 100%;
   padding: 10px 6.6667px;
   background: none;
@@ -542,56 +548,60 @@
   font: inherit;
   font-size: 0.833em;
 }
+.react-calendar__tile:focus:before {
+  content: " ";
+  position: absolute;
+  background: transparent;
+  left: 0;
+  top: 0;
+  width: 100%;
+  height: 100%;
+  border: 2px solid rgb(var(--color-primary-600) / var(--tw-bg-opacity));
+  border-radius: 8px;
+}
 .react-calendar__tile:disabled {
-  background-color: #f0f0f0;
-  color: #ababab;
+  background-color: rgb(var(--color-neutral-50) / var(--tw-bg-opacity));
+  color: rgb(var(--color-neutral-100) / var(--tw-bg-opacity));
 }
 .react-calendar__month-view__days__day--neighboringMonth:disabled,
 .react-calendar__decade-view__years__year--neighboringDecade:disabled,
 .react-calendar__century-view__decades__decade--neighboringCentury:disabled {
-  color: #cdcdcd;
+  color: rgb(var(--color-neutral-100) / var(--tw-bg-opacity));
 }
-.react-calendar__tile:enabled:hover,
-.react-calendar__tile:enabled:focus {
-  background-color: #e6e6e6;
+.react-calendar__tile:enabled:hover {
+  background-color: rgb(var(--color-neutral-200) / var(--tw-bg-opacity));
 }
 .react-calendar__tile--now:not(.react-calendar__tile--active) {
-  color: #2563eb;
-}
-.react-calendar__tile--now:enabled:hover,
-.react-calendar__tile--now:enabled:focus {
-  background: #1d50bc;
+  color: rgb(var(--color-primary-600) / var(--tw-bg-opacity));
 }
 .react-calendar__tile--hasActive {
-  background: #76baff;
+  background: rgb(var(--color-primary-200) / var(--tw-bg-opacity));
 }
-.react-calendar__tile--hasActive:enabled:hover,
-.react-calendar__tile--hasActive:enabled:focus {
-  background: #a9d4ff;
+.react-calendar__tile--hasActive:enabled:hover {
+  background: rgb(var(--color-primary-100) / var(--tw-bg-opacity));
 }
 .react-calendar__tile--active {
-  background: #eff6ff;
+  background: rgb(var(--color-primary-50) / var(--tw-bg-opacity));
 }
 .react-calendar__tile:not(.react-calendar__tile--active):enabled:hover {
   border-radius: 8px 8px 8px 8px;
 }
-.react-calendar__tile--active:enabled:hover,
-.react-calendar__tile--active:enabled:focus {
-  background: #eff6ff;
+.react-calendar__tile--active:enabled:hover {
+  background: rgb(var(--color-primary-50) / var(--tw-bg-opacity));
   border-radius: none !important;
 }
 .react-calendar--selectRange .react-calendar__tile--hover {
-  background-color: #eff6ff;
+  background: rgb(var(--color-primary-50) / var(--tw-bg-opacity));
   border-radius: none !important;
 }
 .react-calendar__tile--rangeStart {
-  background: #006edc !important;
-  border-radius: 8px 8px 8px 8px;
+  background: rgb(var(--color-primary-600) / var(--tw-bg-opacity)) !important;
+  border-radius: 8px;
   color: white;
 }
 .react-calendar__tile--rangeEnd {
-  background: #006edc !important;
-  border-radius: 8px 8px 8px 8px;
+  background: rgb(var(--color-primary-600) / var(--tw-bg-opacity)) !important;
+  border-radius: 8px;
   color: white;
 }