N°4283 Centralize blocks spacing between each other in block-integration

This commit is contained in:
Stephen Abello
2021-11-24 14:55:46 +01:00
parent ccf1bba235
commit 9dac061b04
40 changed files with 249 additions and 81 deletions

View File

@@ -0,0 +1,8 @@
/*
* @copyright Copyright (C) 2010-2021 Combodo SARL
* @license http://opensource.org/licenses/AGPL-3.0
*/
@import "panel-with-blocks";
@import "panel-within-main-content";
@import "panel-within-modal";

View File

@@ -0,0 +1,15 @@
/*
* @copyright Copyright (C) 2010-2021 Combodo SARL
* @license http://opensource.org/licenses/AGPL-3.0
*/
$ibo-panel--spacing-top--with-same-block: $ibo-spacing-600 !default;
$ibo-panel--spacing-top--with-other-block: $ibo-spacing-500 !default;
.ibo-panel + .ibo-panel {
margin-top: $ibo-panel--spacing-top--with-same-block;
}
.ibo-panel + .ibo-block:not(.ibo-panel) {
margin-top: $ibo-panel--spacing-top--with-other-block;
}

View File

@@ -0,0 +1,33 @@
/*
* @copyright Copyright (C) 2010-2021 Combodo SARL
* @license http://opensource.org/licenses/AGPL-3.0
*/
$ibo-panel-within-main-content--margin-bottom: 200px !default;
$ibo-panel-within-main-content--sticky-sentinel-top--top: -1 * $ibo-main-content--padding-top !default;
$ibo-panel-within-main-content--sticky-sentinel-top--height: $ibo-main-content--padding-top !default;
$ibo-panel-within-main-content--header--top--is-sticky: -1 * $ibo-main-content--padding-top !default;
#ibo-main-content {
/*
* Careful: Here we get all the "descendants" instead of the first closest panel in the main content, which could cause some glitches in the future.
* For now we decided to stay that way for the following reasons, if that changes in the future keep the repercussions on descendants panels in mind.
* - We don't have nested sticky panels (yet)
* - We don't want to hardcode the main content's markup selector if not necessary as it could change in the future (and is already different in read-only vs edition)
* - Unlike in JS, there no easy way to find the closest descendant
*/
.ibo-panel.ibo-has-sticky-header {
margin-bottom: $ibo-panel-within-main-content--margin-bottom; /* Add a margin below the panel so the dropdown lists can open without problem (N°4039) */
/* Stickable header rules */
> .ibo-sticky-sentinel-top {
top: $ibo-panel-within-main-content--sticky-sentinel-top--top;
height: $ibo-panel-within-main-content--sticky-sentinel-top--height;
}
> .ibo-panel--header.ibo-is-sticking {
top: $ibo-panel-within-main-content--header--top--is-sticky;
}
}
}

View File

@@ -0,0 +1,29 @@
/*
* @copyright Copyright (C) 2010-2021 Combodo SARL
* @license http://opensource.org/licenses/AGPL-3.0
*/
$ibo-panel-within-modal--sticky-sentinel-top--top: -1 * $ibo-vendors-jqueryui--ui-dialog-content--padding-y !default;
$ibo-panel-within-modal--sticky-sentinel-top--height: $ibo-vendors-jqueryui--ui-dialog-content--padding-y !default;
$ibo-panel-within-modal--header--top--is-sticky: -1 * $ibo-vendors-jqueryui--ui-dialog-content--padding-y !default;
.ui-dialog-content {
/*
* Careful: Here we get all the "descendants" instead of the first closest panel in the modal, which could cause some glitches in the future.
* For now we decided to stay that way for the following reasons, if that changes in the future keep the repercussions on descendants panels in mind.
* - We don't have nested sticky panels (yet)
* - We don't want to hardcode the modal's markup selector if not necessary as it could change in the future (and is already different in read-only vs edition)
* - Unlike in JS, there no easy way to find the closest descendant
*/
.ibo-panel.ibo-has-sticky-header {
/* Sticky header rules */
> .ibo-sticky-sentinel-top {
top: $ibo-panel-within-modal--sticky-sentinel-top--top;
height: $ibo-panel-within-modal--sticky-sentinel-top--height;
}
> .ibo-panel--header.ibo-is-sticking {
top: $ibo-panel-within-modal--header--top--is-sticky;
}
}
}