beenull/xpipe-mirror
1
0
Fork 0
mirror of https://github.com/xpipe-io/xpipe.git synced 2024-11-25 09:00:26 +00:00
Code Issues Projects Releases Packages Wiki Activity

Style fixes

Browse source
This commit is contained in:
crschnick 2024-10-30 09:59:35 +00:00
parent 0448e0f813
commit 52035d62ea
17 changed files with 62 additions and 47 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

21
app/src/main/java/io/xpipe/app/browser/session/BrowserSessionComp.java
View file

@ -20,7 +20,10 @@ import io.xpipe.app.util.ThreadHelper;
import javafx.application.Platform; import javafx.application.Platform;
import javafx.beans.binding.Bindings; import javafx.beans.binding.Bindings;
import javafx.beans.property.BooleanProperty; import javafx.beans.property.BooleanProperty;
import javafx.beans.property.SimpleBooleanProperty;
import javafx.beans.property.SimpleDoubleProperty; import javafx.beans.property.SimpleDoubleProperty;
import javafx.geometry.Insets;
import javafx.geometry.Pos;
import javafx.scene.layout.AnchorPane; import javafx.scene.layout.AnchorPane;
import javafx.scene.layout.Region; import javafx.scene.layout.Region;
import javafx.scene.shape.Rectangle; import javafx.scene.shape.Rectangle;
@ -100,7 +103,8 @@ public class BrowserSessionComp extends SimpleComp {
new VerticalComp(List.of(bookmarkTopBar, bookmarksContainer, localDownloadStage)).styleClass("left"); new VerticalComp(List.of(bookmarkTopBar, bookmarksContainer, localDownloadStage)).styleClass("left");
var split = new SimpleDoubleProperty(); var split = new SimpleDoubleProperty();
var tabs = new BrowserSessionTabsComp(model, split).apply(struc -> { var tabs = new BrowserSessionTabsComp(model, split);
tabs.apply(struc -> {
struc.get().setViewOrder(1); struc.get().setViewOrder(1);
struc.get().setPickOnBounds(false); struc.get().setPickOnBounds(false);
AnchorPane.setTopAnchor(struc.get(), 0.0); AnchorPane.setTopAnchor(struc.get(), 0.0);
@ -108,6 +112,10 @@ public class BrowserSessionComp extends SimpleComp {
AnchorPane.setLeftAnchor(struc.get(), 0.0); AnchorPane.setLeftAnchor(struc.get(), 0.0);
AnchorPane.setRightAnchor(struc.get(), 0.0); AnchorPane.setRightAnchor(struc.get(), 0.0);
}); });
vertical.apply(struc -> {
struc.get().paddingProperty().bind(Bindings.createObjectBinding(
() -> new Insets(tabs.getHeaderHeight().get(), 0, 0, 0), tabs.getHeaderHeight()));
});
var loadingIndicator = LoadingOverlayComp.noProgress(Comp.empty(), model.getBusy()) var loadingIndicator = LoadingOverlayComp.noProgress(Comp.empty(), model.getBusy())
.apply(struc -> { .apply(struc -> {
AnchorPane.setTopAnchor(struc.get(), 0.0); AnchorPane.setTopAnchor(struc.get(), 0.0);
@ -141,7 +149,16 @@ public class BrowserSessionComp extends SimpleComp {
}); });
}); });
var r = splitPane.createRegion(); var topBackground = Comp.hspacer().styleClass("top-spacer");
var stack = new StackComp(List.of(topBackground, splitPane));
stack.apply(struc -> {
struc.get().setAlignment(Pos.TOP_CENTER);
var spacer = (Region) struc.get().lookup(".top-spacer");
spacer.prefHeightProperty().bind(tabs.getHeaderHeight());
spacer.minHeightProperty().bind(spacer.prefHeightProperty());
spacer.maxHeightProperty().bind(spacer.prefHeightProperty());
});
var r = stack.createRegion();
r.getStyleClass().add("browser"); r.getStyleClass().add("browser");
return r; return r;
} }

