@pzh-ui/css 0.0.39 → 0.0.42

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@pzh-ui/css",
3
- "version": "0.0.39",
3
+ "version": "0.0.42",
4
4
  "description": "Contains default styling for projects whitin Provincie Zuid-Holland.",
5
5
  "license": "ISC",
6
6
  "publishConfig": {
@@ -19,7 +19,7 @@
19
19
  "@tailwindcss/line-clamp": "^0.3.1",
20
20
  "react-datepicker": "^4.7.0"
21
21
  },
22
- "gitHead": "174607cd1c919eb6df5cff984aafc4d6b0d33484",
22
+ "gitHead": "e361552eea07a46cda1401f56aaafefd63d5084d",
23
23
  "devDependencies": {
24
24
  "tailwindcss": "^3.0.23"
25
25
  }
package/src/tailwind.css CHANGED
@@ -809,10 +809,18 @@ select{
809
809
  margin-left: 1rem;
810
810
  }
811
811
 
812
+ .mr-4{
813
+ margin-right: 1rem;
814
+ }
815
+
812
816
  .mt-1{
813
817
  margin-top: 0.25rem;
814
818
  }
815
819
 
820
+ .mt-\[1px\]{
821
+ margin-top: 1px;
822
+ }
823
+
816
824
  .-mt-8{
817
825
  margin-top: -2rem;
818
826
  }
@@ -1001,6 +1009,10 @@ select{
1001
1009
  overflow-y: auto;
1002
1010
  }
1003
1011
 
1012
+ .overflow-y-visible{
1013
+ overflow-y: visible;
1014
+ }
1015
+
1004
1016
  .break-words{
1005
1017
  overflow-wrap: break-word;
1006
1018
  }
@@ -1047,6 +1059,11 @@ select{
1047
1059
  border-color: rgb(0 128 77 / var(--tw-border-opacity));
1048
1060
  }
1049
1061
 
