Skip to content

Commit

Permalink
Fix display of radio buttons (#4411)
Browse files Browse the repository at this point in the history 
Previously, unchecked radio buttons were not displayed.
  • Loading branch information
@tobiasdiez @Siedlerchr
tobiasdiez authored and Siedlerchr committed Oct 26, 2018
1 parent 3d8570b commit d65ca33
Show file tree
Hide file tree
Showing 2 changed files with 96 additions and 45 deletions.
22 changes: 21 additions & 1 deletion src/main/java/org/jabref/gui/Base.css
View file
Original file line number Diff line number Diff line change
Expand Up @@ -391,12 +391,32 @@
}

.check-box > .box > .mark {
-fx-background-color: white;
-fx-background-color: -fx-control-inner-background;
-fx-padding: 0.2em 0.2em 0.2em 0.2em;
-fx-shape: "M6.61 11.89L3.5 8.78 2.44 9.84 6.61 14l8.95-8.95L14.5 4z";
-fx-stroke-width: 5;
}

.radio-button > .radio {
-fx-background-radius: 1.0em; /* large value to make sure this remains circular */
-fx-padding: 0.35em; /* padding from outside edge to the inner dot */
-fx-background-color: rgba(0, 0, 0, 0.54), -fx-control-inner-background;
-fx-background-insets: 0, 2px;
}

.radio-button:selected > .radio {
-fx-background-color: -jr-checked, -fx-background;
}

.radio-button > .radio > .dot {
-fx-padding: 0.25em; /* radius of the inner dot when selected */
-fx-background-insets: 0;
}

.radio-button:selected > .radio > .dot {
-fx-background-color: -jr-checked;
}

