FIX: release fixes (#2207)

* REFACTOR: scrollbar * FIX: consensus sync on import configs * FIX: no client for web3signer * REMOVED: prunning btn for geth * FIX: format * CHANGE: some styles on controp page * CHANGE: some styles changed on cp * FIX: format
stereum-dev · Feb 27, 2025 · 1a0888e · 1a0888e
1 parent f1b6f60
commit 1a0888e
Show file tree

Hide file tree

Showing 11 changed files with 114 additions and 92 deletions.
diff --git a/launcher/public/output.css b/launcher/public/output.css
@@ -1028,10 +1028,6 @@ video {
   top: 100%;
 }
 
-.left-2\/3{
-  left: 66.666667%;
-}
-
 .z-0{
   z-index: 0;
 }
@@ -1440,6 +1436,10 @@ video {
   margin: -0.25rem;
 }
 
+.m-0{
+  margin: 0px;
+}
+
 .m-1{
   margin: 0.25rem;
 }
@@ -1448,10 +1448,6 @@ video {
   margin: auto;
 }
 
-.m-0{
-  margin: 0px;
-}
-
 .mx-1{
   margin-left: 0.25rem;
   margin-right: 0.25rem;
@@ -1975,10 +1971,6 @@ video {
   height: 100vh;
 }
 
-.h-auto{
-  height: auto;
-}
-
 .max-h-10{
   max-height: 2.5rem;
 }
@@ -2523,10 +2515,6 @@ video {
   width: 100vw;
 }
 
-.w-auto{
-  width: auto;
-}
-
 .min-w-\[100px\]{
   min-width: 100px;
 }
@@ -2601,6 +2589,12 @@ video {
           transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
 }
 
+.-translate-x-2\/3{
+  --tw-translate-x: -66.666667%;
+  -webkit-transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
+          transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
+}
+
 .-translate-y-1\/2{
   --tw-translate-y: -50%;
   -webkit-transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
@@ -2619,12 +2613,6 @@ video {
           transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
 }
 
-.-translate-x-2\/3{
-  --tw-translate-x: -66.666667%;
-  -webkit-transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
-          transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
-}
-
 .rotate-0{
   --tw-rotate: 0deg;
   -webkit-transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
@@ -3563,6 +3551,10 @@ video {
   border-color: rgb(251 146 60 / var(--tw-border-opacity, 1));
 }
 
+.border-\[\#ffffff0a\]{
+  border-color: #ffffff0a;
+}
+
 .border-blue-100{
   --tw-border-opacity: 1;
   border-color: rgb(219 234 254 / var(--tw-border-opacity, 1));
@@ -3652,6 +3644,16 @@ video {
   border-color: rgb(54 83 20 / var(--tw-border-opacity, 1));
 }
 
+.border-neutral-500{
+  --tw-border-opacity: 1;
+  border-color: rgb(115 115 115 / var(--tw-border-opacity, 1));
+}
+
+.border-neutral-600{
+  --tw-border-opacity: 1;
+  border-color: rgb(82 82 82 / var(--tw-border-opacity, 1));
+}
+
 .border-orange-500{
   --tw-border-opacity: 1;
   border-color: rgb(249 115 22 / var(--tw-border-opacity, 1));
@@ -3736,14 +3738,12 @@ video {
   border-color: rgb(63 63 70 / var(--tw-border-opacity, 1));
 }
 
-.border-neutral-500{
-  --tw-border-opacity: 1;
-  border-color: rgb(115 115 115 / var(--tw-border-opacity, 1));
+.border-\[\#ffffff27\]{
+  border-color: #ffffff27;
 }
 
-.border-neutral-600{
-  --tw-border-opacity: 1;
-  border-color: rgb(82 82 82 / var(--tw-border-opacity, 1));
+.border-\[\#ffffff16\]{
+  border-color: #ffffff16;
 }
 
 .border-b-transparent{
@@ -3808,11 +3808,6 @@ video {
   border-top-color: rgb(255 255 255 / var(--tw-border-opacity, 1));
 }
 
-.bg-\[\#093A4C\]{
-  --tw-bg-opacity: 1;
-  background-color: rgb(9 58 76 / var(--tw-bg-opacity, 1));
-}
-
 .bg-\[\#0d0d0e\]{
   --tw-bg-opacity: 1;
   background-color: rgb(13 13 14 / var(--tw-bg-opacity, 1));
@@ -4073,6 +4068,11 @@ video {
   background-color: rgb(41 46 50 / var(--tw-bg-opacity, 1));
 }
 
+.bg-\[\#2A2A30\]{
+  --tw-bg-opacity: 1;
+  background-color: rgb(42 42 48 / var(--tw-bg-opacity, 1));
+}
+
 .bg-\[\#2a2e30\]{
   --tw-bg-opacity: 1;
   background-color: rgb(42 46 48 / var(--tw-bg-opacity, 1));
@@ -4113,11 +4113,6 @@ video {
   background-color: rgb(48 50 50 / var(--tw-bg-opacity, 1));
 }
 
-.bg-\[\#313136\]{
-  --tw-bg-opacity: 1;
-  background-color: rgb(49 49 54 / var(--tw-bg-opacity, 1));
-}
-
 .bg-\[\#32363A\]{
   --tw-bg-opacity: 1;
   background-color: rgb(50 54 58 / var(--tw-bg-opacity, 1));
@@ -4512,16 +4507,6 @@ video {
   background-color: rgb(63 63 70 / var(--tw-bg-opacity, 1));
 }
 
-.bg-neutral-700{
-  --tw-bg-opacity: 1;
-  background-color: rgb(64 64 64 / var(--tw-bg-opacity, 1));
-}
-
-.bg-neutral-800{
-  --tw-bg-opacity: 1;
-  background-color: rgb(38 38 38 / var(--tw-bg-opacity, 1));
-}
-
 .bg-opacity-50{
   --tw-bg-opacity: 0.5;
 }
@@ -4545,6 +4530,12 @@ video {
   background-image: linear-gradient(to right, var(--tw-gradient-stops));
 }
 
+.from-\[\#1A1A20\]{
+  --tw-gradient-from: #1A1A20 var(--tw-gradient-from-position);
+  --tw-gradient-to: rgb(26 26 32 / 0) var(--tw-gradient-to-position);
+  --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to);
+}
+
 .from-\[\#1e1e1f\]{
   --tw-gradient-from: #1e1e1f var(--tw-gradient-from-position);
   --tw-gradient-to: rgb(30 30 31 / 0) var(--tw-gradient-to-position);
@@ -4577,6 +4568,10 @@ video {
   --tw-gradient-stops: var(--tw-gradient-from), #d1d5db var(--tw-gradient-via-position), var(--tw-gradient-to);
 }
 
+.to-\[\#0D0D12\]{
+  --tw-gradient-to: #0D0D12 var(--tw-gradient-to-position);
+}
+
 .to-\[\#0b0b0b\]{
   --tw-gradient-to: #0b0b0b var(--tw-gradient-to-position);
 }
@@ -5313,6 +5308,11 @@ video {
   color: rgb(234 179 8 / var(--tw-text-opacity, 1));
 }
 
+.text-emerald-500{
+  --tw-text-opacity: 1;
+  color: rgb(16 185 129 / var(--tw-text-opacity, 1));
+}
+
 .placeholder-gray-400\/70::-webkit-input-placeholder{
   color: rgb(156 163 175 / 0.7);
 }
@@ -6611,22 +6611,6 @@ html body {
   opacity: 0.5;
 }
 
-.hs-tooltip.show .hs-tooltip-shown\:visible{
-  visibility: visible;
-}
-
-.hs-tooltip.show .hs-tooltip-shown\:opacity-100{
-  opacity: 1;
-}
-
-.hs-tooltip-content.show.hs-tooltip-shown\:visible{
-  visibility: visible;
-}
-
-.hs-tooltip-content.show.hs-tooltip-shown\:opacity-100{
-  opacity: 1;
-}
-
 .selected .hs-combo-box-selected\:block{
   display: block;
 }

diff --git a/launcher/src/components/UI/control-page/ControlScreen.vue b/launcher/src/components/UI/control-page/ControlScreen.vue
@@ -1,6 +1,6 @@
 <template>
   <base-layout>
-    <div class="Control-screen w-full h-full grid grid-cols-24 grid-rows-12 items-center bg-[#313136]">
+    <div class="Control-screen w-full h-full grid grid-cols-24 grid-rows-12 items-center bg-[#2A2A30]">
       <ControlHeader />
       <CommonSidebar />
       <AlertSection @expert-handler="expertModeHandlerAlert" />

diff --git a/launcher/src/components/UI/control-page/components/cards/MiniCard.vue b/launcher/src/components/UI/control-page/components/cards/MiniCard.vue
@@ -1,5 +1,7 @@
 <template>
-  <div class="w-full h-full bg-gradient-to-br from-[#1e1e1f] to-[#0b0b0b] mx-h-[145px] shadow-sm shadow-[#161515] rounded-lg p-[2px]">
+  <div
+    class="w-full h-full bg-gradient-to-br from-[#1A1A20] to-[#0D0D12] border border-[#ffffff16] mx-h-[145px] shadow-sm shadow-[#161515] rounded-lg p-[2px]"
+  >
     <slot></slot>
   </div>
 </template>
diff --git a/launcher/src/components/UI/control-page/components/cards/ThinCard.vue b/launcher/src/components/UI/control-page/components/cards/ThinCard.vue
@@ -1,5 +1,7 @@
 <template>
-  <div class="w-full h-full bg-gradient-to-br from-[#1e1e1f] to-[#0b0b0b] mx-h-[145px] shadow-sm shadow-[#2a2929] rounded-md p-[2px]">
+  <div
+    class="w-full h-full bg-gradient-to-br from-[#1A1A20] to-[#0D0D12] border border-[#ffffff16] mx-h-[145px] shadow-sm shadow-[#2a2929] rounded-md p-[2px]"
+  >
     <slot></slot>
   </div>
 </template>
diff --git a/launcher/src/components/UI/control-page/components/cards/WidgetCard.vue b/launcher/src/components/UI/control-page/components/cards/WidgetCard.vue
@@ -1,5 +1,7 @@
 <template>
-  <div class="w-full h-full bg-gradient-to-br from-[#1e1e1f] to-[#0b0b0b] mx-h-[145px] shadow-sm shadow-[#161515] rounded-lg p-[2px]">
+  <div
+    class="w-full h-full bg-gradient-to-br from-[#1A1A20] to-[#0D0D12] border border-[#ffffff16] mx-h-[145px] shadow-sm shadow-[#161515] rounded-lg p-[2px]"
+  >
     <slot></slot>
   </div>
 </template>
diff --git a/launcher/src/components/UI/control-page/components/widgets/ConnectedClientPair.vue b/launcher/src/components/UI/control-page/components/widgets/ConnectedClientPair.vue
@@ -6,13 +6,14 @@
         <span class="w-1/2 h-full flex justify-start items-center text-gray-200 font-semibold uppercase text-2xs"> CONSENSUS CLIENT </span>
         <div class="icon-bar h-full w-6 flex justify-center items-center">
           <img
+            v-if="setupStore.relatedValidatorPairs?.pairs[0]?.consensusService.icon"
             class="w-5 h-5"
             :src="setupStore.relatedValidatorPairs?.pairs[0]?.consensusService.icon || '/path/to/default-icon.png'"
             alt=""
           />
         </div>
         <span class="client-name w-24 text-gray-200 uppercase text-[50%] flex justify-start items-center pl-2">
-          {{ setupStore.relatedValidatorPairs?.pairs[0]?.consensusService.name || "Unknown Consensus Client" }}
+          {{ setupStore.relatedValidatorPairs?.pairs[0]?.consensusService.name || "No Client" }}
         </span>
       </div>
 
@@ -21,13 +22,14 @@
         <span class="w-1/2 h-full flex justify-start items-center text-gray-200 font-semibold uppercase text-2xs"> EXECUTION CLIENT </span>
         <div class="icon-bar h-full w-6 flex justify-center items-center">
           <img
+            v-if="setupStore.relatedValidatorPairs?.pairs[0]?.executionService.icon"
             class="w-5 h-5"
             :src="setupStore.relatedValidatorPairs?.pairs[0]?.executionService.icon || '/path/to/default-icon.png'"
             alt=""
           />
         </div>
         <span class="client-name w-24 text-gray-200 uppercase text-[50%] flex justify-start items-center pl-2">
-          {{ setupStore.relatedValidatorPairs?.pairs[0]?.executionService.name || "Unknown Execution Client" }}
+          {{ setupStore.relatedValidatorPairs?.pairs[0]?.executionService.name || "No Client" }}
         </span>
       </div>
     </div>

diff --git a/launcher/src/components/UI/control-page/components/widgets/VolumeWidget.vue b/launcher/src/components/UI/control-page/components/widgets/VolumeWidget.vue
@@ -41,25 +41,25 @@
         </div>
       </template>
 
-      <div v-else class="hdd-services w-full h-3/4 flex pt-1 pb-1">
-        <div class="write-read-box h-full w-2/5 flex justify-start items-center text-[50%] border-r-2 border-gray-600">
+      <div v-else class="hdd-services w-full h-3/4 flex pt-1 pb-1 overflow-hidden">
+        <div class="write-read-box h-full w-1/2 flex justify-start items-center text-[50%]">
           <div class="ttl-box w-1/4 h-full flex flex-col justify-center items-center mr-1">
             <div class="title w-full text-[7px] h-1/2 flex justify-start items-center text-gray-200 uppercase mr-1">
               <span>write</span>
             </div>
             <div class="title w-full text-[7px] h-1/2 flex justify-center items-center text-gray-200 uppercase">read</div>
           </div>
-          <div class="val-box w-3/4 h-full flex flex-col text-xs justify-center font-semibold items-center">
+          <div class="val-box w-3/4 h-full flex flex-col text-xs justify-center items-center">
             <div
-              class="title w-full h-1/2 flex justify-center items-center text-orange-500 uppercase"
+              class="title w-full h-1/2 flex justify-center items-center text-2xs font-medium text-orange-500"
               @mouseenter="footerStore.cursorLocation = `Write: ${convertWriteValueToMb} MB`"
               @mouseleave="footerStore.cursorLocation = ''"
             >
               {{ convertWriteValueToMb }}
               MB
             </div>
             <div
-              class="title w-full h-1/2 flex justify-center items-center text-teal-700 uppercase"
+              class="title w-full h-1/2 flex justify-center items-center text-2xs font-medium text-emerald-500 uppercase"
               @mouseenter="
                 footerStore.cursorLocation = `Read: ${convertReadValueToMb}   MB
                 `
@@ -71,16 +71,16 @@
             </div>
           </div>
         </div>
-        <div class="storage-box flex h-full w-3/5 flex-col pl-1">
+        <div class="storage-box flex h-full w-1/2 flex-col ml-1">
           <div
-            class="used-storage h-1/2 w-full text-xs flex justify-start items-center text-green-500"
+            class="used-storage h-1/2 w-full text-2xs flex justify-start items-center text-emerald-500"
             @mouseenter="footerStore.cursorLocation = `${availDisk} GB ${t('controlPage.free')}`"
             @mouseleave="footerStore.cursorLocation = ''"
           >
             {{ availDisk }} GB {{ t("controlPage.free") }}
           </div>
           <div
-            class="total-storage h-1/2 w-full text-xs text-gray-300 flex justify-start items-center"
+            class="total-storage h-1/2 w-full text-2xs font-normal text-gray-300 flex justify-start items-center"
             @mouseenter="footerStore.cursorLocation = `${totalDisk} GB ${t('controlPage.total')}`"
             @mouseleave="footerStore.cursorLocation = ''"
           >

diff --git a/launcher/src/components/UI/import-config/components/ImportingSyncing.vue b/launcher/src/components/UI/import-config/components/ImportingSyncing.vue
@@ -92,6 +92,7 @@ export default {
     },
     filterServices() {
       this.executionClient = this.configServices.filter((service) => service.category === "execution")[0];
+
       this.consensusClient = this.configServices.filter((service) => service.category === "consensus")[0];
     },
   },
-Original file line number
+Diff line change
@@ Expand Up / @@ -92,6 +92,7 @@ export default { @@
         },
         filterServices() {
           this.executionClient = this.configServices.filter((service) => service.category === "execution")[0];
           this.consensusClient = this.configServices.filter((service) => service.category === "consensus")[0];
         },
       },
@@ Expand Down @@