@jjlmoya/utils-cooking 1.20.0 → 1.21.0

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": "@jjlmoya/utils-cooking",
3
- "version": "1.20.0",
3
+ "version": "1.21.0",
4
4
  "type": "module",
5
5
  "main": "./src/index.ts",
6
6
  "types": "./src/index.ts",
@@ -34,7 +34,7 @@
34
34
  position: relative;
35
35
  }
36
36
 
37
- :global(.theme-dark) .banana-card {
37
+ .theme-dark .banana-card {
38
38
  background: rgba(24, 24, 27, 0.4);
39
39
  border-color: rgba(113, 113, 122, 0.5);
40
40
  box-shadow: 0 32px 64px 0 rgba(0, 0, 0, 0.3);
@@ -155,7 +155,7 @@
155
155
  backdrop-filter: blur(12px);
156
156
  }
157
157
 
158
- :global(.theme-dark) .status-badge {
158
+ .theme-dark .status-badge {
159
159
  background: rgba(0, 0, 0, 0.2);
160
160
  border-color: rgba(255, 255, 255, 0.05);
161
161
  }
@@ -175,7 +175,7 @@
175
175
  color: var(--bc-text-dark);
176
176
  }
177
177
 
178
- :global(.theme-dark) .status-name {
178
+ .theme-dark .status-name {
179
179
  color: var(--bc-text-light);
180
180
  }
181
181
 
@@ -188,7 +188,7 @@
188
188
  min-height: 3em;
189
189
  }
190
190
 
191
- :global(.theme-dark) .status-description {
191
+ .theme-dark .status-description {
192
192
  color: var(--bc-text-muted);
193
193
  }
194
194
 
@@ -209,7 +209,7 @@
209
209
  gap: 2rem;
210
210
  }
211
211
 
212
- :global(.theme-dark) .controls-panel {
212
+ .theme-dark .controls-panel {
213
213
  background: rgba(0, 0, 0, 0.2);
214
214
  border-color: rgba(255, 255, 255, 0.05);
215
215
  }
@@ -253,7 +253,7 @@
253
253
  appearance: none;
254
254
  }
255
255
 
256
- :global(.theme-dark) .ripeness-slider {
256
+ .theme-dark .ripeness-slider {
257
257
  background: #27272a;
258
258
  }
259
259
 
@@ -269,7 +269,7 @@
269
269
  transition: all 0.2s;
270
270
  }
271
271
 
272
- :global(.theme-dark) .ripeness-slider::-webkit-slider-thumb {
272
+ .theme-dark .ripeness-slider::-webkit-slider-thumb {
273
273
  border-color: var(--bc-text-dark);
274
274
  }
275
275
 
@@ -389,7 +389,7 @@
389
389
  color: var(--bc-blue-dark);
390
390
  }
391
391
 
392
- :global(.theme-dark) .setting-value {
392
+ .theme-dark .setting-value {
393
393
  color: var(--bc-blue-lighter);
394
394
  }
395
395
 
@@ -405,7 +405,7 @@
405
405
  appearance: none;
406
406
  }
407
407
 
408
- :global(.theme-dark) .setting-slider {
408
+ .theme-dark .setting-slider {
409
409
  background: rgba(59, 130, 246, 0.5);
410
410
  }
411
411
 
@@ -430,7 +430,7 @@
430
430
  background: var(--bc-green);
431
431
  }
432
432
 
433
- :global(.theme-dark) .partner-btn.active {
433
+ .theme-dark .partner-btn.active {
434
434
  background: var(--bc-green);
435
435
  }
436
436
 
@@ -465,7 +465,7 @@
465
465
  text-transform: uppercase;
466
466
  }
467
467
 
468
- :global(.theme-dark) .partner-title {
468
+ .theme-dark .partner-title {
469
469
  color: var(--bc-text-light);
470
470
  }
471
471
 
@@ -494,7 +494,7 @@
494
494
  border: 1px solid var(--bc-gray-light);
495
495
  }
496
496
 
497
- :global(.theme-dark) .toggle-switch {
497
+ .theme-dark .toggle-switch {
498
498
  background: #27272a;
499
499
  border-color: #3f3f46;
500
500
  }
@@ -525,7 +525,7 @@
525
525
  border: 1px solid #e4e4e7;
526
526
  }
527
527
 
528
- :global(.theme-dark) .info-box {
528
+ .theme-dark .info-box {
529
529
  background: rgba(113, 113, 122, 0.4);
530
530
  border-color: rgba(113, 113, 122, 0.5);
531
531
  }
@@ -564,7 +564,7 @@
564
564
  margin: 0;
565
565
  }
566
566
 
567
- :global(.theme-dark) .info-text {
567
+ .theme-dark .info-text {
568
568
  color: var(--bc-gray-light);
569
569
  }
570
570
 
@@ -572,7 +572,7 @@
572
572
  color: var(--bc-orange);
573
573
  }
574
574
 
575
- :global(.theme-dark) .info-box.acceleration .info-title {
575
+ .theme-dark .info-box.acceleration .info-title {
576
576
  color: var(--bc-yellow);
577
577
  }
578
578
 
@@ -582,6 +582,6 @@
582
582
  font-weight: 900;
583
583
  }
584
584
 
585
- :global(.theme-dark) .info-box.acceleration .info-text {
585
+ .theme-dark .info-box.acceleration .info-text {
586
586
  color: var(--bc-text-light);
587
587
  }
@@ -282,7 +282,7 @@
282
282
  }
283
283
  }