.menu-bar {
-fx-background-color: -jr-menu-background;
-fx-background-insets: 0;
Expand Down
119 changes: 75 additions & 44 deletions src/main/java/org/jabref/styletester/StyleTester.fxml
View file
Original file line number Diff line number Diff line change
Expand Up @@ -28,147 +28,178 @@
<?import javafx.scene.control.ToggleGroup?>
<?import javafx.scene.input.KeyCodeCombination?>
<?import javafx.scene.layout.AnchorPane?>
<?import javafx.scene.layout.ColumnConstraints?>
<?import javafx.scene.layout.FlowPane?>
<?import javafx.scene.layout.GridPane?>
<?import javafx.scene.layout.HBox?>
<?import javafx.scene.layout.RowConstraints?>
<?import javafx.scene.layout.VBox?>
<?import org.jabref.gui.icon.JabRefIconView?>
<AnchorPane xmlns:fx="http://javafx.com/fxml/1" prefHeight="600.0" prefWidth="900.0"
xmlns="http://javafx.com/javafx/8.0.121" fx:controller="org.jabref.styletester.StyleTesterView">

<AnchorPane prefHeight="600.0" prefWidth="900.0" xmlns="http://javafx.com/javafx/8.0.121"
xmlns:fx="http://javafx.com/fxml/1" fx:controller="org.jabref.styletester.StyleTesterView">
<TabPane AnchorPane.bottomAnchor="0.0" AnchorPane.leftAnchor="0.0" AnchorPane.rightAnchor="0.0"
AnchorPane.topAnchor="0.0">
<Tab text="Buttons">
<GridPane vgap="16" hgap="32" style="-fx-padding: 20 30 20 30;">
<Label GridPane.rowIndex="0" GridPane.columnIndex="0" GridPane.columnSpan="6">Normal buttons:</Label>
<Button text="Normal" GridPane.rowIndex="1" GridPane.columnIndex="0">
<GridPane hgap="32" style="-fx-padding: 20 30 20 30;" vgap="16">
<Label GridPane.columnIndex="0" GridPane.columnSpan="6" GridPane.rowIndex="0">Normal buttons:</Label>
<Button text="Normal" GridPane.columnIndex="0" GridPane.rowIndex="1">
<graphic>
<JabRefIconView glyph="ADD_NOBOX"/>
</graphic>
</Button>
<Button text="Hover" fx:id="normalButtonHover" GridPane.rowIndex="1" GridPane.columnIndex="1">
<Button fx:id="normalButtonHover" text="Hover" GridPane.columnIndex="1" GridPane.rowIndex="1">
<graphic>
<JabRefIconView glyph="ADD_NOBOX"/>
</graphic>
</Button>
<Button text="Pressed" fx:id="normalButtonPressed" GridPane.rowIndex="1" GridPane.columnIndex="2">
<Button fx:id="normalButtonPressed" text="Pressed" GridPane.columnIndex="2" GridPane.rowIndex="1">
<graphic>
<JabRefIconView glyph="ADD_NOBOX"/>
</graphic>
</Button>
<Button text="Focused" fx:id="normalButtonFocused" GridPane.rowIndex="1" GridPane.columnIndex="3">
<Button fx:id="normalButtonFocused" text="Focused" GridPane.columnIndex="3" GridPane.rowIndex="1">
<graphic>
<JabRefIconView glyph="ADD_NOBOX"/>
</graphic>
</Button>
<Button disable="true" text="Disabled" GridPane.rowIndex="1" GridPane.columnIndex="4">
<Button disable="true" text="Disabled" GridPane.columnIndex="4" GridPane.rowIndex="1">
<graphic>
<JabRefIconView glyph="ADD_NOBOX"/>
</graphic>
</Button>
<Button defaultButton="true" text="Default" GridPane.rowIndex="1" GridPane.columnIndex="5">
<Button defaultButton="true" text="Default" GridPane.columnIndex="5" GridPane.rowIndex="1">
<graphic>
<JabRefIconView glyph="ADD_NOBOX"/>
</graphic>
</Button>
<Button cancelButton="true" text="Cancel" GridPane.rowIndex="1" GridPane.columnIndex="6">
<Button cancelButton="true" text="Cancel" GridPane.columnIndex="6" GridPane.rowIndex="1">
<graphic>
<JabRefIconView glyph="ADD_NOBOX"/>
</graphic>
</Button>
<Label GridPane.rowIndex="2" GridPane.columnIndex="0" GridPane.columnSpan="6">Text buttons:</Label>
<Button text="Normal" styleClass="text-button" GridPane.rowIndex="3" GridPane.columnIndex="0">
<Label GridPane.columnIndex="0" GridPane.columnSpan="6" GridPane.rowIndex="2">Text buttons:</Label>
<Button styleClass="text-button" text="Normal" GridPane.columnIndex="0" GridPane.rowIndex="3">
<graphic>
<JabRefIconView glyph="ADD_NOBOX"/>
</graphic>
</Button>
<Button text="Hover" fx:id="textButtonHover" styleClass="text-button" GridPane.rowIndex="3"
GridPane.columnIndex="1">
<Button fx:id="textButtonHover" styleClass="text-button" text="Hover" GridPane.columnIndex="1"
GridPane.rowIndex="3">
<graphic>
<JabRefIconView glyph="ADD_NOBOX"/>
</graphic>
</Button>
<Button text="Pressed" fx:id="textButtonPressed" styleClass="text-button" GridPane.rowIndex="3"
GridPane.columnIndex="2">
<Button fx:id="textButtonPressed" styleClass="text-button" text="Pressed" GridPane.columnIndex="2"
GridPane.rowIndex="3">
<graphic>
<JabRefIconView glyph="ADD_NOBOX"/>
</graphic>
</Button>
<Button text="Focused" fx:id="textButtonFocused" styleClass="text-button" GridPane.rowIndex="3"
GridPane.columnIndex="3">
<Button fx:id="textButtonFocused" styleClass="text-button" text="Focused" GridPane.columnIndex="3"
GridPane.rowIndex="3">
<graphic>
<JabRefIconView glyph="ADD_NOBOX"/>
</graphic>
</Button>
<Button disable="true" text="Disabled" styleClass="text-button" GridPane.rowIndex="3"
GridPane.columnIndex="4">
<Button disable="true" styleClass="text-button" text="Disabled" GridPane.columnIndex="4"
GridPane.rowIndex="3">
<graphic>
<JabRefIconView glyph="ADD_NOBOX"/>
</graphic>
</Button>
<Button defaultButton="true" text="Default" styleClass="text-button" GridPane.rowIndex="3"
GridPane.columnIndex="5">
<Button defaultButton="true" styleClass="text-button" text="Default" GridPane.columnIndex="5"
GridPane.rowIndex="3">
<graphic>
<JabRefIconView glyph="ADD_NOBOX"/>
</graphic>
</Button>
<Button cancelButton="true" text="Cancel" styleClass="text-button" GridPane.rowIndex="3"
GridPane.columnIndex="6">
<Button cancelButton="true" styleClass="text-button" text="Cancel" GridPane.columnIndex="6"
GridPane.rowIndex="3">
<graphic>
<JabRefIconView glyph="ADD_NOBOX"/>
</graphic>
</Button>
<Label GridPane.rowIndex="4" GridPane.columnIndex="0" GridPane.columnSpan="6">Contained buttons:</Label>
<Button text="Normal" styleClass="contained-button" GridPane.rowIndex="5" GridPane.columnIndex="0">
<Label GridPane.columnIndex="0" GridPane.columnSpan="6" GridPane.rowIndex="4">Contained buttons:</Label>
<Button styleClass="contained-button" text="Normal" GridPane.columnIndex="0" GridPane.rowIndex="5">
<graphic>
<JabRefIconView glyph="ADD_NOBOX"/>
</graphic>
</Button>
<Button text="Hover" fx:id="containedButtonHover" styleClass="contained-button" GridPane.rowIndex="5"
GridPane.columnIndex="1">
<Button fx:id="containedButtonHover" styleClass="contained-button" text="Hover" GridPane.columnIndex="1"
GridPane.rowIndex="5">
<graphic>
<JabRefIconView glyph="ADD_NOBOX"/>
</graphic>
</Button>
<Button text="Pressed" fx:id="containedButtonPressed" styleClass="contained-button"
GridPane.rowIndex="5" GridPane.columnIndex="2">
<Button fx:id="containedButtonPressed" styleClass="contained-button" text="Pressed"
GridPane.columnIndex="2" GridPane.rowIndex="5">
<graphic>
<JabRefIconView glyph="ADD_NOBOX"/>
</graphic>
</Button>
<Button text="Focused" fx:id="containedButtonFocused" styleClass="contained-button"
GridPane.rowIndex="5" GridPane.columnIndex="3">
<Button fx:id="containedButtonFocused" styleClass="contained-button" text="Focused"
GridPane.columnIndex="3" GridPane.rowIndex="5">
<graphic>
<JabRefIconView glyph="ADD_NOBOX"/>
</graphic>
</Button>
<Button disable="true" text="Disabled" styleClass="contained-button" GridPane.rowIndex="5"
GridPane.columnIndex="4">
<Button disable="true" styleClass="contained-button" text="Disabled" GridPane.columnIndex="4"
GridPane.rowIndex="5">
<graphic>
<JabRefIconView glyph="ADD_NOBOX"/>
</graphic>
</Button>
<Button defaultButton="true" text="Default" styleClass="contained-button" GridPane.rowIndex="5"
GridPane.columnIndex="5">
<Button defaultButton="true" styleClass="contained-button" text="Default" GridPane.columnIndex="5"
GridPane.rowIndex="5">
<graphic>
<JabRefIconView glyph="ADD_NOBOX"/>
</graphic>
</Button>
<Button cancelButton="true" text="Cancel" styleClass="contained-button" GridPane.rowIndex="5"
GridPane.columnIndex="6">
<Button cancelButton="true" styleClass="contained-button" text="Cancel" GridPane.columnIndex="6"
GridPane.rowIndex="5">
<graphic>
<JabRefIconView glyph="ADD_NOBOX"/>
</graphic>
</Button>
<columnConstraints>
<ColumnConstraints/>
<ColumnConstraints/>
<ColumnConstraints/>
<ColumnConstraints/>
<ColumnConstraints/>
<ColumnConstraints/>
<ColumnConstraints/>
</columnConstraints>
<rowConstraints>
<RowConstraints/>
<RowConstraints/>
<RowConstraints/>
<RowConstraints/>
<RowConstraints/>
<RowConstraints/>
</rowConstraints>
</GridPane>
</Tab>
<Tab text="Switches">
<VBox style="-fx-padding: 1em" spacing="10">
<VBox spacing="10" style="-fx-padding: 1em">
<Label text="Checkboxes"/>
<VBox style="-fx-padding: 0em 0em 0em 1em" spacing="15">
<VBox spacing="15" style="-fx-padding: 0em 0em 0em 1em">
<CheckBox text="Unchecked"/>
<CheckBox text="Checked" selected="true"/>
<CheckBox text="Unchecked disabled" disable="true"/>
<CheckBox text="Checked disabled" disable="true" selected="true"/>
<CheckBox selected="true" text="Checked"/>
<CheckBox disable="true" text="Unchecked disabled"/>
<CheckBox disable="true" selected="true" text="Checked disabled"/>
</VBox>
<Label text="Radio-Buttons">
<VBox.margin>
<Insets top="20.0"/>
</VBox.margin>
</Label>
<VBox spacing="15" style="-fx-padding: 0em 0em 0em 1em">
<RadioButton text="Unchecked"/>
<RadioButton selected="true" text="Checked"/>
<RadioButton disable="true" text="Unchecked disabled"/>
<RadioButton disable="true" selected="true" text="Checked disabled"/>
</VBox>
</VBox>
</Tab>
Expand Down

0 comments on commit d65ca33

Please sign in to comment.