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

Code format

Browse Source
This commit is contained in:
Molkobain
2021-04-15 09:23:22 +02:00
parent 973133ce0b
commit 2a62e28c66
4 changed files with 142 additions and 129 deletions
Download Patch File Download Diff File Expand all files Collapse all files

207
css/backoffice/layout/tab-container/_tab-container.scss
View File

@@ -49,102 +49,112 @@ $ibo-tab--temporary-remote-content--button--hover--opacity: 0.5 !default;
$ibo-tab--temporary-remote-content--button--hover--background-color: $ibo-color-grey-900 !default;
$ibo-tab--temporary-remote-content--button--hover--color: $ibo-color-grey-200 !default;
/* Rules */
.ibo-tab-container--tabs-list {
position: relative;
@extend %ibo-full-height-content;
height: $ibo-tab-container--tabs-list--height;
position: relative;
@extend %ibo-full-height-content;
height: $ibo-tab-container--tabs-list--height;
background-color: $ibo-tab-container--tabs-list--background-color;
@extend %ibo-font-ral-nor-150;
}
.ibo-tab-container--tab-header{
@extend %ibo-full-height-content;
color: $ibo-tab-container--tab-header--text-color;
&:hover{
color: $ibo-tab-container--tab-header--text-color--on-hover;
background-color: $ibo-tab-container--tab-header--background-color--on-hover;
}
&.ui-tabs-active{
@extend %ibo-font-ral-bol-150;
color: $ibo-tab-container--tab-header--text-color--is-active;
}
}
.ibo-tab-container--tab-toggler{
@extend %ibo-fully-centered-content;
padding-left: $ibo-tab-container--tab-toggler--padding-x;
padding-right: $ibo-tab-container--tab-toggler--padding-x;
@extend %ibo-text-truncated-with-ellipsis;
@extend %ibo-hyperlink-inherited-colors
}
.ibo-tab-container--extra-tabs-container{
@extend .ibo-tab-container--tab-header;
position: absolute;
top: 0;
bottom: 0;
right: 0;
background-color: $ibo-tab-container--extra-tabs-container--background-color;
}
.ibo-tab-container--extra-tabs-list-toggler{
@extend .ibo-tab-container--tab-toggler;
padding-left: $ibo-tab-container--extra-tabs-list-toggler--padding-x;
padding-right: $ibo-tab-container--extra-tabs-list-toggler--padding-x;
}
.ibo-tab-container--extra-tabs-list{
position: absolute;
z-index: 1;
top: calc(100% + 6px);
right: 12px;
max-height: $ibo-tab-container--extra-tabs-list--max-height;
display: flex;
flex-direction: column;
background-color: $ibo-tab-container--extra-tabs-list--background-color;
border-radius: $ibo-tab-container--extra-tabs-list--border-radius;
@extend %ibo-elevation-100;
}
.ibo-tab-container--extra-tab-toggler{
padding: $ibo-tab-container--extra-tab-toggler--padding;
max-width: $ibo-tab-container--extra-tab-toggler--max-width;
color: $ibo-tab-container--extra-tab-toggler--text-color;
@extend %ibo-text-truncated-with-ellipsis;
&:hover,
&:active{
color: $ibo-tab-container--extra-tab-toggler--text-color--on-hover;
background-color: $ibo-tab-container--extra-tab-toggler--background-color--on-hover;
}
background-color: $ibo-tab-container--tabs-list--background-color;
@extend %ibo-font-ral-nor-150;
}
.ibo-tab-container--tab-container{
padding: $ibo-tab-container--tab-container--padding-y $ibo-tab-container--tab-container--padding-x;
.ibo-tab-container--tab-header {
@extend %ibo-full-height-content;
color: $ibo-tab-container--tab-header--text-color;
&:hover {
color: $ibo-tab-container--tab-header--text-color--on-hover;
background-color: $ibo-tab-container--tab-header--background-color--on-hover;
}
&.ui-tabs-active {
@extend %ibo-font-ral-bol-150;
color: $ibo-tab-container--tab-header--text-color--is-active;
}
}
.ibo-is-scrollable .ibo-tab-container--tab-container--label{
.ibo-tab-container--tab-toggler {
@extend %ibo-fully-centered-content;
padding-left: $ibo-tab-container--tab-toggler--padding-x;
padding-right: $ibo-tab-container--tab-toggler--padding-x;
@extend %ibo-text-truncated-with-ellipsis;
@extend %ibo-hyperlink-inherited-colors
}
.ibo-tab-container--extra-tabs-container {
@extend .ibo-tab-container--tab-header;
position: absolute;
top: 0;
bottom: 0;
right: 0;
background-color: $ibo-tab-container--extra-tabs-container--background-color;
}
.ibo-tab-container--extra-tabs-list-toggler {
@extend .ibo-tab-container--tab-toggler;
padding-left: $ibo-tab-container--extra-tabs-list-toggler--padding-x;
padding-right: $ibo-tab-container--extra-tabs-list-toggler--padding-x;
}
.ibo-tab-container--extra-tabs-list {
position: absolute;
z-index: 1;
top: calc(100% + 6px);
right: 12px;
max-height: $ibo-tab-container--extra-tabs-list--max-height;
display: flex;
flex-direction: column;
background-color: $ibo-tab-container--extra-tabs-list--background-color;
border-radius: $ibo-tab-container--extra-tabs-list--border-radius;
@extend %ibo-elevation-100;
}
.ibo-tab-container--extra-tab-toggler {
padding: $ibo-tab-container--extra-tab-toggler--padding;
max-width: $ibo-tab-container--extra-tab-toggler--max-width;
color: $ibo-tab-container--extra-tab-toggler--text-color;
@extend %ibo-text-truncated-with-ellipsis;
&:hover,
&:active {
color: $ibo-tab-container--extra-tab-toggler--text-color--on-hover;
background-color: $ibo-tab-container--extra-tab-toggler--background-color--on-hover;
}
}
.ibo-tab-container--tab-container {
padding: $ibo-tab-container--tab-container--padding-y $ibo-tab-container--tab-container--padding-x;
}
.ibo-is-scrollable .ibo-tab-container--tab-container--label {
display: block;
}
.ibo-tab-container--tab-container--label{
.ibo-tab-container--tab-container--label {
display: none;
margin-bottom: $ibo-tab-container--tab-container--label--margin-bottom;
overflow-x: hidden;
> span{
position: relative;
padding-left: $ibo-tab-container--tab-container--label--spacing;
margin-left: $ibo-tab-container--tab-container--label--span--margin-left;
color: $ibo-tab-container--tab-container--label--text-color;
@extend %ibo-font-ral-med-250;
}
> span::before,
> span::after {
margin-bottom: $ibo-tab-container--tab-container--label--margin-bottom;
overflow-x: hidden;
> span {
position: relative;
padding-left: $ibo-tab-container--tab-container--label--spacing;
margin-left: $ibo-tab-container--tab-container--label--span--margin-left;
color: $ibo-tab-container--tab-container--label--text-color;
@extend %ibo-font-ral-med-250;
}
> span::before,
> span::after {
content: "";
display: inline-block;
position: absolute;
@@ -153,16 +163,18 @@ $ibo-tab--temporary-remote-content--button--hover--color: $ibo-color-grey-200 !d
width: 10000px;
border-top: $ibo-tab-container--tab-container--label--separator-height solid $ibo-tab-container--tab-container--label--text-color;
}
> span::before{
right: 100%;
}
> span::after{
left: 100%;
margin-left: $ibo-tab-container--tab-container--label--spacing;
}
> span::before {
right: 100%;
}
> span::after {
left: 100%;
margin-left: $ibo-tab-container--tab-container--label--spacing;
}
}
.ibo-tab--temporary-remote-content{
.ibo-tab--temporary-remote-content {
position: relative;
}
@@ -178,7 +190,7 @@ $ibo-tab--temporary-remote-content--button--hover--color: $ibo-color-grey-200 !d
}
}
.ibo-tab--temporary-remote-content--button{
.ibo-tab--temporary-remote-content--button {
position: absolute;
top: 0;
display: flex;
@@ -189,13 +201,14 @@ $ibo-tab--temporary-remote-content--button--hover--color: $ibo-color-grey-200 !d
height: 100%;
width: 100%;
cursor: pointer;
@extend %ibo-font-ral-med-300;
background-color: transparent;
color: $ibo-tab--temporary-remote-content--button--color;
&:hover{
&:hover {
opacity: $ibo-tab--temporary-remote-content--button--hover--opacity;
background-color: $ibo-tab--temporary-remote-content--button--hover--background-color;
color: $ibo-tab--temporary-remote-content--button--hover--color;

50
templates/base/layouts/tab-container/layout.html.twig
View File

@@ -3,12 +3,12 @@
<div id="{{ oUIBlock.GetId() }}" class="ibo-tab-container ibo-is-{{ oUIBlock.GetLayout() }}{% if oUIBlock.GetIsScrollable() %} ibo-is-scrollable{% endif %}"
data-role="ibo-tab-container">
{% block iboTabContainer %}
<ul class="ibo-tab-container--tabs-list" data-role="ibo-tab-container--tabs-list">
{% if not aPage.isPrintable %}
{% block iboTabContainerTabsList %}
{% for oTab in oUIBlock.GetSubBlocks() %}
{% block iboTabContainerTab %}
{% if oTab.GetType() == constant('TabManager::ENUM_TAB_TYPE_AJAX') %}
<ul class="ibo-tab-container--tabs-list" data-role="ibo-tab-container--tabs-list">
{% if not aPage.isPrintable %}
{% block iboTabContainerTabsList %}
{% for oTab in oUIBlock.GetSubBlocks() %}
{% block iboTabContainerTab %}
{% if oTab.GetType() == constant('TabManager::ENUM_TAB_TYPE_AJAX') %}
<li class="ibo-tab-container--tab-header" data-role="ibo-tab-container--tab-header"
data-tab-id="tab_{{ oTab.GetId()|sanitize(constant('utils::ENUM_SANITIZATION_FILTER_ELEMENT_IDENTIFIER')) }}"
data-tab-type="{{ oTab.GetType() }}"
@@ -27,29 +27,29 @@
</a>
</li>
{% endif %}
{% endblock %}
{% endfor %}
<li class="ibo-tab-container--extra-tabs-container ibo-tab-container--tab-header" data-role="ibo-tab-container--extra-tabs-container">
<a href="#" class="ibo-tab-container--extra-tabs-list-toggler" data-role="ibo-tab-container--extra-tabs-list-toggler">
<span class="fas fa-ellipsis-v"></span>
</a>
<div class="ibo-tab-container--extra-tabs-list ibo-is-hidden" data-role="ibo-tab-container--extra-tabs-list">
{% endblock %}
{% endfor %}
<li class="ibo-tab-container--extra-tabs-container ibo-tab-container--tab-header" data-role="ibo-tab-container--extra-tabs-container">
<a href="#" class="ibo-tab-container--extra-tabs-list-toggler" data-role="ibo-tab-container--extra-tabs-list-toggler">
<span class="fas fa-ellipsis-v"></span>
</a>
<div class="ibo-tab-container--extra-tabs-list ibo-is-hidden" data-role="ibo-tab-container--extra-tabs-list">
{% for oTab in oUIBlock.GetSubBlocks() %}
<a href="#tab_{{ oTab.GetId()|sanitize(constant('utils::ENUM_SANITIZATION_FILTER_ELEMENT_IDENTIFIER')) }}"
class="ibo-tab-container--extra-tab-toggler" data-role="ibo-tab-container--extra-tab-toggler">
<span>{{ oTab.GetTitle() }}</span>
</a>
{% endfor %}
</div>
</li>
{% endblock %}
{% endif %}
</ul>
</div>
</li>
{% endblock %}
{% endif %}
</ul>
{% block iboTabContainerTabsContainers %}
{% if not aPage.isPrintable %}
<div id="{{ oUIBlock.GetId() }}--tab-container-list" class="ibo-tab-container--tab-container-list{% if oUIBlock.GetIsScrollable() %} ibo-is-scrollable{% endif %}" data-role="ibo-tab-container--tab-container-list">
{% for oTab in oUIBlock.GetSubBlocks() %}
{% if not aPage.isPrintable %}
<div id="{{ oUIBlock.GetId() }}--tab-container-list" class="ibo-tab-container--tab-container-list{% if oUIBlock.GetIsScrollable() %} ibo-is-scrollable{% endif %}" data-role="ibo-tab-container--tab-container-list">
{% for oTab in oUIBlock.GetSubBlocks() %}
{% if oTab.GetType() == constant('TabManager::ENUM_TAB_TYPE_HTML') %}
<div id="tab_{{ oTab.GetId()|sanitize(constant('utils::ENUM_SANITIZATION_FILTER_ELEMENT_IDENTIFIER')) }}"
class="ibo-tab-container--tab-container">
@@ -57,9 +57,9 @@
{{ render_block(oTab, {aPage: aPage}) }}
</div>
{% endif %}
{% endfor %}
</div>
{% else %}
{% endfor %}
</div>
{% else %}
{% for oTab in oUIBlock.GetSubBlocks() %}
<div id="tab_{{ oTab.GetId()|sanitize(constant('utils::ENUM_SANITIZATION_FILTER_ELEMENT_IDENTIFIER')) }}"
@@ -74,7 +74,7 @@
{% endif %}
</div>
{% endfor %}
{% endif %}
{% endif %}
{% endblock %}
{% endblock %}

4
templates/base/layouts/tab-container/layout.js.twig
View File

@@ -2,9 +2,9 @@
{# @license http://opensource.org/licenses/AGPL-3.0 #}
{% if not aPage.isPrintable %}
$('#{{ oUIBlock.GetId() }}').tab_container({'remote_tab_load_dict': '{{ 'UIBlock:TabContainer:RemoteTabLoad'|dict_s|escape('js') }}'});
$('#{{ oUIBlock.GetId() }}').tab_container({'remote_tab_load_dict': '{{ 'UIBlock:TabContainer:RemoteTabLoad'|dict_s|escape('js') }}'});
{% else %}
{% for oTab in oUIBlock.GetSubBlocks() %}
{% for oTab in oUIBlock.GetSubBlocks() %}
oHiddeableChapters['tab_{{ oTab.GetId()|sanitize(constant('utils::ENUM_SANITIZATION_FILTER_ELEMENT_IDENTIFIER')) }}'] = '{{ oTab.GetTitle()|escape('js') }}';
{% if oTab.GetType() == constant('TabManager::ENUM_TAB_TYPE_AJAX') %}
$.post('{{ oTab.GetUrl()|raw }}', {printable: '1'}, function (data)

10
templates/base/layouts/tab-container/tab/layout.html.twig
View File

@@ -1,9 +1,9 @@
{# @copyright Copyright (C) 2010-2021 Combodo SARL #}
{# @license http://opensource.org/licenses/AGPL-3.0 #}
<div id="{{ oUIBlock.GetId() }}" class="ibo-tab">
{% block iboContentBlockContainer %}
{% for oSubBlock in oUIBlock.GetSubBlocks() %}
{{ render_block(oSubBlock, {aPage: aPage}) }}
{% endfor %}
{% endblock %}
{% block iboContentBlockContainer %}
{% for oSubBlock in oUIBlock.GetSubBlocks() %}
{{ render_block(oSubBlock, {aPage: aPage}) }}
{% endfor %}
{% endblock %}
</div>