@gkucmierz/nano-ui 1.8.9 → 1.8.10

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 (5) hide show
  1. package/dist/nano-ui-dark.svg +27 -40
  2. package/dist/nano-ui-light.svg +25 -38
  3. package/dist/nano-ui.css +1 -1
  4. package/dist/nano-ui.js +4465 -2940
  5. package/package.json +1 -1
package/dist/nano-ui-dark.svg CHANGED
@@ -1,54 +1,41 @@
1
1
  <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512" width="512" height="512">
2
2
  <defs>
3
- <!-- Background Squircle Gradient -->
4
- <linearGradient id="nanoBgGrad" x1="0%" y1="0%" x2="100%" y2="100%">
3
+ <!-- Dark Squircle Surface Gradient -->
4
+ <linearGradient id="nanoBgGradDark" x1="0%" y1="0%" x2="100%" y2="100%">
5
5
  <stop offset="0%" stop-color="#0f172a" />
6
6
  <stop offset="100%" stop-color="#020617" />
7
7
  </linearGradient>
8
8
 
9
- <!-- Ambient Core Radial Glow -->
10
- <radialGradient id="nanoAmbientGlow" cx="50%" cy="50%" r="50%">
11
- <stop offset="0%" stop-color="#6366f1" stop-opacity="0.38" />
12
- <stop offset="55%" stop-color="#00f2fe" stop-opacity="0.14" />
13
- <stop offset="100%" stop-color="#020617" stop-opacity="0" />
14
- </radialGradient>
15
-
16
- <!-- Continuous Kinetic Energy Monogram Gradient -->
17
- <linearGradient id="nanoKineticGrad" x1="136" y1="376" x2="376" y2="136" gradientUnits="userSpaceOnUse">
18
- <stop offset="0%" stop-color="#4f46e5" />
19
- <stop offset="28%" stop-color="#6366f1" />
20
- <stop offset="58%" stop-color="#38bdf8" />
21
- <stop offset="100%" stop-color="#00f2fe" />
9
+ <!-- [□] Golden Pillar Gradient (Indigo -> Electric Violet) -->
10
+ <linearGradient id="nanoPhiRectDark" x1="112" y1="112" x2="180" y2="400" gradientUnits="userSpaceOnUse">
11
+ <stop offset="0%" stop-color="#818cf8" />
12
+ <stop offset="100%" stop-color="#4f46e5" />
22
13
  </linearGradient>
23
- </defs>
24
-
25
- <!-- Squircle Base Canvas (App Icon & OG Surface) -->
26
- <rect width="512" height="512" rx="144" fill="url(#nanoBgGrad)" stroke="rgba(255, 255, 255, 0.14)" stroke-width="4" />
27
14
 
28
- <!-- Ambient Glow -->
29
- <circle cx="256" cy="256" r="220" fill="url(#nanoAmbientGlow)" />
15
+ <!-- [△] Golden Wedge Triangle Gradient (Indigo -> Emerald/Cyan) -->
16
+ <linearGradient id="nanoPhiTriDark" x1="212" y1="112" x2="400" y2="400" gradientUnits="userSpaceOnUse">
17
+ <stop offset="0%" stop-color="#6366f1" />
18
+ <stop offset="55%" stop-color="#06b6d4" />
19
+ <stop offset="100%" stop-color="#10b981" />
20
+ </linearGradient>
30
21
 
31
- <!-- High-Precision Quantum Reticle Rings -->
32
- <circle cx="256" cy="256" r="208" stroke="rgba(255, 255, 255, 0.08)" stroke-width="2" stroke-dasharray="8 12" />
33
- <circle cx="256" cy="256" r="160" stroke="rgba(255, 255, 255, 0.05)" stroke-width="1.5" />
22
+ <!-- [○] Quantum Sphere Radial Gradient (Cyan Core) -->
23
+ <radialGradient id="nanoPhiCircleDark" cx="38%" cy="35%" r="65%">
24
+ <stop offset="0%" stop-color="#e0f2fe" />
25
+ <stop offset="45%" stop-color="#00f2fe" />
26
+ <stop offset="100%" stop-color="#0284c7" />
27
+ </radialGradient>
28
+ </defs>
34
29
 
