Dashboard improvements #712
This commit is contained in:
commit
1d0f5fe48c
|
@ -18,6 +18,7 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
|
||||||
|
|
||||||
### Changed
|
### Changed
|
||||||
|
|
||||||
|
- [Dashboard improvements #712](https://github.com/farmOS/farmOS/pull/712)
|
||||||
- [Misc quick form code and documentation improvements #703](https://github.com/farmOS/farmOS/pull/703)
|
- [Misc quick form code and documentation improvements #703](https://github.com/farmOS/farmOS/pull/703)
|
||||||
|
|
||||||
### Deprecated
|
### Deprecated
|
||||||
|
|
|
@ -1,8 +0,0 @@
|
||||||
.layout--twocol .layout__region {
|
|
||||||
box-sizing: border-box;
|
|
||||||
overflow-x: scroll;
|
|
||||||
}
|
|
||||||
|
|
||||||
.layout--twocol .layout__region--first {
|
|
||||||
padding-right: 1.5em;
|
|
||||||
}
|
|
|
@ -1,4 +0,0 @@
|
||||||
dashboard_layout:
|
|
||||||
css:
|
|
||||||
theme:
|
|
||||||
css/dashboard_layout.css: { }
|
|
|
@ -72,15 +72,6 @@ class DashboardController extends ControllerBase {
|
||||||
// Ask modules for dashboard groups.
|
// Ask modules for dashboard groups.
|
||||||
$build = $this->moduleHandler()->invokeAll('farm_dashboard_groups');
|
$build = $this->moduleHandler()->invokeAll('farm_dashboard_groups');
|
||||||
|
|
||||||
// Default the group #type to container if none was provided.
|
|
||||||
foreach ($build as $region => $groups) {
|
|
||||||
foreach ($groups as $name => $group) {
|
|
||||||
if (!empty($group) && empty($group['#type'])) {
|
|
||||||
$build[$region][$name]['#type'] = 'container';
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
// Ask modules for dashboard panes.
|
// Ask modules for dashboard panes.
|
||||||
$panes = $this->moduleHandler()->invokeAll('farm_dashboard_panes');
|
$panes = $this->moduleHandler()->invokeAll('farm_dashboard_panes');
|
||||||
|
|
||||||
|
@ -163,6 +154,9 @@ class DashboardController extends ControllerBase {
|
||||||
$container = [
|
$container = [
|
||||||
'#type' => 'container',
|
'#type' => 'container',
|
||||||
'#weight' => $weight,
|
'#weight' => $weight,
|
||||||
|
'#attributes' => [
|
||||||
|
'class' => ['dashboard-pane'],
|
||||||
|
],
|
||||||
];
|
];
|
||||||
|
|
||||||
// If a title is set, make it a fieldset.
|
// If a title is set, make it a fieldset.
|
||||||
|
@ -191,8 +185,6 @@ class DashboardController extends ControllerBase {
|
||||||
// Build the layout.
|
// Build the layout.
|
||||||
$render = $layoutInstance->build($regions);
|
$render = $layoutInstance->build($regions);
|
||||||
|
|
||||||
// Add the dashboard_layout styles.
|
|
||||||
$render['#attached']['library'][] = 'farm_ui_dashboard/dashboard_layout';
|
|
||||||
return $render;
|
return $render;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
|
@ -0,0 +1,47 @@
|
||||||
|
/* Add a gap between layout regions. */
|
||||||
|
.layout--twocol {
|
||||||
|
--dashboard-spacing: var(--gin-spacing-s);
|
||||||
|
gap: var(--dashboard-spacing);
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Use flexbox within each region. */
|
||||||
|
.layout--twocol .layout__region,
|
||||||
|
.layout--twocol .layout__region {
|
||||||
|
flex-basis: 100%;
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
gap: var(--dashboard-spacing);
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Split first and second regions to two columns on large screens. */
|
||||||
|
@media (min-width: 48em) {
|
||||||
|
.layout--twocol .layout__region--first,
|
||||||
|
.layout--twocol .layout__region--second {
|
||||||
|
flex-basis: 50%;
|
||||||
|
max-width: calc(50% - var(--dashboard-spacing)*.5);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Style dashboard fieldsets similar to gin-layer-wrapper. */
|
||||||
|
.layout__region > fieldset.dashboard-pane {
|
||||||
|
margin: 0;
|
||||||
|
padding-top: var(--gin-spacing-m);
|
||||||
|
background: var(--gin-bg-layer);
|
||||||
|
border: 1px solid var(--gin-border-color-layer);
|
||||||
|
box-shadow: var(--gin-shadow-l1);
|
||||||
|
border-radius: var(--gin-border-l);
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Reduce spacing within dashboard fieldsets. */
|
||||||
|
.layout__region > fieldset.dashboard-pane .fieldset__label {
|
||||||
|
padding: 0 var(--gin-spacing-m);
|
||||||
|
}
|
||||||
|
.layout__region > fieldset.dashboard-pane .fieldset__wrapper {
|
||||||
|
margin: 0 var(--gin-spacing-m) var(--gin-spacing-m) var(--gin-spacing-m);
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Increase fieldset font. */
|
||||||
|
.layout__region > fieldset.dashboard-pane .fieldset__label {
|
||||||
|
font-size: var(--gin-font-size-l);
|
||||||
|
font-weight: var(--gin-font-weight-bold);
|
||||||
|
}
|
|
@ -2,6 +2,10 @@ asset_map_popup:
|
||||||
css:
|
css:
|
||||||
theme:
|
theme:
|
||||||
css/asset_map_popup.css: { }
|
css/asset_map_popup.css: { }
|
||||||
|
dashboard:
|
||||||
|
css:
|
||||||
|
theme:
|
||||||
|
css/dashboard.css: { }
|
||||||
flag:
|
flag:
|
||||||
css:
|
css:
|
||||||
theme:
|
theme:
|
||||||
|
|
|
@ -109,6 +109,13 @@ function farm_ui_theme_preprocess_log__full(&$variables) {
|
||||||
$variables['#attached']['library'][] = 'farm_ui_theme/layout';
|
$variables['#attached']['library'][] = 'farm_ui_theme/layout';
|
||||||
}
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Implements hook_preprocess_HOOK().
|
||||||
|
*/
|
||||||
|
function farm_ui_theme_preprocess_page__dashboard(&$variables) {
|
||||||
|
$variables['#attached']['library'][] = 'farm_ui_theme/dashboard';
|
||||||
|
}
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* Implements hook_preprocess_HOOK().
|
* Implements hook_preprocess_HOOK().
|
||||||
*/
|
*/
|
||||||
|
|
Loading…
Reference in New Issue