12
app/src/main/java/io/xpipe/app/browser/session/BrowserSessionTabsComp.java
View file

@ -16,7 +16,9 @@ import io.xpipe.app.util.ContextMenuHelper;
import javafx.application.Platform; import javafx.application.Platform;
import javafx.beans.binding.Bindings; import javafx.beans.binding.Bindings;
import javafx.beans.property.DoubleProperty;
import javafx.beans.property.SimpleBooleanProperty; import javafx.beans.property.SimpleBooleanProperty;
import javafx.beans.property.SimpleDoubleProperty;
import javafx.beans.property.SimpleStringProperty; import javafx.beans.property.SimpleStringProperty;
import javafx.beans.value.ObservableDoubleValue; import javafx.beans.value.ObservableDoubleValue;
import javafx.beans.value.ObservableValue; import javafx.beans.value.ObservableValue;
@ -24,12 +26,14 @@ import javafx.collections.ListChangeListener;
import javafx.geometry.Insets; import javafx.geometry.Insets;
import javafx.geometry.Pos; import javafx.geometry.Pos;
import javafx.scene.control.*; import javafx.scene.control.*;
import javafx.scene.control.skin.TabPaneSkin;
import javafx.scene.input.*; import javafx.scene.input.*;
import javafx.scene.layout.Region; import javafx.scene.layout.Region;
import javafx.scene.layout.StackPane; import javafx.scene.layout.StackPane;
import atlantafx.base.controls.RingProgressIndicator; import atlantafx.base.controls.RingProgressIndicator;
import atlantafx.base.theme.Styles; import atlantafx.base.theme.Styles;
import lombok.Getter;
import java.util.*; import java.util.*;
@ -41,16 +45,18 @@ public class BrowserSessionTabsComp extends SimpleComp {
private final BrowserSessionModel model; private final BrowserSessionModel model;
private final ObservableDoubleValue leftPadding; private final ObservableDoubleValue leftPadding;
@Getter
private final DoubleProperty headerHeight;
public BrowserSessionTabsComp(BrowserSessionModel model, ObservableDoubleValue leftPadding) { public BrowserSessionTabsComp(BrowserSessionModel model, ObservableDoubleValue leftPadding) {
this.model = model; this.model = model;
this.leftPadding = leftPadding; this.leftPadding = leftPadding;
this.headerHeight = new SimpleDoubleProperty();
} }
public Region createSimple() { public Region createSimple() {
var map = new LinkedHashMap<Comp<?>, ObservableValue<Boolean>>(); var map = new LinkedHashMap<Comp<?>, ObservableValue<Boolean>>();
map.put(Comp.hspacer().styleClass("top-spacer"), new SimpleBooleanProperty(true)); map.put(Comp.of(() -> createTabPane()), new SimpleBooleanProperty(true));
map.put(Comp.of(() -> createTabPane()), Bindings.isNotEmpty(model.getSessionEntries()));
map.put( map.put(
new BrowserWelcomeComp(model).apply(struc -> StackPane.setAlignment(struc.get(), Pos.CENTER_LEFT)), new BrowserWelcomeComp(model).apply(struc -> StackPane.setAlignment(struc.get(), Pos.CENTER_LEFT)),
Bindings.createBooleanBinding( Bindings.createBooleanBinding(
@ -69,6 +75,7 @@ public class BrowserSessionTabsComp extends SimpleComp {
tabs.setTabMinWidth(Region.USE_PREF_SIZE); tabs.setTabMinWidth(Region.USE_PREF_SIZE);
tabs.setTabMaxWidth(400); tabs.setTabMaxWidth(400);
tabs.setTabClosingPolicy(ALL_TABS); tabs.setTabClosingPolicy(ALL_TABS);
tabs.setSkin(new TabPaneSkin(tabs));
Styles.toggleStyleClass(tabs, TabPane.STYLE_CLASS_FLOATING); Styles.toggleStyleClass(tabs, TabPane.STYLE_CLASS_FLOATING);
toggleStyleClass(tabs, DENSE); toggleStyleClass(tabs, DENSE);
@ -91,6 +98,7 @@ public class BrowserSessionTabsComp extends SimpleComp {
.paddingProperty() .paddingProperty()
.bind(Bindings.createObjectBinding( .bind(Bindings.createObjectBinding(
() -> new Insets(0, 0, 0, -leftPadding.get() + 2), leftPadding)); () -> new Insets(0, 0, 0, -leftPadding.get() + 2), leftPadding));
headerHeight.bind(headerArea.heightProperty());
}); });
} }
}); });

