From 3b68491cc80571d0e164ebbc294fecbf4ad3f30d Mon Sep 17 00:00:00 2001
From: Carles Tubio <ctubio@users.noreply.github.com>
Date: Mon, 21 Oct 2024 04:39:55 +0000
Subject: [PATCH] Updated colors of ui inputs because of reasons.
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

████ ███  To request new features or in case this commit breaks something for you,
████ ███  please, create a new github issue with all possible information for me,
▓███▀█▄   but never share your API Keys!
▒▓██ ███
░▒▓█ ███  Signed-off-by: Carles Tubio <ctubio@users.noreply.github.com>
 _________________________________________
/ Hello, WORLD!                           \
|                                         |
\ pssst.. 1.00000000 BTC = 63347.87 EUR.  /
 -----------------------------------------
        \   ^__^
         \  (oo)\_______
            (__)\       )\/\
                ||----w |
                ||     ||
---
 Makefile                                      |  2 +-
 .../trading-bot/trading-bot.client/Client.ts  |  7 ++-
 .../trading-bot/trading-bot.client/Orders.ts  |  2 +-
 .../trading-bot/trading-bot.client/Trades.ts  |  2 +-
 src/lib/Krypto.ninja-client/Makefile          |  8 ++--
 .../www/css/bootstrap-dark.scss               | 13 +++---
 .../www/css/bootstrap.scss                    | 43 +++++++++++++------
 src/lib/Krypto.ninja-client/www/js/Shared.ts  |  2 +-
 8 files changed, 48 insertions(+), 31 deletions(-)

diff --git a/Makefile b/Makefile
index 0229bbeba..af6c3e26e 100644
--- a/Makefile
+++ b/Makefile
@@ -2,7 +2,7 @@ K         ?= K.sh
 MAJOR      = 0
 MINOR      = 7
 PATCH      = 0
-BUILD      = 46
+BUILD      = 47
 
 OBLIGATORY = DISCLAIMER: This is strict non-violent software: \n$\
              if you hurt other living creatures, please stop; \n$\
diff --git a/src/bin/trading-bot/trading-bot.client/Client.ts b/src/bin/trading-bot/trading-bot.client/Client.ts
index 9ba5beb18..d2d719703 100644
--- a/src/bin/trading-bot/trading-bot.client/Client.ts
+++ b/src/bin/trading-bot/trading-bot.client/Client.ts
@@ -15,7 +15,7 @@ import {Socket, Shared, Models} from 'lib/K';
   </div>
   <div class="row">
     <div class="col-md-1 col-xs-12 text-center" style="padding-right:0px;">
-      <div class="exchange">
+      <div class="hud">
         <state-button
           [product]="product"
           [state]="state"
@@ -38,14 +38,13 @@ import {Socket, Shared, Models} from 'lib/K';
               class="btn btn-default"
               (click)="showSubmitOrder = !showSubmitOrder">Submit Order</button>
           </div>
-          <div style="padding-top: 2px;padding-bottom: 2px;">
+          <div style="padding-top: 7px;padding-bottom: 7px;">
             <button type="button"
               class="btn btn-danger"
-              style="margin:5px 0px;"
               (click)="cancelAllOrders()"
               data-placement="bottom">Cancel Orders</button>
           </div>
-          <div style="padding-bottom: 2px;">
+          <div style="padding-bottom: 7px;">
             <button type="button"
               class="btn btn-info"
               (click)="cleanAllClosedOrders()"
