change status view from Label to Stackpane & adjust spinner size computation

src/main/java/org/cryptomator/ui/controls/FontAwesome5Spinner.java

@@ -0,0 +1,69 @@
+package org.cryptomator.ui.controls;
+
+import com.tobiasdiez.easybind.EasyBind;
+
+import javafx.animation.Interpolator;
+import javafx.animation.RotateTransition;
+import javafx.beans.property.DoubleProperty;
+import javafx.beans.property.SimpleDoubleProperty;
+import javafx.scene.control.ProgressIndicator;
+import javafx.util.Duration;
+
+/**
+ * A progress indicator in the shape of {@link FontAwesome5Icon#SPINNER}. The single spinner segements are defined in the css in the `progress-indicator` class.
+ * <p>
+ * See also https://docs.oracle.com/javase/8/javafx/api/javafx/scene/doc-files/cssref.html#progressindicator
+ */
+public class FontAwesome5Spinner extends ProgressIndicator {
+
+	private static final double DEFAULT_GLYPH_SIZE = 12.0;
+
+	private final FontAwesome5IconView boundingBox;
+	private final RotateTransition animation;
+	private final DoubleProperty glyphSize = new SimpleDoubleProperty(this, "glyphSize", DEFAULT_GLYPH_SIZE);
+
+	public FontAwesome5Spinner() {
+		this.boundingBox = new FontAwesome5IconView();
+		boundingBox.setGlyph(FontAwesome5Icon.SPINNER);
+		boundingBox.glyphSizeProperty().bind(glyphSize);
+
+		this.animation = new RotateTransition(Duration.millis(100), this);
+		animation.setInterpolator(Interpolator.DISCRETE);
+		animation.setByAngle(45);
+		animation.setCycleCount(1);
+		animation.setOnFinished(event -> {
+			double currentAngle = this.getRotate();
+			animation.setFromAngle(currentAngle);
+			animation.play();
+		});
+
+		EasyBind.subscribe(this.visibleProperty(), this::reset);
+		EasyBind.subscribe(boundingBox.glyphSizeProperty(), this::shrinkToGlyphSize);
+	}
+
+	private void shrinkToGlyphSize(Number newValue) {
+		setMaxSize(boundingBox.getBoundsInLocal().getWidth(), boundingBox.getBoundsInLocal().getHeight());
+	}
+
+	private void reset(boolean flag) {
+		if (flag) {
+			setRotate(0);
+			animation.playFromStart();
+		} else {
+			animation.stop();
+		}
+	}
+
+	public DoubleProperty glyphSizeProperty() {
+		return glyphSize;
+	}
+
+	public double getGlyphSize() {
+		return glyphSize.get();
+	}
+
+	public void setGlyphSize(double glyphSize) {
+		this.glyphSize.set(glyphSize);
+	}
+
+}

src/main/java/org/cryptomator/ui/controls/FontAwesome5StatusView.java

@@ -0,0 +1,71 @@
+package org.cryptomator.ui.controls;
+
+import com.tobiasdiez.easybind.EasyBind;
+
+import javafx.beans.binding.BooleanBinding;
+import javafx.beans.property.DoubleProperty;
+import javafx.beans.property.ObjectProperty;
+import javafx.beans.property.SimpleDoubleProperty;
+import javafx.beans.property.SimpleObjectProperty;
+import javafx.geometry.Pos;
+import javafx.scene.layout.StackPane;
+
+/**
+ * Similar to the {@link FontAwesome5IconView}, except that if the spinner glyph is selected, an animated facsimile is used.
+ */
+public class FontAwesome5StatusView extends StackPane {
+
+	private static final double DEFAULT_GLYPH_SIZE = 12.0;
+	private static final FontAwesome5Icon DEFAULT_GLYPH = FontAwesome5Icon.ANCHOR;
+
+	private final FontAwesome5IconView staticIcon;
+	private final FontAwesome5Spinner animatedSpinner;
+	private final BooleanBinding isSpinnerGlyph;
+
+	private final ObjectProperty<FontAwesome5Icon> glyph = new SimpleObjectProperty<>(this, "glyph", DEFAULT_GLYPH);
+	private final DoubleProperty glyphSize = new SimpleDoubleProperty(this, "glyphSize", DEFAULT_GLYPH_SIZE);
+
+
+	public FontAwesome5StatusView() {
+		this.staticIcon = new FontAwesome5IconView();
+		this.animatedSpinner = new FontAwesome5Spinner();
+		this.isSpinnerGlyph = glyphProperty().isEqualTo(FontAwesome5Icon.SPINNER);
+		setAlignment(Pos.CENTER);
+		getChildren().addAll(staticIcon, animatedSpinner);
+
+		staticIcon.glyphProperty().bind(glyph);
+		staticIcon.glyphSizeProperty().bind(glyphSize);
+		animatedSpinner.glyphSizeProperty().bind(glyphSize);
+
+		EasyBind.subscribe(isSpinnerGlyph, this::showSpinner);
+	}
+
+	private void showSpinner(boolean isSpinner) {
+		animatedSpinner.setVisible(isSpinner);
+		staticIcon.setVisible(!isSpinner);
+	}
+
+	public ObjectProperty<FontAwesome5Icon> glyphProperty() {
+		return glyph;
+	}
+
+	public FontAwesome5Icon getGlyph() {
+		return glyph.get();
+	}
+
+	public void setGlyph(FontAwesome5Icon glyph) {
+		this.glyph.set(glyph == null ? DEFAULT_GLYPH : glyph);
+	}
+
+	public DoubleProperty glyphSizeProperty() {
+		return glyphSize;
+	}
+
+	public double getGlyphSize() {
+		return glyphSize.get();
+	}
+
+	public void setGlyphSize(double glyphSize) {
+		this.glyphSize.set(glyphSize);
+	}
+}