35
- <!-- Diagonal Alignment Axis -->
36
- <line x1="84" y1="84" x2="428" y2="428" stroke="rgba(255, 255, 255, 0.05)" stroke-width="1.5" stroke-dasharray="6 10" />
30
+ <!-- Squircle Base Canvas (Inset by 6px for stroke-width="12" -> [0, 0, 512, 512] zero clipping) -->
31
+ <rect x="6" y="6" width="500" height="500" rx="140" fill="url(#nanoBgGradDark)" stroke="rgba(255, 255, 255, 0.14)" stroke-width="12" />
37
32
 
38
- <!-- BOLD KINETIC 'N' MONOGRAM (Continuous 72px Joined Path) -->
39
- <path
40
- d="M136 376 V136 L376 376 V136"
41
- stroke="url(#nanoKineticGrad)"
42
- stroke-width="72"
43
- stroke-linecap="round"
44
- stroke-linejoin="round"
45
- />
33
+ <!-- 1. [□] BAUHAUS GOLDEN PILLAR (H = 288, w = H * phi^-3 = 68) -->
34
+ <rect x="112" y="112" width="68" height="288" rx="14.4" fill="url(#nanoPhiRectDark)" />
46
35
 
47
- <!-- Prominent Quantum Pulsar (Upper Right) -->
48
- <circle cx="376" cy="136" r="54" fill="rgba(0, 242, 254, 0.24)" />
49
- <circle cx="376" cy="136" r="32" fill="#00f2fe" />
50
- <circle cx="376" cy="136" r="13" fill="#ffffff" />
36
+ <!-- 2. [△] BAUHAUS GOLDEN RIGHT TRIANGLE (Right leg = H * phi^-1 = 178 -> y = 400 - 178 = 222) -->
37
+ <polygon points="212,112 400,400 400,222" fill="url(#nanoPhiTriDark)" />
51
38
 
52
- <!-- Secondary Anchor Core (Bottom Left) -->
53
- <circle cx="136" cy="376" r="15" fill="#4f46e5" />
39
+ <!-- 3. [○] BAUHAUS GOLDEN SPHERE (Upper-right phi^-2 pocket, tangent to x=400, y=112) -->
40
+ <circle cx="360.8" cy="151.2" r="39.2" fill="url(#nanoPhiCircleDark)" />
54
41
  </svg>
package/dist/nano-ui-light.svg CHANGED
@@ -1,54 +1,41 @@
1
1
  <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512" width="512" height="512">
2
2
  <defs>
3
- <!-- Light Squircle Gradient -->
3
+ <!-- Light Squircle Surface Gradient -->
4
4
  <linearGradient id="nanoBgGradLight" x1="0%" y1="0%" x2="100%" y2="100%">
5
5
  <stop offset="0%" stop-color="#ffffff" />
6
6
  <stop offset="100%" stop-color="#eef2ff" />
7
7
  </linearGradient>
8
8
 
9
- <!-- Ambient Core Radial Glow -->
10
- <radialGradient id="nanoAmbientGlowLight" cx="50%" cy="50%" r="50%">
11
- <stop offset="0%" stop-color="#6366f1" stop-opacity="0.22" />
12
- <stop offset="55%" stop-color="#0284c7" stop-opacity="0.10" />
13
- <stop offset="100%" stop-color="#ffffff" stop-opacity="0" />
14
- </radialGradient>
9
+ <!-- [□] Golden Pillar Gradient (High-Contrast Deep Indigo) -->
10
+ <linearGradient id="nanoPhiRectLight" x1="112" y1="112" x2="180" y2="400" gradientUnits="userSpaceOnUse">
11
+ <stop offset="0%" stop-color="#4f46e5" />
12
+ <stop offset="100%" stop-color="#3730a3" />
13
+ </linearGradient>
15
14
 
