From 767941d096a1de56e99163c008abe9e4500a7454 Mon Sep 17 00:00:00 2001
From: crschnick <crschnick@xpipe.io>
Date: Tue, 14 Feb 2023 18:37:13 +0000
Subject: [PATCH] Move to atlantafx

---
 app/build.gradle                              |  3 +-
 .../about/ThirdPartyDependencyListComp.java   |  3 +
 .../io/xpipe/app/comp/base/BigIconButton.java |  3 +-
 .../io/xpipe/app/comp/base/ButtonComp.java    | 10 +--
 .../xpipe/app/comp/base/ListSelectorComp.java |  5 +-
 .../storage/store/StoreEntryListComp.java     |  4 +-
 .../main/java/io/xpipe/app/core/AppStyle.java | 42 +++-------
 .../io/xpipe/app/issue/ErrorHandlerComp.java  |  4 +
 .../io/xpipe/app/issue/UserReportComp.java    | 24 ++++--
 .../java/io/xpipe/app/prefs/AppPrefs.java     | 17 ++--
 .../xpipe/app/prefs/CustomFormRenderer.java   |  6 +-
 .../xpipe/app/prefs/CustomToggleControl.java  | 82 +++++++++++++++++++
 app/src/main/java/module-info.java            |  1 +
 .../io/xpipe/app/resources/style/alert.css    | 23 ------
 .../app/resources/style/base/button-comp.css  | 17 ----
 .../app/resources/style/base/combo-box.css    | 36 --------
 .../app/resources/style/base/filter-comp.css  |  2 -
 .../app/resources/style/base/hyperlinks.css   |  6 --
 .../style/base/lazy-text-field-comp.css       |  4 -
 .../resources/style/base/multi-step-comp.css  | 20 ++---
 .../style/base/toggle-group-comp.css          | 46 -----------
 .../app/resources/style/base/tooltip.css      |  7 +-
 .../xpipe/app/resources/style/empty-alert.css |  8 --
 .../resources/style/error-handler-comp.css    |  8 +-
 .../io/xpipe/app/resources/style/intro.css    |  2 -
 .../app/resources/style/named-choice-comp.css |  2 +-
 .../app/resources/style/sidebar-comp.css      | 13 ++-
 .../app/resources/style/simple-alert.css      | 30 +++++--
 .../source/data-source-type-choice-comp.css   | 14 ----
 .../resources/style/storage/header-bars.css   | 65 ++++++---------
 .../style/storage/store-entry-comp.css        |  2 +-
 .../io/xpipe/app/resources/style/style.css    | 10 +--
 .../io/xpipe/app/resources/style/tab-pane.css |  5 --
 .../app/resources/style/table-mapping.css     |  2 +-
 .../io/xpipe/app/resources/style/tag-comp.css |  8 --
 .../io/xpipe/app/resources/style/tags.css     |  2 -
 .../xpipe/app/resources/style/third-party.css | 38 +--------
 .../io/xpipe/app/resources/theme/dark.css     | 20 -----
 .../io/xpipe/app/resources/theme/light.css    | 20 -----
 .../fxcomps/impl/IconButtonComp.java          |  2 +-
 .../xpipe/extension/util/PrettyListView.java  |  2 -
 .../resources/style/code-snippet.css          |  6 +-
 42 files changed, 228 insertions(+), 396 deletions(-)
 create mode 100644 app/src/main/java/io/xpipe/app/prefs/CustomToggleControl.java
 delete mode 100644 app/src/main/resources/io/xpipe/app/resources/style/alert.css
 delete mode 100644 app/src/main/resources/io/xpipe/app/resources/style/base/button-comp.css
 delete mode 100644 app/src/main/resources/io/xpipe/app/resources/style/base/combo-box.css
 delete mode 100644 app/src/main/resources/io/xpipe/app/resources/style/base/hyperlinks.css
 delete mode 100644 app/src/main/resources/io/xpipe/app/resources/style/base/toggle-group-comp.css
 delete mode 100644 app/src/main/resources/io/xpipe/app/resources/style/empty-alert.css
 delete mode 100644 app/src/main/resources/io/xpipe/app/resources/style/tag-comp.css
 delete mode 100644 app/src/main/resources/io/xpipe/app/resources/style/tags.css
 delete mode 100644 app/src/main/resources/io/xpipe/app/resources/theme/dark.css
 delete mode 100644 app/src/main/resources/io/xpipe/app/resources/theme/light.css

diff --git a/app/build.gradle b/app/build.gradle
index 0170f75c..b6f6ad44 100644
--- a/app/build.gradle
+++ b/app/build.gradle
@@ -53,6 +53,7 @@ dependencies {
     implementation 'com.jfoenix:jfoenix:9.0.10'
     implementation 'org.controlsfx:controlsfx:11.1.1'
     implementation 'net.synedra:validatorfx:0.3.1'
+    implementation 'io.github.mkpaz:atlantafx-base:1.2.0'
 }
 
 apply from: "$rootDir/gradle/gradle_scripts/junit.gradle"