1
app/src/main/java/io/xpipe/app/comp/store/StoreSidebarComp.java
View file

@ -31,6 +31,7 @@ public class StoreSidebarComp extends SimpleComp {
.styleClass("gray") .styleClass("gray")
.styleClass("bar") .styleClass("bar")
.styleClass("filler-bar") .styleClass("filler-bar")
.minHeight(10)
.vgrow())); .vgrow()));
sideBar.apply(struc -> struc.get().setFillWidth(true)); sideBar.apply(struc -> struc.get().setFillWidth(true));
sideBar.styleClass("sidebar"); sideBar.styleClass("sidebar");

4
app/src/main/java/io/xpipe/app/fxcomps/Comp.java
View file

@ -97,8 +97,8 @@ public abstract class Comp<S extends CompStructure<?>> {
return apply(struc -> struc.get().setMinWidth(width)); return apply(struc -> struc.get().setMinWidth(width));
} }
public Comp<S> minHeight(double width) { public Comp<S> minHeight(double height) {
return apply(struc -> struc.get().setMinHeight(width)); return apply(struc -> struc.get().setMinHeight(height));
} }
public Comp<S> maxWidth(int width) { public Comp<S> maxWidth(int width) {

2
app/src/main/resources/io/xpipe/app/resources/style/bookmark.css
View file

@ -29,7 +29,7 @@
-fx-background-radius: 4 0 0 4; -fx-background-radius: 4 0 0 4;
-fx-background-insets: 0 7 8 8, 1 8 9 9; -fx-background-insets: 0 7 8 8, 1 8 9 9;
-fx-padding: 1 0 9 9; -fx-padding: 1 0 9 9;
-fx-background-color: -color-border-default, -fx-foreground-base; -fx-background-color: -color-border-default, -color-foreground-base;
} }
.bookmarks-header { .bookmarks-header {

25
app/src/main/resources/io/xpipe/app/resources/style/browser.css
View file

@ -20,7 +20,7 @@
-fx-background-radius: 4; -fx-background-radius: 4;
-fx-border-color: -color-border-default; -fx-border-color: -color-border-default;
-fx-border-width: 1; -fx-border-width: 1;
-fx-background-color: -fx-foreground-base; -fx-background-color: -color-foreground-base;
} }
.transfer:highlighted > .download-background { .transfer:highlighted > .download-background {
@ -48,9 +48,7 @@
} }
.browser .top-spacer { .browser .top-spacer {
-fx-background-color: transparent; -fx-background-color: -color-bg-inset;
-fx-pref-height: 2.65em;
-fx-max-height: 2.65em;
} }
.root:seamless-frame .browser .top-spacer { .root:seamless-frame .browser .top-spacer {
@ -130,7 +128,7 @@
-fx-background-radius: 0 0 4 4; -fx-background-radius: 0 0 4 4;
-fx-border-width: 1 0 0 0; -fx-border-width: 1 0 0 0;
-fx-border-color: -color-border-default; -fx-border-color: -color-border-default;
-fx-background-color: -fx-foreground-base; -fx-background-color: -color-foreground-base;
-fx-padding: 5 8; -fx-padding: 5 8;
} }
@ -196,9 +194,6 @@
} }
.browser .tab-header-area, .browser .headers-region { .browser .tab-header-area, .browser .headers-region {
-fx-min-height: 2.65em;
-fx-pref-height: 2.65em;
-fx-max-height: 2.65em;
} }
@ -216,12 +211,6 @@
-fx-background-color: transparent; -fx-background-color: transparent;
} }
.browser .left {
-fx-border-color: transparent, transparent;
-fx-border-width: 2.7em 0 0 0, 2.65em 0 0 0;
-fx-background-color: transparent;
}
.browser.chooser .left { .browser.chooser .left {
-fx-border-width: 0; -fx-border-width: 0;
} }
@ -241,7 +230,7 @@
-fx-background-insets: 0, 7 0 0 0; -fx-background-insets: 0, 7 0 0 0;
-fx-border-width: 1; -fx-border-width: 1;
-fx-border-color: -color-border-default; -fx-border-color: -color-border-default;
-fx-background-color: -fx-foreground-base, -fx-foreground-base; -fx-background-color: -color-foreground-base, -color-foreground-base;
} }
.browser .browser-content-container { .browser .browser-content-container {
@ -259,9 +248,7 @@
} }
.browser .split-pane-divider { .browser .split-pane-divider {
-fx-border-color: transparent, transparent;
-fx-padding: 0 2 0 3; -fx-padding: 0 2 0 3;
-fx-border-width: 2.7em 0 0 0, 2.65em 0 0 0;
-fx-opacity: 1.0; -fx-opacity: 1.0;
-fx-background-color: transparent; -fx-background-color: transparent;
} }
@ -272,11 +259,11 @@
.table-view .column-header { .table-view .column-header {
-fx-pref-height: 2em; -fx-pref-height: 2em;
-fx-background-color: -fx-foreground-base; -fx-background-color: -color-foreground-base;
} }
.table-view .column-header-background { .table-view .column-header-background {
-fx-background-color: -fx-foreground-base; -fx-background-color: -color-foreground-base;
} }
.table-view .column-header-background .label { .table-view .column-header-background .label {

4
app/src/main/resources/io/xpipe/app/resources/style/color-box.css
View file

@ -19,12 +19,12 @@
} }
.root:dark .color-box.gray { .root:dark .color-box.gray {
-fx-background-color: derive(-color-bg-default, 13%); -fx-background-color: -color-foreground-base;
-fx-border-color: -color-border-default; -fx-border-color: -color-border-default;
} }
.root:light .color-box.gray { .root:light .color-box.gray {
-fx-background-color: derive(-color-bg-default, -3%); -fx-background-color: -color-foreground-base;
-fx-border-color: derive(-color-border-default, -10%); -fx-border-color: derive(-color-border-default, -10%);
} }

