Skip to content

Commit 30bacf1

Browse files
coodoscoodos
authored
Feat/provisioner secret use (#299)
* feat: change evault logic * chore: provisioner secret usage
1 parent 8b571ab commit 30bacf1

File tree

14 files changed

+1027
-245
lines changed

14 files changed

+1027
-245
lines changed

‎infrastructure/control-panel/src/app.css‎

Lines changed: 256 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -69,3 +69,259 @@
6969
--color-green: #0fb340;
7070
}
7171
}
72+
73+
@layer utilities {
74+
/* Primary colors */
75+
.bg-primary {
76+
background-color: var(--color-primary);
77+
}
78+
.bg-primary-100 {
79+
background-color: var(--color-primary-100);
80+
}
81+
.bg-primary-200 {
82+
background-color: var(--color-primary-200);
83+
}
84+
.bg-primary-300 {
85+
background-color: var(--color-primary-300);
86+
}
87+
.bg-primary-400 {
88+
background-color: var(--color-primary-400);
89+
}
90+
.bg-primary-500 {
91+
background-color: var(--color-primary-500);
92+
}
93+
94+
.text-primary {
95+
color: var(--color-primary);
96+
}
97+
.text-primary-100 {
98+
color: var(--color-primary-100);
99+
}
100+
.text-primary-200 {
101+
color: var(--color-primary-200);
102+
}
103+
.text-primary-300 {
104+
color: var(--color-primary-300);
105+
}
106+
.text-primary-400 {
107+
color: var(--color-primary-400);
108+
}
109+
.text-primary-500 {
110+
color: var(--color-primary-500);
111+
}
112+
113+
.border-primary {
114+
border-color: var(--color-primary);
115+
}
116+
.border-primary-100 {
117+
border-color: var(--color-primary-100);
118+
}
119+
.border-primary-200 {
120+
border-color: var(--color-primary-200);
121+
}
122+
.border-primary-300 {
123+
border-color: var(--color-primary-300);
124+
}
125+
.border-primary-400 {
126+
border-color: var(--color-primary-400);
127+
}
128+
.border-primary-500 {
129+
border-color: var(--color-primary-500);
130+
}
131+
132+
/* Secondary colors */
133+
.bg-secondary {
134+
background-color: var(--color-secondary);
135+
}
136+
.bg-secondary-100 {
137+
background-color: var(--color-secondary-100);
138+
}
139+
.bg-secondary-200 {
140+
background-color: var(--color-secondary-200);
141+
}
142+
.bg-secondary-300 {
143+
background-color: var(--color-secondary-300);
144+
}
145+
.bg-secondary-400 {
146+
background-color: var(--color-secondary-400);
147+
}
148+
.bg-secondary-500 {
149+
background-color: var(--color-secondary-500);
150+
}
151+
152+
.text-secondary {
153+
color: var(--color-secondary);
154+
}
155+
.text-secondary-100 {
156+
color: var(--color-secondary-100);
157+
}
158+
.text-secondary-200 {
159+
color: var(--color-secondary-200);
160+
}
161+
.text-secondary-300 {
162+
color: var(--color-secondary-300);
163+
}
164+
.text-secondary-400 {
165+
color: var(--color-secondary-400);
166+
}
167+
.text-secondary-500 {
168+
color: var(--color-secondary-500);
169+
}
170+
171+
/* Danger colors */
172+
.bg-danger {
173+
background-color: var(--color-danger);
174+
}
175+
.bg-danger-100 {
176+
background-color: var(--color-danger-100);
177+
}
178+
.bg-danger-200 {
179+
background-color: var(--color-danger-200);
180+
}
181+
.bg-danger-300 {
182+
background-color: var(--color-danger-300);
183+
}
184+
.bg-danger-400 {
185+
background-color: var(--color-danger-400);
186+
}
187+
.bg-danger-500 {
188+
background-color: var(--color-danger-500);
189+
}
190+
191+
.text-danger {
192+
color: var(--color-danger);
193+
}
194+
.text-danger-100 {
195+
color: var(--color-danger-100);
196+
}
197+
.text-danger-200 {
198+
color: var(--color-danger-200);
199+
}
200+
.text-danger-300 {
201+
color: var(--color-danger-300);
202+
}
203+
.text-danger-400 {
204+
color: var(--color-danger-400);
205+
}
206+
.text-danger-500 {
207+
color: var(--color-danger-500);
208+
}
209+
210+
/* Black colors */
211+
.bg-black-100 {
212+
background-color: var(--color-black-100);
213+
}
214+
.bg-black-300 {
215+
background-color: var(--color-black-300);
216+
}
217+
.bg-black-500 {
218+
background-color: var(--color-black-500);
219+
}
220+
.bg-black-700 {
221+
background-color: var(--color-black-700);
222+
}
223+
.bg-black-900 {
224+
background-color: var(--color-black-900);
225+
}
226+
227+
.text-black-100 {
228+
color: var(--color-black-100);
229+
}
230+
.text-black-300 {
231+
color: var(--color-black-300);
232+
}
233+
.text-black-500 {
234+
color: var(--color-black-500);
235+
}
236+
.text-black-700 {
237+
color: var(--color-black-700);
238+
}
239+
.text-black-900 {
240+
color: var(--color-black-900);
241+
}
242+
243+
.border-black-100 {
244+
border-color: var(--color-black-100);
245+
}
246+
247+
/* Green color */
248+
.text-green {
249+
color: var(--color-green);
250+
}
251+
252+
/* Basic colors */
253+
.bg-white {
254+
background-color: var(--color-white);
255+
}
256+
.bg-gray {
257+
background-color: var(--color-gray);
258+
}
259+
.bg-gray-50 {
260+
background-color: #f9fafb;
261+
}
262+
.bg-gray-100 {
263+
background-color: #f3f4f6;
264+
}
265+
.bg-gray-200 {
266+
background-color: #e5e7eb;
267+
}
268+
.bg-gray-300 {
269+
background-color: #d1d5db;
270+
}
271+
.bg-gray-400 {
272+
background-color: #9ca3af;
273+
}
274+
.bg-gray-500 {
275+
background-color: #6b7280;
276+
}
277+
.bg-gray-600 {
278+
background-color: #4b5563;
279+
}
280+
.bg-gray-700 {
281+
background-color: #374151;
282+
}
283+
.bg-gray-800 {
284+
background-color: #1f2937;
285+
}
286+
.bg-gray-900 {
287+
background-color: #111827;
288+
}
289+
290+
.text-gray-50 {
291+
color: #f9fafb;
292+
}
293+
.text-gray-100 {
294+
color: #f3f4f6;
295+
}
296+
.text-gray-200 {
297+
color: #e5e7eb;
298+
}
299+
.text-gray-300 {
300+
color: #d1d5db;
301+
}
302+
.text-gray-400 {
303+
color: #9ca3af;
304+
}
305+
.text-gray-500 {
306+
color: #6b7280;
307+
}
308+
.text-gray-600 {
309+
color: #4b5563;
310+
}
311+
.text-gray-700 {
312+
color: #374151;
313+
}
314+
.text-gray-800 {
315+
color: #1f2937;
316+
}
317+
.text-gray-900 {
318+
color: #111827;
319+
}
320+
321+
.border-gray-300 {
322+
border-color: #d1d5db;
323+
}
324+
.border-gray-700 {
325+
border-color: #374151;
326+
}
327+
}

