@donkit-ai/design-system 0.2.10 → 0.2.11

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.
Files changed (3) hide show
  1. package/package.json +1 -1
  2. package/src/components/Stepper.css +8 -4
  3. package/src/components/Textarea.css +17 -13
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@donkit-ai/design-system",
3
- "version": "0.2.10",
3
+ "version": "0.2.11",
4
4
  "description": "Donkit Design System - minimal design tokens and React components",
5
5
  "type": "module",
6
6
  "main": "src/index.js",
package/src/components/Stepper.css CHANGED
@@ -99,28 +99,32 @@
99
99
  /* Sizes */
100
100
 
101
101
  /* Small */
102
+ .ds-stepper--small {
103
+ height: var(--height-s);
104
+ }
105
+
102
106
  .ds-stepper--small .ds-stepper-button {
103
107
  width: var(--height-s);
104
- height: var(--height-s);
105
108
  padding: 0;
106
109
  }
107
110
 
108
111
  .ds-stepper--small .ds-stepper-input {
109
- height: var(--height-s);
110
112
  font-size: var(--font-size-p2);
111
113
  letter-spacing: var(--letter-spacing-p2);
112
114
  padding: 0 var(--space-xs);
113
115
  }
114
116
 
115
117
  /* Medium */
118
+ .ds-stepper--medium {
119
+ height: var(--height-m);
120
+ }
121
+
116
122
  .ds-stepper--medium .ds-stepper-button {
117
123
  width: var(--height-m);
118
- height: var(--height-m);
119
124
  padding: 0;
120
125
  }
121
126
 
122
127
  .ds-stepper--medium .ds-stepper-input {
123
- height: var(--height-m);
124
128
  font-size: var(--font-size-p1);
125
129
  letter-spacing: var(--letter-spacing-p1);
126
130
  padding: 0 var(--space-s);
package/src/components/Textarea.css CHANGED
@@ -28,27 +28,31 @@
28
28
  transition: border-color var(--transition-normal);
29
29
  line-height: 1.5;
30
30
  resize: vertical;
31
- /* Кастомный resize handle */
31
+ /* Кастомный resize handle - 2 диагональные линии */
32
32
  background:
33
- linear-gradient(135deg, transparent 6px, var(--color-border) 6px, var(--color-border) 7px, transparent 7px),
34
- linear-gradient(135deg, transparent 10px, var(--color-border) 10px, var(--color-border) 11px, transparent 11px);
33
+ linear-gradient(315deg, transparent 5px, var(--color-border) 5px, var(--color-border) 6px, transparent 6px),
34
+ linear-gradient(315deg, transparent 10px, var(--color-border) 10px, var(--color-border) 11px, transparent 11px);
35
35
  background-repeat: no-repeat;
36
36
  background-position: bottom right;
37
- background-size: 12px 12px;
37
+ background-size: 16px 16px;
38
38
  }
39
39
 
40
40
  .ds-textarea::placeholder {
41
41
  color: var(--color-txt-icon-2);
42
42
  }
43
43
 
44
+ .ds-textarea::-webkit-resizer {
45
+ display: none;
46
+ }
47
+
44
48
  .ds-textarea:hover:not(:disabled) {
45
49
  border-color: var(--color-border-hover);
46
50
  background:
47
- linear-gradient(135deg, transparent 6px, var(--color-border-hover) 6px, var(--color-border-hover) 7px, transparent 7px),
48
- linear-gradient(135deg, transparent 10px, var(--color-border-hover) 10px, var(--color-border-hover) 11px, transparent 11px);
51
+ linear-gradient(315deg, transparent 5px, var(--color-border-hover) 5px, var(--color-border-hover) 6px, transparent 6px),
52
+ linear-gradient(315deg, transparent 10px, var(--color-border-hover) 10px, var(--color-border-hover) 11px, transparent 11px);
49
53
  background-repeat: no-repeat;
50
54
  background-position: bottom right;
51
- background-size: 12px 12px;
55
+ background-size: 16px 16px;
52
56
  }
53
57
 
54
58
  .ds-textarea:focus,
@@ -56,11 +60,11 @@
56
60
  outline: none;
57
61
  border-color: var(--color-border-hover);
58
62
  background:
59
- linear-gradient(135deg, transparent 6px, var(--color-border-hover) 6px, var(--color-border-hover) 7px, transparent 7px),
60
- linear-gradient(135deg, transparent 10px, var(--color-border-hover) 10px, var(--color-border-hover) 11px, transparent 11px);
63
+ linear-gradient(315deg, transparent 5px, var(--color-border-hover) 5px, var(--color-border-hover) 6px, transparent 6px),
64
+ linear-gradient(315deg, transparent 10px, var(--color-border-hover) 10px, var(--color-border-hover) 11px, transparent 11px);
61
65
  background-repeat: no-repeat;
62
66
  background-position: bottom right;
63
- background-size: 12px 12px;
67
+ background-size: 16px 16px;
64
68
  }
65
69
 
66
70
  .ds-textarea:disabled {
@@ -70,11 +74,11 @@
70
74
  .ds-textarea--error {
71
75
  border-color: var(--color-error);
72
76
  background:
73
- linear-gradient(135deg, transparent 6px, var(--color-error) 6px, var(--color-error) 7px, transparent 7px),
74
- linear-gradient(135deg, transparent 10px, var(--color-error) 10px, var(--color-error) 11px, transparent 11px);
77
+ linear-gradient(315deg, transparent 5px, var(--color-error) 5px, var(--color-error) 6px, transparent 6px),
78
+ linear-gradient(315deg, transparent 10px, var(--color-error) 10px, var(--color-error) 11px, transparent 11px);
75
79
  background-repeat: no-repeat;
76
80
  background-position: bottom right;
77
- background-size: 12px 12px;
81
+ background-size: 16px 16px;
78
82
  }
79
83
 
80
84
  .ds-textarea--no-resize {