16
- <!-- Continuous Kinetic Energy Monogram Gradient (High-Contrast Light Mode) -->
17
- <linearGradient id="nanoKineticGradLight" x1="136" y1="376" x2="376" y2="136" gradientUnits="userSpaceOnUse">
18
- <stop offset="0%" stop-color="#3730a3" />
19
- <stop offset="32%" stop-color="#4f46e5" />
20
- <stop offset="68%" stop-color="#0284c7" />
21
- <stop offset="100%" stop-color="#06b6d4" />
15
+ <!-- [△] Golden Wedge Triangle Gradient (Indigo -> Deep Teal/Emerald) -->
16
+ <linearGradient id="nanoPhiTriLight" x1="212" y1="112" x2="400" y2="400" gradientUnits="userSpaceOnUse">
17
+ <stop offset="0%" stop-color="#4338ca" />
18
+ <stop offset="55%" stop-color="#0284c7" />
19
+ <stop offset="100%" stop-color="#059669" />
22
20
  </linearGradient>
21
+
22
+ <!-- [○] Quantum Sphere Radial Gradient (High-Contrast Cyan) -->
23
+ <radialGradient id="nanoPhiCircleLight" cx="38%" cy="35%" r="65%">
24
+ <stop offset="0%" stop-color="#38bdf8" />
25
+ <stop offset="55%" stop-color="#0284c7" />
26
+ <stop offset="100%" stop-color="#0369a1" />
27
+ </radialGradient>
23
28
  </defs>
24
29
 
25
30
  <!-- Squircle Base Canvas (Exact 1:1 Geometry with nano-ui-dark.svg) -->
26
- <rect x="6" y="6" width="500" height="500" rx="140" fill="url(#nanoBgGradLight)" stroke="rgba(79, 70, 229, 0.32)" stroke-width="12" />
27
-
28
- <!-- Ambient Glow -->
29
- <circle cx="256" cy="256" r="220" fill="url(#nanoAmbientGlowLight)" />
30
-
31
- <!-- High-Precision Quantum Reticle Rings -->
32
- <circle cx="256" cy="256" r="208" stroke="rgba(15, 23, 42, 0.10)" stroke-width="2" stroke-dasharray="8 12" />
33
- <circle cx="256" cy="256" r="160" stroke="rgba(15, 23, 42, 0.06)" stroke-width="1.5" />
34
-
35
- <!-- Diagonal Alignment Axis -->
36
- <line x1="84" y1="84" x2="428" y2="428" stroke="rgba(15, 23, 42, 0.07)" stroke-width="1.5" stroke-dasharray="6 10" />
31
+ <rect x="6" y="6" width="500" height="500" rx="140" fill="url(#nanoBgGradLight)" stroke="rgba(79, 70, 229, 0.28)" stroke-width="12" />
37
32
 
38
- <!-- BOLD KINETIC 'N' MONOGRAM (Continuous 72px Joined Path — Zero Pixel Shift vs Dark Icon) -->
39
- <path
40
- d="M136 376 V136 L376 376 V136"
41
- stroke="url(#nanoKineticGradLight)"
42
- stroke-width="72"
43
- stroke-linecap="round"
44
- stroke-linejoin="round"
45
- />
33
+ <!-- 1. [□] BAUHAUS GOLDEN PILLAR (H = 288, w = H * phi^-3 = 68) -->
34
+ <rect x="112" y="112" width="68" height="288" rx="14.4" fill="url(#nanoPhiRectLight)" />
46
35
 
47
- <!-- Prominent Quantum Pulsar (Upper Right) -->
48
- <circle cx="376" cy="136" r="54" fill="rgba(6, 182, 212, 0.24)" />
49
- <circle cx="376" cy="136" r="32" fill="#0284c7" />
50
- <circle cx="376" cy="136" r="13" fill="#ffffff" />
36
+ <!-- 2. [△] BAUHAUS GOLDEN RIGHT TRIANGLE (Right leg = H * phi^-1 = 178 -> y = 400 - 178 = 222) -->
37
+ <polygon points="212,112 400,400 400,222" fill="url(#nanoPhiTriLight)" />
51
38
 
52
- <!-- Secondary Anchor Core (Bottom Left) -->
53
- <circle cx="136" cy="376" r="15" fill="#3730a3" />
39
+ <!-- 3. [○] BAUHAUS GOLDEN SPHERE (Upper-right phi^-2 pocket, tangent to x=400, y=112) -->
40
+ <circle cx="360.8" cy="151.2" r="39.2" fill="url(#nanoPhiCircleLight)" />
54
41
  </svg>