mirrors/cryptomator
1
0
Fork 0
mirror of https://github.com/cryptomator/cryptomator.git synced 2026-05-20 11:41:26 +00:00
Code Issues Packages Projects Releases Wiki Activity

updated theme

Browse Source
This commit is contained in:
Tobias Hagemann
2019-07-23 17:02:05 +02:00
parent 14de8ffd59
commit 0eb19a287f
2 changed files with 56 additions and 24 deletions
Download Patch File Download Diff File Expand all files Collapse all files

64
main/ui/src/main/resources/css/theme.css
View File

@@ -9,8 +9,10 @@
PRIMARY_BG: #70A11B;
GRAY_LIGHT_BG: #F7F7F7;
TEXT_FILL: #222;
CONTROL_BORDER: #CFCFCF;
CONTROL_ARMED: #E1E1E1;
TEXT_FILL_LIGHT: #7E7E7E;
CONTROL_BORDER_NORMAL: #CFCFCF;
CONTROL_BORDER_FOCUSED: #9E9E9E;
CONTROL_BG_ARMED: #E1E1E1;
-fx-background-color: GRAY_LIGHT_BG;
-fx-text-fill: TEXT_FILL;
@@ -43,7 +45,7 @@
}
.main-window .title .button:armed .fa-icon {
-fx-fill: CONTROL_ARMED;
-fx-fill: CONTROL_BG_ARMED;
}
/*******************************************************************************
@@ -57,7 +59,7 @@
}
.split-pane:horizontal > .split-pane-divider {
-fx-background-color: GRAY_LIGHT_BG, CONTROL_BORDER;
-fx-background-color: GRAY_LIGHT_BG, CONTROL_BORDER_NORMAL;
-fx-background-insets: 0, 0 1 0 0;
}
@@ -72,7 +74,20 @@
}
.list-cell:selected {
-fx-background-color: CONTROL_ARMED;
-fx-background-color: CONTROL_BG_ARMED;
}
.list-cell .lock-icon {
-fx-fill: TEXT_FILL;
}
.list-cell .label {
-fx-text-fill: TEXT_FILL;
}
.list-cell .detail-label {
-fx-text-fill: TEXT_FILL_LIGHT;
-fx-font-size: 0.8em;
}
.onboarding-overlay-arc {
@@ -81,7 +96,7 @@
}
.toolbar-container {
-fx-border-color: CONTROL_BORDER transparent transparent transparent;
-fx-border-color: CONTROL_BORDER_NORMAL transparent transparent transparent;
-fx-border-width: 1px 0 0 0;
}
@@ -90,10 +105,15 @@
-fx-pref-width: 30px;
-fx-background-color: transparent;
-fx-background-insets: 0;
-fx-border-color: transparent CONTROL_BORDER transparent transparent;
-fx-background-radius: 0;
-fx-border-color: transparent CONTROL_BORDER_NORMAL transparent transparent;
-fx-border-width: 1;
}
.toolbar-container .button:armed {
-fx-background-color: CONTROL_BORDER_NORMAL, CONTROL_BG_ARMED;
}
/*******************************************************************************
* *
* Tooltip *
@@ -117,13 +137,17 @@
.text-input {
-fx-cursor: text;
-fx-text-fill: TEXT_FILL;
-fx-prompt-text-fill: derive(TEXT_FILL, +50%);
-fx-background-color: CONTROL_BORDER, white;
-fx-prompt-text-fill: TEXT_FILL_LIGHT;
-fx-background-color: CONTROL_BORDER_NORMAL, white;
-fx-background-insets: 0, 1px;
-fx-background-radius: 4px;
-fx-padding: 0.3em 0.5em 0.3em 0.5em;
}
.text-input:focused {
-fx-background-color: CONTROL_BORDER_FOCUSED, white;
}
/****************************************************************************
* *
* Buttons *
@@ -134,14 +158,18 @@
-fx-pref-height: 25px;
-fx-text-fill: TEXT_FILL;
-fx-alignment: CENTER;
-fx-background-color: CONTROL_BORDER, white;
-fx-background-color: CONTROL_BORDER_NORMAL, white;
-fx-background-insets: 0, 1px;
-fx-background-radius: 4px;
-fx-padding: 0.2em 0.4em 0.2em 0.4em;
}
.button:focused {
-fx-background-color: CONTROL_BORDER_FOCUSED, white;
}
.button:armed {
-fx-background-color: CONTROL_BORDER, CONTROL_ARMED;
-fx-background-color: CONTROL_BORDER_NORMAL, CONTROL_BG_ARMED;
}
/*******************************************************************************
@@ -156,12 +184,16 @@
}
.check-box > .box {
-fx-background-color: CONTROL_BORDER, white;
-fx-background-color: CONTROL_BORDER_NORMAL, white;
-fx-background-insets: 0, 1px;
-fx-background-radius: 4px;
-fx-padding: 0.3em;
}
.check-box:focused > .box {
-fx-background-color: CONTROL_BORDER_FOCUSED, white;
}
.check-box > .box > .mark {
-fx-background-color: transparent;
-fx-padding: 0.4em;
@@ -180,14 +212,14 @@
.choice-box {
-fx-text-fill: TEXT_FILL;
-fx-background-color: CONTROL_BORDER, white;
-fx-background-color: CONTROL_BORDER_NORMAL, white;
-fx-background-insets: 0, 1px;
-fx-background-radius: 4px;
-fx-padding: 0.3em 0.5em 0.3em 0.5em;
}
.choice-box:focused {
-fx-background-color: derive(CONTROL_BORDER, -20%), white;
-fx-background-color: CONTROL_BORDER_FOCUSED, white;
}
.choice-box > .open-button {
@@ -202,7 +234,7 @@
}
.choice-box .context-menu {
-fx-background-color: CONTROL_BORDER, white;
-fx-background-color: CONTROL_BORDER_NORMAL, white;
-fx-background-insets: 0, 1px;
-fx-background-radius: 4px;
-fx-padding: 0.2em 0 0.2em 0;
@@ -217,5 +249,5 @@
}
.menu-item:focused {
-fx-background-color: CONTROL_ARMED;
-fx-background-color: CONTROL_BG_ARMED;
}

16
main/ui/src/main/resources/fxml/vault_list_cell.fxml
View File

@@ -1,25 +1,25 @@
<?xml version="1.0" encoding="UTF-8"?>
<?import javafx.scene.control.Label?>
<?import javafx.scene.layout.VBox?>
<?import javafx.scene.layout.HBox?>
<?import de.jensd.fx.glyphs.fontawesome.FontAwesomeIconView?>
<?import javafx.geometry.Insets?>
<?import javafx.scene.control.Label?>
<?import javafx.scene.layout.HBox?>
<?import javafx.scene.layout.VBox?>
<HBox xmlns="http://javafx.com/javafx"
xmlns:fx="http://javafx.com/fxml"
fx:controller="org.cryptomator.ui.mainwindow.VaultListCellController"
prefHeight="50.0"
prefHeight="46.0"
prefWidth="200.0"
spacing="12"
alignment="CENTER_LEFT">
<padding>
<Insets top="4" right="6" bottom="4" left="6"/>
<Insets top="6" right="8" bottom="6" left="12"/>
</padding>
<children>
<FontAwesomeIconView glyphName="${controller.glyph}" HBox.hgrow="NEVER" glyphSize="20"/>
<VBox spacing="6" HBox.hgrow="ALWAYS">
<FontAwesomeIconView styleClass="lock-icon" glyphName="${controller.glyph}" HBox.hgrow="NEVER" glyphSize="16"/>
<VBox spacing="4" HBox.hgrow="ALWAYS">
<Label text="${controller.vault.displayableName}"/>
<Label text="${controller.vault.displayablePath}" textOverrun="CENTER_ELLIPSIS"/>
<Label styleClass="detail-label" text="${controller.vault.displayablePath}" textOverrun="CENTER_ELLIPSIS"/>
</VBox>
</children>
</HBox>