Skip to content
Snippets Groups Projects
Commit df272885 authored by Nicolay Schiøll-Johansen's avatar Nicolay Schiøll-Johansen
Browse files

Updated main and explore page with css styling

parent 4ba881c4
No related branches found
No related tags found
2 merge requests!165Weekly merge to Master,!112Updated main and explore page with css styling
Pipeline #78840 passed
Stage: build
Stage: test
Hide whitespace changes
Inline Side-by-side
Showing
with 157 additions and 102 deletions
src/main/java/NTNU/IDATT1002/controllers/Explore.java
+ 2
− 2
View file @ df272885
...@@ -62,8 +62,8 @@ public class Explore implements Initializable { ...@@ -62,8 +62,8 @@ public class Explore implements Initializable {
VBox v = new VBox(); VBox v = new VBox();
v.setPrefHeight(400); v.setPrefHeight(400);
v.setPrefWidth(400); v.setPrefWidth(400);
v.setAlignment(Pos.CENTER); v.setAlignment(Pos.TOP_LEFT);
v.setStyle("-fx-background-color: #999999;"); //v.setStyle("-fx-background-color: #999999;");
//Image container //Image container
ImageView iV = new ImageView(); ImageView iV = new ImageView();
......
src/main/resources/NTNU/IDATT1002/explore.fxml
+ 77
− 58
View file @ df272885
<?xml version="1.0" encoding="UTF-8"?> <?xml version="1.0" encoding="UTF-8"?>
<?import javafx.geometry.Insets?>
<?import javafx.scene.control.Button?> <?import javafx.scene.control.Button?>
<?import javafx.scene.control.ScrollPane?> <?import javafx.scene.control.ScrollPane?>
<?import javafx.scene.control.TextField?> <?import javafx.scene.control.TextField?>
...@@ -12,70 +13,88 @@ ...@@ -12,70 +13,88 @@
<?import javafx.scene.layout.HBox?> <?import javafx.scene.layout.HBox?>
<?import javafx.scene.layout.Pane?> <?import javafx.scene.layout.Pane?>
<?import javafx.scene.layout.RowConstraints?> <?import javafx.scene.layout.RowConstraints?>
<?import javafx.scene.layout.VBox?>
<AnchorPane maxHeight="1080.0" maxWidth="1920.0" prefHeight="1080.0" prefWidth="1920.0" xmlns="http://javafx.com/javafx/11.0.1" xmlns:fx="http://javafx.com/fxml/1" fx:controller="NTNU.IDATT1002.controllers.Explore"> <VBox maxHeight="-Infinity" maxWidth="-Infinity" minHeight="-Infinity" minWidth="-Infinity" prefHeight="1080.0" prefWidth="1920.0" xmlns="http://javafx.com/javafx/11.0.1" xmlns:fx="http://javafx.com/fxml/1" fx:controller="NTNU.IDATT1002.controllers.Explore">
<children> <children>
<HBox alignment="CENTER" minHeight="100.0" prefHeight="100.0" prefWidth="1920.0" spacing="20.0" style="-fx-background-color: #0c0c0c;" AnchorPane.leftAnchor="0.0" AnchorPane.rightAnchor="0.0" AnchorPane.topAnchor="0.0"> <HBox alignment="CENTER" prefHeight="100.0" prefWidth="200.0" styleClass="tbarbg" stylesheets="@style.css">
<children> <children>
<ImageView fx:id="tbar_logo" fitHeight="69.0" fitWidth="153.0" onMouseClicked="#switchToMain" pickOnBounds="true" preserveRatio="true"> <HBox alignment="CENTER" minHeight="100.0" prefHeight="100.0" prefWidth="1920.0" spacing="20.0">
<image> <children>
<Image url="@../../Images/PlaceholderLogo.png" /> <HBox alignment="CENTER_LEFT" prefHeight="100.0" prefWidth="250.0">
</image> <children>
</ImageView> <ImageView fx:id="tbar_logo" fitHeight="69.0" fitWidth="153.0" onMouseClicked="#switchToMain" pickOnBounds="true" preserveRatio="true">
<Pane prefHeight="100.0" prefWidth="343.0" /> <image>
<TextField fx:id="tbar_search" prefHeight="25.0" prefWidth="358.0" promptText="Search: Tags, Albums, Metadata, etc..." /> <Image url="@../../Images/PlaceholderLogo.png" />
<Button fx:id="tbar_searchBtn" mnemonicParsing="false" onAction="#switchToSearch" text="SEARCH" /> </image>
<Button fx:id="tbar_explore" mnemonicParsing="false" onAction="#switchToExplore" text="EXPLORE" /> <HBox.margin>
<Button fx:id="tbar_albums" mnemonicParsing="false" onAction="#switchToAlbums" text="ALBUMS" /> <Insets />
<Button fx:id="tbar_map" mnemonicParsing="false" onAction="#switchToMap" text="MAP" /> </HBox.margin>
<Pane prefHeight="100.0" prefWidth="174.0" /> </ImageView>
<Button fx:id="tbar_upload" mnemonicParsing="false" onAction="#switchToUpload" prefHeight="25.0" prefWidth="114.0" text="UPLOAD" /> </children>
<opaqueInsets>
<Insets />
</opaqueInsets>
</HBox>
<TextField fx:id="tbar_search" focusTraversable="false" minWidth="200.0" prefHeight="35.0" prefWidth="400.0" promptText="Search: Tags, Albums, Metadata, etc...">
<HBox.margin>
<Insets />
</HBox.margin>
</TextField>
<Button fx:id="tbar_searchBtn" minWidth="70" mnemonicParsing="false" onAction="#switchToSearch" text="SEARCH" textFill="white" />
<Button fx:id="tbar_explore" minWidth="70" mnemonicParsing="false" onAction="#switchToExplore" text="EXPLORE" textFill="white" />
<Button fx:id="tbar_albums" minWidth="70" mnemonicParsing="false" onAction="#switchToAlbums" text="ALBUMS" textFill="white" />
<Button fx:id="tbar_map" minWidth="50" mnemonicParsing="false" onAction="#switchToMap" text="MAP" textFill="white" />
<HBox alignment="CENTER_RIGHT" prefHeight="100.0" prefWidth="250.0">
<children>
<Button fx:id="tbar_upload" minWidth="70" mnemonicParsing="false" onAction="#switchToUpload" prefHeight="25.0" prefWidth="114.0" text="UPLOAD" textFill="white" />
</children>
</HBox>
</children>
</HBox>
</children> </children>
</HBox> </HBox>
<ScrollPane fx:id="scrollPane" fitToWidth="true" hbarPolicy="NEVER" layoutY="100.0" prefHeight="980.0" prefWidth="1920.0" AnchorPane.bottomAnchor="0.0" AnchorPane.leftAnchor="0.0" AnchorPane.rightAnchor="0.0" AnchorPane.topAnchor="100.0"> <ScrollPane fx:id="scrollPane" fitToWidth="true" hbarPolicy="NEVER" prefHeight="980.0" prefWidth="1920.0" VBox.vgrow="ALWAYS" styleClass="scroll-pane" stylesheets="@style.css">
<content> <content>
<AnchorPane maxHeight="1920.0" minHeight="0.0" minWidth="0.0" prefHeight="2000.0" prefWidth="1920.0"> <BorderPane prefHeight="2000.0" prefWidth="1920.0" styleClass="bodybg" stylesheets="@style.css" AnchorPane.leftAnchor="0.0" AnchorPane.rightAnchor="0.0" AnchorPane.topAnchor="0.0">
<children> <top>
<BorderPane prefHeight="2000.0" prefWidth="1920.0" AnchorPane.leftAnchor="0.0" AnchorPane.rightAnchor="0.0" AnchorPane.topAnchor="0.0"> <Pane prefHeight="200.0" prefWidth="200.0" BorderPane.alignment="CENTER" />
<top> </top>
<Pane prefHeight="200.0" prefWidth="200.0" style="-fx-background-color: #6d6d6d;" BorderPane.alignment="CENTER" /> <left>
</top> <Pane prefHeight="200.0" prefWidth="200.0" BorderPane.alignment="CENTER" />
<left> </left>
<Pane prefHeight="200.0" prefWidth="200.0" style="-fx-background-color: #6d6d6d;" BorderPane.alignment="CENTER" /> <right>
</left> <Pane prefHeight="200.0" prefWidth="200.0" BorderPane.alignment="CENTER" />
<right> </right>
<Pane prefHeight="200.0" prefWidth="200.0" style="-fx-background-color: #6d6d6d;" BorderPane.alignment="CENTER" /> <center>
</right> <GridPane fx:id="gridPane" alignment="CENTER" hgap="10.0" styleClass="exploreGrid" stylesheets="@style.css" vgap="10.0" BorderPane.alignment="CENTER">
<center> <columnConstraints>
<GridPane fx:id="gridPane" alignment="CENTER" BorderPane.alignment="CENTER"> <ColumnConstraints hgrow="SOMETIMES" minWidth="10.0" prefWidth="100.0" />
<columnConstraints> <ColumnConstraints hgrow="SOMETIMES" minWidth="10.0" prefWidth="100.0" />
<ColumnConstraints hgrow="SOMETIMES" minWidth="10.0" prefWidth="100.0" /> <ColumnConstraints hgrow="SOMETIMES" minWidth="10.0" prefWidth="100.0" />
<ColumnConstraints hgrow="SOMETIMES" minWidth="10.0" prefWidth="100.0" /> </columnConstraints>
<ColumnConstraints hgrow="SOMETIMES" minWidth="10.0" prefWidth="100.0" /> <rowConstraints>
</columnConstraints> <RowConstraints minHeight="10.0" prefHeight="30.0" vgrow="SOMETIMES" />
<rowConstraints> <RowConstraints minHeight="10.0" prefHeight="30.0" vgrow="SOMETIMES" />
<RowConstraints minHeight="10.0" prefHeight="30.0" vgrow="SOMETIMES" /> <RowConstraints minHeight="10.0" prefHeight="30.0" vgrow="SOMETIMES" />
<RowConstraints minHeight="10.0" prefHeight="30.0" vgrow="SOMETIMES" /> <RowConstraints minHeight="10.0" prefHeight="30.0" vgrow="SOMETIMES" />
<RowConstraints minHeight="10.0" prefHeight="30.0" vgrow="SOMETIMES" /> <RowConstraints minHeight="10.0" prefHeight="30.0" vgrow="SOMETIMES" />
<RowConstraints minHeight="10.0" prefHeight="30.0" vgrow="SOMETIMES" /> </rowConstraints>
<RowConstraints minHeight="10.0" prefHeight="30.0" vgrow="SOMETIMES" /> </GridPane>
</rowConstraints> </center>
</GridPane> <bottom>
</center> <HBox alignment="CENTER" minHeight="200.0" prefHeight="200.0" prefWidth="1920.0" spacing="20.0" BorderPane.alignment="TOP_CENTER">
<bottom> <children>
<Pane prefHeight="150.0" prefWidth="1920.0" style="-fx-background-color: #6d6d6d;" BorderPane.alignment="CENTER"> <Button fx:id="footer_previousBtn" mnemonicParsing="false" onAction="#switchToPrevious" text="PREVIOUS" />
<children> <Button fx:id="footer_nextBtn" layoutX="944.0" layoutY="48.0" mnemonicParsing="false" onAction="#switchToNext" text="NEXT" />
<HBox alignment="CENTER" layoutY="-2.0" prefHeight="84.0" prefWidth="1920.0" spacing="20.0"> </children>
<children> <padding>
<Button fx:id="footer_previousBtn" mnemonicParsing="false" onAction="#switchToPrevious" text="PREVIOUS" /> <Insets bottom="70.0" top="10.0" />
<Button fx:id="footer_nextBtn" layoutX="944.0" layoutY="48.0" mnemonicParsing="false" onAction="#switchToNext" text="NEXT" /> </padding>
</children> </HBox>
</HBox> </bottom>
</children></Pane> </BorderPane>
</bottom>
</BorderPane>
</children></AnchorPane>
</content> </content>
</ScrollPane> </ScrollPane>
</children> </children>
</AnchorPane> </VBox>
src/main/resources/NTNU/IDATT1002/login.fxml
+ 2
− 2
View file @ df272885
...@@ -41,8 +41,8 @@ ...@@ -41,8 +41,8 @@
<RowConstraints minHeight="10.0" prefHeight="30.0" vgrow="SOMETIMES" /> <RowConstraints minHeight="10.0" prefHeight="30.0" vgrow="SOMETIMES" />
</rowConstraints> </rowConstraints>
<children> <children>
<TextField fx:id="Username" prefHeight="35.0" prefWidth="157.0" promptText="Username" GridPane.rowIndex="1" /> <TextField fx:id="Username" prefHeight="35.0" prefWidth="157.0" promptText="Username" GridPane.rowIndex="1" focusTraversable="false"/>
<PasswordField fx:id="Password" prefHeight="35.0" promptText="Password" GridPane.rowIndex="2" onKeyPressed="#enterLogin"/> <PasswordField fx:id="Password" prefHeight="35.0" promptText="Password" GridPane.rowIndex="2" onKeyPressed="#enterLogin" focusTraversable="false"/>
<HBox prefHeight="100.0" prefWidth="200.0" spacing="10.0" GridPane.rowIndex="3"> <HBox prefHeight="100.0" prefWidth="200.0" spacing="10.0" GridPane.rowIndex="3">
<children> <children>
<Button fx:id="login" onAction="#buttonLogin" prefHeight="35.0" prefWidth="69.0" text="Log In" textFill="WHITE" /> <Button fx:id="login" onAction="#buttonLogin" prefHeight="35.0" prefWidth="69.0" text="Log In" textFill="WHITE" />
......
src/main/resources/NTNU/IDATT1002/main.fxml
+ 44
− 29
View file @ df272885
<?xml version="1.0" encoding="UTF-8"?> <?xml version="1.0" encoding="UTF-8"?>
<?import javafx.geometry.Insets?>
<?import javafx.scene.control.Button?> <?import javafx.scene.control.Button?>
<?import javafx.scene.control.TextField?> <?import javafx.scene.control.TextField?>
<?import javafx.scene.image.Image?> <?import javafx.scene.image.Image?>
<?import javafx.scene.image.ImageView?> <?import javafx.scene.image.ImageView?>
<?import javafx.scene.layout.AnchorPane?>
<?import javafx.scene.layout.HBox?> <?import javafx.scene.layout.HBox?>
<?import javafx.scene.layout.Pane?>
<?import javafx.scene.layout.VBox?> <?import javafx.scene.layout.VBox?>
<?import javafx.scene.text.Font?> <?import javafx.scene.text.Font?>
<AnchorPane prefHeight="1080.0" prefWidth="1920.0" xmlns="http://javafx.com/javafx" xmlns:fx="http://javafx.com/fxml" fx:controller="NTNU.IDATT1002.controllers.Main"> <VBox prefHeight="1080.0" prefWidth="1920.0" xmlns="http://javafx.com/javafx/11.0.1" xmlns:fx="http://javafx.com/fxml/1" fx:controller="NTNU.IDATT1002.controllers.Main">
<children> <children>
<VBox prefHeight="1080.0" prefWidth="1920.0" AnchorPane.bottomAnchor="0.0" AnchorPane.leftAnchor="0.0" AnchorPane.rightAnchor="0.0" AnchorPane.topAnchor="0.0"> <HBox alignment="CENTER" prefHeight="100.0" prefWidth="200.0" styleClass="tbarbg" stylesheets="@style.css">
<children> <children>
<HBox alignment="CENTER" minHeight="100.0" prefHeight="100.0" prefWidth="1920.0" spacing="20.0" style="-fx-background-color: #0c0c0c;" AnchorPane.leftAnchor="0.0" AnchorPane.rightAnchor="0.0" AnchorPane.topAnchor="0.0"> <HBox alignment="CENTER" minHeight="100.0" prefHeight="100.0" prefWidth="1920.0" spacing="20.0">
<children> <children>
<ImageView fx:id="tbar_logo" fitHeight="69.0" fitWidth="153.0" onMouseClicked="#switchToMain" pickOnBounds="true" preserveRatio="true"> <HBox alignment="CENTER_LEFT" prefHeight="100.0" prefWidth="250.0">
<image> <children>
<Image url="@../../Images/PlaceholderLogo.png" /> <ImageView fx:id="tbar_logo" fitHeight="69.0" fitWidth="153.0" onMouseClicked="#switchToMain" pickOnBounds="true" preserveRatio="true">
</image> <image>
</ImageView> <Image url="@../../Images/PlaceholderLogo.png" />
<Pane prefHeight="100.0" prefWidth="343.0" /> </image>
<TextField fx:id="tbar_search" prefHeight="25.0" prefWidth="358.0" promptText="Search: Tags, Albums, Metadata, etc..." /> <HBox.margin>
<Button fx:id="tbar_searchBtn" mnemonicParsing="false" onAction="#switchToSearch" text="SEARCH" /> <Insets />
<Button fx:id="tbar_explore" mnemonicParsing="false" onAction="#switchToExplore" text="EXPLORE" /> </HBox.margin>
<Button fx:id="tbar_albums" mnemonicParsing="false" onAction="#switchToAlbums" text="ALBUMS" /> </ImageView>
<Button fx:id="tbar_map" mnemonicParsing="false" onAction="#switchToMap" text="MAP" /> </children>
<Pane prefHeight="100.0" prefWidth="174.0" /> <opaqueInsets>
<Button fx:id="tbar_upload" mnemonicParsing="false" onAction="#switchToUpload" prefHeight="25.0" prefWidth="114.0" text="UPLOAD" /> <Insets />
</children> </opaqueInsets>
</HBox> </HBox>
<HBox alignment="CENTER" prefHeight="982.0" prefWidth="1920.0"> <TextField fx:id="tbar_search" focusTraversable="false" minWidth="200.0" prefHeight="35.0" prefWidth="400.0" promptText="Search: Tags, Albums, Metadata, etc...">
<children> <HBox.margin>
<Button fx:id="uploadBtn" mnemonicParsing="false" onAction="#switchToUpload" text="UPLOAD"> <Insets />
<font> </HBox.margin>
<Font size="60.0" /> </TextField>
</font> <Button fx:id="tbar_searchBtn" minWidth="70" mnemonicParsing="false" onAction="#switchToSearch" text="SEARCH" textFill="white" />
</Button> <Button fx:id="tbar_explore" minWidth="70" mnemonicParsing="false" onAction="#switchToExplore" text="EXPLORE" textFill="white" />
<Button fx:id="tbar_albums" minWidth="70" mnemonicParsing="false" onAction="#switchToAlbums" text="ALBUMS" textFill="white" />
<Button fx:id="tbar_map" minWidth="50" mnemonicParsing="false" onAction="#switchToMap" text="MAP" textFill="white" />
<HBox alignment="CENTER_RIGHT" prefHeight="100.0" prefWidth="250.0">
<children>
<Button fx:id="tbar_upload" minWidth="70" mnemonicParsing="false" onAction="#switchToUpload" prefHeight="25.0" prefWidth="114.0" text="UPLOAD" textFill="white" />
</children>
</HBox>
</children> </children>
</HBox> </HBox>
</children> </children>
</VBox> </HBox>
<HBox alignment="CENTER" prefHeight="982.0" prefWidth="1920.0" styleClass="bodybg" stylesheets="@style.css" VBox.vgrow="ALWAYS">
<children>
<Button fx:id="uploadBtn" mnemonicParsing="false" onAction="#switchToUpload" stylesheets="@style.css" text="UPLOAD" textFill="WHITE">
<font>
<Font size="60.0" />
</font>
</Button>
</children>
</HBox>
</children> </children>
</AnchorPane> </VBox>
src/main/resources/NTNU/IDATT1002/signup.fxml
+ 8
− 8
View file @ df272885
...@@ -46,18 +46,18 @@ ...@@ -46,18 +46,18 @@
<RowConstraints minHeight="10.0" prefHeight="30.0" vgrow="SOMETIMES" /> <RowConstraints minHeight="10.0" prefHeight="30.0" vgrow="SOMETIMES" />
</rowConstraints> </rowConstraints>
<children> <children>
<TextField fx:id="signup_firstName" prefHeight="35.0" prefWidth="248.0" promptText="First name" GridPane.rowIndex="1" /> <TextField fx:id="signup_firstName" prefHeight="35.0" prefWidth="248.0" promptText="First name" GridPane.rowIndex="1" focusTraversable="false"/>
<TextField fx:id="signup_lastName" prefHeight="35.0" promptText="Last name" GridPane.rowIndex="2" /> <TextField fx:id="signup_lastName" prefHeight="35.0" promptText="Last name" GridPane.rowIndex="2" focusTraversable="false"/>
<TextField fx:id="signup_username" prefHeight="35.0" promptText="Username" GridPane.rowIndex="3" /> <TextField fx:id="signup_username" prefHeight="35.0" promptText="Username" GridPane.rowIndex="3" focusTraversable="false"/>
<TextField fx:id="signup_email" prefHeight="35.0" promptText="Email" GridPane.rowIndex="4" /> <TextField fx:id="signup_email" prefHeight="35.0" promptText="Email" GridPane.rowIndex="4" focusTraversable="false"/>
<PasswordField fx:id="signup_password" prefHeight="35.0" prefWidth="247.0" promptText="Password" GridPane.rowIndex="5" /> <PasswordField fx:id="signup_password" prefHeight="35.0" prefWidth="247.0" promptText="Password" GridPane.rowIndex="5" focusTraversable="false"/>
<HBox GridPane.rowIndex="6"> <HBox GridPane.rowIndex="6">
<children> <children>
<TextField fx:id="signup_phoneCode" prefHeight="35.0" prefWidth="150.0" promptText="Calling code" /> <TextField fx:id="signup_phoneCode" prefHeight="35.0" prefWidth="150.0" promptText="Calling code" focusTraversable="false"/>
<TextField fx:id="signup_phoneNr" prefHeight="35.0" prefWidth="242.0" promptText="Phone number" /> <TextField fx:id="signup_phoneNr" prefHeight="35.0" prefWidth="242.0" promptText="Phone number" focusTraversable="false"/>
</children> </children>
</HBox> </HBox>
<DatePicker fx:id="signup_birthDate" prefHeight="35.0" prefWidth="304.0" promptText="Birth date" GridPane.rowIndex="7" /> <DatePicker fx:id="signup_birthDate" prefHeight="35.0" prefWidth="304.0" promptText="Birth date" GridPane.rowIndex="7" focusTraversable="false"/>
<Text fill="WHITE" strokeType="OUTSIDE" strokeWidth="0.0" text="SIGN UP"> <Text fill="WHITE" strokeType="OUTSIDE" strokeWidth="0.0" text="SIGN UP">
<font> <font>
<Font name="System Bold" size="14.0" /> <Font name="System Bold" size="14.0" />
......
src/main/resources/NTNU/IDATT1002/style.css
+ 24
− 3
View file @ df272885
...@@ -8,16 +8,37 @@ ...@@ -8,16 +8,37 @@
-fx-background-color: #10101f; -fx-background-color: #10101f;
} }
.tbarbg{
-fx-background-color: #10101f;
}
.button{ .button{
-fx-transition-duration: 0.4s; -fx-transition-duration: 0.4s;
-fx-background-color: blank; -fx-background-color: none;
-fx-border-width: 2px; -fx-border-width: 2px;
-fx-border-color: white; -fx-border-color: #46b4fe;
-fx-color: white; -fx-text-fill: white;
} }
.button:hover{ .button:hover{
-fx-background-color: rgba(193, 198, 196, 0.5); -fx-background-color: rgba(193, 198, 196, 0.5);
-fx-color: white; -fx-color: white;
}
.tbarmenu{
}
.exploreGrid{
-fx-background-color: rgba(255, 255, 255, 0.5);
}
.exploreGridPane{
-fx-fit-to-width: true;
}
.scroll-pane{
-fx-background-color: none;
-fx-border-width: 0;
} }
\ No newline at end of file
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment