scrubtime 0.3.1 → 0.3.2

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 (2) hide show
  1. package/dist/styles.css +23 -5
  2. package/package.json +1 -1
package/dist/styles.css CHANGED
@@ -54,9 +54,13 @@
54
54
  display: flex;
55
55
  flex-direction: column;
56
56
  gap: 0.5rem;
57
+ user-select: none;
58
+ cursor: default;
57
59
  }
58
60
 
59
61
  .scrubtime-display {
62
+ position: relative;
63
+ z-index: 1;
60
64
  display: flex;
61
65
  align-items: center;
62
66
  justify-content: center;
@@ -135,6 +139,7 @@
135
139
  border-radius: var(--scrubtime-radius-sm);
136
140
  padding: 0.5rem;
137
141
  outline: 2px solid var(--scrubtime-slider-thumb);
142
+ cursor: text;
138
143
  outline-offset: 0;
139
144
  box-sizing: border-box;
140
145
  }
@@ -146,6 +151,7 @@
146
151
  }
147
152
 
148
153
  .scrubtime-slider-container {
154
+ position: relative;
149
155
  display: flex;
150
156
  flex-direction: column;
151
157
  --thumb-width: 1.25rem;
@@ -154,17 +160,29 @@
154
160
  user-select: none;
155
161
  }
156
162
 
163
+ .scrubtime-slider-container::before {
164
+ content: '';
165
+ position: absolute;
166
+ top: 0.75rem;
167
+ left: 0;
168
+ right: 0;
169
+ height: 0.5rem;
170
+ background: var(--scrubtime-slider-bg);
171
+ border-radius: 0.25rem;
172
+ pointer-events: none;
173
+ }
174
+
157
175
  .scrubtime-slider {
158
176
  -webkit-appearance: none;
159
177
  appearance: none;
178
+ position: relative;
160
179
  width: 100%;
161
- height: 0.5rem;
162
- background: var(--scrubtime-slider-bg);
163
- border-radius: 0.25rem;
180
+ height: 2.1875rem;
181
+ margin: -0.875rem 0 -1.4375rem 0;
164
182
  cursor: pointer;
165
- margin: 0;
166
183
  touch-action: pan-x;
167
184
  user-select: none;
185
+ background: transparent;
168
186
  }
169
187
 
170
188
  .scrubtime-slider::-webkit-slider-thumb {
@@ -215,7 +233,7 @@
215
233
  height: 1em;
216
234
  font-size: 0.625rem;
217
235
  color: var(--scrubtime-text-muted);
218
- margin-top: 0.25rem;
236
+ margin-top: 0.875rem;
219
237
  /* Inset to match thumb travel range */
220
238
  margin-left: calc(var(--thumb-width) / 2);
221
239
  margin-right: calc(var(--thumb-width) / 2 + 1px);
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "scrubtime",
3
- "version": "0.3.1",
3
+ "version": "0.3.2",
4
4
  "description": "A React time picker with draggable scrubber and slider - minimal clicks, maximum control",
5
5
  "author": "falkenhawk",
6
6
  "license": "MIT",