@drivy/cobalt 0.37.0 → 0.37.1

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": "@drivy/cobalt",
3
- "version": "0.37.0",
3
+ "version": "0.37.1",
4
4
  "description": "Opinionated design system for Drivy's projects.",
5
5
  "main": "src/index.js",
6
6
  "types": "types/index.d.ts",
@@ -4,7 +4,7 @@
4
4
  $calendar-range-day-color: var(--c-background-accentAlt);
5
5
  $calendar-range-day-invalid-color: var(--c-background-errorAlt);
6
6
 
7
- $calendar-day-size: 42px;
7
+ --calendar-day-size: 48px;
8
8
 
9
9
  @mixin start-range($color) {
10
10
  background-image: linear-gradient(to right, transparent 50%, $color 50%);
@@ -23,8 +23,8 @@
23
23
 
24
24
  margin: auto;
25
25
 
26
- height: $calendar-day-size;
27
- width: $calendar-day-size;
26
+ height: var(--calendar-day-size);
27
+ width: var(--calendar-day-size);
28
28
 
29
29
  box-sizing: border-box;
30
30
 
@@ -39,6 +39,10 @@
39
39
  flex-direction: column;
40
40
  align-items: flex-start;
41
41
 
42
+ @include breakpoint($from: sm) {
43
+ --calendar-day-size: 42px;
44
+ }
45
+
42
46
  &__months-container {
43
47
  display: flex;
44
48
  flex-direction: column;
@@ -99,8 +103,8 @@
99
103
 
100
104
  z-index: 1;
101
105
 
102
- height: $calendar-day-size;
103
- width: $calendar-day-size;
106
+ height: var(--calendar-day-size);
107
+ width: var(--calendar-day-size);
104
108
 
105
109
  display: flex;
106
110
 
@@ -115,7 +119,7 @@
115
119
 
116
120
  font-size: 13px;
117
121
 
118
- line-height: $calendar-day-size;
122
+ line-height: var(--calendar-day-size);
119
123
 
120
124
  font-weight: 600;
121
125