mirrors/cryptomator
1
0
Fork 0
mirror of https://github.com/cryptomator/cryptomator.git synced 2026-09-08 00:57:43 +00:00
Code Issues Packages Projects Releases Wiki Activity

Refactor notificationbar

Browse Source 
* rename to InfoBar
* replace closeButton text with graphic and add accessibilityText
* use common base class for styling and use CSS lookup for variants
This commit is contained in:
Armin Schrenk
2026-01-12 23:31:37 +01:00
parent a06accb80f
commit 33f26bf804
5 changed files with 122 additions and 59 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/main/resources/css/dark_theme.css
+45 -19
View File
@@ -50,6 +50,7 @@
GREEN_5: PRIMARY;
RED_5: #E74C3C;
ORANGE_5: #E67E22;
YELLOW_4: #C19F0E;
YELLOW_5: #F1C40F;
MAIN_BG: GRAY_1;
@@ -387,37 +388,62 @@
/*******************************************************************************
* *
* NotificationBar *
* InfoBar *
* *
******************************************************************************/
.info-bar {
-fx-alignment: center;
-fx-min-height:24px;
-fx-max-height:24px;
-fx-background-color: -bar-bg;
}
.notification-label {
-fx-text-fill: white;
.info-bar--green {
-bar-bg: GREEN_5;
-button-bg: GREEN_5;
-button-bg-pressed: GREEN_3;
}
.info-bar--yellow {
-bar-bg: YELLOW_5;
-button-bg: YELLOW_5;
-button-bg-pressed: YELLOW_4;
}
.info-bar--red {
-bar-bg: RED_5;
-button-bg: RED_5;
-button-bg-pressed: RED_5;
}
.info-bar .label {
-fx-text-fill: GRAY_9;
-fx-font-weight: bold;
}
.notification-debug {
-fx-min-height:24px;
-fx-max-height:24px;
-fx-background-color: RED_5;
.info-bar--yellow .label {
-fx-text-fill: GRAY_9;
-fx-font-weight: bold;
-fx-effect: dropshadow( gaussian , rgba(0,0,0,0.45) , 2 , 0 , 0 , 1 );
}
.notification-update {
-fx-min-height:24px;
-fx-max-height:24px;
-fx-background-color: YELLOW_5;
.info-bar .glyph {
-fx-fill: GRAY_9;
}
.notification-support {
-fx-min-height:24px;
-fx-max-height:24px;
-fx-background-color: PRIMARY;
.info-bar:hover .label {
-fx-underline:true;
}
.notification-debug:hover .notification-label,
.notification-update:hover .notification-label,
.notification-support:hover .notification-label {
-fx-underline:true;
.info-bar .button {
-fx-background-color: transparent;
-fx-border-color: transparent;
-fx-padding: 2 2 2 2;
}
.info-bar .button:armed {
-fx-background-color: -button-bg-pressed;
-fx-background-radius: 8;
}
/*******************************************************************************
src/main/resources/css/light_theme.css
+46 -20
View File
@@ -50,6 +50,7 @@
GREEN_5: PRIMARY;
RED_5: #E74C3C;
ORANGE_5: #E67E22;
YELLOW_4: #C19F0E;
YELLOW_5: #F1C40F;
MAIN_BG: GRAY_9;
@@ -387,39 +388,64 @@
/*******************************************************************************
* *
* NotificationBar *
* InfoBar *
* *
******************************************************************************/
.info-bar {
-fx-alignment: center;
-fx-min-height:24px;
-fx-max-height:24px;
-fx-background-color: -bar-bg;
}
.notification-label {
-fx-text-fill: white;
.info-bar--green {
-bar-bg: GREEN_5;
-button-bg: GREEN_5;
-button-bg-pressed: GREEN_3;
}
.info-bar--yellow {
-bar-bg: YELLOW_5;
-button-bg: YELLOW_5;
-button-bg-pressed: YELLOW_4;
}
.info-bar--red {
-bar-bg: RED_5;
-button-bg: RED_5;
-button-bg-pressed: RED_5;
}
.info-bar .label {
-fx-text-fill: GRAY_9;
-fx-font-weight: bold;
}
.notification-debug {
-fx-min-height:24px;
-fx-max-height:24px;
-fx-background-color: RED_5;
.info-bar--yellow .label {
-fx-text-fill: GRAY_9;
-fx-font-weight: bold;
-fx-effect: dropshadow( gaussian , rgba(0,0,0,0.45) , 2 , 0 , 0 , 1 );
}
.notification-update {
-fx-min-height:24px;
-fx-max-height:24px;
-fx-background-color: YELLOW_5;
.info-bar .glyph {
-fx-fill: GRAY_9;
}
.notification-support {
-fx-min-height:24px;
-fx-max-height:24px;
-fx-background-color: PRIMARY;
}
.notification-debug:hover .notification-label,
.notification-update:hover .notification-label,
.notification-support:hover .notification-label {
.info-bar:hover .label {
-fx-underline:true;
}
.info-bar .button {
-fx-background-color: transparent;
-fx-border-color: transparent;
-fx-padding: 2 2 2 2;
}
.info-bar .button:armed {
-fx-background-color: -button-bg-pressed;
-fx-background-radius: 8;
}
/*******************************************************************************
* *
* ScrollBar *
src/main/resources/fxml/main_window.fxml
+7 -7
View File
@@ -3,7 +3,7 @@
<?import javafx.scene.control.SplitPane?>
<?import javafx.scene.layout.StackPane?>
<?import javafx.scene.layout.VBox?>
<?import org.cryptomator.ui.controls.NotificationBar?>
<?import org.cryptomator.ui.controls.InfoBar?>
<StackPane xmlns:fx="http://javafx.com/fxml"
xmlns="http://javafx.com/javafx"
@@ -11,23 +11,23 @@
fx:controller="org.cryptomator.ui.mainwindow.MainWindowController"
styleClass="main-window">
<VBox minWidth="600">
<NotificationBar onMouseClicked="#showUpdatePreferences"
<InfoBar onMouseClicked="#showUpdatePreferences"
text="%main.notification.updateAvailable"
dismissable="true"
notify="${controller.updateAvailable}"
styleClass="notification-update"/>
<NotificationBar onMouseClicked="#showContributePreferences"
styleClass="info-bar--yellow"/>
<InfoBar onMouseClicked="#showContributePreferences"
text="%main.notification.support"
dismissable="true"
notify="${!controller.licenseValid}"
styleClass="notification-support"/>
styleClass="info-bar--green"/>
<SplitPane dividerPositions="0.33" orientation="HORIZONTAL" VBox.vgrow="ALWAYS">
<fx:include source="vault_list.fxml" SplitPane.resizableWithParent="false"/>
<fx:include source="vault_detail.fxml" SplitPane.resizableWithParent="true"/>
</SplitPane>
<NotificationBar onMouseClicked="#showGeneralPreferences"
<InfoBar onMouseClicked="#showGeneralPreferences"
text="DEBUG MODE"
styleClass="notification-debug"
styleClass="info-bar--red"
notify="${controller.debugModeEnabled}"/>
</VBox>
</StackPane>
src/main/resources/i18n/strings.properties
+2 -1
View File
@@ -426,9 +426,10 @@ main.vaultlist.addVaultBtn.menuItemRecover=Recover Existing Vault…
main.vaultlist.addVaultButton.tooltip=Add Vault
main.vaultlist.showEventsButton.tooltip=Open Event View
main.vaultlist.showPreferencesButton.tooltip=Show Preferences
##Notificaition
##Notification
main.notification.updateAvailable=Update is available.
main.notification.support=Support Cryptomator.
main.notification.closeButton.tooltip=Close info bar
## Vault Detail
### Welcome
main.vaultDetail.welcomeOnboarding=Thanks for choosing Cryptomator to protect your files. If you need any assistance, check out our getting started guides: