ADD::added style to some buttons

EDIT::changed travel pane from anchor pane to scroll pane
This commit is contained in:
Sem van der Hoeven
2019-03-25 15:45:31 +01:00
parent 987acbad71
commit 521426ac16
3 changed files with 29 additions and 19 deletions

View File

@@ -7,6 +7,7 @@ import javafx.event.ActionEvent;
import javafx.fxml.FXML;
import javafx.scene.control.Button;
import javafx.scene.control.Label;
import javafx.scene.control.ScrollPane;
import javafx.scene.control.Slider;
import javafx.scene.layout.AnchorPane;
import org.springframework.beans.factory.annotation.Autowired;
@@ -30,7 +31,7 @@ public class CalculatorController {
@FXML
private AnchorPane getStartedPane;
@FXML
private AnchorPane travelPane;
private ScrollPane travelPane;
@FXML
private AnchorPane homePane;
@FXML
@@ -47,6 +48,8 @@ public class CalculatorController {
private Label annualIncomeLabel;
@FXML
private Button saveButton;
@FXML
private Button getStartedNextButton;
public void initialize() {
peopleInHouseholdSLider.setSnapToTicks(true);

View File

@@ -14,7 +14,7 @@
<children>
<AnchorPane fx:id="calculatorTabs" prefHeight="85.0" prefWidth="820.0" style="-fx-background-color: #677069;">
<children>
<Button fx:id="calculatorGetStartedButton" contentDisplay="TOP" layoutX="188.0" layoutY="5.0" mnemonicParsing="false" onAction="#displayGetStarted" style="-fx-padding: 0px 0px 0px 0px;" text="Get started" textFill="#d4ddd6" AnchorPane.leftAnchor="188.0">
<Button fx:id="calculatorGetStartedButton" contentDisplay="TOP" layoutX="188.0" layoutY="5.0" mnemonicParsing="false" onAction="#displayGetStarted" style="-fx-padding: 0px 0px 0px 0px;" styleClass="navButton" text="Get started" textFill="#d4ddd6" AnchorPane.leftAnchor="188.0">
<font>
<Font name="Corbel Bold" size="16.0" />
</font>
@@ -30,7 +30,7 @@
</ImageView>
</graphic>
</Button>
<Button fx:id="calculatorTravelButton" contentDisplay="TOP" layoutX="273.0" layoutY="5.0" mnemonicParsing="false" onAction="#displayTravel" prefWidth="79.0" style="-fx-padding: 0px 0px 0px 0px;" text="Travel" textFill="#d4ddd6" AnchorPane.leftAnchor="273.0">
<Button fx:id="calculatorTravelButton" contentDisplay="TOP" layoutX="273.0" layoutY="5.0" mnemonicParsing="false" onAction="#displayTravel" prefWidth="79.0" style="-fx-padding: 0px 0px 0px 0px;" styleClass="navButton" text="Travel" textFill="#d4ddd6" AnchorPane.leftAnchor="273.0">
<font>
<Font name="Corbel Bold" size="16.0" />
</font>
@@ -47,7 +47,7 @@
</ImageView>
</graphic>
</Button>
<Button fx:id="calculatorHomeButton" contentDisplay="TOP" layoutX="358.0" layoutY="5.0" mnemonicParsing="false" onAction="#displayHome" prefWidth="79.0" style="-fx-padding: 0px 0px 0px 0px;" text="Home" textFill="#d4ddd6" AnchorPane.leftAnchor="358.0">
<Button fx:id="calculatorHomeButton" contentDisplay="TOP" layoutX="358.0" layoutY="5.0" mnemonicParsing="false" onAction="#displayHome" prefWidth="79.0" style="-fx-padding: 0px 0px 0px 0px;" styleClass="navButton" text="Home" textFill="#d4ddd6" AnchorPane.leftAnchor="358.0">
<font>
<Font name="Corbel Bold" size="16.0" />
</font>
@@ -64,7 +64,7 @@
</ImageView>
</graphic>
</Button>
<Button fx:id="calculatorFoodButton" contentDisplay="TOP" layoutX="443.0" layoutY="5.0" mnemonicParsing="false" onAction="#displayFood" prefWidth="79.0" style="-fx-padding: 0px 0px 0px 0px;" text="Food" textFill="#d4ddd6" AnchorPane.leftAnchor="443.0">
<Button fx:id="calculatorFoodButton" contentDisplay="TOP" layoutX="443.0" layoutY="5.0" mnemonicParsing="false" onAction="#displayFood" prefWidth="79.0" style="-fx-padding: 0px 0px 0px 0px;" styleClass="navButton" text="Food" textFill="#d4ddd6" AnchorPane.leftAnchor="443.0">
<font>
<Font name="Corbel Bold" size="16.0" />
</font>
@@ -81,7 +81,7 @@
</ImageView>
</graphic>
</Button>
<Button fx:id="calculatorShoppingButton" contentDisplay="TOP" layoutX="528.0" layoutY="5.0" mnemonicParsing="false" onAction="#displayShopping" prefWidth="79.0" style="-fx-padding: 0px 0px 0px 0px;" text="Shopping" textFill="#d4ddd6" AnchorPane.leftAnchor="528.0">
<Button fx:id="calculatorShoppingButton" contentDisplay="TOP" layoutX="528.0" layoutY="5.0" mnemonicParsing="false" onAction="#displayShopping" prefHeight="81.0" prefWidth="79.0" style="-fx-padding: 0px 0px 0px 0px;" styleClass="navButton" text="Shopping" textFill="#d4ddd6" AnchorPane.leftAnchor="528.0">
<font>
<Font name="Corbel Bold" size="16.0" />
</font>
@@ -98,7 +98,10 @@
</ImageView>
</graphic>
</Button>
<Button fx:id="saveButton" layoutX="702.0" layoutY="30.0" mnemonicParsing="false" text="Save" />
<Button fx:id="saveButton" layoutX="702.0" layoutY="24.0" mnemonicParsing="false" text="Save">
<font>
<Font size="17.0" />
</font></Button>
</children>
</AnchorPane>
<AnchorPane fx:id="getStartedPane" layoutY="85.0" prefHeight="618.0" prefWidth="820.0" AnchorPane.leftAnchor="0.0">
@@ -132,8 +135,9 @@
<Insets />
</opaqueInsets>
</Label>
<Button fx:id="getStartedNextButton" layoutX="383.0" layoutY="406.0" mnemonicParsing="false" onAction="#displayTravel" styleClass="nextButton" text="Next" />
</children></AnchorPane>
<AnchorPane fx:id="travelPane" layoutY="85.0" prefHeight="618.0" prefWidth="820.0" visible="false" />
<ScrollPane fx:id="travelPane" layoutY="85.0" prefHeight="618.0" prefWidth="820.0" visible="false" />
<AnchorPane fx:id="homePane" layoutY="85.0" prefHeight="618.0" prefWidth="820.0" visible="false" />
<AnchorPane fx:id="foodPane" layoutY="85.0" prefHeight="618.0" prefWidth="820.0" visible="false" />
<AnchorPane fx:id="shoppingPane" layoutY="85.0" prefHeight="618.0" prefWidth="820.0" visible="false" />

View File

@@ -1,27 +1,28 @@
/*#calculatorShoppingButton:hover {*/
/*-fx-background-color: red;*/
/*}*/
/*#calculatorGetStartedButton:pressed {*/
/*-fx-background-color: red;*/
/*-fx-border-color: #677069;*/
/*}*/
#calculatorTabs .button {
#calculatorTabs .navButton {
-fx-background-color: transparent;
-fx-font-size: 16px;
}
#calculatorTabs .button:pressed {
#calculatorTabs .navButton:pressed {
-fx-border-color: #677069;
}
#calculatorTabs .button:hover {
#calculatorTabs .navButton:hover {
-fx-background-color: #707a72;
}
#calculatorTabs #saveButton {
-fx-background-color: #89a888;
-fx-font-size: 16px;
-fx-font-weight: regular;
}
.root {
.nextButton {
-fx-background-color: #89a888;
-fx-font-size: 16px;
-fx-font-family: Corbel;
}
.nextButton:hover {
-fx-background-color: #9ec19c;
}
.slider {
-show-value-on-interaction: true;
@@ -30,3 +31,5 @@