2
app/src/main/resources/io/xpipe/app/resources/style/prefs.css
View file

@ -33,7 +33,7 @@
.prefs .sidebar { .prefs .sidebar {
-fx-spacing: 0; -fx-spacing: 0;
-fx-background-color: -fx-foreground-base; -fx-background-color: -color-foreground-base;
-fx-border-color: -color-border-default; -fx-border-color: -color-border-default;
-fx-padding: 0.2em 0 0 0; -fx-padding: 0.2em 0 0 0;
-fx-border-width: 1; -fx-border-width: 1;

4
app/src/main/resources/io/xpipe/app/resources/style/style.css
View file

@ -14,7 +14,7 @@
} }
.root:dark:separate-frame .background { .root:dark:separate-frame .background {
-fx-background-color: derive(-color-bg-default, 1%); -fx-background-color: derive(-color-bg-default, -3%);
} }
.root:light:separate-frame .background { .root:light:separate-frame .background {
@ -22,7 +22,7 @@
} }
.root:dark:separate-frame.background { .root:dark:separate-frame.background {
-fx-background-color: derive(-color-bg-default, 1%); -fx-background-color: derive(-color-bg-default, -3%);
} }
.root:light:separate-frame.background { .root:light:separate-frame.background {

4
app/src/main/resources/io/xpipe/app/resources/theme/cupertinoDark.css
View file

@ -10,9 +10,9 @@
} }
.root:dark * { .root:dark * {
-fx-foreground-base: derive(-color-bg-default, 13%); -color-foreground-base: derive(-color-bg-default, 9%);
} }
.root:light * { .root:light * {
-fx-foreground-base: derive(-color-bg-default, -3%); -color-foreground-base: derive(-color-bg-default, -3%);
} }