@@ -132,7 +133,7 @@ application {
 
 run {
     systemProperty 'io.xpipe.app.mode', 'gui'
-    systemProperty 'io.xpipe.app.dataDir', "$projectDir/local_stage/"
+    systemProperty 'io.xpipe.app.dataDir', "$projectDir/local6/"
     systemProperty 'io.xpipe.app.writeLogs', "true"
     systemProperty 'io.xpipe.app.writeSysOut', "true"
     systemProperty 'io.xpipe.app.developerMode', "true"
diff --git a/app/src/main/java/io/xpipe/app/comp/about/ThirdPartyDependencyListComp.java b/app/src/main/java/io/xpipe/app/comp/about/ThirdPartyDependencyListComp.java
index 6baee94d..09fc9030 100644
--- a/app/src/main/java/io/xpipe/app/comp/about/ThirdPartyDependencyListComp.java
+++ b/app/src/main/java/io/xpipe/app/comp/about/ThirdPartyDependencyListComp.java
@@ -5,6 +5,7 @@ import io.xpipe.app.util.Hyperlinks;
 import io.xpipe.extension.fxcomps.Comp;
 import io.xpipe.extension.fxcomps.CompStructure;
 import io.xpipe.extension.fxcomps.SimpleCompStructure;
+import javafx.geometry.Insets;
 import javafx.geometry.Pos;
 import javafx.scene.control.*;
 import javafx.scene.layout.StackPane;
@@ -18,6 +19,7 @@ public class ThirdPartyDependencyListComp extends Comp<CompStructure<?>> {
         link.setOnAction(e -> {
             Hyperlinks.open(t.link());
         });
+        tp.setPadding(Insets.EMPTY);
         tp.setGraphic(link);
         tp.setAlignment(Pos.CENTER_LEFT);
         AppFont.medium(tp);
@@ -49,6 +51,7 @@ public class ThirdPartyDependencyListComp extends Comp<CompStructure<?>> {
         acc.setPrefWidth(500);
         var sp = new ScrollPane(acc);
         sp.setFitToWidth(true);
+        sp.setHbarPolicy(ScrollPane.ScrollBarPolicy.NEVER);
         return new SimpleCompStructure<>(sp);
     }
 }
diff --git a/app/src/main/java/io/xpipe/app/comp/base/BigIconButton.java b/app/src/main/java/io/xpipe/app/comp/base/BigIconButton.java
index 87af017b..2a9646c0 100644
--- a/app/src/main/java/io/xpipe/app/comp/base/BigIconButton.java
+++ b/app/src/main/java/io/xpipe/app/comp/base/BigIconButton.java
@@ -5,6 +5,7 @@ import io.xpipe.extension.fxcomps.CompStructure;
 import javafx.beans.value.ObservableValue;
 import javafx.geometry.Pos;
 import javafx.scene.Node;
+import javafx.scene.control.Button;
 import javafx.scene.control.Label;
 import javafx.scene.layout.StackPane;
 import javafx.scene.layout.VBox;
@@ -48,7 +49,7 @@ public class BigIconButton extends ButtonComp {
 
     @Value
     @Builder
-    public static class Structure implements CompStructure<JFXButton> {
+    public static class Structure implements CompStructure<Button> {
         JFXButton button;
         VBox stack;
         Node graphic;
diff --git a/app/src/main/java/io/xpipe/app/comp/base/ButtonComp.java b/app/src/main/java/io/xpipe/app/comp/base/ButtonComp.java
index 28aec229..f97f6aea 100644
--- a/app/src/main/java/io/xpipe/app/comp/base/ButtonComp.java
+++ b/app/src/main/java/io/xpipe/app/comp/base/ButtonComp.java
@@ -1,6 +1,5 @@
 package io.xpipe.app.comp.base;
 
-import com.jfoenix.controls.JFXButton;
 import io.xpipe.extension.fxcomps.Comp;
 import io.xpipe.extension.fxcomps.CompStructure;
 import io.xpipe.extension.fxcomps.SimpleCompStructure;
@@ -11,9 +10,10 @@ import javafx.beans.value.ObservableValue;
 import javafx.css.Size;
 import javafx.css.SizeUnits;
 import javafx.scene.Node;
+import javafx.scene.control.Button;
 import org.kordamp.ikonli.javafx.FontIcon;
 
-public class ButtonComp extends Comp<CompStructure<JFXButton>> {
+public class ButtonComp extends Comp<CompStructure<Button>> {
 
     private final ObservableValue<String> name;
     private final ObjectProperty<Node> graphic;
@@ -48,14 +48,14 @@ public class ButtonComp extends Comp<CompStructure<JFXButton>> {
     }
 
     @Override
-    public CompStructure<JFXButton> createBase() {
-        var button = new JFXButton(null);
+    public CompStructure<Button> createBase() {
+        var button = new Button(null);
         if (name != null) {
             button.textProperty().bind(name);
         }
         var graphic = getGraphic();
         if (graphic instanceof FontIcon f) {
-            f.iconColorProperty().bind(button.textFillProperty());
+            //f.iconColorProperty().bind(button.textFillProperty());
             SimpleChangeListener.apply(button.fontProperty(), c -> {
                 f.setIconSize((int) new Size(c.getSize(), SizeUnits.PT).pixels());
             });
diff --git a/app/src/main/java/io/xpipe/app/comp/base/ListSelectorComp.java b/app/src/main/java/io/xpipe/app/comp/base/ListSelectorComp.java
index 0be95ee8..bd12530f 100644
--- a/app/src/main/java/io/xpipe/app/comp/base/ListSelectorComp.java
+++ b/app/src/main/java/io/xpipe/app/comp/base/ListSelectorComp.java
@@ -1,8 +1,8 @@
 package io.xpipe.app.comp.base;
 
-import com.jfoenix.controls.JFXCheckBox;
 import io.xpipe.extension.fxcomps.SimpleComp;
 import javafx.beans.property.ListProperty;
+import javafx.scene.control.CheckBox;
 import javafx.scene.control.Label;
 import javafx.scene.control.ScrollPane;
 import javafx.scene.layout.Region;
@@ -24,8 +24,9 @@ public class ListSelectorComp<T> extends SimpleComp {
     @Override
     protected Region createSimple() {
         var vbox = new VBox();
+        vbox.getStyleClass().add("content");
         for (var v : values) {
-            var cb = new JFXCheckBox(null);
+            var cb = new CheckBox(null);
             cb.selectedProperty().addListener((c, o, n) -> {
                 if (n) {
                     selected.add(v);
diff --git a/app/src/main/java/io/xpipe/app/comp/storage/store/StoreEntryListComp.java b/app/src/main/java/io/xpipe/app/comp/storage/store/StoreEntryListComp.java
index a2e7b053..d2581501 100644
--- a/app/src/main/java/io/xpipe/app/comp/storage/store/StoreEntryListComp.java
+++ b/app/src/main/java/io/xpipe/app/comp/storage/store/StoreEntryListComp.java
@@ -1,6 +1,6 @@
 package io.xpipe.app.comp.storage.store;
 
-import io.xpipe.app.comp.base.ListViewComp;
+import io.xpipe.app.comp.base.ListBoxViewComp;
 import io.xpipe.app.comp.base.MultiContentComp;
 import io.xpipe.extension.fxcomps.Comp;
 import io.xpipe.extension.fxcomps.SimpleComp;
@@ -20,7 +20,7 @@ public class StoreEntryListComp extends SimpleComp {
                 StoreViewState.get()
                         .getFilterString()
                         .map(s -> (storeEntrySection -> storeEntrySection.shouldShow(s))));
-        var content = new ListViewComp<>(filtered, topLevel, null, (StoreEntrySection e) -> {
+        var content = new ListBoxViewComp<>(filtered, topLevel, (StoreEntrySection e) -> {
             return e.comp(true);
         });
         return content.styleClass("store-list-comp");
diff --git a/app/src/main/java/io/xpipe/app/core/AppStyle.java b/app/src/main/java/io/xpipe/app/core/AppStyle.java
index 8d0c0a7b..fdd3154a 100644
--- a/app/src/main/java/io/xpipe/app/core/AppStyle.java
+++ b/app/src/main/java/io/xpipe/app/core/AppStyle.java
@@ -1,10 +1,15 @@
 package io.xpipe.app.core;
 
+import atlantafx.base.theme.NordDark;
+import atlantafx.base.theme.NordLight;
+import atlantafx.base.theme.PrimerDark;
+import atlantafx.base.theme.PrimerLight;
 import io.xpipe.app.prefs.AppPrefs;
 import io.xpipe.extension.I18n;
 import io.xpipe.extension.event.ErrorEvent;
 import io.xpipe.extension.event.TrackEvent;
 import io.xpipe.extension.prefs.PrefsChoiceValue;
+import javafx.application.Application;
 import javafx.scene.Scene;
 import lombok.AllArgsConstructor;
 import lombok.Getter;
@@ -19,20 +24,16 @@ import java.util.*;
 
 public class AppStyle {
 
-    private static final Map<String, String> COLOR_SCHEME_CONTENTS = new HashMap<>();
     private static final Map<Path, String> STYLESHEET_CONTENTS = new HashMap<>();
     private static final List<Scene> scenes = new ArrayList<>();
     private static String FONT_CONTENTS = "";
 
     public static void init() {
-        if (COLOR_SCHEME_CONTENTS.size() > 0) {
+        if (STYLESHEET_CONTENTS.size() > 0) {
             return;
         }
 
         TrackEvent.info("Loading stylesheets ...");
-        for (var t : Theme.values()) {
-            loadTheme(t);
-        }
         loadStylesheets();
 
         if (AppPrefs.get() != null) {
@@ -45,25 +46,6 @@ public class AppStyle {
         }
     }
 
-    private static void loadTheme(Theme theme) {
-        for (var module : AppExtensionManager.getInstance().getContentModules()) {
-            AppResources.with(module.getName(), "theme", path -> {
-                var file = path.resolve(theme.getId() + ".css");
-                if (!Files.exists(file)) {
-                    return;
-                }
-
-                try {
-                    var bytes = Files.readAllBytes(file);
-                    var s = "data:text/css;base64," + Base64.getEncoder().encodeToString(bytes);
-                    COLOR_SCHEME_CONTENTS.put(theme.getId(), s);
-                } catch (IOException ex) {
-                    ErrorEvent.fromThrowable(ex).omitted(true).build().handle();
-                }
-            });
-        }
-    }
-
     private static void loadStylesheets() {
         AppResources.with(AppResources.XPIPE_MODULE, "font-config/font.css", path -> {
             var bytes = Files.readAllBytes(path);
@@ -99,8 +81,7 @@ public class AppStyle {
 
     private static void changeTheme(Theme oldTheme, Theme newTheme) {
         scenes.forEach(scene -> {
-            scene.getStylesheets().remove(COLOR_SCHEME_CONTENTS.get(oldTheme.getId()));
-            scene.getStylesheets().add(COLOR_SCHEME_CONTENTS.get(newTheme.getId()));
+            Application.setUserAgentStylesheet(newTheme.getTheme().getUserAgentStylesheet());
         });
     }
 
@@ -117,7 +98,6 @@ public class AppStyle {
     }
 
     public static void reloadStylesheets(Scene scene) {
-        COLOR_SCHEME_CONTENTS.clear();
         STYLESHEET_CONTENTS.clear();
         FONT_CONTENTS = "";
 
@@ -128,7 +108,7 @@ public class AppStyle {
 
     public static void addStylesheets(Scene scene) {
         var t = AppPrefs.get() != null ? AppPrefs.get().theme.getValue() : Theme.LIGHT;
-        scene.getStylesheets().add(COLOR_SCHEME_CONTENTS.get(t.getId()));
+        Application.setUserAgentStylesheet(t.getTheme().getUserAgentStylesheet());
         TrackEvent.debug("Set theme " + t.getId() + " for scene");
 
         if (AppPrefs.get() != null && !AppPrefs.get().useSystemFont.get()) {
@@ -146,10 +126,14 @@ public class AppStyle {
     @AllArgsConstructor
     @Getter
     public enum Theme implements PrefsChoiceValue {
-        LIGHT("light");
+        LIGHT("light", new PrimerLight()),
+        DARK("dark", new PrimerDark()),
+        NORD_LIGHT("nordLight", new NordLight()),
+        NORD_DARK("nordDark", new NordDark());
         // DARK("dark");
 
         private final String id;
+        private final atlantafx.base.theme.Theme theme;
 
         @Override
         public String toTranslatedString() {
diff --git a/app/src/main/java/io/xpipe/app/issue/ErrorHandlerComp.java b/app/src/main/java/io/xpipe/app/issue/ErrorHandlerComp.java
index 14f2c554..c3df9c8a 100644
--- a/app/src/main/java/io/xpipe/app/issue/ErrorHandlerComp.java
+++ b/app/src/main/java/io/xpipe/app/issue/ErrorHandlerComp.java
@@ -23,6 +23,9 @@ import org.kordamp.ikonli.javafx.FontIcon;
 import java.util.List;
 import java.util.concurrent.atomic.AtomicBoolean;
 
+import static atlantafx.base.theme.Styles.ACCENT;
+import static atlantafx.base.theme.Styles.BUTTON_OUTLINED;
+
 public class ErrorHandlerComp extends SimpleComp {
 
     private static final AtomicBoolean showing = new AtomicBoolean(false);
@@ -98,6 +101,7 @@ public class ErrorHandlerComp extends SimpleComp {
                 var ac = createActionComp(action);
                 actionBox.getChildren().add(ac);
             }
+            actionBox.getChildren().get(1).getStyleClass().addAll(BUTTON_OUTLINED, ACCENT);
 
             content.getChildren().addAll(actionBox, new Separator(Orientation.HORIZONTAL));
         }
diff --git a/app/src/main/java/io/xpipe/app/issue/UserReportComp.java b/app/src/main/java/io/xpipe/app/issue/UserReportComp.java
index 5542552a..fce31191 100644
--- a/app/src/main/java/io/xpipe/app/issue/UserReportComp.java
+++ b/app/src/main/java/io/xpipe/app/issue/UserReportComp.java
@@ -17,6 +17,7 @@ import javafx.beans.property.SimpleListProperty;
 import javafx.beans.property.SimpleStringProperty;
 import javafx.beans.property.StringProperty;
 import javafx.collections.FXCollections;
+import javafx.geometry.Pos;
 import javafx.scene.control.Hyperlink;
 import javafx.scene.control.Label;
 import javafx.scene.control.TextArea;
@@ -25,6 +26,9 @@ import javafx.stage.Stage;
 
 import java.nio.file.Path;
 
+import static atlantafx.base.theme.Styles.ACCENT;
+import static atlantafx.base.theme.Styles.BUTTON_OUTLINED;
+
 public class UserReportComp extends SimpleComp {
 
     private final StringProperty text = new SimpleStringProperty();
@@ -45,13 +49,16 @@ public class UserReportComp extends SimpleComp {
     }
 
     private Comp<?> createAttachments() {
-        var list = new ListSelectorComp<>(event.getAttachments(), file -> {
-                    if (file.equals(AppLogs.get().getSessionLogsDirectory())) {
-                        return I18n.get("logFilesAttachment");
-                    }
+        var list = new ListSelectorComp<>(
+                        event.getAttachments(),
+                        file -> {
+                            if (file.equals(AppLogs.get().getSessionLogsDirectory())) {
+                                return I18n.get("logFilesAttachment");
+                            }
 
-                    return file.getFileName().toString();
-                }, includedDiagnostics)
+                            return file.getFileName().toString();
+                        },
+                        includedDiagnostics)
                 .styleClass("attachment-list");
         var tp = new TitledPaneComp(I18n.observable("additionalErrorAttachments"), list, 100)
                 .apply(struc -> struc.get().setExpanded(true))
@@ -93,9 +100,12 @@ public class UserReportComp extends SimpleComp {
         dataPolicyButton.setOnAction(event1 -> {
             Hyperlinks.open(Hyperlinks.DOCS_PRIVACY);
         });
-        var sendButton = new ButtonComp(I18n.observable("sendReport"), null, this::send).createRegion();
+        var sendButton = new ButtonComp(I18n.observable("sendReport"), null, this::send)
+                .apply(struc -> struc.get().getStyleClass().addAll(BUTTON_OUTLINED, ACCENT))
+                .createRegion();
         var spacer = new Region();
         var buttons = new HBox(dataPolicyButton, spacer, sendButton);
+        buttons.setAlignment(Pos.CENTER);
         buttons.getStyleClass().add("buttons");
         HBox.setHgrow(spacer, Priority.ALWAYS);
         AppFont.medium(dataPolicyButton);
diff --git a/app/src/main/java/io/xpipe/app/prefs/AppPrefs.java b/app/src/main/java/io/xpipe/app/prefs/AppPrefs.java
index 08373dbf..541eea01 100644
--- a/app/src/main/java/io/xpipe/app/prefs/AppPrefs.java
+++ b/app/src/main/java/io/xpipe/app/prefs/AppPrefs.java
@@ -3,7 +3,6 @@ package io.xpipe.app.prefs;
 import com.dlsc.formsfx.model.structure.*;
 import com.dlsc.preferencesfx.formsfx.view.controls.SimpleComboBoxControl;
 import com.dlsc.preferencesfx.formsfx.view.controls.SimpleTextControl;
-import com.dlsc.preferencesfx.formsfx.view.controls.ToggleControl;
 import com.dlsc.preferencesfx.model.Category;
 import com.dlsc.preferencesfx.model.Group;
 import com.dlsc.preferencesfx.model.Setting;
@@ -139,10 +138,10 @@ public class AppPrefs {
     private final BooleanProperty automaticallyUpdate =
             typed(new SimpleBooleanProperty(XPipeDistributionType.get().supportsUpdate()), Boolean.class);
     private final BooleanField automaticallyUpdateField =
-            BooleanField.ofBooleanType(automaticallyUpdate).render(() -> new ToggleControl());
+            BooleanField.ofBooleanType(automaticallyUpdate).render(() -> new CustomToggleControl());
     private final BooleanProperty updateToPrereleases = typed(new SimpleBooleanProperty(false), Boolean.class);
     private final BooleanField updateToPrereleasesField =
-            BooleanField.ofBooleanType(updateToPrereleases).render(() -> new ToggleControl());
+            BooleanField.ofBooleanType(updateToPrereleases).render(() -> new CustomToggleControl());
 
     private final BooleanProperty confirmDeletions = typed(new SimpleBooleanProperty(true), Boolean.class);
 
@@ -179,31 +178,31 @@ public class AppPrefs {
             : internalDeveloperMode;
     private final BooleanField developerModeField = Field.ofBooleanType(effectiveDeveloperMode)
             .editable(System.getProperty(DEVELOPER_MODE_PROP) == null)
-            .render(() -> new ToggleControl());
+            .render(() -> new CustomToggleControl());
 
     private final BooleanProperty developerDisableUpdateVersionCheck =
             typed(new SimpleBooleanProperty(false), Boolean.class);
     private final BooleanField developerDisableUpdateVersionCheckField =
-            BooleanField.ofBooleanType(developerDisableUpdateVersionCheck).render(() -> new ToggleControl());
+            BooleanField.ofBooleanType(developerDisableUpdateVersionCheck).render(() -> new CustomToggleControl());
 
     private final BooleanProperty developerDisableGuiRestrictions =
             typed(new SimpleBooleanProperty(false), Boolean.class);
     private final BooleanField developerDisableGuiRestrictionsField =
-            BooleanField.ofBooleanType(developerDisableGuiRestrictions).render(() -> new ToggleControl());
+            BooleanField.ofBooleanType(developerDisableGuiRestrictions).render(() -> new CustomToggleControl());
 
     private final BooleanProperty developerShowHiddenProviders = typed(new SimpleBooleanProperty(false), Boolean.class);
     private final BooleanField developerShowHiddenProvidersField =
-            BooleanField.ofBooleanType(developerShowHiddenProviders).render(() -> new ToggleControl());
+            BooleanField.ofBooleanType(developerShowHiddenProviders).render(() -> new CustomToggleControl());
 
     private final BooleanProperty developerShowHiddenEntries = typed(new SimpleBooleanProperty(false), Boolean.class);
     private final BooleanField developerShowHiddenEntriesField =
-            BooleanField.ofBooleanType(developerShowHiddenEntries).render(() -> new ToggleControl());
+            BooleanField.ofBooleanType(developerShowHiddenEntries).render(() -> new CustomToggleControl());
 
     private final BooleanProperty developerDisableConnectorInstallationVersionCheck =
             typed(new SimpleBooleanProperty(false), Boolean.class);
     private final BooleanField developerDisableConnectorInstallationVersionCheckField = BooleanField.ofBooleanType(
                     developerDisableConnectorInstallationVersionCheck)
-            .render(() -> new ToggleControl());
+            .render(() -> new CustomToggleControl());
 
     public ReadOnlyProperty<CloseBehaviour> closeBehaviour() {
         return closeBehaviour;
diff --git a/app/src/main/java/io/xpipe/app/prefs/CustomFormRenderer.java b/app/src/main/java/io/xpipe/app/prefs/CustomFormRenderer.java
index d2da7558..4aaed2ee 100644
--- a/app/src/main/java/io/xpipe/app/prefs/CustomFormRenderer.java
+++ b/app/src/main/java/io/xpipe/app/prefs/CustomFormRenderer.java
@@ -52,7 +52,9 @@ public class CustomFormRenderer extends PreferencesFxFormRenderer {
                             AppFont.setSize(titleLabel, 2);
                             // Set margin for all but first group titles to visually separate groups
                             if (nextRow > 1) {
-                                GridPane.setMargin(titleLabel, new Insets(SPACING * 3, 0, 0, 0));
+                                GridPane.setMargin(titleLabel, new Insets(SPACING * 3, 0, SPACING, 0));
+                            } else {
+                                GridPane.setMargin(titleLabel, new Insets(SPACING, 0,  SPACING, 0));
                             }
                         }
 
@@ -79,7 +81,7 @@ public class CustomFormRenderer extends PreferencesFxFormRenderer {
                                 var descriptionLabel = new Label();
                                 descriptionLabel.setWrapText(true);
                                 descriptionLabel.disableProperty().bind(c.getFieldLabel().disabledProperty());
-                                descriptionLabel.opacityProperty().bind(c.getFieldLabel().opacityProperty());
+                                descriptionLabel.opacityProperty().bind(c.getFieldLabel().opacityProperty().multiply(0.8));
                                 descriptionLabel.managedProperty().bind(c.getFieldLabel().managedProperty());
                                 descriptionLabel.visibleProperty().bind(c.getFieldLabel().visibleProperty());
                                 descriptionLabel.setMaxHeight(USE_PREF_SIZE);
diff --git a/app/src/main/java/io/xpipe/app/prefs/CustomToggleControl.java b/app/src/main/java/io/xpipe/app/prefs/CustomToggleControl.java
new file mode 100644
index 00000000..768c37d5
--- /dev/null
+++ b/app/src/main/java/io/xpipe/app/prefs/CustomToggleControl.java
@@ -0,0 +1,82 @@
+package io.xpipe.app.prefs;
+
+import atlantafx.base.controls.ToggleSwitch;
+import com.dlsc.formsfx.model.structure.BooleanField;
+import com.dlsc.preferencesfx.formsfx.view.controls.SimpleControl;
+import com.dlsc.preferencesfx.formsfx.view.controls.ToggleControl;
+import com.dlsc.preferencesfx.util.VisibilityProperty;
+import javafx.scene.control.Label;
+
+/**
+ * Displays a control for boolean values with a toggle from ControlsFX.
+ *
+ * @author François Martin
+ * @author Marco Sanfratello
+ */
+public class CustomToggleControl extends SimpleControl<BooleanField, ToggleSwitch> {
+
+  /**
+   * Constructs a ToggleControl of {@link ToggleControl} type, with visibility condition.
+   *
+   * @param visibilityProperty property for control visibility of this element
+   *
+   * @return the constructed ToggleControl
+   */
+  public static ToggleControl of(VisibilityProperty visibilityProperty) {
+    ToggleControl toggleControl = new ToggleControl();
+
+    toggleControl.setVisibilityProperty(visibilityProperty);
+
+    return toggleControl;
+  }
+
+  /**
+   * {@inheritDoc}
+   */
+  @Override
+  public void initializeParts() {
+    super.initializeParts();
+    fieldLabel = new Label(field.labelProperty().getValue());
+    node = new atlantafx.base.controls.ToggleSwitch();
+    node.getStyleClass().add("toggle-control");
+    node.setSelected(field.getValue());
+  }
+
+  /**
+   * {@inheritDoc}
+   */
+  @Override
+  public void layoutParts() {
+
+  }
+
+  /**
+   * {@inheritDoc}
+   */
+  @Override
+  public void setupBindings() {
+    super.setupBindings();
+  }
+
+  /**
+   * {@inheritDoc}
+   */
+  @Override
+  public void setupValueChangedListeners() {
+    super.setupValueChangedListeners();
+    field.userInputProperty().addListener((observable, oldValue, newValue) -> {
+      node.setSelected(Boolean.parseBoolean(field.getUserInput()));
+    });
+  }
+
+  /**
+   * {@inheritDoc}
+   */
+  @Override
+  public void setupEventHandlers() {
+    node.selectedProperty().addListener((observable, oldValue, newValue) -> {
+      field.userInputProperty().setValue(String.valueOf(newValue));
+    });
+  }
+
+}
diff --git a/app/src/main/java/module-info.java b/app/src/main/java/module-info.java
index 96830e7e..dd995ca6 100644
--- a/app/src/main/java/module-info.java
+++ b/app/src/main/java/module-info.java
@@ -36,6 +36,7 @@ open module io.xpipe.app {
     requires com.sun.jna;
     requires com.sun.jna.platform;
     requires org.slf4j;
+    requires atlantafx.base;
     requires org.ocpsoft.prettytime;
     requires com.dlsc.preferencesfx;
     requires com.vladsch.flexmark;
diff --git a/app/src/main/resources/io/xpipe/app/resources/style/alert.css b/app/src/main/resources/io/xpipe/app/resources/style/alert.css
deleted file mode 100644
index e94fb256..00000000
--- a/app/src/main/resources/io/xpipe/app/resources/style/alert.css
+++ /dev/null
@@ -1,23 +0,0 @@
-.dialog-pane .button {
--fx-font-size: 0.8em;
--fx-border-width: 1px;
--fx-border-color: -xp-border;
--fx-background-color: -xp-base;
--fx-border-radius: 2px;
--fx-background-radius: 2px;
-}
-
-.dialog-pane .button:hover {
--fx-background-color: -xp-base-highlight;
--fx-border-color: -xp-border-highlight;
-}
-
-.dialog-pane .button:pressed {
--fx-background-color: -xp-base-pressed;
--fx-border-color: -xp-border-pressed;
-}
-
-.dialog-pane .button:default {
--fx-background-color: -xp-base-highlight;
--fx-border-color: -xp-border-highlight;
-}
diff --git a/app/src/main/resources/io/xpipe/app/resources/style/base/button-comp.css b/app/src/main/resources/io/xpipe/app/resources/style/base/button-comp.css
deleted file mode 100644
index b52b8f2f..00000000
--- a/app/src/main/resources/io/xpipe/app/resources/style/base/button-comp.css
+++ /dev/null
@@ -1,17 +0,0 @@
-.button-comp {
--fx-border-width: 1px;
--fx-border-color: -xp-border;
--fx-background-color: -xp-base;
--fx-border-radius: 2px;
--fx-background-radius: 2px;
-}
-
-.button-comp:hover {
--fx-background-color: -xp-base-highlight;
--fx-border-color: -xp-border-highlight;
-}
-
-.button-comp:pressed {
--fx-background-color: -xp-base-pressed;
--fx-border-color: -xp-border-pressed;
-}
\ No newline at end of file
diff --git a/app/src/main/resources/io/xpipe/app/resources/style/base/combo-box.css b/app/src/main/resources/io/xpipe/app/resources/style/base/combo-box.css
deleted file mode 100644
index 750ea0f0..00000000
--- a/app/src/main/resources/io/xpipe/app/resources/style/base/combo-box.css
+++ /dev/null
@@ -1,36 +0,0 @@
-.combo-box {
--fx-border-width: 1px;
--fx-border-color: -xp-border;
--fx-background-color: -xp-base;
--fx-border-radius: 2px;
--fx-background-radius: 2px;
-}
-
-.combo-box:hover {
--fx-background-color: -xp-base-highlight;
--fx-border-color: -xp-border-highlight;
-}
-
-.combo-box:hover:pressed {
--fx-background-color: -xp-base-pressed;
--fx-border-color: -xp-border-pressed;
-}
-
-.combo-box .list-cell {
-    -fx-border-width: 0 0 0 0;
-}
-
-.combo-box .list-cell:hover {
--fx-background-color: -xp-base-highlight;
--fx-border-color: -xp-border-highlight;
-}
-
-.combo-box .list-cell:pressed {
--fx-background-color: -xp-base-pressed;
--fx-border-color: -xp-border-pressed;
-}
-
-.combo-box-popup .list-cell:selected {
--fx-background-color: -xp-base-pressed;
--fx-border-color: -xp-border-pressed;
-}
\ No newline at end of file
diff --git a/app/src/main/resources/io/xpipe/app/resources/style/base/filter-comp.css b/app/src/main/resources/io/xpipe/app/resources/style/base/filter-comp.css
index 388f17cf..91d8fcf8 100644
--- a/app/src/main/resources/io/xpipe/app/resources/style/base/filter-comp.css
+++ b/app/src/main/resources/io/xpipe/app/resources/style/base/filter-comp.css
@@ -1,8 +1,6 @@
 .filter-comp .text-field {
 -fx-padding: 0.35em;
 -fx-background-color: transparent;
--fx-background-radius: 3px;
--fx-background-color: #0001;
 }
 
 .filter-comp .input-line {
diff --git a/app/src/main/resources/io/xpipe/app/resources/style/base/hyperlinks.css b/app/src/main/resources/io/xpipe/app/resources/style/base/hyperlinks.css
deleted file mode 100644
index 2198185e..00000000
--- a/app/src/main/resources/io/xpipe/app/resources/style/base/hyperlinks.css
+++ /dev/null
@@ -1,6 +0,0 @@
-.hyperlink {
--fx-text-fill: #4FA64F;
--fx-underline: true;
--fx-border-color: transparent;
--fx-padding: 0;
-}
\ No newline at end of file
diff --git a/app/src/main/resources/io/xpipe/app/resources/style/base/lazy-text-field-comp.css b/app/src/main/resources/io/xpipe/app/resources/style/base/lazy-text-field-comp.css
index 481d1cc0..954e00fd 100644
--- a/app/src/main/resources/io/xpipe/app/resources/style/base/lazy-text-field-comp.css
+++ b/app/src/main/resources/io/xpipe/app/resources/style/base/lazy-text-field-comp.css
@@ -1,7 +1,3 @@
-.lazy-text-field-comp {
--fx-text-fill: -xp-text-base;
-}
-
 .lazy-text-field-comp:disabled {
 -fx-opacity: 1.0;
 }
diff --git a/app/src/main/resources/io/xpipe/app/resources/style/base/multi-step-comp.css b/app/src/main/resources/io/xpipe/app/resources/style/base/multi-step-comp.css
index 27dd7c0f..508daa06 100644
--- a/app/src/main/resources/io/xpipe/app/resources/style/base/multi-step-comp.css
+++ b/app/src/main/resources/io/xpipe/app/resources/style/base/multi-step-comp.css
@@ -1,6 +1,6 @@
 .multi-step-comp > .top .line {
 -fx-max-height: 3px;
--fx-background-color: -xp-border;
+-fx-background-color: -color-accent-fg;
 }
 
 .multi-step-comp .entry {
@@ -9,25 +9,25 @@
 }
 
 .multi-step-comp > .top {
-    -fx-border-color: -xp-border;
+    -fx-border-color: -color-accent-fg;
 -fx-border-width: 0 0 0.1em 0;
--fx-background-color: -xp-base-accent;
+-fx-background-color: -color-accent-subtle;
 -fx-effect: dropshadow(three-pass-box, #333, 6, 0, 0, 2);
 }
 
 .multi-step-comp > .top .name {
--fx-text-fill: -xp-text-accent-base;
+-fx-text-fill: -color-accent-fg;
 }
 
 .multi-step-comp .entry:next .name {
--fx-text-fill: -xp-text-accent-light;
+-fx-text-fill: -color-accent-fg;
 }
 
 .multi-step-comp .buttons {
--fx-border-color: -xp-border;
+-fx-border-color: -color-accent-fg;
 -fx-border-width: 0.1em 0 0 0;
 -fx-padding: 1em;
--fx-background-color: -xp-base-accent;
+-fx-background-color: -color-accent-subtle;
 -fx-effect: dropshadow(three-pass-box, #333, 6, 0, 0, -1);
 }
 
@@ -38,7 +38,7 @@
 -fx-background-radius: 4px;
 -fx-background-color: #073B4C;
 -fx-border-width: 1px;
--fx-border-color: -xp-text-accent-light;
+-fx-border-color:-color-accent-fg;
 -fx-border-radius: 4px;
 }
 
@@ -67,11 +67,11 @@
 }
 
 .multi-step-comp > .top .entry .number {
--fx-text-fill: -xp-text-accent-base;
+-fx-text-fill: white;
 }
 
 .multi-step-comp > .top .entry:next .number {
--fx-text-fill: -xp-text-accent-light;
+-fx-text-fill: white;
 }
 
 .multi-step-comp > .top {
diff --git a/app/src/main/resources/io/xpipe/app/resources/style/base/toggle-group-comp.css b/app/src/main/resources/io/xpipe/app/resources/style/base/toggle-group-comp.css
deleted file mode 100644
index 39279ace..00000000
--- a/app/src/main/resources/io/xpipe/app/resources/style/base/toggle-group-comp.css
+++ /dev/null
@@ -1,46 +0,0 @@
-.toggle-group-comp .toggle-button {
--fx-border-width: 1px;
--fx-border-color: -xp-border;
--fx-background-color: -xp-base;
--fx-border-radius: 2px;
--fx-padding: 0.3em 1em 0.3em 1em;
-}
-
-.toggle-group-comp .toggle-button.first {
--fx-border-width: 1px 0 1px 1px;
--fx-border-radius: 2px 0 0 2px;
--fx-background-radius: 2px 0 0 2px;
-}
-
-.toggle-group-comp .toggle-button.center {
--fx-border-width: 1px 0 1px 0;
--fx-border-radius: 0;
--fx-background-radius: 0;
-}
-
-.toggle-group-comp .toggle-button.last {
--fx-border-width: 1px 1px 1px 0;
--fx-border-radius: 0px 2px 2px 0;
--fx-background-radius: 0px 2px 2px 0;
-}
-
-.toggle-group-comp .toggle-button.first.last {
--fx-border-width: 1px 1px 1px 1px;
--fx-border-radius: 2px 2px 2px 2px;
--fx-background-radius: 2px 2px 2px 2;
-}
-
-.toggle-group-comp .toggle-button:hover {
--fx-background-color: -xp-base-highlight;
--fx-border-color: -xp-border-highlight;
-}
-
-.toggle-group-comp .toggle-button:pressed {
--fx-background-color: -xp-base-pressed;
--fx-border-color: -xp-border-pressed;
-}
-
-.toggle-group-comp .toggle-button:selected {
--fx-background-color: -xp-base-pressed;
--fx-border-color: -xp-border-pressed;
-}
diff --git a/app/src/main/resources/io/xpipe/app/resources/style/base/tooltip.css b/app/src/main/resources/io/xpipe/app/resources/style/base/tooltip.css
index 035fc7f6..3cabe868 100644
--- a/app/src/main/resources/io/xpipe/app/resources/style/base/tooltip.css
+++ b/app/src/main/resources/io/xpipe/app/resources/style/base/tooltip.css
@@ -1,8 +1,3 @@
 .fancy-tooltip {
--fx-background-color: -xp-base-highlight;
--fx-text-fill: -xp-text-base;
--fx-border-width: 1px;
--fx-border-color: -xp-border-highlight;
--fx-border-radius: 4px;
--fx-font-size: 10pt;
+-fx-opacity: 1;
 }
\ No newline at end of file
diff --git a/app/src/main/resources/io/xpipe/app/resources/style/empty-alert.css b/app/src/main/resources/io/xpipe/app/resources/style/empty-alert.css
deleted file mode 100644
index a3c8dc3a..00000000
--- a/app/src/main/resources/io/xpipe/app/resources/style/empty-alert.css
+++ /dev/null
@@ -1,8 +0,0 @@
-.dialog-pane:no-header .graphic-container {
-    -fx-padding: 0;
-}
-
-.dialog-pane:no-header > *.button-bar > *.container {
--fx-border-width: 1px 0 0 0;
--fx-border-color: -xp-border;
-}
diff --git a/app/src/main/resources/io/xpipe/app/resources/style/error-handler-comp.css b/app/src/main/resources/io/xpipe/app/resources/style/error-handler-comp.css
index a9b02636..cda3fddb 100644
--- a/app/src/main/resources/io/xpipe/app/resources/style/error-handler-comp.css
+++ b/app/src/main/resources/io/xpipe/app/resources/style/error-handler-comp.css
@@ -20,14 +20,14 @@
 -fx-spacing: 0.3em;
 }
 
-.error-report .attachments .attachment-list {
--fx-padding: 0.5em;
+.error-report .attachments .attachment-list .content {
+-fx-padding: 0.5em 1em;
 }
 
 .error-report .buttons {
--fx-border-color: -xp-border;
+-fx-border-color:-color-accent-fg;
 -fx-border-width: 0.1em 0 0 0;
 -fx-padding: 1.0em 1.5em 1em 1.5em;
--fx-background-color: -xp-base-accent;
+-fx-background-color: -color-accent-subtle;
 -fx-effect: dropshadow(three-pass-box, #333, 6, 0, 0, -1);
 }
diff --git a/app/src/main/resources/io/xpipe/app/resources/style/intro.css b/app/src/main/resources/io/xpipe/app/resources/style/intro.css
index 3405c3a3..c89e7598 100644
--- a/app/src/main/resources/io/xpipe/app/resources/style/intro.css
+++ b/app/src/main/resources/io/xpipe/app/resources/style/intro.css
@@ -1,6 +1,5 @@
 .intro .label {
 -fx-line-spacing: 5px;
--fx-text-fill: -xp-text-base;
 -fx-graphic-text-gap: 8px;
 }
 
@@ -14,7 +13,6 @@
 
 .intro .label .ikonli-font-icon {
 -fx-line-spacing: 5px;
--fx-icon-color: -xp-text-base;
 }
 
 .intro-add-collection-button {
diff --git a/app/src/main/resources/io/xpipe/app/resources/style/named-choice-comp.css b/app/src/main/resources/io/xpipe/app/resources/style/named-choice-comp.css
index c1fb7c57..b63b9275 100644
--- a/app/src/main/resources/io/xpipe/app/resources/style/named-choice-comp.css
+++ b/app/src/main/resources/io/xpipe/app/resources/style/named-choice-comp.css
@@ -1,6 +1,6 @@
 .named-store-choice,.named-source-choice {
 -fx-border-width: 1px;
--fx-border-color: -xp-border;
+-fx-border-color:-color-accent-fg;
 -fx-background-color: transparent;
 -fx-border-radius: 4px;
 -fx-padding: 2px;
diff --git a/app/src/main/resources/io/xpipe/app/resources/style/sidebar-comp.css b/app/src/main/resources/io/xpipe/app/resources/style/sidebar-comp.css
index 7291ff72..ad883d3a 100644
--- a/app/src/main/resources/io/xpipe/app/resources/style/sidebar-comp.css
+++ b/app/src/main/resources/io/xpipe/app/resources/style/sidebar-comp.css
@@ -1,8 +1,8 @@
 .sidebar-comp {
 -fx-pref-width: 7em;
--fx-background-color: linear-gradient(to right,#EEEEEE, #DDD);
- -fx-border-width: 0;
--fx-border-color: #DDD;
+-fx-background-color: -color-accent-subtle;
+ -fx-border-width: 0 0 0 0.05em;
+-fx-border-color: -color-accent-emphasis;
 -fx-padding: 0;
 }
 
@@ -11,8 +11,7 @@
 }
 
 .sidebar-comp .big-icon-button-comp:selected {
--fx-background-insets: 0, 0 0 0 0.2em;
--fx-background-color: -xp-base-accent, #CCC;
+-fx-background-color: -color-accent-muted;
 }
 
 .sidebar-comp .big-icon-button-comp .icon {
@@ -20,8 +19,8 @@
 }
 
 .sidebar-comp .big-icon-button-comp * {
--fx-text-fill: -xp-text-base;
--fx-icon-color: -xp-text-base;
+-fx-text-fill: -color-fg-default;
+-fx-icon-color: -color-fg-default;
 }
 
 .sidebar-comp .big-icon-button-comp {
diff --git a/app/src/main/resources/io/xpipe/app/resources/style/simple-alert.css b/app/src/main/resources/io/xpipe/app/resources/style/simple-alert.css
index 4a03eb83..189dcf8f 100644
--- a/app/src/main/resources/io/xpipe/app/resources/style/simple-alert.css
+++ b/app/src/main/resources/io/xpipe/app/resources/style/simple-alert.css
@@ -1,5 +1,21 @@
+.dialog-pane .button {
+-fx-font-size: 0.8em;
+-fx-border-width: 1px;
+-fx-border-radius: 2px;
+-fx-background-radius: 2px;
+}
+
+.dialog-pane:no-header .graphic-container {
+    -fx-padding: 0;
+}
+
+.dialog-pane:no-header > *.button-bar > *.container {
+-fx-border-width: 1px 0 0 0;
+-fx-border-color:-color-accent-fg;
+}
+
 .dialog-pane:header .header-panel {
--fx-background-color: -xp-base-accent;
+-fx-background-color: -color-accent-subtle;
 }
 
 .dialog-pane:header .header-panel .graphic-container {
@@ -8,24 +24,24 @@
 
 .dialog-pane:header > .content {
 -fx-border-width: 2px 0 0 0;
--fx-border-color: -xp-text-accent-light;
--fx-background-color: -xp-base-accent;
+-fx-border-color:-color-accent-fg;
+-fx-background-color: -color-accent-subtle;
     -fx-border-insets: 0 1.333em 1em 1em;
     -fx-padding: 1.333em 0 0 0;
 }
 
 .content-text {
-    -fx-text-fill: white;
+    -fx-text-fill: -color-accent-fg;
 }
 
 .dialog-pane:header .content.label {
-    -fx-text-fill: white;
+    -fx-text-fill: -color-accent-fg;
 }
 
 .dialog-pane:header .header-panel .label {
     -fx-font-size: 1.0em;
     -fx-wrap-text: true;
-    -fx-text-fill: white;
+    -fx-text-fill: -color-accent-fg;
 }
 
 .dialog-pane:header {
@@ -34,7 +50,7 @@
 
 .dialog-pane:header > *.button-bar > *.container {
 -fx-border-width: 1px 0 0 0;
--fx-border-color: -xp-border-accent;
+-fx-border-color: -color-accent-fg;
 }
 
 .dialog-pane:header > *.label.content{
diff --git a/app/src/main/resources/io/xpipe/app/resources/style/source/data-source-type-choice-comp.css b/app/src/main/resources/io/xpipe/app/resources/style/source/data-source-type-choice-comp.css
index 6f74d8ff..092d2da2 100644
--- a/app/src/main/resources/io/xpipe/app/resources/style/source/data-source-type-choice-comp.css
+++ b/app/src/main/resources/io/xpipe/app/resources/style/source/data-source-type-choice-comp.css
@@ -1,17 +1,3 @@
 .data-source-type {
 -fx-padding: 0.15em 0 0.15em 0.05em;
 }
-
-.data-source-type:hover {
--fx-background-color: -xp-base-highlight;
-}
-
-.data-source-type .list-cell .label {
--fx-text-fill: -xp-text-base;
-}
-
-.data-source-type .combo-box-popup .list-view .list-cell {
--fx-padding: 0.5em;
--fx-text-fill: blue;
--fx-background-color: white;
-}
\ No newline at end of file
diff --git a/app/src/main/resources/io/xpipe/app/resources/style/storage/header-bars.css b/app/src/main/resources/io/xpipe/app/resources/style/storage/header-bars.css
index a319906d..9a0b77e1 100644
--- a/app/src/main/resources/io/xpipe/app/resources/style/storage/header-bars.css
+++ b/app/src/main/resources/io/xpipe/app/resources/style/storage/header-bars.css
@@ -1,27 +1,27 @@
 .bar {
 -fx-padding: 0.8em 1.0em 0.8em 1.0em;
--fx-background-color: -xp-base-accent;
--fx-text-fill: -xp-text-accent-base;
--fx-border-color: -xp-border-accent;
+-fx-background-color: -color-accent-subtle;
+-fx-border-color: -color-accent-emphasis;
 }
 
 .store-header-bar {
--fx-background-radius: 0 0 3px 0;
--fx-border-radius: 0 0 3px 0;
- -fx-border-width: 0 2px 2px 0;
+-fx-background-radius: 0 0 2px 0;
+-fx-border-radius: 0 0 2px 0;
+ -fx-border-width: 0 0.05em 0.05em 0;
+-fx-spacing: 0.8em;
 }
 
 .store-creation-bar {
--fx-background-radius: 0 3px 3px 0;
--fx-border-radius: 0 3px 3px 0;
- -fx-border-width: 0 2px 2px 0;
+-fx-background-radius: 0 2px 2px 0;
+-fx-border-radius: 0 2px 2px 0;
+ -fx-border-width: 0.05em 0.05em 0.05em 0;
 -fx-spacing: 0.2em;
 }
 
 .filler-bar {
--fx-background-radius: 0 3px 0 0;
--fx-border-radius: 0 3px 0 0;
- -fx-border-width: 0 2px 0 0;
+-fx-background-radius: 0 2px 0 0;
+-fx-border-radius: 0 2px 0 0;
+ -fx-border-width: 0.05em 0.05em 0 0;
 }
 
 .sidebar {
@@ -30,25 +30,24 @@
 
 .bar .button-comp {
 -fx-border-width: 0;
--fx-border-color: -xp-border;
+-fx-border-color: -color-accent-emphasis;
 -fx-background-color: transparent;
 -fx-border-radius: 2px;
 -fx-background-radius: 2px;
--fx-text-fill: -xp-text-accent-light;
 -fx-padding: 0.2em 0em 0.2em 0em;
 }
 
 .collections-bar {
--fx-background-radius: 0 0 3px 0;
--fx-border-radius: 0 0 3px 0;
+-fx-background-radius: 0 0 2px 0;
+-fx-border-radius: 0 0 2px 0;
  -fx-border-width: 0 2px 2px 0;
 }
 
 .entry-bar {
--fx-background-radius: 0 0 3px 3px;
--fx-border-radius: 0 0 3px 3px;
+-fx-background-radius: 0 0 2px 2px;
+-fx-border-radius: 0 0 2px 2px;
  -fx-border-width: 0 2px 2px 2px;
--fx-background-color: -xp-base-accent;
+-fx-background-color: -color-accent-subtle;
 }
 
 .entry-bar .horizontal-comp {
@@ -56,38 +55,28 @@
 }
 
 .bar .icon-button-comp {
--fx-text-fill: -xp-text-accent-base;
+-fx-text-fill: -color-fg-default;
 }
 
 .bar .name {
--fx-text-fill: -xp-text-accent-base;
+-fx-text-fill: -color-fg-default;
 }
 
 .bar .count-comp {
 -fx-padding: 0.0em 0em 0.0em 0.4em;
--fx-text-fill: -xp-text-accent-light;
-}
-
-.bar .filter-bar {
--fx-padding: 0.8em 0 0.0em 0;
 }
 
 .bar .filter-bar .text-field {
 -fx-padding: 0.35em;
--fx-background-color: transparent;
+-fx-text-fill: -color-fg-default;
+}
+.bar .filter-bar {
 -fx-background-radius: 0.5em;
--fx-background-color: #0004;
--fx-text-fill: -xp-text-accent-base;
+-fx-background-color: -color-bg-default;
+ -fx-border-width: 0.05em;
+-fx-border-radius: 0.5em;
+-fx-border-color: -color-accent-emphasis;
 }
-
-.bar .filter-bar .background {
--fx-text-fill: -xp-text-accent-light;
-}
-
-.bar .filter-bar .background .ikonli-font-icon {
--fx-icon-color: -xp-text-accent-light;
-}
-
 .filter-bar .input-line {
 -fx-opacity: 0.2;
 }
\ No newline at end of file
diff --git a/app/src/main/resources/io/xpipe/app/resources/style/storage/store-entry-comp.css b/app/src/main/resources/io/xpipe/app/resources/style/storage/store-entry-comp.css
index ba973769..ad7f870f 100644
--- a/app/src/main/resources/io/xpipe/app/resources/style/storage/store-entry-comp.css
+++ b/app/src/main/resources/io/xpipe/app/resources/style/storage/store-entry-comp.css
@@ -1,6 +1,6 @@
 
 .store-entry-grid .date, .store-entry-grid .summary {
--fx-text-fill: -xp-text-light;
+-fx-text-fill: -color-fg-muted;
 }
 
 .store-entry-grid:failed .jfx-text-field {
diff --git a/app/src/main/resources/io/xpipe/app/resources/style/style.css b/app/src/main/resources/io/xpipe/app/resources/style/style.css
index 1e66cbe5..4ab8a77d 100644
--- a/app/src/main/resources/io/xpipe/app/resources/style/style.css
+++ b/app/src/main/resources/io/xpipe/app/resources/style/style.css
@@ -1,21 +1,13 @@
-* {
--fx-text-fill: -xp-text-base;
-}
 
 .window-content {
 -fx-padding: 1.2em;
 }
 
-.radio-button
-{
-    -fx-text-fill: -xp-text-accent-base;
-}
-
 .message-comp {
 -fx-padding: 0.6em;
 -fx-background-color: #FF9999AA;
 -fx-border-width: 1px;
--fx-border-color: -xp-border;
+-fx-border-color:-color-accent-fg;
 -fx-border-radius: 2px;
 }
 
diff --git a/app/src/main/resources/io/xpipe/app/resources/style/tab-pane.css b/app/src/main/resources/io/xpipe/app/resources/style/tab-pane.css
index e90d6b8d..b74c2289 100644
--- a/app/src/main/resources/io/xpipe/app/resources/style/tab-pane.css
+++ b/app/src/main/resources/io/xpipe/app/resources/style/tab-pane.css
@@ -1,11 +1,6 @@
-.jfx-tab-pane .tab-header-area .jfx-rippler {
-    -jfx-rippler-fill: -xp-base-pressed;
-}
-
 .jfx-tab-pane .tab-header-background { -fx-background-color: transparent; }
 
 .jfx-tab-pane .tab-header-area .tab-selected-line {
-    -fx-background-color: -xp-base-accent;
     -fx-pref-height: 1px;
 }
 
diff --git a/app/src/main/resources/io/xpipe/app/resources/style/table-mapping.css b/app/src/main/resources/io/xpipe/app/resources/style/table-mapping.css
index f93230c0..baf1ca0b 100644
--- a/app/src/main/resources/io/xpipe/app/resources/style/table-mapping.css
+++ b/app/src/main/resources/io/xpipe/app/resources/style/table-mapping.css
@@ -14,7 +14,7 @@
 
 .table-mapping-confirmation-comp .grid-container {
 -fx-border-width: 1px;
--fx-border-color: -xp-border;
+-fx-border-color:-color-accent-fg;
 -fx-background-color: transparent;
 -fx-border-radius: 4px;
 -fx-padding: 2px;
diff --git a/app/src/main/resources/io/xpipe/app/resources/style/tag-comp.css b/app/src/main/resources/io/xpipe/app/resources/style/tag-comp.css
deleted file mode 100644
index 88ad7275..00000000
--- a/app/src/main/resources/io/xpipe/app/resources/style/tag-comp.css
+++ /dev/null
@@ -1,8 +0,0 @@
-.tag-comp {
--fx-border-width: 1px;
--fx-border-color: -xp-border;
--fx-background-color: -xp-base;
--fx-border-radius: 4px;
--fx-background-radius: 4px;
--fx-padding: 0.15em;
-}
\ No newline at end of file
diff --git a/app/src/main/resources/io/xpipe/app/resources/style/tags.css b/app/src/main/resources/io/xpipe/app/resources/style/tags.css
deleted file mode 100644
index f7628904..00000000
--- a/app/src/main/resources/io/xpipe/app/resources/style/tags.css
+++ /dev/null
@@ -1,2 +0,0 @@
-.managed-tag {
-}
\ No newline at end of file
diff --git a/app/src/main/resources/io/xpipe/app/resources/style/third-party.css b/app/src/main/resources/io/xpipe/app/resources/style/third-party.css
index e9405358..0a146edd 100644
--- a/app/src/main/resources/io/xpipe/app/resources/style/third-party.css
+++ b/app/src/main/resources/io/xpipe/app/resources/style/third-party.css
@@ -5,38 +5,6 @@
 .third-party-dependency-list-comp .titled-pane {
 -fx-background-color: transparent;
 }
-
-.third-party-dependency-list-comp .titled-pane .text-area {
-/* -fx-font-family: Monospace; */
-}
-
-.titled-pane > .title > .arrow-button .arrow {
--fx-background-color: -xp-base;
--fx-focus-color: transparent;
--fx-border-width: 1px;
--fx-border-color: -xp-border;
--fx-border-radius: 4px;
--fx-background-radius: 4px;
-}
-
-.titled-pane:hover > .title > .arrow-button .arrow {
--fx-background-color: -xp-base-highlight;
--fx-focus-color: transparent;
--fx-border-color: -xp-border-highlight;
-}
-
-.titled-pane:pressed > .title > .arrow-button .arrow {
--fx-background-color: -xp-base-pressed;
--fx-focus-color: transparent;
--fx-border-color: -xp-border-pressed;
-}
-
-.titled-pane > .title {
--fx-background-color: transparent;
--fx-background-insets: 0;
-}
-
-.titled-pane:hover > .title {
--fx-background-color: #0001;
--fx-background-insets: 0;
-}
+.titled-pane .content {
+      -fx-padding: 0em ;
+  }
diff --git a/app/src/main/resources/io/xpipe/app/resources/theme/dark.css b/app/src/main/resources/io/xpipe/app/resources/theme/dark.css
deleted file mode 100644
index 5a2fa19c..00000000
--- a/app/src/main/resources/io/xpipe/app/resources/theme/dark.css
+++ /dev/null
@@ -1,20 +0,0 @@
-* {
-    -xp-base: #111111;
-    -xp-base-highlight: #219AC250;
-    -xp-base-pressed: #419AC290;
-
-    -xp-border: #073B4C43;
-    -xp-border-highlight: #053B4C93;
-    -xp-border-pressed: #033B4C43;
-
-    -xp-text-base: #333;
-    -xp-text-light: #666;
-
-    -xp-text-base-inverted: #333;
-    -xp-text-light-inverted: grey;
-
-    -xp-base-accent: #4764C2FF;
-    -xp-border-accent: #19254DFF;
-    -xp-text-accent-base: white;
-    -xp-text-accent-light: #CCF;
-}
\ No newline at end of file
diff --git a/app/src/main/resources/io/xpipe/app/resources/theme/light.css b/app/src/main/resources/io/xpipe/app/resources/theme/light.css
deleted file mode 100644
index 0310c06c..00000000
--- a/app/src/main/resources/io/xpipe/app/resources/theme/light.css
+++ /dev/null
@@ -1,20 +0,0 @@
-* {
-    -xp-base: #DDDF;
-    -xp-base-highlight: #B9E5F3FF;
-    -xp-base-pressed: #73CAE7FF;
-
-    -xp-border: #0F498877;
-    -xp-border-highlight: #0C626C77;
-    -xp-border-pressed: #087B4F77;
-
-    -xp-text-base: #333;
-    -xp-text-light: #555;
-
-    -xp-text-base-inverted: #333;
-    -xp-text-light-inverted: grey;
-
-    -xp-base-accent: #252a30DD;
-    -xp-border-accent: #555a6099;
-    -xp-text-accent-base: white;
-    -xp-text-accent-light: #CCF;
-}
\ No newline at end of file
diff --git a/extension/src/main/java/io/xpipe/extension/fxcomps/impl/IconButtonComp.java b/extension/src/main/java/io/xpipe/extension/fxcomps/impl/IconButtonComp.java
index 72b13518..0d66c939 100644
--- a/extension/src/main/java/io/xpipe/extension/fxcomps/impl/IconButtonComp.java
+++ b/extension/src/main/java/io/xpipe/extension/fxcomps/impl/IconButtonComp.java
@@ -41,7 +41,7 @@ public class IconButtonComp extends Comp<CompStructure<JFXButton>> {
         button.fontProperty().addListener((c, o, n) -> {
             fi.setIconSize((int) new Size(n.getSize(), SizeUnits.PT).pixels());
         });
-        fi.iconColorProperty().bind(button.textFillProperty());
+        //fi.iconColorProperty().bind(button.textFillProperty());
         button.setGraphic(fi);
         button.setOnAction(e -> {
             e.consume();
diff --git a/extension/src/main/java/io/xpipe/extension/util/PrettyListView.java b/extension/src/main/java/io/xpipe/extension/util/PrettyListView.java
index 826a6d3d..4c9a430e 100644
--- a/extension/src/main/java/io/xpipe/extension/util/PrettyListView.java
+++ b/extension/src/main/java/io/xpipe/extension/util/PrettyListView.java
@@ -24,8 +24,6 @@ public class PrettyListView<T> extends ListView<T> {
             getChildren().addAll(vBar, hBar);
         });
 
-        getStyleClass().add("jfx-list-view");
-
         vBar.setManaged(false);
         vBar.setOrientation(Orientation.VERTICAL);
         vBar.getStyleClass().add("pretty-scroll-bar");
diff --git a/extension/src/main/resources/io/xpipe/extension/resources/style/code-snippet.css b/extension/src/main/resources/io/xpipe/extension/resources/style/code-snippet.css
index af5798a4..424c8d21 100644
--- a/extension/src/main/resources/io/xpipe/extension/resources/style/code-snippet.css
+++ b/extension/src/main/resources/io/xpipe/extension/resources/style/code-snippet.css
@@ -1,14 +1,14 @@
 .code-snippet {
 -fx-padding: 0.3em 0.5em 0.3em 0.5em;
 -fx-border-width: 0;
--fx-border-color: -xp-border;
+-fx-border-color:-color-accent-fg;
 -fx-spacing: 0;
 -fx-font-family: Monospace;
 }
 
 .code-snippet-container {
 -fx-border-width: 1px;
--fx-border-color: -xp-border;
+-fx-border-color:-color-accent-fg;
 -fx-background-color: transparent;
 -fx-border-radius: 4px;
 -fx-background-radius: 4px;
@@ -32,5 +32,5 @@
 
 .code-snippet-container .spacer {
 -fx-pref-width: 1px;
--fx-background-color: -xp-border;
+-fx-background-color:-color-accent-fg;
 }