From da423152fcec2752fe996d13a9290153e563e148 Mon Sep 17 00:00:00 2001
From: Dmitry Isaenko <developer.su@gmail.com>
Date: Fri, 24 May 2019 01:54:04 +0300
Subject: [PATCH] CSS updates

---
 README.md                                     |   8 +-
 .../FXML/Settings/SettingsLayout.fxml         |   4 +-
 src/main/resources/FXML/landingPage.fxml      |  14 +-
 src/main/resources/res/app_light.css          | 240 ++++++++++++------
 4 files changed, 176 insertions(+), 90 deletions(-)

diff --git a/README.md b/README.md
index a8c0c0a..8a28417 100644
--- a/README.md
+++ b/README.md
@@ -12,10 +12,10 @@ Deep WIP multi-tool to work with XCI/NSP/NCA/NRO(?) files
 * [OpenJFX](https://wiki.openjdk.java.net/display/OpenJFX/Main)
 * Few icons taken from: [materialdesignicons.com](http://materialdesignicons.com/)
 
+### Information taken from
+* Switch brew wiki
+* roothorick, shchmue, He and others advices and notes. Thanks!
+
 ### System requirements
 
 JRE/JDK 8u60 or higher.
-
-### Thanks
-
-TBD
\ No newline at end of file
diff --git a/src/main/resources/FXML/Settings/SettingsLayout.fxml b/src/main/resources/FXML/Settings/SettingsLayout.fxml
index b6826b7..6dd613d 100644
--- a/src/main/resources/FXML/Settings/SettingsLayout.fxml
+++ b/src/main/resources/FXML/Settings/SettingsLayout.fxml
@@ -34,7 +34,7 @@
                               <Label disable="true" text="Length should be 32 symbols" wrapText="true" />
                               <Separator prefWidth="200.0" />
                               <Label text="Used for NCA" />
-                              <Button fx:id="importKeysBtn" contentDisplay="TOP" mnemonicParsing="false" text="Import from prod.keys">
+                              <Button fx:id="importKeysBtn" mnemonicParsing="false" text="Import from prod.keys">
                                  <graphic>
                                     <SVGPath content="M1,12H10.76L8.26,9.5L9.67,8.08L14.59,13L9.67,17.92L8.26,16.5L10.76,14H1V12M19,3C20.11,3 21,3.9 21,5V19A2,2 0 0,1 19,21H5C3.89,21 3,20.1 3,19V16H5V19H19V7H5V10H3V5A2,2 0 0,1 5,3H19Z" />
                                  </graphic>
@@ -87,7 +87,7 @@
                            </padding>
                            <children>
                               <Label text="Title Keys" />
-                              <Button fx:id="importTitleKeysBtn" contentDisplay="TOP" mnemonicParsing="false" text="Import from title.keys">
+                              <Button fx:id="importTitleKeysBtn" mnemonicParsing="false" text="Import from title.keys">
                                  <graphic>
                                     <SVGPath content="M1,12H10.76L8.26,9.5L9.67,8.08L14.59,13L9.67,17.92L8.26,16.5L10.76,14H1V12M19,3C20.11,3 21,3.9 21,5V19A2,2 0 0,1 19,21H5C3.89,21 3,20.1 3,19V16H5V19H19V7H5V10H3V5A2,2 0 0,1 5,3H19Z" />
                                  </graphic>
diff --git a/src/main/resources/FXML/landingPage.fxml b/src/main/resources/FXML/landingPage.fxml
index aebe046..6afc277 100644
--- a/src/main/resources/FXML/landingPage.fxml
+++ b/src/main/resources/FXML/landingPage.fxml
@@ -14,29 +14,29 @@
 <?import javafx.scene.layout.VBox?>
 <?import javafx.scene.shape.SVGPath?>
 
-<AnchorPane xmlns="http://javafx.com/javafx/8.0.141" xmlns:fx="http://javafx.com/fxml/1" fx:controller="konogonka.Controllers.MainController">
+<AnchorPane xmlns="http://javafx.com/javafx/8.0.171" xmlns:fx="http://javafx.com/fxml/1" fx:controller="konogonka.Controllers.MainController">
    <children>
       <VBox layoutX="10.0" layoutY="10.0" spacing="5.0" AnchorPane.bottomAnchor="0.0" AnchorPane.leftAnchor="0.0" AnchorPane.rightAnchor="0.0" AnchorPane.topAnchor="0.0">
          <children>
-            <ToolBar prefHeight="40.0" prefWidth="200.0">
+            <ToolBar>
                <items>
-                  <Button contentDisplay="TOP" mnemonicParsing="false" onAction="#selectFilesBtnAction" text="%btnFileOpen">
+                  <Button contentDisplay="TOP" minHeight="-Infinity" minWidth="100.0" mnemonicParsing="false" onAction="#selectFilesBtnAction" prefHeight="55.0" text="%btnFileOpen">
                      <graphic>
                         <SVGPath content="M12,10L8,14H11V20H13V14H16M19,4H5C3.89,4 3,4.9 3,6V18A2,2 0 0,0 5,20H9V18H5V8H19V18H15V20H19A2,2 0 0,0 21,18V6A2,2 0 0,0 19,4Z" />
                      </graphic>
                   </Button>
-                  <Button fx:id="analyzeBtn" contentDisplay="TOP" disable="true" mnemonicParsing="false" text="%btnAnalyze">
+                  <Button fx:id="analyzeBtn" contentDisplay="TOP" disable="true" minHeight="-Infinity" minWidth="100.0" mnemonicParsing="false" prefHeight="55.0" text="%btnAnalyze">
                      <graphic>
                         <SVGPath content="M7,2V13H10V22L17,10H13L17,2H7Z" />
                      </graphic>
                   </Button>
                   <Pane prefWidth="15.0" />
-                  <Button fx:id="settingsBtn" contentDisplay="TOP" mnemonicParsing="false" text="%btnSettings">
+                  <Button fx:id="settingsBtn" contentDisplay="TOP" minHeight="-Infinity" minWidth="100.0" mnemonicParsing="false" prefHeight="55.0" text="%btnSettings">
                      <graphic>
                         <SVGPath content="M12,15.5A3.5,3.5 0 0,1 8.5,12A3.5,3.5 0 0,1 12,8.5A3.5,3.5 0 0,1 15.5,12A3.5,3.5 0 0,1 12,15.5M19.43,12.97C19.47,12.65 19.5,12.33 19.5,12C19.5,11.67 19.47,11.34 19.43,11L21.54,9.37C21.73,9.22 21.78,8.95 21.66,8.73L19.66,5.27C19.54,5.05 19.27,4.96 19.05,5.05L16.56,6.05C16.04,5.66 15.5,5.32 14.87,5.07L14.5,2.42C14.46,2.18 14.25,2 14,2H10C9.75,2 9.54,2.18 9.5,2.42L9.13,5.07C8.5,5.32 7.96,5.66 7.44,6.05L4.95,5.05C4.73,4.96 4.46,5.05 4.34,5.27L2.34,8.73C2.21,8.95 2.27,9.22 2.46,9.37L4.57,11C4.53,11.34 4.5,11.67 4.5,12C4.5,12.33 4.53,12.65 4.57,12.97L2.46,14.63C2.27,14.78 2.21,15.05 2.34,15.27L4.34,18.73C4.46,18.95 4.73,19.03 4.95,18.95L7.44,17.94C7.96,18.34 8.5,18.68 9.13,18.93L9.5,21.58C9.54,21.82 9.75,22 10,22H14C14.25,22 14.46,21.82 14.5,21.58L14.87,18.93C15.5,18.67 16.04,18.34 16.56,17.94L19.05,18.95C19.27,19.03 19.54,18.95 19.66,18.73L21.66,15.27C21.78,15.05 21.73,14.78 21.54,14.63L19.43,12.97Z" />
                      </graphic>
                   </Button>
-                  <Button contentDisplay="TOP" mnemonicParsing="false" onAction="#showHideLogs" text="%btnLogShow">
+                  <Button contentDisplay="TOP" minHeight="-Infinity" minWidth="100.0" mnemonicParsing="false" onAction="#showHideLogs" prefHeight="55.0" text="%btnLogShow">
                      <graphic>
                         <SVGPath content="M17,11H15V9H17M13,11H11V9H13M9,11H7V9H9M20,2H4A2,2 0 0,0 2,4V22L6,18H20A2,2 0 0,0 22,16V4C22,2.89 21.1,2 20,2Z" />
                      </graphic>
@@ -45,7 +45,7 @@
             </ToolBar>
             <SplitPane fx:id="splitPane" dividerPositions="0.5" VBox.vgrow="ALWAYS">
                <items>
-                  <TabPane fx:id="tabPane" side="LEFT" tabClosingPolicy="UNAVAILABLE">
+                  <TabPane fx:id="tabPane" side="LEFT" tabClosingPolicy="UNAVAILABLE" tabMinHeight="35.0" tabMinWidth="25.0" >
                     <tabs>
                       <Tab closable="false">
                            <content>
diff --git a/src/main/resources/res/app_light.css b/src/main/resources/res/app_light.css
index 9d0581d..c24805e 100644
--- a/src/main/resources/res/app_light.css
+++ b/src/main/resources/res/app_light.css
@@ -2,64 +2,70 @@
     src: url("NotoMono-Regular.ttf");
 }
 .root{
-    -fx-background: #ebebeb;
+    -fx-background: #f5f5f5;
 }
 
-.button, .buttonUp, .buttonStop, .buttonSelect{
-    -fx-background-color: #fefefe;
-    -fx-border-color: #fefefe;
-    -fx-border-radius: 3;
-    -fx-border-width: 2;
-    -fx-text-fill: #2c2c2c;
-    -fx-effect: dropshadow(three-pass-box, #b4b4b4, 2, 0, 0, 0);
-    
+.button SVGPath{
+    -fx-fill: #0f0f0f;
 }
-.button:hover, .buttonStop:hover, .buttonUp:hover, .choice-box:hover, .button:focused:hover, .buttonStop:focused:hover, .buttonUp:focused:hover, .buttonSelect:focused:hover, .choice-box:focused:hover{
-    -fx-background-color: #fefefe;
-    -fx-border-color: #00caca;
-    -fx-border-radius: 3;
+
+.button:hover SVGPath, .choice-box:hover SVGPath, .button:focused:hover SVGPath, .choice-box:focused:hover SVGPath, .button:pressed SVGPath, .button:pressed:hover SVGPath{
+    -fx-fill: #ffffff;
+}
+.button{
+    -fx-background-color: #ffffff;
+    -fx-border-color: #0d98ba;
+    -fx-background-radius: 5;
+    -fx-border-radius: 2;
     -fx-border-width: 2;
     -fx-text-fill: #2c2c2c;
 }
-.button:focused, .buttonStop:focused, .buttonUp:focused, .buttonSelect:focused, .choice-box:focused{
-    -fx-background-color: #cccccc;
-    -fx-border-color: #cccccc;
+
+.button:disabled SVGPath{
+    -fx-fill: #bbbbbb;
+}
+.button:disabled {
+    -fx-opacity: 1.0 ;
+    -fx-background-color: #959595;
+    -fx-border-color: #959595;
+    -fx-background-radius: 5;
+    -fx-border-radius: 5;
+    -fx-border-width: 2;
+    -fx-text-fill: #bbbbbb;
+}
+
+.button:hover, .choice-box:hover, .button:focused:hover, .choice-box:focused:hover{
+    -fx-background-color: #0d98ba;
+    -fx-border-color: #0d98ba;
+    -fx-background-radius: 5;
+    -fx-border-radius: 5;
+    -fx-border-width: 2;
+    -fx-text-fill: #ffffff;
+}
+.button:focused, .choice-box:focused{
+    -fx-background-color: #d0d0d0;
+    -fx-border-color: #0d98ba;
+    -fx-background-radius: 5;
+    -fx-border-radius: 5;
+    -fx-border-width: 2;
+    -fx-text-fill: #2c2c2c;
 }
 
 .button:pressed, .button:pressed:hover{
-    -fx-background-color: #fefefe;
-    -fx-border-color: #e82382;
-    -fx-border-radius: 3;
+    -fx-background-color: #007cad;
+    -fx-border-color: #007cad;
+    -fx-background-radius: 5;
+    -fx-border-radius: 5;
     -fx-border-width: 2;
-    -fx-text-fill: #2c2c2c;
-}
-.buttonSelect:pressed, .buttonSelect:pressed:hover{
-    -fx-background-color: #fefefe;
-    -fx-border-color: #289de8;
-    -fx-border-radius: 3;
-    -fx-border-width: 2;
-    -fx-text-fill: #2c2c2c;
-}
-.buttonUp:pressed, .buttonUp:pressed:hover{
-    -fx-background-color: #fefefe;
-    -fx-border-color: #a2e019;
-    -fx-border-radius: 3;
-    -fx-border-width: 2;
-    -fx-text-fill: #2c2c2c;
-}
-.buttonStop:pressed, .buttonStop:pressed:hover{
-    -fx-background-color: #fefefe;
-    -fx-border-color: #fb582c;
-    -fx-border-radius: 3;
-    -fx-border-width: 2;
-    -fx-text-fill: #2c2c2c;
+    -fx-text-fill: #ffffff;
 }
 // -========================+ TextArea =====================-
 .text-area{
     -fx-background-color: transparent;
     -fx-control-inner-background: #fefefe;
     -fx-font-family: "Noto Mono";
-    -fx-border-color: #06b9bb;
+    -fx-background-radius: 3;
+    -fx-border-color: #ffdab9;
     -fx-border-radius: 3;
     -fx-border-width: 2;
     -fx-text-fill: #2c2c2c;
@@ -85,7 +91,7 @@
     -fx-background-color: #fefefe;
 }
 .dialog-pane > .button-bar > .container{
-    -fx-background-color: #ebebeb;
+    -fx-background-color: #f5f5f5;
 }
 
 .dialog-pane > .label{
@@ -107,7 +113,7 @@
     -fx-border-radius: 3;
     -fx-border-width: 2;
     -fx-mark-color: #eea11e;
-    -fx-effect: dropshadow(three-pass-box, #b4b4b4, 2, 0, 0, 0);
+    -fx-effect: dropshadow(three-pass-box, #414a4c, 2, 0, 0, 0);
 }
 .choice-box > .label {
     -fx-text-fill: #2c2c2c;
@@ -136,33 +142,34 @@
 }
 
 // -======================== TAB PANE =========================-
+/*
 .tab-pane .tab SVGPath{
     -fx-fill: #2c2c2c;                                      // OK
 }
 .tab-pane .tab:selected SVGPath{
-    -fx-fill: #289de8;                                      // OK
+    -fx-fill: #1dacd6;                                      // OK
 }
 .tab-pane .tab{
     -fx-background-color: #fefefe;                          //ok
     -fx-focus-color: transparent;
     -fx-faint-focus-color: transparent;
     -fx-border-radius: 0 0 0 0;
-    -fx-border-width: 3 0 0 0;
+    -fx-border-width: 0 0 1 0;
     -fx-border-color: #fefefe;                               //OK
 }
 
 .tab-pane .tab:selected{
-    -fx-background-color: #ebebeb;                          // OK
+    -fx-background-color: #ffefd5;                          // OK
     -fx-focus-color: transparent;
     -fx-faint-focus-color: transparent;
     -fx-border-radius: 0 0 0 0;
-    -fx-border-width: 3 0 0 0;
-    -fx-border-color: #289de8;                              // OK
+    -fx-border-width: 0 0 1 0;
+    -fx-border-color: #9aceeb;                              // OK
 }
 
 .tab-pane > .tab-header-area {
     -fx-background-insets: 0.0;
-    -fx-padding: 5 5 5 5;
+    -fx-padding: 5 5 5 5 ;
 }
 
 .tab-pane > .tab-header-area > .tab-header-background
@@ -173,13 +180,64 @@
 .tab-pane > .tab-header-area > .headers-region > .tab {
     -fx-padding: 10;
 }
+*/
+// -======================== TAB PANE =========================-
+.tab-pane .tab SVGPath{
+    -fx-fill: #2c2c2c;                                      // OK
+}
+.tab-pane .tab:selected SVGPath{
+    -fx-fill: #1dacd6;                                      // OK
+}
+
+.tab-pane .tab .label{
+    -fx-text-fill: #2c2c2c;
+}
+.tab-pane .tab{
+    -fx-background-color: #f5f5f5;                          //ok
+    -fx-focus-color: transparent;
+    -fx-faint-focus-color: transparent;
+    -fx-background-radius: 5;
+}
+.tab-pane .tab:selected .label{
+    -fx-text-fill: #ffffff;
+}
+.tab-pane .tab:selected{
+    -fx-background-color: #007cad;                          // OK
+    -fx-focus-color: transparent;
+    -fx-faint-focus-color: transparent;
+    -fx-background-radius: 5;
+}
+.tab-pane .tab:hover .label{
+    -fx-text-fill: #ffffff;
+}
+.tab-pane .tab:hover{
+    -fx-background-color: #0d98ba;                          // OK
+    -fx-focus-color: transparent;
+    -fx-faint-focus-color: transparent;
+    -fx-background-radius: 5;
+}
+.tab-pane > .tab-header-area {
+    -fx-background-insets: 0.0;
+    -fx-padding: 5 5 5 5 ;
+}
+
+.tab-pane > .tab-header-area > .tab-header-background
+{
+   -fx-background-color: #f5f5f5;                       // OK
+   -fx-border-width: 0 0 1 0;
+   -fx-border-color: #959595;                              // OK
+}
+.tab-pane > .tab-header-area > .headers-region > .tab {
+    -fx-padding: 10;
+}
 // -=========================== TABLE ======================-
 .table-view {
     -fx-background-color: #fefefe;
     -fx-background-image: url(app_logo.png);
     -fx-background-position: center;
     -fx-background-repeat: no-repeat;
-    -fx-border-color: #06b9bb;
+    -fx-background-radius: 3;
+    -fx-border-color: #ffdab9;
     -fx-border-radius: 3;
     -fx-border-width: 2;
 }
@@ -203,7 +261,7 @@
     -fx-text-fill: #2c2c2c;
 }
 .table-row-cell, .table-row-cell:filled:selected, .table-row-cell:selected{
-    -fx-background-color: -fx-table-cell-border-color, #d3fffd;
+    -fx-background-color: -fx-table-cell-border-color, #f0fff0;
     -fx-background-insets: 0, 0 0 1 0;
     -fx-padding: 0.0em; /* 0 */
     -fx-table-cell-border-color: #b0b0b0;
@@ -251,40 +309,68 @@
     -fx-border-width: 1;
 }
 .customTitleGrid {
-    -fx-background-color: #191919, #d3fffd;
+    -fx-background-color: #191919, #f0fff0;
     -fx-background-insets: 0, 1;
 }
 .customGrid {
     -fx-background-color: #191919, #f0f0f0;
     -fx-background-insets: 0, 1;
 }
-
-.regionUpload{
-    -fx-shape: "M8,21V19H16V21H8M8,17V15H16V17H8M8,13V11H16V13H8M19,9H5L12,2L19,9Z";
-    -fx-background-color: #a2e019;
-    -size: 24;
-    -fx-min-height: -size;
-    -fx-min-width: 20;
+// -======================== Titiled Pane ========================-
+.titled-pane
+{
+    -fx-text-fill: #000000;
 }
 
-.regionStop{
-    -fx-shape: "M12,2C17.53,2 22,6.47 22,12C22,17.53 17.53,22 12,22C6.47,22 2,17.53 2,12C2,6.47 6.47,2 12,2M15.59,7L12,10.59L8.41,7L7,8.41L10.59,12L7,15.59L8.41,17L12,13.41L15.59,17L17,15.59L13.41,12L17,8.41L15.59,7Z";
-    -fx-background-color: #fb582c;
-    -size: 24;
-    -fx-min-height: -size;
-    -fx-min-width: -size;
+.titled-pane:focused
+{
+    -fx-text-fill: white;
 }
 
-.regionLamp {
-    -fx-shape: "M12,2A7,7 0 0,0 5,9C5,11.38 6.19,13.47 8,14.74V17A1,1 0 0,0 9,18H15A1,1 0 0,0 16,17V14.74C17.81,13.47 19,11.38 19,9A7,7 0 0,0 12,2M9,21A1,1 0 0,0 10,22H14A1,1 0 0,0 15,21V20H9V21Z";
-    -fx-background-color: #2c2c2c;
-    -size: 17.5;
-    -fx-min-height: -size;
-    -fx-min-width: 12.5;
+.titled-pane > .title
+{
+    -fx-background-color: #fff8e7;
+    -fx-background-insets: 0, 1, 2;
+    -fx-background-radius: 5 5 0 0, 4 4 0 0, 3 3 0 0;
+    -fx-padding: 3 11 5 11;
+    -fx-border-width: 1;
+    -fx-border-radius: 5 5 0 0, 4 4 0 0, 3 3 0 0;
+    -fx-border-color: #c8c8c8;
 }
-.regionUpdatesCheck {
-    -fx-shape: "M19,8L15,12H18A6,6 0 0,1 12,18C11,18 10.03,17.75 9.2,17.3L7.74,18.76C8.97,19.54 10.43,20 12,20A8,8 0 0,0 20,12H23M6,12A6,6 0 0,1 12,6C13,6 13.97,6.25 14.8,6.7L16.26,5.24C15.03,4.46 13.57,4 12,4A8,8 0 0,0 4,12H1L5,16L9,12";
-    -fx-background-color: #2c2c2c;
-    -size: 17.5;
-    -fx-min-width: -size;
+
+.titled-pane:focused > .title
+{
+    -fx-background-color: #d5713f;
+    -fx-background-insets: 0, 1, 2;
+    -fx-background-radius: 5 5 0 0, 4 4 0 0, 3 3 0 0;
+    -fx-padding: 3 11 5 11;
+    -fx-border-width: 1;
+    -fx-border-radius: 5 5 0 0, 4 4 0 0, 3 3 0 0;
+    -fx-border-color: #c8c8c8;
+}
+
+.titled-pane > .title > .arrow-button
+{
+    -fx-background-color: transparent;
+    -fx-background-insets: 0;
+    -fx-background-radius: 0;
+    -fx-padding:  0 3 0 0;
+}
+
+.titled-pane > .title > .arrow-button .arrow
+{
+    -fx-background-color: #575757, #575757;
+    -fx-background-insets: 1 0 -1 0, 0;
+    -fx-padding: 3 3.75 3 3.75;
+    -fx-shape: "M 0 0 h 7 l -3.5 4 z";
+}
+
+.titled-pane:collapsed > .title > .arrow-button .arrow
+{
+    -fx-rotate: -90;
+}
+
+.titled-pane:focused > .title > .arrow-button .arrow
+{
+    -fx-background-color: white, white;
 }
\ No newline at end of file