4
app/src/main/resources/io/xpipe/app/resources/theme/cupertinoLight.css
View file

@ -9,9 +9,9 @@
} }
.root:dark * { .root:dark * {
-fx-foreground-base: derive(-color-bg-default, 13%); -color-foreground-base: derive(-color-bg-default, 13%);
} }
.root:light * { .root:light * {
-fx-foreground-base: derive(-color-bg-default, -3%); -color-foreground-base: derive(-color-bg-default, -3%);
} }

4
app/src/main/resources/io/xpipe/app/resources/theme/dark.css
View file

@ -7,9 +7,9 @@
} }
.root:dark * { .root:dark * {
-fx-foreground-base: derive(-color-bg-default, 13%); -color-foreground-base: derive(-color-bg-default, 10%);
} }
.root:light * { .root:light * {
-fx-foreground-base: derive(-color-bg-default, -3%); -color-foreground-base: derive(-color-bg-default, -3%);
} }

4
app/src/main/resources/io/xpipe/app/resources/theme/dracula.css
View file

@ -7,9 +7,9 @@
} }
.root:dark * { .root:dark * {
-fx-foreground-base: derive(-color-bg-default, 13%); -color-foreground-base: derive(-color-bg-default, 9%);
} }
.root:light * { .root:light * {
-fx-foreground-base: derive(-color-bg-default, -3%); -color-foreground-base: derive(-color-bg-default, -3%);
} }

4
app/src/main/resources/io/xpipe/app/resources/theme/light.css
View file

@ -5,9 +5,9 @@
} }
.root:dark * { .root:dark * {
-fx-foreground-base: derive(-color-bg-default, 13%); -color-foreground-base: derive(-color-bg-default, 13%);
} }
.root:light * { .root:light * {
-fx-foreground-base: derive(-color-bg-default, -3%); -color-foreground-base: derive(-color-bg-default, -3%);
} }

6
app/src/main/resources/io/xpipe/app/resources/theme/mocha.css
View file

@ -115,15 +115,17 @@
-fx-padding: inherit; -fx-padding: inherit;
} }
.root { -color-bg-default-transparent: #0d1117d2; }
.root .table-view { .root .table-view {
-color-cell-bg-odd: derive(-color-bg-subtle, -35%); -color-cell-bg-odd: derive(-color-bg-subtle, -35%);
-color-cell-bg: derive(-color-bg-subtle, -30%); -color-cell-bg: derive(-color-bg-subtle, -30%);
} }
.root:dark * { .root:dark * {
-fx-foreground-base: derive(-color-bg-default, 13%); -color-foreground-base: derive(-color-bg-default, 9%);
} }
.root:light * { .root:light * {
-fx-foreground-base: derive(-color-bg-default, -3%); -color-foreground-base: derive(-color-bg-default, -3%);
} }

4
app/src/main/resources/io/xpipe/app/resources/theme/nordDark.css
View file

@ -6,9 +6,9 @@
} }
.root:dark * { .root:dark * {
-fx-foreground-base: derive(-color-bg-default, 13%); -color-foreground-base: derive(-color-bg-default, 9%);
} }
.root:light * { .root:light * {
-fx-foreground-base: derive(-color-bg-default, -3%); -color-foreground-base: derive(-color-bg-default, -3%);
} }

4
app/src/main/resources/io/xpipe/app/resources/theme/nordLight.css
View file

@ -5,9 +5,9 @@
} }
.root:dark * { .root:dark * {
-fx-foreground-base: derive(-color-bg-default, 13%); -color-foreground-base: derive(-color-bg-default, 13%);
} }
.root:light * { .root:light * {
-fx-foreground-base: derive(-color-bg-default, -3%); -color-foreground-base: derive(-color-bg-default, -3%);
} }