diff --git a/src/bin/trading-bot/trading-bot.client/Orders.ts b/src/bin/trading-bot/trading-bot.client/Orders.ts
index 72fcdbe83..874134178 100644
--- a/src/bin/trading-bot/trading-bot.client/Orders.ts
+++ b/src/bin/trading-bot/trading-bot.client/Orders.ts
@@ -29,7 +29,7 @@ export class OrdersComponent {
   private grid: GridOptions = <GridOptions>{
     suppressNoRowsOverlay: true,
     defaultColDef: { sortable: true, resizable: true, flex: 1 },
-    rowHeight:27,
+    rowHeight:28,
     headerHeight:25,
     columnDefs: [{
       width: 30,
diff --git a/src/bin/trading-bot/trading-bot.client/Trades.ts b/src/bin/trading-bot/trading-bot.client/Trades.ts
index eaf632dfc..45b3bd614 100644
--- a/src/bin/trading-bot/trading-bot.client/Trades.ts
+++ b/src/bin/trading-bot/trading-bot.client/Trades.ts
@@ -44,7 +44,7 @@ export class TradesComponent {
     overlayLoadingTemplate: `<span class="ag-overlay-no-rows-center">0 closed orders</span>`,
     overlayNoRowsTemplate: `<span class="ag-overlay-no-rows-center">0 closed orders</span>`,
     defaultColDef: { sortable: true, resizable: true, flex: 1 },
-    rowHeight:27,
+    rowHeight:28,
     headerHeight:25,
     animateRows:true,
     getRowId: (params: any) => params.data.tradeId,
diff --git a/src/lib/Krypto.ninja-client/Makefile b/src/lib/Krypto.ninja-client/Makefile
index 972a8f582..93253f299 100644
--- a/src/lib/Krypto.ninja-client/Makefile
+++ b/src/lib/Krypto.ninja-client/Makefile
@@ -20,8 +20,8 @@ STEP       = $(call TPUT,setaf 2)$(call TPUT,setab 0)[$(1)/$(STEPS)]$(call TPUT,
 STEP_1    := $(call STEP,1,npm packages)
 STEP_2    := $(call STEP,2,ts files)
 STEP_3    := $(call STEP,3,js zip file)
-STEP_4    := $(call STEP,4,font files)
-STEP_4    := $(call STEP,4,css files)
+STEP_4    := $(call STEP,4,font file)
+STEP_5    := $(call STEP,4,css files)
 
 all $(KSRC): js css
 
@@ -83,7 +83,7 @@ export define PACKAGE_JSON
     "@angular/platform-browser":         "^18.2.8",
     "@angular/platform-browser-dynamic": "^18.2.8",
     "@angular/router":                   "^18.2.8",
-    "@types/node": "^22.7.6",
+    "@types/node": "^22.7.7",
     "ag-grid-angular":   "^32.2.2",
     "ag-grid-community": "^32.2.2",
     "bootstrap": "^5.3.3",
@@ -91,7 +91,7 @@ export define PACKAGE_JSON
     "highcharts": "^11.4.8",
     "highcharts-angular": "^4.0.1",
     "rxjs": "^7.8.1",
-    "sass": "^1.80.1",
+    "sass": "^1.80.3",
     "typescript": "^5.6.3",
     "uglify-js": "^3.19.3",
     "zone.js": "^0.14.10"
diff --git a/src/lib/Krypto.ninja-client/www/css/bootstrap-dark.scss b/src/lib/Krypto.ninja-client/www/css/bootstrap-dark.scss
index d82e839ad..f1ad361af 100644
--- a/src/lib/Krypto.ninja-client/www/css/bootstrap-dark.scss
+++ b/src/lib/Krypto.ninja-client/www/css/bootstrap-dark.scss
@@ -32,10 +32,6 @@ body.theme-dark {
     color: #999999!important;
   }
 
-  .form-control {
-    color: #ffff00;
-    background-color: #2b2b2b;
-  }
   .btn {
     &:active:hover, &.active.hover {
       border-color: #000;
@@ -116,7 +112,7 @@ body.theme-dark {
   .levels {
     background: #232323;
   }
-  .exchange {
+  .hud {
     background: #232323;
     border: 1px #313131 solid;
   }
@@ -245,10 +241,13 @@ body.theme-dark {
     padding: 2px 5px;
     box-shadow: none;
     border-radius: 0;
-    border: 1px #2b2b2b solid;
+    border: 1px #64fcb500 solid;
+    color: #ffff00;
+    background-color: #0b361f;
     &:focus {
       box-shadow: none;
-      border: 1px #606060 solid;
+      border-color: #64fcb5;
+      background-color: #2ea264;
     }
   }
   .tradeSafetyBg {
diff --git a/src/lib/Krypto.ninja-client/www/css/bootstrap.scss b/src/lib/Krypto.ninja-client/www/css/bootstrap.scss
index 33e13bf7e..eaeba8741 100644
--- a/src/lib/Krypto.ninja-client/www/css/bootstrap.scss
+++ b/src/lib/Krypto.ninja-client/www/css/bootstrap.scss
@@ -625,7 +625,8 @@ table {
   width: 100%;
   height: 26px;
   padding: 6px 12px;
-  font-size: 15px;
+  font-size: 19px;
+  font-weight: 600;
   line-height: 1.1;
   color: #555;
   background-color: #fff;
@@ -638,7 +639,8 @@ table {
   -o-transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s;
   transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s;
   &:focus {
-    border-color: #66afe9;
+    border-color: #00ff43;
+    background-color: #eaeebd;
     outline: 0;
     -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 8px rgba(102, 175, 233, 0.6);
     box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 8px rgba(102, 175, 233, 0.6);
@@ -757,7 +759,6 @@ table {
 
 .btn {
   display: inline-block;
-  margin-bottom: 0;
   font-weight: normal;
   text-align: center;
   vertical-align: middle;
@@ -766,15 +767,18 @@ table {
   cursor: pointer;
   background-image: none;
   border: 1px solid transparent;
+  border-bottom-width: 3px;
   white-space: nowrap;
   padding: 5px 10px;
   font-size: 16px;
+  font-weight: 600;
   line-height: 1.1;
   border-radius: 7px;
   -webkit-user-select: none;
   -moz-user-select: none;
   -ms-user-select: none;
   user-select: none;
+  margin-bottom: 0px;
   &:hover {
     color: #333;
     text-decoration: none;
@@ -784,6 +788,9 @@ table {
     background-image: none;
     -webkit-box-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
     box-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
+    transform: translateY(2px);
+    border-bottom-width: 1px;
+    margin-bottom: 2px;
   }
   &:active:hover, &.active.hover {
     border-color: transparent;
@@ -1165,7 +1172,7 @@ table {
   background-color: rgba(255,0,0,.1019607843);
   border-color: #b92c28;
   &:hover, &.hover {
-    background-color: #f96964;
+    background-color: #ea3933;
   }
   &:active:hover, &.active.hover {
     background-color: #b40802;
@@ -1944,7 +1951,7 @@ button.close {
   }
 }
 
-.exchange {
+.hud {
   padding:5px;
 }
 
@@ -2270,10 +2277,12 @@ div.ag-header-cell .ag-header-cell-label i {
 }
 
 #zeroed_checkbox {
-  zoom: 200%;
-  margin-top: 2px;
+  height: 23px;
+  margin-top: 3px;
   margin-right: 20px;
   display: inline-block;
+  width: 23px;
+  margin-bottom: 11px;
 }
 
 #base_select{
@@ -2282,7 +2291,7 @@ div.ag-header-cell .ag-header-cell-label i {
   font-size: 19px;
   display: inline-block;
   position: relative;
-  top: -10px;
+  top: -6px;
   margin-right: 20px;
 }
 
@@ -2460,15 +2469,20 @@ address {
 
 .btn-default {
 	color: #008080;
-	background-color: #00ff001a;
+	background-color: #00ff0047;
 	border-color: #ccc;
-	&:hover, &:focus, &.focus, &:active, &.active {
+	&:hover, &:focus, &.focus, &:active, &.active, &.btn:first-child:active {
 	  color: #333;
 	  background-color: #00ff00;
 	  border-color: #00ff00;
 	}
 }
-  
+
+:not(.btn-check)+.btn:active {
+  color: #333;
+  background-color: #00ff00;
+  border-color: #00ff00;
+}
 
 .tradeSafetyBg {
   background: white;
@@ -2478,7 +2492,7 @@ address {
   background: white;
 }
 
-.exchange {
+.hud {
   background: white;
   border: 1px #CCC solid;
 }
@@ -2602,6 +2616,11 @@ input#filter_pattern {
   background-color: #00000024!important;
 }
 
+.radio input[type="radio"], .checkbox input[type="checkbox"] {
+  height: 20px;
+  width: 20px;
+}
+
 @keyframes entrance {
 	to, 20%, 40%, 60%, 80% { opacity: 1 }
 	from, 10%, 30%, 50%, 70%, 90% { opacity: 0 }
diff --git a/src/lib/Krypto.ninja-client/www/js/Shared.ts b/src/lib/Krypto.ninja-client/www/js/Shared.ts
index a504c2d19..e1ed8c03f 100644
--- a/src/lib/Krypto.ninja-client/www/js/Shared.ts
+++ b/src/lib/Krypto.ninja-client/www/js/Shared.ts
@@ -17,7 +17,7 @@ import {Socket, Models} from 'lib/K';
   selector: 'K',
   template: `<div>
     <div [hidden]="state.online !== null"
-      style="padding:42px;transform:rotate(-6deg);">
+      style="padding:42px;transform:rotate(-6deg);text-shadow: 1px 1px #0000009e;">
       <h4 class="text-danger text-center">
         <i class="beacon exc-{{ exchange_icon }}-s" style="font-size:69px;"></i>
         <br /><br />