From b14d3ff30f60ea8b0884e013c9b97d4efd5b8b3c Mon Sep 17 00:00:00 2001 From: Uwe Kindler Date: Wed, 26 Oct 2022 09:51:58 +0200 Subject: [PATCH] Added auto hide styling to focus_highlighting.css --- src/stylesheets/focus_highlighting.css | 270 ++++++++++++++++++++++--- 1 file changed, 243 insertions(+), 27 deletions(-) diff --git a/src/stylesheets/focus_highlighting.css b/src/stylesheets/focus_highlighting.css index 5551721..8b013dc 100644 --- a/src/stylesheets/focus_highlighting.css +++ b/src/stylesheets/focus_highlighting.css @@ -1,18 +1,34 @@ /* * Default style sheet on Windows Platforms with focus highlighting flag enabled */ + + +/***************************************************************************** + * CDockContainerWidget + *****************************************************************************/ ads--CDockContainerWidget { - background: palette(dark); + background: palette(window); } + ads--CDockContainerWidget > QSplitter{ padding: 1 0 1 0; } + + +/***************************************************************************** + * CDockAreaWidget + *****************************************************************************/ ads--CDockAreaWidget { background: palette(window); - border: 1px solid white; + /*border: 1px solid white;*/ } + + +/***************************************************************************** + * CDockWidgetTab + *****************************************************************************/ ads--CDockWidgetTab { background: palette(window); border-color: palette(light); @@ -36,6 +52,11 @@ ads--CDockWidgetTab[activeTab="true"] QLabel { color: palette(foreground); } + + +/***************************************************************************** + * CDockWidget + *****************************************************************************/ ads--CDockWidget { background: palette(light); border-color: palette(light); @@ -43,19 +64,17 @@ ads--CDockWidget { border-width: 1px 0 0 0; } -ads--CTitleBarButton { - padding: 0px 0px; -} QScrollArea#dockWidgetScrollArea { padding: 0px; border: none; } -#tabsMenuButton::menu-indicator { - image: none; -} + +/***************************************************************************** + * Dock widget tab styling + *****************************************************************************/ #tabCloseButton { margin-top: 2px; background: none; @@ -75,6 +94,53 @@ QScrollArea#dockWidgetScrollArea { background: rgba(0, 0, 0, 48); } +/* Focus related styling */ +ads--CDockWidgetTab[focused="true"] { + background: palette(highlight); + border-color: palette(highlight); +} + +ads--CDockWidgetTab[focused="true"] > #tabCloseButton { + qproperty-icon: url(:/ads/images/close-button-focused.svg) +} + +ads--CDockWidgetTab[focused="true"] > #tabCloseButton:hover { + background: rgba(255, 255, 255, 48); +} + +ads--CDockWidgetTab[focused="true"] > #tabCloseButton:pressed { + background: rgba(255, 255, 255, 92); +} + +ads--CDockWidgetTab[focused="true"] QLabel { + color: palette(light); +} + + + +/***************************************************************************** + * Dock area title bar and buttons styling + *****************************************************************************/ + ads--CDockAreaTitleBar { + background: transparent; + border-bottom: 2px solid palette(light); + padding-bottom: 0px; +} + +ads--CDockAreaWidget[focused="true"] ads--CDockAreaTitleBar { + border-bottom: 2px solid palette(highlight); +} + +ads--CTitleBarButton { + padding: 0px 0px; +} + + +#tabsMenuButton::menu-indicator { + image: none; +} + + #dockAreaCloseButton { qproperty-icon: url(:/ads/images/close-button.svg), url(:/ads/images/close-button-disabled.svg) disabled; @@ -94,36 +160,186 @@ ads--CDockSplitter::handle { /* height: 1px; */ } -/* Focus related styling */ -ads--CDockWidgetTab[focused="true"] { - background: palette(highlight); - border-color: palette(highlight); + + +/***************************************************************************** + * Styling of auto hide functionality + *****************************************************************************/ +ads--CDockWidgetSideTab { + /*background: palette(window);*/ + qproperty-iconSize: 16px 16px;/* this is optional in case you would like to change icon size*/ } -ads--CDockWidgetTab[focused="true"]>#tabCloseButton { - qproperty-icon: url(:/ads/images/close-button-focused.svg) + +ads--CDockWidgetSideTab +{ + background: none; + border: none; + padding-left: 2px; + padding-right: 0px; + text-align: center; } -ads--CDockWidgetTab[focused="true"]>#tabCloseButton:hover { - background: rgba(255, 255, 255, 48); + +ads--CDockWidgetSideTab[sideTabBarArea="0"], +ads--CDockWidgetSideTab[sideTabBarArea="2"] +{ + border-top: 5px solid rgba(0, 0, 0, 48); + margin-right: 6px; + min-height: 20; } -ads--CDockWidgetTab[focused="true"]>#tabCloseButton:pressed { - background: rgba(255, 255, 255, 92); + +ads--CDockWidgetSideTab[sideTabBarArea="1"], +ads--CDockWidgetSideTab[sideTabBarArea="3"] +{ + border-bottom: 5px solid rgba(0, 0, 0, 48); + margin-right: 6px; + min-height: 20; } -ads--CDockWidgetTab[focused="true"] QLabel { + + +ads--CDockWidgetSideTab:hover[sideTabBarArea="0"], +ads--CDockWidgetSideTab:hover[sideTabBarArea="2"] +{ + border-top: 5px solid palette(highlight); + color: palette(highlight); +} + + +ads--CDockWidgetSideTab:hover[sideTabBarArea="1"], +ads--CDockWidgetSideTab:hover[sideTabBarArea="3"] +{ + border-bottom: 5px solid palette(highlight); + color: palette(highlight); +} + +ads--CDockWidgetSideTab[sideTabBarArea="0"][activeTab="true"], +ads--CDockWidgetSideTab[sideTabBarArea="2"][activeTab="true"] +{ + border-top: 5px solid palette(highlight); +} + + +ads--CDockWidgetSideTab[sideTabBarArea="1"][activeTab="true"], +ads--CDockWidgetSideTab[sideTabBarArea="3"][activeTab="true"] +{ + border-bottom: 5px solid palette(highlight); +} + +ads--CSideTabBar +{ + background: palette(window); +} + + +ads--CSideTabBar[sideTabBarArea="0"] +{ + border-bottom: 1px solid palette(dark); +} + +ads--CSideTabBar[sideTabBarArea="1"] +{ + border-right: 1px solid palette(dark); +} + +ads--CSideTabBar[sideTabBarArea="2"] +{ + border-left: 1px solid palette(dark); +} + +ads--CSideTabBar[sideTabBarArea="3"] +{ + border-top: 1px solid palette(dark); +} + + + +#dockAreaAutoHideButton { + qproperty-icon: url(:/ads/images/vs-pin-button.svg); + qproperty-iconSize: 16px; +} + +ads--CAutoHideDockContainer #dockAreaAutoHideButton +{ + qproperty-icon: url(:/ads/images/vs-pin-button-pinned-focused.svg); + qproperty-iconSize: 16px; +} + +#autoHideTitleLabel +{ + padding-left: 4px; color: palette(light); } -ads--CDockAreaTitleBar { - background: transparent; - border-bottom: 2px solid palette(light); - padding-bottom: 0px; + +ads--CAutoHideDockContainer +{ + background: palette(window); } -ads--CDockAreaWidget[focused="true"] ads--CDockAreaTitleBar { - background: transparent; - border-bottom: 2px solid palette(highlight); - padding-bottom: 0px; + +ads--CAutoHideDockContainer ads--CDockAreaTitleBar +{ + background: palette(highlight); + padding: 0px; + border: none; } + +ads--CResizeHandle +{ + background: palette(window); +} + + +ads--CAutoHideDockContainer[sideTabBarArea="0"] ads--CResizeHandle +{ + border-top: 1px solid palette(dark); +} + +ads--CAutoHideDockContainer[sideTabBarArea="1"] ads--CResizeHandle +{ + border-left: 1px solid palette(dark); +} + +ads--CAutoHideDockContainer[sideTabBarArea="2"] ads--CResizeHandle +{ + border-right: 1px solid palette(dark); +} + +ads--CAutoHideDockContainer[sideTabBarArea="3"] ads--CResizeHandle +{ + border-top: 1px solid palette(dark); +} + + +/* + * This is required because the ads--CDockAreaWidget[focused="true"] will + * overwrite the ads--CAutoHideDockContainer ads--CDockAreaTitleBar rule + */ +ads--CAutoHideDockContainer ads--CDockAreaWidget[focused="true"] ads--CDockAreaTitleBar +{ + background: palette(highlight); + padding: 0px; + border: none; +} + + +ads--CAutoHideDockContainer #dockAreaCloseButton +{ + qproperty-icon: url(:/ads/images/close-button-focused.svg) +} + + +ads--CAutoHideDockContainer ads--CTitleBarButton:hover +{ + background: rgba(255, 255, 255, 48); +} + +ads--CAutoHideDockContainer ads--CTitleBarButton:pressed +{ + background: rgba(255, 255, 255, 96); +} + +