284
284
 
285
- :global(.brine-visualization) {
285
+ .brine-visualization {
286
286
  display: flex;
287
287
  flex-direction: column;
288
288
  align-items: center;
@@ -292,7 +292,7 @@
292
292
  position: relative;
293
293
  }
294
294
 
295
- :global(.brine-jar) {
295
+ .brine-jar {
296
296
  position: relative;
297
297
  width: 12rem;
298
298
  height: 16rem;
@@ -304,7 +304,7 @@
304
304
  overflow: hidden;
305
305
  }
306
306
 
307
- :global(.brine-jar-cap) {
307
+ .brine-jar-cap {
308
308
  position: absolute;
309
309
  top: -0.25rem;
310
310
  left: 50%;
@@ -315,7 +315,7 @@
315
315
  border-radius: 0.5rem 0.5rem 0 0;
316
316
  }
317
317
 
318
- :global(.brine-water) {
318
+ .brine-water {
319
319
  position: absolute;
320
320
  bottom: 0;
321
321
  left: 0;
@@ -325,7 +325,7 @@
325
325
  height: 50%;
326
326
  }
327
327
 
328
- :global(.brine-water)::before {
328
+ .brine-water::before {
329
329
  content: '';
330
330
  position: absolute;
331
331
  top: 0;
@@ -355,7 +355,7 @@
355
355
  }
356
356
  }
357
357
 
358
- :global(.brine-product) {
358
+ .brine-product {
359
359
  position: absolute;
360
360
  bottom: 1rem;
361
361
  left: 50%;
@@ -372,7 +372,7 @@
372
372
  height: 40%;
373
373
  }
374
374
 
375
- :global(.brine-product-label) {
375
+ .brine-product-label {
376
376
  font-size: 0.75rem;
377
377
  font-weight: 700;
378
378
  color: rgba(0, 0, 0, 0.3);
@@ -380,7 +380,7 @@
380
380
  letter-spacing: 0.05em;
381
381
  }
382
382
 
383
- :global(.brine-particles) {
383
+ .brine-particles {
384
384
  position: absolute;
385
385
  inset: 0;
386
386
  pointer-events: none;
@@ -21,7 +21,7 @@
21
21
  --color-ring: rgba(234, 179, 8, 0.5);
22
22
  }
23
23
 
24
- :global(.theme-dark) .egg-timer-wrapper {
24
+ .theme-dark .egg-timer-wrapper {
25
25
  --color-bg: #1f2937;
26
26
  --color-bg-secondary: #111827;
27
27
  --color-border: #374151;
@@ -149,7 +149,7 @@
149
149
  box-shadow: 0 0 0 1px var(--color-primary);
150
150
  }
151
151
 
152
- :global(.theme-dark) .egg-timer-btn.active {
152
+ .theme-dark .egg-timer-btn.active {
153
153
  background-color: rgba(234, 179, 8, 0.1);
154
154
  color: var(--color-primary);
155
155
  }
@@ -189,7 +189,7 @@
189
189
  box-shadow: 0 0 0 1px var(--color-primary);
190
190
  }
191
191
 
192
- :global(.theme-dark) .egg-timer-size-btn.active {
192
+ .theme-dark .egg-timer-size-btn.active {
193
193
  background-color: rgba(234, 179, 8, 0.1);
194
194
  color: var(--color-primary);
195
195
  }
@@ -279,7 +279,7 @@
279
279
  box-shadow: 0 0 0 3px rgba(251, 191, 36, 0.1);
280
280
  }
281
281
 
282
- :global(.theme-dark) .egg-timer-result-card.mollet {
282
+ .theme-dark .egg-timer-result-card.mollet {
283
283
  box-shadow: 0 0 0 3px rgba(251, 191, 36, 0.15);
284
284
  }
285
285
 
@@ -396,7 +396,7 @@
396
396
  background-color: var(--color-soft);
397
397
  }
398
398
 
399
- :global(.theme-dark) .egg-timer-seo-card:hover {
399
+ .theme-dark .egg-timer-seo-card:hover {
400
400
  background-color: rgba(234, 179, 8, 0.1);
401
401
  }
402
402
 
@@ -10,7 +10,7 @@
10
10
  --card-br: 1.5rem;
11
11
  }
12
12
 
13
- :global(.theme-dark) .kitchen-timer-wrapper {
13
+ .theme-dark .kitchen-timer-wrapper {
14
14
  --kt-primary: #fb923c;
15
15
  --kt-secondary: #fdba74;
16
16
  --kt-bg: #0f172a;
@@ -28,7 +28,7 @@
28
28
  gap: 2rem;
29
29
  }
30
30
 
31
- :global(.theme-dark) .meringue-calculator-container {
31
+ .theme-dark .meringue-calculator-container {
32
32
  --text-dark: #f1f5f9;
33
33
  --text-muted: #94a3b8;
34
34
  --text-light: #cbd5e1;
@@ -116,7 +116,7 @@
116
116
  box-shadow: 0 0 0 4px rgba(244, 114, 182, 0.1);
117
117
  }
118
118
 
119
- :global(.theme-dark) .meringue-input-wrapper input:focus {
119
+ .theme-dark .meringue-input-wrapper input:focus {
120
120
  box-shadow: 0 0 0 4px rgba(244, 114, 182, 0.2);
121
121
  }
122
122
 
@@ -155,7 +155,7 @@
155
155
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.05);
156
156
  }
157
157
 
158
- :global(.theme-dark) .meringue-type-btn.active {
158
+ .theme-dark .meringue-type-btn.active {
159
159
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.3);
160
160
  }
161
161
 
@@ -165,7 +165,7 @@
165
165
  gap: 1.5rem;
166
166
  }
167
167
 
168
- :global(.meringue-result-item) {
168
+ .meringue-result-item {
169
169
  background: var(--time-bg);
170
170
  border: 1px solid var(--card-border);
171
171
  border-radius: 20px;
@@ -176,7 +176,7 @@
176
176
  transition: all 0.2s ease;
177
177
  }
178
178
 
179
- :global(.meringue-result-item):hover {
179
+ .meringue-result-item:hover {
180
180
  background: var(--card-bg);
181
181
  transform: scale(1.02);
182
182
  }
@@ -215,7 +215,7 @@
215
215
  gap: 1rem;
216
216
  }
217
217
 
218
- :global(.meringue-time-row) {
218
+ .meringue-time-row {
219
219
  display: flex;
220
220
  align-items: center;
221
221
  justify-content: space-between;
@@ -246,7 +246,7 @@
246
246
  font-size: 1.125rem;
247
247
  }
248
248
 
249
- :global(.theme-dark) .meringue-time-val {
249
+ .theme-dark .meringue-time-val {
250
250
  color: var(--primary);
251
251
  }
252
252
 
@@ -266,7 +266,7 @@
266
266
  flex-shrink: 0;
267
267
  }
268
268
 
269
- :global(.theme-dark) .meringue-pro-tip svg {
269
+ .theme-dark .meringue-pro-tip svg {
270
270
  color: var(--primary);
271
271
  }
272
272
 
@@ -277,11 +277,11 @@
277
277
  margin: 0;
278
278
  }
279
279
 
280
- :global(.theme-dark) .meringue-pro-tip p {
280
+ .theme-dark .meringue-pro-tip p {
281
281
  color: var(--pink-light);
282
282
  }
283
283
 
284
- :global(.meringue-fade-in) {
284
+ .meringue-fade-in {
285
285
  animation: meringue-fade-in 0.5s ease forwards;
286
286
  }
287
287
 
@@ -12,7 +12,7 @@
12
12
  --ms-transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
13
13
  }
14
14
 
15
- :global(.theme-dark) {
15
+ .theme-dark {
16
16
  --ms-bg-card: hsl(220deg, 25%, 12%);
17
17
  --ms-bg-app: hsl(220deg, 30%, 7%);
18
18
  --ms-border: hsl(220deg, 20%, 20%);
@@ -148,13 +148,13 @@
148
148
  width: 2.5rem;
149
149
  }
150
150
 
151
- :global(.ms-input-group) {
151
+ .ms-input-group {
152
152
  display: flex;
153
153
  flex-direction: column;
154
154
  gap: 0.5rem;
155
155
  }
156
156
 
157
- :global(.ms-label) {
157
+ .ms-label {
158
158
  font-size: 0.75rem;
159
159
  font-weight: 700;
160
160
  color: var(--ms-text-muted);
@@ -162,7 +162,7 @@
162
162
  letter-spacing: 0.05em;
163
163
  }
164
164
 
165
- :global(.ms-input) {
165
+ .ms-input {
166
166
  width: 100%;
167
167
  padding: 0.75rem 1rem;
168
168
  border-radius: 0.5rem;
@@ -173,7 +173,7 @@
173
173
  transition: var(--ms-transition);
174
174
  }
175
175
 
176
- :global(.ms-input):focus {
176
+ .ms-input:focus {
177
177
  outline: none;
178
178
  border-color: var(--ms-primary);
179
179
  box-shadow: 0 0 0 3px hsla(262deg, 83%, 58%, 0.1);
@@ -276,7 +276,7 @@
276
276
  margin-bottom: 1.5rem;
277
277
  }
278
278
 
279
- :global(.ms-ingredient-row) {
279
+ .ms-ingredient-row {
280
280
  display: grid;
281
281
  grid-template-columns: 1fr;
282
282
  gap: 0.75rem;
@@ -300,13 +300,13 @@
300
300
  }
301
301
 
302
302
  @media (min-width: 640px) {
303
- :global(.ms-ingredient-row) {
303
+ .ms-ingredient-row {
304
304
  grid-template-columns: 2fr 1fr 1fr auto;
305
305
  align-items: center;
306
306
  }
307
307
  }
308
308
 
309
- :global(.ms-ingredient-final) {
309
+ .ms-ingredient-final {
310
310
  font-weight: 800;
311
311
  color: hsl(150deg, 80%, 40%);
312
312
  font-size: 1.125rem;
@@ -314,7 +314,7 @@
314
314
  text-align: center;
315
315
  }
316
316
 
317
- :global(.ms-del-btn) {
317
+ .ms-del-btn {
318
318
  background: transparent;
319
319
  border: none;
320
320
  color: var(--ms-text-muted);
@@ -324,7 +324,7 @@
324
324
  transition: var(--ms-transition);
325
325
  }
326
326
 
327
- :global(.ms-del-btn):hover {
327
+ .ms-del-btn:hover {
328
328
  background: hsl(0deg, 85%, 60%);
329
329
  color: var(--ms-bg-card);
330
330
  }
@@ -350,14 +350,14 @@
350
350
  border-style: solid;
351
351
  }
352
352
 
353
- :global(.ms-empty-state) {
353
+ .ms-empty-state {
354
354
  text-align: center;
355
355
  padding: 2rem;
356
356
  color: var(--ms-text-muted);
357
357
  font-style: italic;
358
358
  }
359
359
 
360
- :global(.ms-inputs-grid) {
360
+ .ms-inputs-grid {
361
361
  display: grid;
362
362
  grid-template-columns: 1fr 1fr;
363
363
  gap: 1rem;
@@ -32,7 +32,7 @@
32
32
  width: 100%;
33
33
  }
34
34
 
35
- :global(.theme-dark) .pizza-container {
35
+ .theme-dark .pizza-container {
36
36
  --color-bg: #0f172a;
37
37
  --color-border: #1e293b;
38
38
  --color-text-primary: #f1f5f9;
@@ -185,11 +185,11 @@
185
185
  box-shadow: 0 0 0 4px rgba(255, 255, 255, 0.5);
186
186
  }
187
187
 
188
- :global(.theme-dark) .pizza-slider::-webkit-slider-thumb {
188
+ .theme-dark .pizza-slider::-webkit-slider-thumb {
189
189
  box-shadow: 0 0 0 4px rgba(15, 23, 42, 0.5);
190
190
  }
191
191
 
192
- :global(.theme-dark) .pizza-slider::-moz-range-thumb {
192
+ .theme-dark .pizza-slider::-moz-range-thumb {
193
193
  box-shadow: 0 0 0 4px rgba(15, 23, 42, 0.5);
194
194
  }
195
195
 
@@ -230,7 +230,7 @@
230
230
  margin-bottom: 0.25rem;
231
231
  }
232
232
 
233
- :global(.theme-dark) .pizza-tip-title {
233
+ .theme-dark .pizza-tip-title {
234
234
  color: var(--color-orange-100);
235
235
  }
236
236
 
@@ -240,7 +240,7 @@
240
240
  line-height: 1.5;
241
241
  }
242
242
 
243
- :global(.theme-dark) .pizza-tip-text {
243
+ .theme-dark .pizza-tip-text {
244
244
  color: var(--color-amber-100);
245
245
  }
246
246
 
@@ -14,7 +14,7 @@
14
14
  --sc-transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
15
15
  }
16
16
 
17
- :global(.theme-dark) {
17
+ .theme-dark {
18
18
  --sc-bg-card: hsl(220deg, 25%, 12%);
19
19
  --sc-bg-app: hsl(220deg, 30%, 7%);
20
20
  --sc-border: hsl(220deg, 20%, 20%);
@@ -292,7 +292,7 @@
292
292
  color: var(--sc-primary);
293
293
  }
294
294
 
295
- :global(.theme-dark) .sc-result-icon.starter {
295
+ .theme-dark .sc-result-icon.starter {
296
296
  background: hsl(38deg, 92%, 15%);
297
297
  }
298
298
 
@@ -301,7 +301,7 @@
301
301
  color: hsl(45deg, 93%, 50%);
302
302
  }
303
303
 
304
- :global(.theme-dark) .sc-result-icon.flour {
304
+ .theme-dark .sc-result-icon.flour {
305
305
  background: hsl(45deg, 93%, 15%);
306
306
  }
307
307
 
@@ -310,7 +310,7 @@
310
310
  color: hsl(196deg, 95%, 50%);
311
311
  }
312
312
 
313
- :global(.theme-dark) .sc-result-icon.water {
313
+ .theme-dark .sc-result-icon.water {
314
314
  background: hsl(196deg, 95%, 15%);
315
315
  }
316
316