Versions Compared

Key

  • This line was added.
  • This line was removed.
  • Formatting was changed.

...

The CSS stylesheets can be found in the srcresources/dist/style/ directory of the main project. Most general-purpose elements, such as buttons, text fields and menus have their styles defined in Base.css. Styles specific to custom UI components are generally placed in separate CSS files, given the same name as the FXML file they relate to (for example, styles specific to Titlebar.fxml are defined in Titlebar.css).

...

When possible, refer to JavaFX controls (such as Button, Label, etc.) using their class name (e.g. .button rather than Button to target buttons).

Formatting

  • Use soft hard indents (spaces) set to 4 spaces per tab/indent leveltabs).
  • One selector per line.
  • Opening brace of declaration blocks go on the same line as the last selector, with a single space before it.
  • Closing brace of declaration blocks should be placed on a new line (and at the same indentation level as the selectors).
  • Declarations should be indented one level (4 spaces)
  • Each declaration gets its own line.
  • There should be a space after the : in a declaration.
  • A single empty line should be placed between rulesets.

...

Code Block
themeMidnight
languagecss
titleExample CSS
linenumberstrue
collapsetrue
/*=============================================
 * SCROLLBARS
 *=============================================*/
.scroll-bar {
    	-fx-background-color: transparent;
    	-fx-opacity: 0.5;
}

.scroll-bar .track-background, 
.scroll-bar .track {
    	-fx-background-color: transparent;
}

.scroll-bar .thumb {
    	-fx-background-radius: 2px;
    	-fx-background-color: -col-primary-trans;
}

.scroll-bar .increment-button, 
.scroll-bar .decrement-button {
    	-fx-background-color: transparent;
    	-fx-padding: 0;
}

.scroll-bar:horizontal .increment-arrow, 
.scroll-bar:horizontal .decrement-arrow {
    	-fx-background-color: transparent;
    
    	/* Overall scrollbar height is set by the button's padding */
    	-fx-padding: 15px 0 0 0;
}

...