Style fixes

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

View file

@ -20,7 +20,10 @@ import io.xpipe.app.util.ThreadHelper;
import javafx.application.Platform;
import javafx.beans.binding.Bindings;
import javafx.beans.property.BooleanProperty;
import javafx.beans.property.SimpleBooleanProperty;
import javafx.beans.property.SimpleDoubleProperty;
import javafx.geometry.Insets;
import javafx.geometry.Pos;
import javafx.scene.layout.AnchorPane;
import javafx.scene.layout.Region;
import javafx.scene.shape.Rectangle;
@ -100,7 +103,8 @@ public class BrowserSessionComp extends SimpleComp {
new VerticalComp(List.of(bookmarkTopBar, bookmarksContainer, localDownloadStage)).styleClass("left");
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().setPickOnBounds(false);
AnchorPane.setTopAnchor(struc.get(), 0.0);
@ -108,6 +112,10 @@ public class BrowserSessionComp extends SimpleComp {
AnchorPane.setLeftAnchor(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())
.apply(struc -> {
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");
return r;
}

View file

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

View file

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

View file

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

View file

@ -29,7 +29,7 @@
-fx-background-radius: 4 0 0 4;
-fx-background-insets: 0 7 8 8, 1 8 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 {

View file

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

View file

@ -19,12 +19,12 @@
}
.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;
}
.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%);
}

View file

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

View file

@ -14,7 +14,7 @@
}
.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 {
@ -22,7 +22,7 @@
}
.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 {

View file

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

View file

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

View file

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

View file

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

View file

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

View file

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

View file

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

View file

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