@jjlmoya/utils-developer 1.13.0 → 1.14.0

package/src/tool/mobileMockupGenerator/mobile-mockup-generator.css

@@ -41,7 +41,7 @@
     border-color: rgb(254, 202, 202);
   }
 
-  :global(.theme-dark) .mmg-btn-clear {
+  .theme-dark .mmg-btn-clear {
     background: rgb(15, 23, 42);
     border-color: rgb(30, 41, 59);
     color: rgb(148, 163, 184);
@@ -68,7 +68,7 @@
     transform: translateY(-1px);
   }
 
-  :global(.theme-dark) .mmg-btn-download {
+  .theme-dark .mmg-btn-download {
     background: #fff;
     color: rgb(15, 23, 42);
   }
@@ -100,7 +100,7 @@
     box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
   }
 
-  :global(.theme-dark) .mmg-card {
+  .theme-dark .mmg-card {
     background: rgba(15, 23, 42, 0.7);
     border-color: rgb(30, 41, 59);
   }
@@ -123,7 +123,7 @@
     margin-bottom: 1rem;
   }
 
-  :global(.theme-dark) .mmg-card-title {
+  .theme-dark .mmg-card-title {
     color: #fff;
   }
 
@@ -148,7 +148,7 @@
     background: rgba(99, 102, 241, 0.05);
   }
 
-  :global(.theme-dark) .mmg-drop-zone {
+  .theme-dark .mmg-drop-zone {
     border-color: rgb(51, 65, 85);
   }
 
@@ -186,7 +186,7 @@
     margin-top: 0.25rem;
   }
 
-  :global(.theme-dark) .mmg-drop-hint {
+  .theme-dark .mmg-drop-hint {
     color: rgb(203, 213, 225);
   }
 
@@ -217,7 +217,7 @@
     background: rgb(254, 243, 199);
   }
 
-  :global(.theme-dark) .mmg-btn-mass {
+  .theme-dark .mmg-btn-mass {
     background: rgba(180, 83, 9, 0.1);
     border-color: rgba(180, 83, 9, 0.5);
     color: rgb(252, 211, 77);
@@ -283,12 +283,12 @@
     transform: translateY(-1px);
   }
 
-  :global(.theme-dark) .mmg-device-btn {
+  .theme-dark .mmg-device-btn {
     background: rgb(15, 23, 42);
     color: rgb(203, 213, 225);
   }
 
-  :global(.theme-dark) .mmg-device-active {
+  .theme-dark .mmg-device-active {
     background: rgba(79, 70, 229, 0.2);
     border-color: rgb(129, 140, 248);
   }
@@ -314,7 +314,7 @@
     border-color: rgb(99, 102, 241);
   }
 
-  :global(.theme-dark) .mmg-select {
+  .theme-dark .mmg-select {
     background: rgb(2, 6, 23);
     border-color: rgb(30, 41, 59);
     color: #fff;
@@ -363,7 +363,7 @@
     background: rgb(241, 245, 249);
   }
 
-  :global(.theme-dark) .mmg-swap-btn:hover {
+  .theme-dark .mmg-swap-btn:hover {
     background: rgb(30, 41, 59);
   }
 
@@ -397,7 +397,7 @@
     accent-color: rgb(99, 102, 241);
   }
 
-  :global(.theme-dark) .mmg-range {
+  .theme-dark .mmg-range {
     background: rgb(30, 41, 59);
   }
 
@@ -415,7 +415,7 @@
     border-top: 1px solid rgb(241, 245, 249);
   }
 
-  :global(.theme-dark) .mmg-safe-section {
+  .theme-dark .mmg-safe-section {
     border-color: rgba(30, 41, 59, 0.5);
   }
 
@@ -483,7 +483,7 @@
     border: 2px dashed rgb(226, 232, 240);
   }
 
-  :global(.theme-dark) .mmg-empty {
+  .theme-dark .mmg-empty {
     background: rgba(15, 23, 42, 0.5);
     border-color: rgb(30, 41, 59);
   }
@@ -499,7 +499,7 @@
     margin-bottom: 1.5rem;
   }
 
-  :global(.theme-dark) .mmg-empty-icon-wrap {
+  .theme-dark .mmg-empty-icon-wrap {
     background: rgba(79, 70, 229, 0.3);
   }
 
@@ -509,7 +509,7 @@
     color: rgb(99, 102, 241);
   }
 
-  :global(.theme-dark) .mmg-empty-icon-svg {
+  .theme-dark .mmg-empty-icon-svg {
     color: rgb(129, 140, 248);
   }
 
@@ -524,7 +524,7 @@
     margin-top: 0.5rem;
   }
 
-  :global(.theme-dark) .mmg-empty-title {
+  .theme-dark .mmg-empty-title {
     color: #fff;
   }
 
@@ -540,7 +540,7 @@
     }
   }
 
-  :global(.mmg-preview-card) {
+  .mmg-preview-card {
     background: rgba(255, 255, 255, 0.7);
     backdrop-filter: blur(10px);
     border-radius: 2.5rem;
@@ -550,12 +550,12 @@
     position: relative;
   }
 
-  :global(.theme-dark) :global(.mmg-preview-card) {
+  .theme-dark .mmg-preview-card {
     background: rgba(15, 23, 42, 0.7);
     border-color: rgb(30, 41, 59);
   }
 
-  :global(.mmg-card-actions) {
+  .mmg-card-actions {
     position: absolute;
     top: 1rem;
     right: 1rem;
@@ -566,11 +566,11 @@
     z-index: 10;
   }
 
-  :global(.mmg-preview-card:hover) :global(.mmg-card-actions) {
+  .mmg-preview-card:hover .mmg-card-actions {
     opacity: 1;
   }
 
-  :global(.mmg-card-action-btn) {
+  .mmg-card-action-btn {
     padding: 0.5rem;
     background: #fff;
     box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1);
@@ -581,23 +581,23 @@
     display: flex;
   }
 
-  :global(.mmg-card-action-btn:hover) {
+  .mmg-card-action-btn:hover {
     transform: scale(1.1);
   }
 
-  :global(.theme-dark) :global(.mmg-card-action-btn) {
+  .theme-dark .mmg-card-action-btn {
     background: rgb(15, 23, 42);
   }
 
-  :global(.mmg-duplicate-img) {
+  .mmg-duplicate-img {
     color: rgb(99, 102, 241);
   }
 
-  :global(.mmg-replace-img) {
+  .mmg-replace-img {
     color: rgb(217, 119, 6);
   }
 
-  :global(.mmg-canvas-wrap) {
+  .mmg-canvas-wrap {
     aspect-ratio: 9/16;
     background: rgb(241, 245, 249);
     border-radius: 1.5rem;
@@ -606,42 +606,42 @@
     outline: 1px solid rgb(226, 232, 240);
   }
 
-  :global(.theme-dark) :global(.mmg-canvas-wrap) {
+  .theme-dark .mmg-canvas-wrap {
     background: rgba(15, 23, 42, 0.5);
     outline-color: rgb(30, 41, 59);
   }
 
-  :global(.mmg-canvas) {
+  .mmg-canvas {
     width: 100%;
     height: 100%;
     object-fit: contain;
     display: block;
   }
 
-  :global(.mmg-card-body) {
+  .mmg-card-body {
     margin-top: 1.5rem;
     display: flex;
     flex-direction: column;
     gap: 1.5rem;
   }
 
-  :global(.mmg-section) {
+  .mmg-section {
     padding-top: 1rem;
     border-top: 1px solid rgb(241, 245, 249);
   }
 
-  :global(.theme-dark) :global(.mmg-section) {
+  .theme-dark .mmg-section {
     border-color: rgba(30, 41, 59, 0.5);
   }
 
-  :global(.mmg-section-head) {
+  .mmg-section-head {
     display: flex;
     align-items: center;
     justify-content: space-between;
     margin-bottom: 0.75rem;
   }
 
-  :global(.mmg-section-label) {
+  .mmg-section-label {
     font-size: 0.625rem;
     font-weight: 900;
     text-transform: uppercase;
@@ -649,7 +649,7 @@
     color: rgb(148, 163, 184);
   }
 
-  :global(.mmg-reset-btn) {
+  .mmg-reset-btn {
     padding: 0.375rem;
     color: rgb(148, 163, 184);
     border: none;
@@ -660,22 +660,22 @@
     display: flex;
   }
 
-  :global(.mmg-reset-btn:hover) {
+  .mmg-reset-btn:hover {
     color: rgb(99, 102, 241);
     background: rgb(238, 242, 255);
   }
 
-  :global(.theme-dark) :global(.mmg-reset-btn:hover) {
+  .theme-dark .mmg-reset-btn:hover {
     background: rgba(99, 102, 241, 0.3);
   }
 
-  :global(.mmg-presets-grid) {
+  .mmg-presets-grid {
     display: grid;
     grid-template-columns: repeat(3, 1fr);
     gap: 0.5rem;
   }
 
-  :global(.mmg-preset-btn) {
+  .mmg-preset-btn {
     padding: 0.625rem 0.5rem;
     font-size: 0.5625rem;
     font-weight: 900;
@@ -690,33 +690,33 @@
     line-height: 1.2;
   }
 
-  :global(.mmg-preset-btn:hover) {
+  .mmg-preset-btn:hover {
     background: rgb(241, 245, 249);
     border-color: rgb(199, 210, 254);
     color: rgb(79, 70, 229);
   }
 
-  :global(.mmg-preset-btn:active) {
+  .mmg-preset-btn:active {
     transform: scale(0.95);
   }
 
-  :global(.theme-dark) :global(.mmg-preset-btn) {
+  .theme-dark .mmg-preset-btn {
     background: rgb(15, 23, 42);
     border-color: rgb(30, 41, 59);
     color: rgb(148, 163, 184);
   }
 
-  :global(.theme-dark) :global(.mmg-preset-btn:hover) {
+  .theme-dark .mmg-preset-btn:hover {
     background: rgba(79, 70, 229, 0.2);
     border-color: rgba(99, 102, 241, 0.5);
     color: rgb(129, 140, 248);
   }
 
-  :global(.mmg-color-row) {
+  .mmg-color-row {
     margin-bottom: 0.75rem;
   }
 
-  :global(.mmg-color-sublabel) {
+  .mmg-color-sublabel {
     display: block;
     font-size: 0.625rem;
     font-weight: 700;
@@ -727,7 +727,7 @@
     margin-left: 0.25rem;
   }
 
-  :global(.mmg-color-field) {
+  .mmg-color-field {
     display: flex;
     align-items: center;
     gap: 0.75rem;
@@ -737,12 +737,12 @@
     border-radius: 1rem;
   }
 
-  :global(.theme-dark) :global(.mmg-color-field) {
+  .theme-dark .mmg-color-field {
     background: rgb(2, 6, 23);
     border-color: rgb(30, 41, 59);
   }
 
-  :global(.mmg-color-input) {
+  .mmg-color-input {
     width: 1.5rem;
     height: 1.5rem;
     border-radius: 0.5rem;
@@ -751,17 +751,17 @@
     cursor: pointer;
   }
 
-  :global(.mmg-color-hex) {
+  .mmg-color-hex {
     font-size: 0.75rem;
     font-weight: 700;
     color: rgb(71, 85, 105);
   }
 
-  :global(.theme-dark) :global(.mmg-color-hex) {
+  .theme-dark .mmg-color-hex {
     color: rgb(148, 163, 184);
   }
 
-  :global(.mmg-textarea) {
+  .mmg-textarea {
     width: 100%;
     padding: 0.75rem 1rem;
     background: rgb(248, 250, 252);
@@ -777,29 +777,29 @@
     color: rgb(15, 23, 42);
   }
 
-  :global(.mmg-textarea:focus) {
+  .mmg-textarea:focus {
     border-color: rgb(99, 102, 241);
   }
 
-  :global(.theme-dark) :global(.mmg-textarea) {
+  .theme-dark .mmg-textarea {
     background: rgb(2, 6, 23);
     border-color: rgb(30, 41, 59);
     color: #fff;
   }
 
-  :global(.mmg-range-grid) {
+  .mmg-range-grid {
     display: grid;
     grid-template-columns: 1fr 1fr;
     gap: 1rem 1.5rem;
   }
 
-  :global(.mmg-range-item) {
+  .mmg-range-item {
     display: flex;
     flex-direction: column;
     gap: 0.25rem;
   }
 
-  :global(.mmg-range-row) {
+  .mmg-range-row {
     display: flex;
     justify-content: space-between;
     font-size: 0.5625rem;
@@ -809,12 +809,12 @@
     color: rgb(148, 163, 184);
   }
 
-  :global(.mmg-scene-row) {
+  .mmg-scene-row {
     display: flex;
     gap: 0.5rem;
   }
 
-  :global(.mmg-scene-btn) {
+  .mmg-scene-btn {
     flex: 1;
     display: flex;
     align-items: center;
@@ -833,17 +833,17 @@
     transition: all 0.2s;
   }
 
-  :global(.mmg-scene-btn:hover) {
+  .mmg-scene-btn:hover {
     background: rgb(224, 231, 255);
   }
 
-  :global(.theme-dark) :global(.mmg-scene-btn) {
+  .theme-dark .mmg-scene-btn {
     background: rgba(79, 70, 229, 0.2);
     border-color: rgba(99, 102, 241, 0.5);
     color: rgb(129, 140, 248);
   }
 
-  :global(.mmg-clear-bg-btn) {
+  .mmg-clear-bg-btn {
     display: flex;
     align-items: center;
     justify-content: center;
@@ -856,16 +856,16 @@
     transition: all 0.2s;
   }
 
-  :global(.mmg-clear-bg-btn:hover) {
+  .mmg-clear-bg-btn:hover {
     background: rgb(254, 226, 226);
   }
 
-  :global(.theme-dark) :global(.mmg-clear-bg-btn) {
+  .theme-dark .mmg-clear-bg-btn {
     background: rgba(239, 68, 68, 0.2);
     border-color: rgba(239, 68, 68, 0.5);
   }
 
-  :global(.mmg-delete-btn) {
+  .mmg-delete-btn {
     width: 100%;
     padding: 0.75rem;
     font-size: 0.625rem;
@@ -880,16 +880,16 @@
     transition: all 0.2s;
   }
 
-  :global(.mmg-delete-btn:hover) {
+  .mmg-delete-btn:hover {
     color: rgb(239, 68, 68);
     background: rgb(254, 242, 242);
   }
 
-  :global(.theme-dark) :global(.mmg-delete-btn:hover) {
+  .theme-dark .mmg-delete-btn:hover {
     background: rgba(239, 68, 68, 0.2);
   }
 
-  :global(.mmg-preset-swatch) {
+  .mmg-preset-swatch {
     width: 100%;
     aspect-ratio: 1;
     border-radius: 0.5rem;
@@ -899,6 +899,6 @@
     box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
   }
 
-  :global(.mmg-preset-swatch:hover) {
+  .mmg-preset-swatch:hover {
     transform: scale(1.1);
   }

package/src/tool/musicalTypography/musical-typography.css

@@ -16,7 +16,7 @@
     --mt-feedback-color: #059669;
   }
 
-  :global(.theme-dark) .mt-root {
+  .theme-dark .mt-root {
     --mt-card-bg: #1e293b;
     --mt-border: #334155;
     --mt-text: #f1f5f9;
@@ -65,7 +65,7 @@
     background: rgba(236, 72, 153, 0.04);
   }
 
-  :global(.theme-dark) .mt-card-header-preview {
+  .theme-dark .mt-card-header-preview {
     background: rgba(236, 72, 153, 0.08);
   }
 
@@ -168,7 +168,7 @@
     gap: 0.25rem;
   }
 
-  :global(.mt-scale-row) {
+  .mt-scale-row {
     display: flex;
     justify-content: space-between;
     font-size: 0.8125rem;
@@ -176,7 +176,7 @@
     padding: 0.125rem 0;
   }
 
-  :global(.mt-scale-base) {
+  .mt-scale-base {
     color: var(--mt-base-color);
     font-weight: 700;
     background: var(--mt-accent-bg);
@@ -217,12 +217,12 @@
     border-radius: 9999px;
   }
 
-  :global(.mt-prev-item) {
+  .mt-prev-item {
     border-bottom: 1px solid var(--mt-border);
     padding-bottom: 1rem;
   }
 
-  :global(.mt-prev-meta) {
+  .mt-prev-meta {
     display: flex;
     align-items: baseline;
     gap: 0.5rem;
@@ -231,7 +231,7 @@
     color: var(--mt-muted);
   }
 
-  :global(.mt-prev-text) {
+  .mt-prev-text {
     font-weight: 700;
     color: var(--mt-text);
     white-space: nowrap;
@@ -240,7 +240,7 @@
     margin: 0;
   }
 
-  :global(.mt-sub) {
+  .mt-sub {
     color: var(--mt-muted);
     margin: 0.25rem 0 0;
     white-space: nowrap;

package/src/tool/placeholderGenerator/placeholder-image-generator.css

@@ -16,7 +16,7 @@
     color: var(--pg-text);
   }
 
-  :global(.theme-dark) .pg-root {
+  .theme-dark .pg-root {
     --pg-card-bg: #1e293b;
     --pg-bg: #0f172a;
     --pg-text: #f1f5f9;
@@ -123,7 +123,7 @@
   }
 
   .pg-preset-pill:hover,
-  :global(.pg-preset-pill.active) {
+  .pg-preset-pill.active {
     background: var(--pg-primary);
     border-color: var(--pg-primary-dark);
     color: #fff;