src/main/resources/css/dark_theme.css

@@ -285,6 +285,10 @@
 	-fx-fill: TEXT_FILL_MUTED;
 }
 
+.list-cell .progress-indicator .segment {
+	-fx-background-color: TEXT_FILL_MUTED;
+}
+
 .list-cell .header-label {
 	-fx-font-family: 'Open Sans SemiBold';
 	-fx-font-size: 1.0em;
@@ -299,6 +303,10 @@
 	-fx-fill: PRIMARY;
 }
 
+.list-cell:selected .progress-indicator .segment {
+	-fx-background-color: PRIMARY;
+}
+
 .list-cell:selected .header-label {
 	-fx-text-fill: TEXT_FILL_HIGHLIGHTED;
 }
@@ -564,10 +572,18 @@
 	-fx-fill: TEXT_FILL_MUTED;
 }
 
+.button:disabled .progress-indicator .segment {
+	-fx-background-color: TEXT_FILL_MUTED;
+}
+
 .button:default .glyph-icon {
 	-fx-fill: white;
 }
 
+.button:default .progress-indicator .segment {
+ 	-fx-background-color: white;
+}
+
 .button:default .label {
 	-fx-text-fill: white;
 }
@@ -788,16 +804,30 @@
 	-fx-scale-shape: false;
 }
 
