N°2844 - Continue work on object details: Quick fixes for alpha, will need to be refactored

- Improve display of details in creation/modification/transition modes
This commit is contained in:
Molkobain
2020-10-15 15:51:50 +02:00
parent e7f01e7597
commit 9a47e3cf74
7 changed files with 221 additions and 95 deletions

View File

@@ -30,4 +30,5 @@
@import "activity-panel/caselog-entry";
@import "activity-panel/edits-entry";
@import "activity-panel/transition-entry";
@import "activity-panel/activity-new-entry-form";
@import "activity-panel/activity-new-entry-form";
@import "blocks-integrations/panel-with-tab-container";

View File

@@ -3,24 +3,50 @@
* @license http://opensource.org/licenses/AGPL-3.0
*/
$ibo-object-details--body--padding-top: $ibo-panel--highlight--height !default;
$ibo-object-details--tabs-list--margin-x: -1 * $ibo-panel--body--padding-x !default;
// TODO 3.0.0: This is temporary to make object forms work while it is being migrated to the blocks syste.
// When there is a real ObjectDetails block, rework this to match the block conventions.
$ibo-object-details--tab-container--margin-x: -1 * $ibo-panel--body--padding-x !default;
.ibo-object-details.ibo-panel {
> .ibo-panel--body {
padding-top: $ibo-object-details--body--padding-top;
> .ibo-tab-container {
> .ibo-tab-container--tabs-list{
margin-left: $ibo-object-details--tabs-list--margin-x;
margin-right: $ibo-object-details--tabs-list--margin-x;
}
> .ibo-tab-container--tab-container{
margin-left: $ibo-object-details--tab-container--margin-x;
margin-right: $ibo-object-details--tab-container--margin-x;
}
}
}
.object-details .ibo-title {
z-index: 1;
align-items: start;
position: relative;
padding-left: 32px;
}
.object-details .ibo-title .ibo-title--medallion {
position: absolute;
margin-top: 16px;
}
.object-details .ibo-title .ibo-title--content {
margin-left: calc(90px + 32px);
}
.object-details .ibo-panel {
z-index: 0;
}
.object-details .ibo-panel > .ibo-panel--body > .ibo-tab-container > .ibo-tab-container--tabs-list{
padding-left: calc(32px + 90px + 32px - 24px);
}
.object-details .ibo-panel > .ibo-panel--body > .ibo-tab-container.ibo-is-vertical{
display: flex;
flex-direction: row;
}
.object-details .ibo-panel > .ibo-panel--body > .ibo-tab-container.ibo-is-vertical > .ibo-tab-container--tabs-list{
padding-top: 50px;
flex-direction: column;
height: auto;
padding-left: unset;
margin-right: unset;
min-width: calc(32px + 90px + 32px);
}
.object-details .ibo-panel > .ibo-panel--body > .ibo-tab-container.ibo-is-vertical > .ibo-tab-container--tabs-list > .ibo-tab-container--tab-header{
height: 50px;
width: 100%;
justify-content: left;
}
.object-details .ibo-panel > .ibo-panel--body > .ibo-tab-container.ibo-is-vertical > .ibo-tab-container--tabs-list > .ibo-tab-container--tab-header > .ibo-tab-container--tab-toggler{
width: 100%;
justify-content: left;
}
.object-details .ibo-panel > .ibo-panel--body > .ibo-tab-container.ibo-is-vertical > .ibo-tab-container--tab-container {
flex-grow: 1;
margin-left: unset;
}

View File

@@ -0,0 +1,26 @@
/*!
* @copyright Copyright (C) 2010-2020 Combodo SARL
* @license http://opensource.org/licenses/AGPL-3.0
*/
$ibo-panel-with-tab-container--body--padding-top: $ibo-panel--highlight--height !default;
$ibo-panel-with-tab-container--tabs-list--margin-x: -1 * $ibo-panel--body--padding-x !default;
$ibo-panel-with-tab-container--tab-container--margin-x: -1 * $ibo-panel--body--padding-x !default;
.ibo-panel {
> .ibo-panel--body {
padding-top: $ibo-panel-with-tab-container--body--padding-top;
> .ibo-tab-container {
> .ibo-tab-container--tabs-list{
margin-left: $ibo-panel-with-tab-container--tabs-list--margin-x;
margin-right: $ibo-panel-with-tab-container--tabs-list--margin-x;
}
> .ibo-tab-container--tab-container{
margin-left: $ibo-panel-with-tab-container--tab-container--margin-x;
margin-right: $ibo-panel-with-tab-container--tab-container--margin-x;
}
}
}
}