@pzh-ui/css 0.0.25 → 0.0.28

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.25",
3
+ "version": "0.0.28",
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": "c9b9652b8580063463e158c30ddea2281f205148",
22
+ "gitHead": "67fdc6ba4f0526fbec519af7679f5f388f98a08f",
23
23
  "devDependencies": {
24
24
  "tailwindcss": "^3.0.23"
25
25
  }
package/src/tailwind.css CHANGED
@@ -1418,17 +1418,13 @@ h6,
1418
1418
  font-weight: 700;
1419
1419
  }
1420
1420
 
1421
- .svg-inline--fa
1422
- :not(.text-xs)
1423
- :not(.text-sm)
1424
- :not(.text-base)
1425
- :not(.text-lg)
1426
- :not(.text-2xl)
1427
- :not(.text-3xl)
1428
- :not(.text-4xl)
1429
- :not(.text-5xl)
1430
- :not(.text-6xl) {
1431
- font-size: 14px;
1421
+ .pzh-transition-colors{
1422
+ transition-property: color, background-color, border-color, fill, stroke, -webkit-text-decoration-color;
1423
+ transition-property: color, background-color, border-color, text-decoration-color, fill, stroke;
1424
+ transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, -webkit-text-decoration-color;
1425
+ transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
1426
+ transition-duration: 200ms;
1427
+ transition-timing-function: cubic-bezier(0.4, 0, 1, 1);
1432
1428
  }
1433
1429
 
1434
1430
  /*
@@ -1613,6 +1609,23 @@ h6,
1613
1609
  content: url("data:image/svg+xml; utf8, <svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 448 512'><path fill='rgba(22, 17, 59, 0.35)' d='M438.6 105.4C451.1 117.9 451.1 138.1 438.6 150.6L182.6 406.6C170.1 419.1 149.9 419.1 137.4 406.6L9.372 278.6C-3.124 266.1-3.124 245.9 9.372 233.4C21.87 220.9 42.13 220.9 54.63 233.4L159.1 338.7L393.4 105.4C405.9 92.88 426.1 92.88 438.6 105.4H438.6z'/></svg>");
1614
1610
  }
1615
1611
 
1612
+ .form-field-label{
1613
+ margin-bottom: 0.5rem;
1614
+ display: block;
1615
+ font-size: 0.75rem;
1616
+ text-transform: uppercase;
1617
+ letter-spacing: 0.025em;
1618
+ --tw-text-opacity: 1;
1619
+ color: rgb(74 85 104 / var(--tw-text-opacity));
1620
+ }
1621
+
1622
+ .form-field-description{
1623
+ margin-bottom: 0.5rem;
1624
+ font-size: 0.875rem;
1625
+ --tw-text-opacity: 1;
1626
+ color: rgb(74 85 104 / var(--tw-text-opacity));
1627
+ }
1628
+
1616
1629
  /*
1617
1630
  * React Datepicker
1618
1631
  */
@@ -49,17 +49,8 @@ h6,
49
49
  font-weight: 700;
50
50
  }
51
51
 
52
- .svg-inline--fa
53
- :not(.text-xs)
54
- :not(.text-sm)
55
- :not(.text-base)
56
- :not(.text-lg)
57
- :not(.text-2xl)
58
- :not(.text-3xl)
59
- :not(.text-4xl)
60
- :not(.text-5xl)
61
- :not(.text-6xl) {
62
- font-size: 14px;
52
+ .pzh-transition-colors {
53
+ @apply transition-colors duration-200 ease-in;
63
54
  }
64
55
 
65
56
  /*
@@ -118,6 +109,14 @@ h6,
118
109
  content: url("data:image/svg+xml; utf8, <svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 448 512'><path fill='rgba(22, 17, 59, 0.35)' d='M438.6 105.4C451.1 117.9 451.1 138.1 438.6 150.6L182.6 406.6C170.1 419.1 149.9 419.1 137.4 406.6L9.372 278.6C-3.124 266.1-3.124 245.9 9.372 233.4C21.87 220.9 42.13 220.9 54.63 233.4L159.1 338.7L393.4 105.4C405.9 92.88 426.1 92.88 438.6 105.4H438.6z'/></svg>");
119
110
  }
120
111
 
112
+ .form-field-label {
113
+ @apply block mb-2 text-xs tracking-wide text-gray-700 uppercase;
114
+ }
115
+
116
+ .form-field-description {
117
+ @apply mb-2 text-sm text-gray-700;
118
+ }
119
+
121
120
  /*
122
121
  * React Datepicker
123
122
  */