+/**
+statusView
+**/
+
+.status-view-white .glyph-icon {
+	-fx-fill: white;
+}
+
+.status-view-white .progress-indicator .segment {
+	-fx-background-color: white;
+}
+
 /*******************************************************************************
  *                                                                             *
  * ProgressIndicator                                                           *
  * Derived from aquafx-project.com, (C) Claudine Zillmann, see NOTICE.md       *
+ * and FontAwesome 5 spinner icon (solid), (C) Fonticons, Inc, see			   *
+ * https://fontawesome.com/license#license   								   *
  *                                                                             *
  ******************************************************************************/
 
 .progress-indicator {
-	-fx-indeterminate-segment-count: 12;
-	-fx-spin-enabled: true;
+	-fx-indeterminate-segment-count: 8;
+	-fx-spin-enabled: false;
 }
 
 .progress-indicator:indeterminate > .spinner {
@@ -805,56 +835,40 @@
 }
 
 .progress-indicator:indeterminate .segment {
-	-fx-background-color: PROGRESS_INDICATOR_BEGIN, PROGRESS_INDICATOR_END;
 	-fx-background-insets: 0, 0.5;
 }
 
 .progress-indicator:indeterminate .segment0 {
-	-fx-shape: "m 12.007729,4.9541827 c -0.49762,0.7596865 0.893181,1.6216808 1.327833,0.7666252 L 15.456199,2.0477574 C 15.942094,1.2061627 14.61426,0.43953765 14.128365,1.2811324 z";
-}
-
-.progress-indicator:indeterminate .segment1 {
-	-fx-shape: "m 9.2224559,4.62535 c -0.051108,0.9067177 1.5843581,0.957826 1.5332501,0 l 0,-4.24127319 c 0,-0.9717899 -1.5332501,-0.9717899 -1.5332501,0 z";
-}
-
-.progress-indicator:indeterminate .segment2 {
-	-fx-shape: "M 8.0465401,4.9030617 C 8.5441601,5.6627485 7.1533584,6.5247425 6.7187068,5.6696872 L 4.5980702,1.9966363 C 4.1121752,1.1550418 5.4400085,0.38841683 5.9259035,1.2300114 z";
-}
-
-.progress-indicator:indeterminate .segment3 {
-	-fx-shape: "M 5.7330066,6.5305598 C 6.5579512,6.9103162 5.8366865,8.3790371 5.0144939,7.8850315 L 1.2677551,5.8974832 C 0.409277,5.4420823 1.1277888,4.0876101 1.9862674,4.5430105 z";
-}
-
-.progress-indicator:indeterminate .segment4 {
-	-fx-shape: "m 0.42171041,9.2083842 c -0.90671825,-0.051108 -0.95782608,1.5843588 0,1.5332498 l 4.24127319,0 c 0.9717899,0 0.9717899,-1.5332498 0,-1.5332498 z";
-}
-
-.progress-indicator:indeterminate .segment5 {
-	-fx-shape: "M 5.7330066,13.443113 C 6.5579512,13.063356 5.8366865,11.594635 5.0144939,12.088641 L 1.2677551,14.076189 C 0.409277,14.53159 1.1277888,15.886062 1.9862674,15.430662 z";
-}
-
-.progress-indicator:indeterminate .segment6 {
-	-fx-shape: "M 8.0465401,15.070611 C 8.5441601,14.310924 7.1533584,13.44893 6.7187068,14.303985 l -2.1206366,3.673051 c -0.485895,0.841595 0.8419383,1.60822 1.3278333,0.766625 z";
+	-fx-shape: "M 256 0 C 229.49 0 208 21.49 208 48 C 208 74.51 229.49 96 256 96 C 282.51 96 304 74.51 304 48 C 304 21.49 282.51 0 256 0 z";
 }
 
 .progress-indicator:indeterminate .segment7 {
-	-fx-shape: "m 9.2224559,19.539943 c -0.051108,0.906718 1.5843581,0.957826 1.5332501,0 l 0,-4.241273 c 0,-0.97179 -1.5332501,-0.97179 -1.5332501,0 z";
+	-fx-shape: "M 403.07812 60.921875";
+	-fx-background-color: transparent;
 }
 