‎infrastructure/control-panel/src/lib/fragments/Nodes/VaultNode.svelte‎

Lines changed: 48 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -3,10 +3,11 @@
33
import { HugeiconsIcon } from '@hugeicons/svelte';
44
import { Cancel01FreeIcons, Database01FreeIcons } from '@hugeicons/core-free-icons';
55
6-
export let data: { label: string; subLabel: string };
6+
export let data: { label: string; subLabel: string; type?: string };
7+
export let selected = false;
78
</script>
89

9-
<div class="vault-node-wrapper relative">
10+
<div class="vault-node-wrapper relative" class:highlight={selected}>
1011
<!-- <button class="absolute top-[10px] end-[10px]" onclick={handleCancel}>
1112
<HugeiconsIcon icon={Cancel01FreeIcons} size="15px"/>
1213
</button> -->
@@ -17,8 +18,17 @@
1718
<div class="vault-sub-label">{data.subLabel}</div>
1819
</div>
1920
</div>
20-
<Handle type="source" position={Position.Bottom} class="vault-handle" />
21-
<Handle type="target" position={Position.Top} class="vault-handle" />
21+
22+
<!-- Position handles based on node type -->
23+
{#if data.type === 'platform'}
24+
<!-- Platforms: handles above the card for outgoing connections AND incoming connections -->
25+
<Handle type="source" position={Position.Top} class="vault-handle platform-handle" />
26+
<Handle type="target" position={Position.Top} class="vault-handle platform-handle" />
27+
{:else}
28+
<!-- eVaults: handles at bottom for incoming AND outgoing connections -->
29+
<Handle type="target" position={Position.Bottom} class="vault-handle evault-handle" />
30+
<Handle type="source" position={Position.Bottom} class="vault-handle evault-handle" />
31+
{/if}
2232
</div>
2333

2434
<style>
@@ -35,6 +45,13 @@
3545
min-width: 150px;
3646
color: #333;
3747
font-family: sans-serif;
48+
transition: all 0.3s ease;
49+
}
50+
51+
.vault-node-wrapper.highlight {
52+
box-shadow: 0 0 20px rgba(76, 175, 80, 0.6);
53+
border: 2px solid #4caf50;
54+
transform: scale(1.05);
3855
}
3956
4057
.vault-node-content {
@@ -67,13 +84,39 @@
6784
position: absolute;
6885
border-radius: 50%;
6986
transform: translate(-50%, -50%);
87+
}
88+
89+
:global(.evault-handle) {
7090
top: auto;
7191
bottom: -5px;
7292
left: 50%;
7393
transform: translateX(-50%);
7494
}
75-
:global(.vault-handle[data-position='top']) {
95+
96+
:global(.evault-handle[data-position='top']) {
97+
top: -5px;
98+
bottom: auto;
99+
}
100+
101+
:global(.platform-handle) {
76102
top: -5px;
77103
bottom: auto;
104+
left: 50%;
105+
transform: translateX(-50%);
106+
}
107+
108+
/* Fix handle positioning for Svelte Flow */
109+
:global(.vault-handle[data-handlepos='top']) {
110+
top: -5px !important;
111+
bottom: auto !important;
112+
left: 50% !important;
113+
transform: translateX(-50%) !important;
114+
}
115+
116+
:global(.vault-handle[data-handlepos='bottom']) {
117+
bottom: -5px !important;
118+
top: auto !important;
119+
left: 50% !important;
120+
transform: translateX(-50%) !important;
78121
}
79122
</style>

‎infrastructure/control-panel/src/lib/ui/Checkbox/Checkbox.svelte‎

Lines changed: 4 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -43,7 +43,10 @@
4343
tabindex="0"
4444
role="checkbox"
4545
aria-checked={checked}
46-
onclick={() => inputElement?.click()}
46+
onclick={(e) => {
47+
e.stopPropagation();
48+
inputElement?.click();
49+
}}
4750
>
4851
{#if checked}
4952
<span class="bg-primary block h-2 w-2 rounded-[1px]"></span>

0 commit comments

Comments
 (0)