mirror of
https://github.com/AvengeMedia/DankMaterialShell.git
synced 2026-10-30 06:57:49 -04:00
settings: raised content pane and surface tier ladder instead of dividers
This commit is contained in:
1 parent
af27f0bac0
commit
e4ec3582b4
53 files changed
+155
-163
No files matched your search
@@ -57,7 +57,6 @@ DankFloatingWindow {
|
||||
anchors.right: parent.right
|
||||
anchors.top: headerRow.bottom
|
||||
anchors.bottom: footerRow.top
|
||||
anchors.topMargin: Theme.spacingS
|
||||
clip: true
|
||||
contentHeight: mainColumn.height + Theme.spacingL * 2
|
||||
contentWidth: width
|
||||
|
||||
@@ -103,7 +103,6 @@ ClippingRectangle {
|
||||
controls: null
|
||||
horizontalPadding: 0
|
||||
verticalPadding: 0
|
||||
showDivider: false
|
||||
title: I18n.tr("Preview", "noun, clipboard image preview window title")
|
||||
onCloseRequested: root.closeRequested()
|
||||
}
|
||||
|
||||
@@ -208,7 +208,6 @@ DankFloatingWindow {
|
||||
anchors.right: parent.right
|
||||
anchors.top: headerRow.bottom
|
||||
anchors.bottom: footerRow.top
|
||||
anchors.topMargin: Theme.spacingS
|
||||
|
||||
Loader {
|
||||
id: pageLoader
|
||||
@@ -239,7 +238,7 @@ DankFloatingWindow {
|
||||
|
||||
Row {
|
||||
anchors.right: parent.right
|
||||
anchors.rightMargin: Theme.spacingL
|
||||
anchors.rightMargin: Theme.windowInset
|
||||
anchors.verticalCenter: parent.verticalCenter
|
||||
spacing: Theme.spacingM
|
||||
|
||||
|
||||
@@ -481,7 +481,8 @@ FocusScope {
|
||||
|
||||
Item {
|
||||
anchors.fill: parent
|
||||
anchors.margins: Theme.spacingL
|
||||
anchors.margins: Theme.windowInset
|
||||
anchors.topMargin: 0
|
||||
|
||||
// Sidebar
|
||||
Item {
|
||||
@@ -590,15 +591,6 @@ FocusScope {
|
||||
}
|
||||
}
|
||||
|
||||
// Divider between All and specific categories
|
||||
Rectangle {
|
||||
width: sidebarCol.width - Theme.spacingS * 2
|
||||
height: Theme.dividerWidth
|
||||
anchors.horizontalCenter: parent.horizontalCenter
|
||||
color: Theme.outlineVariant
|
||||
opacity: 0.3
|
||||
}
|
||||
|
||||
// Category Tabs
|
||||
Repeater {
|
||||
model: content.dataModel.sortedKeys
|
||||
@@ -656,23 +648,11 @@ FocusScope {
|
||||
}
|
||||
}
|
||||
|
||||
// Vertical Divider between Sidebar and Main Content
|
||||
Rectangle {
|
||||
id: vDivider
|
||||
anchors.left: sidebar.right
|
||||
anchors.leftMargin: Theme.spacingM
|
||||
anchors.top: parent.top
|
||||
anchors.bottom: parent.bottom
|
||||
width: Theme.dividerWidth
|
||||
color: Theme.outlineVariant
|
||||
opacity: 0.4
|
||||
}
|
||||
|
||||
// Main Content Area
|
||||
Item {
|
||||
id: mainArea
|
||||
anchors.left: vDivider.right
|
||||
anchors.leftMargin: Theme.spacingM
|
||||
anchors.left: sidebar.right
|
||||
anchors.leftMargin: Theme.spacingL
|
||||
anchors.right: parent.right
|
||||
anchors.top: parent.top
|
||||
anchors.bottom: parent.bottom
|
||||
@@ -718,13 +698,6 @@ FocusScope {
|
||||
font.weight: Theme.fontWeightMedium
|
||||
color: Theme.primary
|
||||
}
|
||||
|
||||
Rectangle {
|
||||
Layout.fillWidth: true
|
||||
height: Theme.dividerWidth
|
||||
color: Theme.outlineVariant
|
||||
opacity: 0.3
|
||||
}
|
||||
}
|
||||
|
||||
// Subcategories Repeater
|
||||
|
||||
@@ -211,9 +211,8 @@ DankFloatingWindow {
|
||||
DankNavigationBar {
|
||||
id: viewNavigation
|
||||
Layout.fillWidth: true
|
||||
Layout.topMargin: Theme.spacingS
|
||||
Layout.leftMargin: Theme.spacingL
|
||||
Layout.rightMargin: Theme.spacingL
|
||||
Layout.leftMargin: Theme.windowInset
|
||||
Layout.rightMargin: Theme.windowInset
|
||||
nextFocusTarget: currentTab === 0 ? searchField : null
|
||||
model: [
|
||||
{
|
||||
@@ -240,16 +239,16 @@ DankFloatingWindow {
|
||||
ProcessSummary {
|
||||
Layout.fillWidth: true
|
||||
Layout.fillHeight: false
|
||||
Layout.leftMargin: Theme.spacingL
|
||||
Layout.rightMargin: Theme.spacingL
|
||||
Layout.leftMargin: Theme.windowInset
|
||||
Layout.rightMargin: Theme.windowInset
|
||||
Layout.topMargin: Theme.spacingS
|
||||
visible: currentTab === 0
|
||||
}
|
||||
|
||||
RowLayout {
|
||||
Layout.fillWidth: true
|
||||
Layout.leftMargin: Theme.spacingL
|
||||
Layout.rightMargin: Theme.spacingL
|
||||
Layout.leftMargin: Theme.windowInset
|
||||
Layout.rightMargin: Theme.windowInset
|
||||
Layout.topMargin: Theme.spacingS
|
||||
spacing: Theme.spacingM
|
||||
visible: currentTab === 0
|
||||
@@ -327,8 +326,8 @@ DankFloatingWindow {
|
||||
Rectangle {
|
||||
Layout.fillWidth: true
|
||||
Layout.preferredHeight: Theme.buttonHeightXS
|
||||
Layout.leftMargin: Theme.spacingL
|
||||
Layout.rightMargin: Theme.spacingL
|
||||
Layout.leftMargin: Theme.windowInset
|
||||
Layout.rightMargin: Theme.windowInset
|
||||
Layout.bottomMargin: Theme.spacingM
|
||||
color: "transparent"
|
||||
|
||||
|
||||
@@ -72,7 +72,7 @@ FocusScope {
|
||||
currentPageItem.forceActiveFocus(Qt.TabFocusReason);
|
||||
return;
|
||||
}
|
||||
} while (!item.visible || !item.enabled || !_inViewport(item));
|
||||
} while (!item.visible || !item.enabled || !_inViewport(item))
|
||||
item.forceActiveFocus(Qt.TabFocusReason);
|
||||
});
|
||||
}
|
||||
@@ -124,7 +124,7 @@ FocusScope {
|
||||
item = item.nextItemInFocusChain(forward);
|
||||
if (!item || item === start || !_contains(page, item))
|
||||
return false;
|
||||
} while (!item.visible || !item.enabled);
|
||||
} while (!item.visible || !item.enabled)
|
||||
item.forceActiveFocus(forward ? Qt.TabFocusReason : Qt.BacktabFocusReason);
|
||||
_reveal(item);
|
||||
return true;
|
||||
@@ -430,13 +430,13 @@ FocusScope {
|
||||
|
||||
Column {
|
||||
anchors.fill: parent
|
||||
anchors.leftMargin: root.isCompactMode ? Theme.spacingS : SettingsMetrics.scrollGutter
|
||||
anchors.rightMargin: root.isCompactMode ? Theme.spacingS : SettingsMetrics.scrollGutter
|
||||
anchors.leftMargin: SettingsMetrics.panePadding
|
||||
anchors.rightMargin: SettingsMetrics.panePadding
|
||||
spacing: 0
|
||||
|
||||
Item {
|
||||
id: pageHeader
|
||||
width: Math.min(root.pageContentMaxWidth, parent.width - Theme.spacingL * 2)
|
||||
width: Math.min(root.pageContentMaxWidth, parent.width)
|
||||
anchors.horizontalCenter: parent.horizontalCenter
|
||||
height: Math.max(SettingsMetrics.pageHeaderHeight, pageHeading.implicitHeight + Theme.spacingM * 2)
|
||||
|
||||
|
||||
@@ -300,19 +300,26 @@ DankFloatingWindow {
|
||||
onCloseRequested: settingsModal.hide()
|
||||
}
|
||||
|
||||
Rectangle {
|
||||
Item {
|
||||
id: readOnlyBanner
|
||||
|
||||
property bool showBanner: (SettingsData._isReadOnly && SettingsData._hasUnsavedChanges) || (SessionData._isReadOnly && SessionData._hasUnsavedChanges)
|
||||
|
||||
width: parent.width
|
||||
height: showBanner ? bannerContent.implicitHeight + Theme.spacingM * 2 : 0
|
||||
color: Theme.floatingWindowNestedSurface
|
||||
border.width: Theme.layerOutlineWidth
|
||||
border.color: Theme.outlineMedium
|
||||
visible: showBanner
|
||||
clip: true
|
||||
|
||||
Rectangle {
|
||||
anchors.fill: parent
|
||||
anchors.leftMargin: body.paneInset
|
||||
anchors.rightMargin: body.paneInset
|
||||
radius: SettingsMetrics.paneRadius
|
||||
color: SettingsMetrics.paneColor
|
||||
border.width: Theme.layerOutlineWidth
|
||||
border.color: Theme.outlineMedium
|
||||
}
|
||||
|
||||
Behavior on height {
|
||||
NumberAnimation {
|
||||
duration: SettingsMetrics.fadeDuration
|
||||
@@ -326,9 +333,10 @@ DankFloatingWindow {
|
||||
|
||||
anchors.left: parent.left
|
||||
anchors.right: parent.right
|
||||
anchors.verticalCenter: parent.verticalCenter
|
||||
anchors.leftMargin: Theme.spacingL
|
||||
anchors.rightMargin: Theme.spacingM
|
||||
anchors.bottom: parent.bottom
|
||||
anchors.bottomMargin: Theme.spacingM
|
||||
anchors.leftMargin: body.paneInset + SettingsMetrics.panePadding
|
||||
anchors.rightMargin: body.paneInset + SettingsMetrics.panePadding
|
||||
spacing: Theme.spacingM
|
||||
|
||||
DankIcon {
|
||||
@@ -387,6 +395,9 @@ DankFloatingWindow {
|
||||
|
||||
Item {
|
||||
id: body
|
||||
|
||||
readonly property real paneInset: SettingsMetrics.paneMargin
|
||||
|
||||
width: parent.width
|
||||
height: parent.height - titleBar.height - readOnlyBanner.height
|
||||
clip: true
|
||||
@@ -414,12 +425,15 @@ DankFloatingWindow {
|
||||
x: {
|
||||
const flip = I18n.isRtl ? -1 : 1;
|
||||
if (settingsModal.isCompactMode)
|
||||
return settingsModal.menuVisible ? body.width * flip : 0;
|
||||
return I18n.isRtl ? 0 : sidebar.width;
|
||||
return (settingsModal.menuVisible ? body.width * flip : 0) + body.paneInset;
|
||||
return I18n.isRtl ? body.paneInset : sidebar.width;
|
||||
}
|
||||
width: settingsModal.isCompactMode ? body.width : body.width - sidebar.width
|
||||
height: body.height
|
||||
color: settingsModal.isCompactMode ? Theme.floatingWindowSurface : "transparent"
|
||||
width: settingsModal.isCompactMode ? body.width - body.paneInset * 2 : body.width - sidebar.width - body.paneInset
|
||||
height: body.height - body.paneInset
|
||||
radius: SettingsMetrics.paneRadius
|
||||
color: SettingsMetrics.paneColor
|
||||
border.width: Theme.layerOutlineWidth
|
||||
border.color: Theme.outlineMedium
|
||||
clip: true
|
||||
|
||||
Behavior on x {
|
||||
|
||||
@@ -90,7 +90,7 @@ Item {
|
||||
ancestor = ancestor.parent;
|
||||
if (!ancestor)
|
||||
return false;
|
||||
} while (!item.visible || !item.enabled);
|
||||
} while (!item.visible || !item.enabled)
|
||||
keyboardHighlightId = "";
|
||||
item.forceActiveFocus(forward ? Qt.TabFocusReason : Qt.BacktabFocusReason);
|
||||
ensureRowVisible(item);
|
||||
@@ -219,19 +219,10 @@ Item {
|
||||
|
||||
Component.onCompleted: GreeterService.refresh()
|
||||
|
||||
Rectangle {
|
||||
anchors.right: parent.right
|
||||
anchors.top: parent.top
|
||||
anchors.bottom: parent.bottom
|
||||
width: Theme.dividerWidth
|
||||
color: Theme.outlineVariant
|
||||
visible: !(root.parentModal?.isCompactMode ?? false)
|
||||
}
|
||||
|
||||
DankSearchField {
|
||||
id: searchField
|
||||
|
||||
property real sideInset: root.searchActive ? Theme.spacingS : Theme.spacingL
|
||||
property real sideInset: root.searchActive ? Theme.spacingS : SettingsMetrics.paneMargin
|
||||
|
||||
Behavior on sideInset {
|
||||
enabled: Theme.currentAnimationSpeed !== SettingsData.AnimationSpeed.None
|
||||
@@ -247,7 +238,6 @@ Item {
|
||||
anchors.top: parent.top
|
||||
anchors.leftMargin: sideInset
|
||||
anchors.rightMargin: sideInset
|
||||
anchors.topMargin: SettingsMetrics.searchBarGap
|
||||
height: SettingsMetrics.searchBarHeight
|
||||
placeholderText: I18n.tr("Search settings", "settings search field placeholder")
|
||||
onFocusStateChanged: hasFocus => {
|
||||
@@ -342,9 +332,9 @@ Item {
|
||||
Column {
|
||||
id: sidebarColumn
|
||||
width: parent.width
|
||||
leftPadding: Theme.spacingL
|
||||
rightPadding: Theme.spacingL
|
||||
bottomPadding: Theme.spacingL
|
||||
leftPadding: SettingsMetrics.paneMargin
|
||||
rightPadding: SettingsMetrics.paneMargin
|
||||
bottomPadding: SettingsMetrics.paneMargin
|
||||
spacing: SettingsMetrics.sidebarGroupGap
|
||||
|
||||
ProfileSection {
|
||||
|
||||
Reference in new issue
Block a user