-.progress-indicator:indeterminate .segment8 {
-	-fx-shape: "m 12.10997,15.070611 c -0.49762,-0.759687 0.893182,-1.621681 1.327834,-0.766626 l 2.120636,3.673051 c 0.485895,0.841595 -0.841938,1.60822 -1.327833,0.766625 z";
+.progress-indicator:indeterminate .segment6 {
+	-fx-shape:"M 464 208 C 437.49 208 416 229.49 416 256 C 416 282.51 437.49 304 464 304 C 490.51 304 512 282.51 512 256 C 512 229.49 490.51 208 464 208 z";
 }
 
-.progress-indicator:indeterminate .segment9 {
-	-fx-shape: "m 14.423504,13.443113 c -0.824945,-0.379757 -0.10368,-1.848478 0.718512,-1.354472 l 3.746739,1.987548 c 0.858478,0.455401 0.139967,1.809873 -0.718512,1.354473 z";
+.progress-indicator:indeterminate .segment5 {
+	-fx-shape:"M 403.07812 355.07812 C 376.56813 355.07812 355.07812 376.56813 355.07812 403.07812 C 355.07812 429.58812 376.56813 451.07812 403.07812 451.07812 C 429.58812 451.07812 451.07812 429.58812 451.07812 403.07812 C 451.07812 376.56912 429.58812 355.07812 403.07812 355.07812 z";
 }
 
-.progress-indicator:indeterminate .segment10 {
-	-fx-shape: "m 15.372451,9.2445322 c -0.906719,-0.051108 -0.957826,1.5843588 0,1.5332498 l 4.241273,0 c 0.97179,0 0.97179,-1.5332498 0,-1.5332498 z";
+.progress-indicator:indeterminate .segment4 {
+	-fx-shape:"M 256 416 C 229.49 416 208 437.49 208 464 C 208 490.51 229.49 512 256 512 C 282.51 512 304 490.51 304 464 C 304 437.49 282.51 416 256 416 z";
 }
 
-.progress-indicator:indeterminate .segment11 {
-	-fx-shape: "m 14.321262,6.5816808 c -0.824944,0.3797564 -0.10368,1.8484772 0.718513,1.3544717 L 18.786514,5.9486042 C 19.644992,5.4932031 18.92648,4.1387308 18.068001,4.5941315 z";
+.progress-indicator:indeterminate .segment3 {
+	-fx-shape:"M 108.92188 355.07812 C 82.411875 355.07812 60.921875 376.56813 60.921875 403.07812 C 60.921875 429.58812 82.411875 451.07812 108.92188 451.07812 C 135.43188 451.07812 156.92188 429.58812 156.92188 403.07812 C 156.92188 376.56912 135.43088 355.07812 108.92188 355.07812 z";
+}
+
+.progress-indicator:indeterminate .segment2 {
+	-fx-shape: "M 48 208 C 21.49 208 0 229.49 0 256 C 0 282.51 21.49 304 48 304 C 74.51 304 96 282.51 96 256 C 96 229.49 74.51 208 48 208 z";
+}
+
+.progress-indicator:indeterminate .segment1 {
+	-fx-shape: "M 108.92188 60.921875 C 82.411875 60.921875 60.921875 82.411875 60.921875 108.92188 C 60.921875 135.43188 82.411875 156.92188 108.92188 156.92188 C 135.43188 156.92188 156.92188 135.43187 156.92188 108.92188 C 156.92188 82.411875 135.43088 60.921875 108.92188 60.921875 z";
 }
 
 /*******************************************************************************

src/main/resources/css/light_theme.css

@@ -284,6 +284,10 @@
 	-fx-fill: TEXT_FILL_MUTED;
 }
 
+.list-cell .progress-indicator .segment {
+	-fx-background-color: TEXT_FILL_MUTED;
+}
+
 .list-cell .header-label {
 	-fx-font-family: 'Open Sans SemiBold';
 	-fx-font-size: 1.0em;
@@ -298,6 +302,10 @@
 	-fx-fill: PRIMARY;
 }
 
+.list-cell:selected .progress-indicator .segment {
+	-fx-background-color: PRIMARY;
+}
+
 .list-cell:selected .header-label {
 	-fx-text-fill: TEXT_FILL_HIGHLIGHTED;
 }
@@ -562,10 +570,18 @@
 	-fx-fill: TEXT_FILL_MUTED;
 }
 
+.button:disabled .progress-indicator .segment {
+	-fx-background-color: TEXT_FILL_MUTED;
+}
+
 .button:default .glyph-icon {
 	-fx-fill: white;
 }
 
+.button:default .progress-indicator .segment {
+ 	-fx-background-color: white;
+}
+
 .button:default .label {
 	-fx-text-fill: white;
 }
@@ -786,16 +802,30 @@
 	-fx-scale-shape: false;
 }
 
+/**
+statusView
+**/
+
+.status-view-white .glyph-icon {
+	-fx-fill: white;
+}
+
+.status-view-white .progress-indicator .segment {
+	-fx-background-color: white;
+}
+
 /*******************************************************************************
  *                                                                             *
  * ProgressIndicator                                                           *
  * Derived from aquafx-project.com, (C) Claudine Zillmann, see NOTICE.md       *
+ * and FontAwesome 5 spinner icon (solid), (C) Fonticons, Inc, see			   *
+ * https://fontawesome.com/license#license   								   *
  *                                                                             *
  ******************************************************************************/
 
 .progress-indicator {
-	-fx-indeterminate-segment-count: 12;
-	-fx-spin-enabled: true;
+	-fx-indeterminate-segment-count: 8;
+	-fx-spin-enabled: false;
 }
 
 .progress-indicator:indeterminate > .spinner {
@@ -803,56 +833,40 @@
 }
 
 .progress-indicator:indeterminate .segment {
-	-fx-background-color: PROGRESS_INDICATOR_BEGIN, PROGRESS_INDICATOR_END;
 	-fx-background-insets: 0, 0.5;
 }
 
 .progress-indicator:indeterminate .segment0 {
-	-fx-shape: "m 12.007729,4.9541827 c -0.49762,0.7596865 0.893181,1.6216808 1.327833,0.7666252 L 15.456199,2.0477574 C 15.942094,1.2061627 14.61426,0.43953765 14.128365,1.2811324 z";
-}
-
-.progress-indicator:indeterminate .segment1 {
-	-fx-shape: "m 9.2224559,4.62535 c -0.051108,0.9067177 1.5843581,0.957826 1.5332501,0 l 0,-4.24127319 c 0,-0.9717899 -1.5332501,-0.9717899 -1.5332501,0 z";
-}
-
-.progress-indicator:indeterminate .segment2 {
-	-fx-shape: "M 8.0465401,4.9030617 C 8.5441601,5.6627485 7.1533584,6.5247425 6.7187068,5.6696872 L 4.5980702,1.9966363 C 4.1121752,1.1550418 5.4400085,0.38841683 5.9259035,1.2300114 z";
-}
-
-.progress-indicator:indeterminate .segment3 {
-	-fx-shape: "M 5.7330066,6.5305598 C 6.5579512,6.9103162 5.8366865,8.3790371 5.0144939,7.8850315 L 1.2677551,5.8974832 C 0.409277,5.4420823 1.1277888,4.0876101 1.9862674,4.5430105 z";
-}
-
-.progress-indicator:indeterminate .segment4 {
-	-fx-shape: "m 0.42171041,9.2083842 c -0.90671825,-0.051108 -0.95782608,1.5843588 0,1.5332498 l 4.24127319,0 c 0.9717899,0 0.9717899,-1.5332498 0,-1.5332498 z";
-}
-
-.progress-indicator:indeterminate .segment5 {
-	-fx-shape: "M 5.7330066,13.443113 C 6.5579512,13.063356 5.8366865,11.594635 5.0144939,12.088641 L 1.2677551,14.076189 C 0.409277,14.53159 1.1277888,15.886062 1.9862674,15.430662 z";
-}
-
-.progress-indicator:indeterminate .segment6 {
-	-fx-shape: "M 8.0465401,15.070611 C 8.5441601,14.310924 7.1533584,13.44893 6.7187068,14.303985 l -2.1206366,3.673051 c -0.485895,0.841595 0.8419383,1.60822 1.3278333,0.766625 z";
+	-fx-shape: "M 256 0 C 229.49 0 208 21.49 208 48 C 208 74.51 229.49 96 256 96 C 282.51 96 304 74.51 304 48 C 304 21.49 282.51 0 256 0 z";
 }
 
 .progress-indicator:indeterminate .segment7 {
-	-fx-shape: "m 9.2224559,19.539943 c -0.051108,0.906718 1.5843581,0.957826 1.5332501,0 l 0,-4.241273 c 0,-0.97179 -1.5332501,-0.97179 -1.5332501,0 z";
+	-fx-shape: "M 403.07812 60.921875";
+	-fx-background-color: transparent;
 }
 
-.progress-indicator:indeterminate .segment8 {
-	-fx-shape: "m 12.10997,15.070611 c -0.49762,-0.759687 0.893182,-1.621681 1.327834,-0.766626 l 2.120636,3.673051 c 0.485895,0.841595 -0.841938,1.60822 -1.327833,0.766625 z";
+.progress-indicator:indeterminate .segment6 {
+	-fx-shape:"M 464 208 C 437.49 208 416 229.49 416 256 C 416 282.51 437.49 304 464 304 C 490.51 304 512 282.51 512 256 C 512 229.49 490.51 208 464 208 z";
 }
 
-.progress-indicator:indeterminate .segment9 {
-	-fx-shape: "m 14.423504,13.443113 c -0.824945,-0.379757 -0.10368,-1.848478 0.718512,-1.354472 l 3.746739,1.987548 c 0.858478,0.455401 0.139967,1.809873 -0.718512,1.354473 z";
+.progress-indicator:indeterminate .segment5 {
+	-fx-shape:"M 403.07812 355.07812 C 376.56813 355.07812 355.07812 376.56813 355.07812 403.07812 C 355.07812 429.58812 376.56813 451.07812 403.07812 451.07812 C 429.58812 451.07812 451.07812 429.58812 451.07812 403.07812 C 451.07812 376.56912 429.58812 355.07812 403.07812 355.07812 z";
 }
 
-.progress-indicator:indeterminate .segment10 {
-	-fx-shape: "m 15.372451,9.2445322 c -0.906719,-0.051108 -0.957826,1.5843588 0,1.5332498 l 4.241273,0 c 0.97179,0 0.97179,-1.5332498 0,-1.5332498 z";
+.progress-indicator:indeterminate .segment4 {
+	-fx-shape:"M 256 416 C 229.49 416 208 437.49 208 464 C 208 490.51 229.49 512 256 512 C 282.51 512 304 490.51 304 464 C 304 437.49 282.51 416 256 416 z";
 }
 
-.progress-indicator:indeterminate .segment11 {
-	-fx-shape: "m 14.321262,6.5816808 c -0.824944,0.3797564 -0.10368,1.8484772 0.718513,1.3544717 L 18.786514,5.9486042 C 19.644992,5.4932031 18.92648,4.1387308 18.068001,4.5941315 z";
+.progress-indicator:indeterminate .segment3 {
+	-fx-shape:"M 108.92188 355.07812 C 82.411875 355.07812 60.921875 376.56813 60.921875 403.07812 C 60.921875 429.58812 82.411875 451.07812 108.92188 451.07812 C 135.43188 451.07812 156.92188 429.58812 156.92188 403.07812 C 156.92188 376.56912 135.43088 355.07812 108.92188 355.07812 z";
+}
+
+.progress-indicator:indeterminate .segment2 {
+	-fx-shape: "M 48 208 C 21.49 208 0 229.49 0 256 C 0 282.51 21.49 304 48 304 C 74.51 304 96 282.51 96 256 C 96 229.49 74.51 208 48 208 z";
+}
+
+.progress-indicator:indeterminate .segment1 {
+	-fx-shape: "M 108.92188 60.921875 C 82.411875 60.921875 60.921875 82.411875 60.921875 108.92188 C 60.921875 135.43188 82.411875 156.92188 108.92188 156.92188 C 135.43188 156.92188 156.92188 135.43187 156.92188 108.92188 C 156.92188 82.411875 135.43088 60.921875 108.92188 60.921875 z";
 }
 
 /*******************************************************************************

src/main/resources/fxml/vault_detail.fxml

@@ -10,6 +10,7 @@
 <?import javafx.scene.layout.StackPane?>
 <?import javafx.scene.layout.VBox?>
 <?import javafx.scene.shape.Circle?>
+<?import org.cryptomator.ui.controls.FontAwesome5StatusView?>
 <VBox xmlns:fx="http://javafx.com/fxml"
 	  xmlns="http://javafx.com/javafx"
 	  fx:controller="org.cryptomator.ui.mainwindow.VaultDetailController"
@@ -22,7 +23,7 @@
 		<HBox spacing="12" visible="${controller.anyVaultSelected}" managed="${controller.anyVaultSelected}">
 			<StackPane alignment="CENTER">
 				<Circle styleClass="glyph-icon-primary" radius="16"/>
-				<FontAwesome5IconView styleClass="glyph-icon-white" glyph="${controller.glyph}" HBox.hgrow="NEVER" glyphSize="16"/>
+				<FontAwesome5StatusView styleClass="status-view-white" glyph="${controller.glyph}" glyphSize="16"/>
 			</StackPane>
 			<VBox spacing="4" HBox.hgrow="ALWAYS">
 				<HBox spacing="12">

src/main/resources/fxml/vault_list_cell.fxml

@@ -1,11 +1,11 @@
 <?xml version="1.0" encoding="UTF-8"?>
 
-<?import org.cryptomator.ui.controls.FontAwesome5IconView?>
 <?import javafx.geometry.Insets?>
 <?import javafx.scene.control.Label?>
 <?import javafx.scene.control.Tooltip?>
 <?import javafx.scene.layout.HBox?>
 <?import javafx.scene.layout.VBox?>
+<?import org.cryptomator.ui.controls.FontAwesome5StatusView?>
 <HBox xmlns:fx="http://javafx.com/fxml"
 	  xmlns="http://javafx.com/javafx"
 	  fx:controller="org.cryptomator.ui.mainwindow.VaultListCellController"
@@ -19,7 +19,7 @@
 	</padding>
 	<children>
 		<VBox alignment="CENTER" minWidth="20">
-			<FontAwesome5IconView glyph="${controller.glyph}" HBox.hgrow="NEVER" glyphSize="16"/>
+			<FontAwesome5StatusView glyph="${controller.glyph}" HBox.hgrow="NEVER" glyphSize="16"/>
 		</VBox>
 		<VBox spacing="4" HBox.hgrow="ALWAYS">
 			<Label styleClass="header-label" text="${controller.vault.displayName}"/>