composer/iTop
6
0
Fork 0
mirror of https://github.com/Combodo/iTop.git synced 2026-04-22 10:08:45 +02:00
Code Issues Packages Projects Releases Wiki Activity

N°2844 - Object details: Refine object's name, class and status size and placement

Browse Source
This commit is contained in:
Molkobain
2021-02-19 16:18:50 +01:00
parent 7327025aac
commit e5d8c885bc
2 changed files with 28 additions and 12 deletions
Download Patch File Download Diff File Expand all files Collapse all files

29
css/backoffice/components/_title.scss
View File

@@ -41,22 +41,26 @@ $ibo-title--status-dot--border-radius: $ibo-border-radius-full !default;
max-width: 100%;
max-height: 100%;
}
.ibo-title--icon--must-zoomout {
width: $ibo-title--icon--size--must-zoomout;
}
.ibo-title--emphasis {
.ibo-title--for-object-details {
@extend %ibo-font-ral-med-300;
}
.ibo-title--for-object-details {
@extend %ibo-font-ral-nor-350;
.ibo-title--subtitle {
margin-top: 2px;
margin-bottom: 2px;
@extend %ibo-baseline-centered-content;
@extend %ibo-font-ral-nor-150;
}
.ibo-title--status {
@extend %ibo-baseline-centered-content;
@extend %ibo-font-ral-nor-100;
}
.ibo-title--status-dot {
@extend %ibo-fully-centered-content;
@@ -67,13 +71,23 @@ $ibo-title--status-dot--border-radius: $ibo-border-radius-full !default;
border-radius: $ibo-title--status-dot--border-radius;
}
.ibo-title--status-label {
}
.ibo-title--status-dot + .ibo-title--status-label {
margin-left: $ibo-title--status-dot--spacing;
}
.ibo-title--status + .ibo-title--object-class {
margin-left: 0.5rem;
&::before {
content: "(";
}
&::after {
content: ")";
}
}
@each $sType, $aColors in $ibo-lifecycle-states-colors {
.ibo-title--status-dot.ibo-is-state-#{$sType} {
color: map-get($aColors, 'secondary-color');
@@ -82,7 +96,6 @@ $ibo-title--status-dot--border-radius: $ibo-border-radius-full !default;
}
.ibo-title-for-dashlet {
padding-top: 2em;
}

11
templates/base/components/title/titleforobjectdetails.html.twig
View File

@@ -3,9 +3,12 @@
{% extends 'base/components/title/layout.html.twig' %}
{% block iboPageTitleText %}
<h1 class="ibo-title--for-object-details">{{ oUIBlock.GetClassName() }} <span class="ibo-title--emphasis">{{ oUIBlock.GetObjectName()|raw }}</span></h1>
<div class="ibo-title--status">
<span class="ibo-title--status-dot ibo-is-state-{{ oUIBlock.GetStatusColor() }}"></span>
<span class="ibo-title--status-label">{{ oUIBlock.GetStatusLabel() }}</span>
<h1 class="ibo-title--for-object-details">{{ oUIBlock.GetObjectName()|raw }}</h1>
<div class="ibo-title--subtitle">
<span class="ibo-title--status">
<span class="ibo-title--status-dot ibo-is-state-{{ oUIBlock.GetStatusColor() }}"></span>
<span class="ibo-title--status-label">{{ oUIBlock.GetStatusLabel() }}</span>
</span>
<span class="ibo-title--object-class">{{ oUIBlock.GetClassName() }}</span>
</div>
{% endblock %}