1062
+ .border-pzh-green-light{
1063
+ --tw-border-opacity: 1;
1064
+ border-color: rgb(97 179 117 / var(--tw-border-opacity));
1065
+ }
1066
+
1050
1067
  .border-pzh-yellow-dark{
1051
1068
  --tw-border-opacity: 1;
1052
1069
  border-color: rgb(198 164 16 / var(--tw-border-opacity));
@@ -1057,6 +1074,11 @@ select{
1057
1074
  border-color: rgb(209 31 61 / var(--tw-border-opacity));
1058
1075
  }
1059
1076
 
1077
+ .border-pzh-red-light{
1078
+ --tw-border-opacity: 1;
1079
+ border-color: rgb(235 112 133 / var(--tw-border-opacity));
1080
+ }
1081
+
1060
1082
  .border-pzh-cool-gray{
1061
1083
  --tw-border-opacity: 1;
1062
1084
  border-color: rgb(131 131 131 / var(--tw-border-opacity));
@@ -1124,7 +1146,7 @@ select{
1124
1146
  background-color: rgb(0 0 0 / var(--tw-bg-opacity));
1125
1147
  }
1126
1148
 
1127
- .bg-pzh-gray{
1149
+ .bg-pzh-gray-200{
1128
1150
  --tw-bg-opacity: 1;
1129
1151
  background-color: rgb(235 235 235 / var(--tw-bg-opacity));
1130
1152
  }
@@ -1353,6 +1375,11 @@ select{
1353
1375
  color: rgb(0 128 77 / var(--tw-text-opacity));
1354
1376
  }
1355
1377
 
1378
+ .text-pzh-green-light{
1379
+ --tw-text-opacity: 1;
1380
+ color: rgb(97 179 117 / var(--tw-text-opacity));
1381
+ }
1382
+
1356
1383
  .text-pzh-yellow-dark{
1357
1384
  --tw-text-opacity: 1;
1358
1385
  color: rgb(198 164 16 / var(--tw-text-opacity));
@@ -1363,6 +1390,11 @@ select{
1363
1390
  color: rgb(209 31 61 / var(--tw-text-opacity));
1364
1391
  }
1365
1392
 
1393
+ .text-pzh-red-light{
1394
+ --tw-text-opacity: 1;
1395
+ color: rgb(235 112 133 / var(--tw-text-opacity));
1396
+ }
1397
+
1366
1398
  .text-pzh-cool-gray{
1367
1399
  --tw-text-opacity: 1;
1368
1400
  color: rgb(131 131 131 / var(--tw-text-opacity));
@@ -1407,12 +1439,6 @@ select{
1407
1439
  opacity: 0.5;
1408
1440
  }
1409
1441
 
1410
- .shadow-md{
1411
- --tw-shadow: 0 4px 6px -1px rgb(0 0 0 / 0.1), 0 2px 4px -2px rgb(0 0 0 / 0.1);
1412
- --tw-shadow-colored: 0 4px 6px -1px var(--tw-shadow-color), 0 2px 4px -2px var(--tw-shadow-color);
1413
- box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
1414
- }
1415
-
1416
1442
  .shadow-xl{
1417
1443
  --tw-shadow: 0 20px 25px -5px rgb(0 0 0 / 0.1), 0 8px 10px -6px rgb(0 0 0 / 0.1);
1418
1444
  --tw-shadow-colored: 0 20px 25px -5px var(--tw-shadow-color), 0 8px 10px -6px var(--tw-shadow-color);
@@ -1918,6 +1944,18 @@ h6,
1918
1944
  opacity: 0.55;
1919
1945
  }
1920
1946
 
1947
+ .pzh-drop-shadow {
1948
+ box-shadow: 0px 18px 60px rgba(0, 0, 0, 0.07),
1949
+ 0px 4.02054px 13.4018px rgba(0, 0, 0, 0.0417275),
1950
+ 0px 1.19702px 3.99006px rgba(0, 0, 0, 0.0282725);
1951
+ }
1952
+
1953
+ .pzh-select-input {
1954
+ input {
1955
+ box-shadow: none;
1956
+ }
1957
+ }
1958
+
1921
1959
  .hover\:translate-y-0:hover{
1922
1960
  --tw-translate-y: 0px;
1923
1961
  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));
@@ -1951,7 +1989,7 @@ h6,
1951
1989
  background-color: rgb(0 77 46 / var(--tw-bg-opacity));
1952
1990
  }
1953
1991
 
1954
- .hover\:bg-pzh-gray-light:hover{
1992
+ .hover\:bg-pzh-gray-100:hover{
1955
1993
  --tw-bg-opacity: 1;
1956
1994
  background-color: rgb(245 245 245 / var(--tw-bg-opacity));
1957
1995
  }
@@ -1960,6 +1998,11 @@ h6,
1960
1998
  --tw-bg-opacity: 0.1;
1961
1999
  }
1962
2000
 
2001
+ .hover\:text-pzh-blue-dark:hover{
2002
+ --tw-text-opacity: 1;
2003
+ color: rgb(22 17 59 / var(--tw-text-opacity));
2004
+ }
2005
+
1963
2006
  .hover\:text-pzh-blue:hover{
1964
2007
  --tw-text-opacity: 1;
1965
2008
  color: rgb(40 31 107 / var(--tw-text-opacity));
@@ -1980,7 +2023,7 @@ h6,
1980
2023
  text-decoration-line: underline;
1981
2024
  }
1982
2025
 
1983
- .focus\:bg-pzh-gray-light:focus{
2026
+ .focus\:bg-pzh-gray-100:focus{
1984
2027
  --tw-bg-opacity: 1;
1985
2028
  background-color: rgb(245 245 245 / var(--tw-bg-opacity));
1986
2029
  }
@@ -2146,4 +2189,4 @@ h6,
2146
2189
  padding-left: 2rem;
2147
2190
  padding-right: 2rem;
2148
2191
  }
2149
- }
2192
+ }
@@ -58,7 +58,7 @@ h6,
58
58
  */
59
59
 
60
60
  .pzh-button {
61
- @apply inline-block transition duration-200 ease-in rounded focus:outline-none focus:ring font-bold leading-none disabled:bg-pzh-gray disabled:text-pzh-blue-dark disabled:text-opacity-35 disabled:cursor-not-allowed;
61
+ @apply inline-block transition duration-200 ease-in rounded focus:outline-none focus:ring font-bold leading-none disabled:bg-pzh-gray-200 disabled:text-pzh-blue-dark disabled:text-opacity-35 disabled:cursor-not-allowed;
62
62
  }
63
63
 
64
64
  .pzh-form-input {
@@ -94,7 +94,7 @@ h6,
94
94
  }
95
95
  .pzh-form-radio:disabled + span:before,
96
96
  .pzh-form-checkbox:disabled + span:before {
97
- @apply border-pzh-gray bg-pzh-gray;
97
+ @apply border-pzh-gray-200 bg-pzh-gray-200;
98
98
  }
99
99
 
100
100
  .pzh-form-checkbox + span:before {
@@ -279,3 +279,15 @@ h6,
279
279
  .quill .ql-disabled .ql-editor {
280
280
  opacity: 0.55;
281
281
  }
282
+
283
+ .pzh-drop-shadow {
284
+ box-shadow: 0px 18px 60px rgba(0, 0, 0, 0.07),
285
+ 0px 4.02054px 13.4018px rgba(0, 0, 0, 0.0417275),
286
+ 0px 1.19702px 3.99006px rgba(0, 0, 0, 0.0282725);
287
+ }
288
+
289
+ .pzh-select-input {
290
+ input {
291
+ box-shadow: none;
292
+ }
293
+ }