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

Fix dashboard editor SCSS classes

Browse Source
This commit is contained in:
Molkobain
2021-03-15 19:27:35 +01:00
parent 5e5277f38e
commit 0d020bb706
3 changed files with 39 additions and 40 deletions
Download Patch File Download Diff File Expand all files Collapse all files

8
application/dashboard.class.inc.php
View File

@@ -429,11 +429,11 @@ abstract class Dashboard
public function RenderProperties($oPage, $aExtraParams = array())
{
// menu to pick a layout and edit other properties of the dashboard
$oPage->add('<div class="ui-widget-content ui-corner-all ibo-dashboard--properties"><div class="ui-widget-header ui-corner-all ibo-dashboard--properties--title">'.Dict::S('UI:DashboardEdit:Properties').'</div>');
$oPage->add('<div class="ui-widget-content ui-corner-all ibo-dashboard-editor--properties"><div class="ui-widget-header ui-corner-all ibo-dashboard-editor--properties-title">'.Dict::S('UI:DashboardEdit:Properties').'</div>');
$sUrl = utils::GetAbsoluteUrlAppRoot();
$oPage->add('<div class="ibo-dashboard--properties--subtitle" data-role="ibo-dashboard--properties--subtitle">'.Dict::S('UI:DashboardEdit:Layout').'</div>');
$oPage->add('<div id="select_layout" class="ibo-dashboard--properties--layout-list" data-role="ibo-dashboard--properties--layout-list">');
$oPage->add('<div class="ibo-dashboard-editor--properties-subtitle" data-role="ibo-dashboard-editor--properties-subtitle">'.Dict::S('UI:DashboardEdit:Layout').'</div>');
$oPage->add('<div id="select_layout" class="ibo-dashboard-editor--layout-list" data-role="ibo-dashboard-editor--layout-list">');
foreach (get_declared_classes() as $sLayoutClass) {
if (is_subclass_of($sLayoutClass, 'DashboardLayout')) {
$oReflection = new ReflectionClass($sLayoutClass);
@@ -569,7 +569,7 @@ JS
$oPage->add('<div id="select_dashlet" class="ibo-dashboard--available-dashlets--list" data-role="ibo-dashboard--available-dashlets--list">');
$aAvailableDashlets = $this->GetAvailableDashlets();
foreach ($aAvailableDashlets as $sDashletClass => $aInfo) {
$oPage->add('<span dashlet_class="'.$sDashletClass.'" class="ibo-dashlet--icon dashlet_icon ui-widget-content ui-corner-all" data-role="ibo-dashlet--icon" id="dashlet_'.$sDashletClass.'" title="'.$aInfo['label'].'"><img src="'.$sUrl.$aInfo['icon'].'" /></span>');
$oPage->add('<span dashlet_class="'.$sDashletClass.'" class="ibo-dashboard-editor--available-dashlet-icon dashlet_icon ui-widget-content ui-corner-all" data-role="ibo-dashboard-editor--available-dashlet-icon" id="dashlet_'.$sDashletClass.'" title="'.$aInfo['label'].'"><img src="'.$sUrl.$aInfo['icon'].'" /></span>');
}
$oPage->add('</div>');

56
css/backoffice/layout/dashboard/_dashboard-editor.scss
View File

@@ -1,43 +1,43 @@
$ibo-dashboard-editor--pane-padding: 16px 30px 16px 15px !default;
$ibo-dashboard-editor--pane--padding: 16px 30px 16px 15px !default;
$ibo-dashlet--icon--height: 34px !default;
$ibo-dashlet--icon--width: $ibo-dashlet--icon--height !default;
$ibo-dashlet--icon--margin: 2px 5px !default;
$ibo-dashboard-editor--available-dashlet-icon--height: 34px !default;
$ibo-dashboard-editor--available-dashlet-icon--width: $ibo-dashboard-editor--available-dashlet-icon--height !default;
$ibo-dashboard-editor--available-dashlet-icon--margin: 2px 5px !default;
$ibo-dashboard--properties--title--padding-bottom: 2rem !default;
$ibo-dashboard-editor--properties-title--padding-bottom: 2rem !default;
$ibo-dashboard--properties--layout-list--padding-bottom: 12px !default;
$ibo-dashboard-editor--layout-list--padding-bottom: 12px !default;
$ibo-dashboard--properties--layout-list--button--margin: 0 15px 0 5px !default;
$ibo-dashboard-editor--layout-list--button--margin: 0 15px 0 5px !default;
$ibo-dashboard-editor--padding: 0 !default;
$ibo-dashboard-editor--dashboard--border-right: solid 1px $ibo-color-grey-200 !default;
$ibo-dashboard-editor--dashboard--padding: 16px 15px 16px 30px !default;
$ibo-dashlet--delete--top: 7px !default;
$ibo-dashlet--delete--right: 9px !default;
$ibo-dashlet--delete--padding: 2px 6px !default;
$ibo-dashlet--delete--z-index: 21 !default;
$ibo-dashboard-editor--delete-dashlet-icon--top: 7px !default;
$ibo-dashboard-editor--delete-dashlet-icon--right: 9px !default;
$ibo-dashboard-editor--delete-dashlet-icon--padding: 2px 6px !default;
$ibo-dashboard-editor--delete-dashlet-icon--z-index: 21 !default;
.ibo-dashboard-editor--pane{
flex-grow: 1;
padding: $ibo-dashboard-editor--pane-padding;
padding: $ibo-dashboard-editor--pane--padding;
overflow: auto;
}
.ibo-dashlet--icon{
.ibo-dashboard-editor--available-dashlet-icon{
display: inline-block;
height: $ibo-dashlet--icon--height;
width: $ibo-dashlet--icon--width;
margin: $ibo-dashlet--icon--margin;
height: $ibo-dashboard-editor--available-dashlet-icon--height;
width: $ibo-dashboard-editor--available-dashlet-icon--width;
margin: $ibo-dashboard-editor--available-dashlet-icon--margin;
cursor: grab;
&:active{
cursor: move;
}
}
.ibo-dashboard--properties,
.ibo-dashboard-editor--properties,
.ibo-dashboard--available-dashlets,
.ibo-dashlet--properties{
display: flex;
@@ -54,25 +54,25 @@ $ibo-dashlet--delete--z-index: 21 !default;
}
}
}
.ibo-dashboard--properties--title{
padding-bottom: $ibo-dashboard--properties--title--padding-bottom;
.ibo-dashboard-editor--properties-title{
padding-bottom: $ibo-dashboard-editor--properties-title--padding-bottom;
@extend %ibo-font-ral-med-250;
}
.ibo-dashboard--properties--subtitle,
.ibo-dashboard-editor--properties-subtitle,
.ibo-dashboard--available-dashlet--title,
.ibo-dashlet--properties--title{
@extend .ibo-fieldset-legend;
@extend %ibo-font-ral-med-150;
}
.ibo-dashboard--properties--layout-list {
.ibo-dashboard-editor--layout-list {
display: flex;
justify-content: center;
padding-bottom: $ibo-dashboard--properties--layout-list--padding-bottom;
padding-bottom: $ibo-dashboard-editor--layout-list--padding-bottom;
> .ui-button {
display: inline-block;
height: auto;
margin: $ibo-dashboard--properties--layout-list--button--margin;
margin: $ibo-dashboard-editor--layout-list--button--margin;
}
}
.ibo-dashboard--available-dashlets--list{
@@ -92,12 +92,12 @@ $ibo-dashlet--delete--z-index: 21 !default;
padding: $ibo-dashboard-editor--dashboard--padding;
}
}
.ibo-dashlet--delete{
.ibo-dashboard-editor--delete-dashlet-icon{
position: absolute;
top: $ibo-dashlet--delete--top;
right: $ibo-dashlet--delete--right;
padding: $ibo-dashlet--delete--padding;
z-index: $ibo-dashlet--delete--z-index;
top: $ibo-dashboard-editor--delete-dashlet-icon--top;
right: $ibo-dashboard-editor--delete-dashlet-icon--right;
padding: $ibo-dashboard-editor--delete-dashlet-icon--padding;
z-index: $ibo-dashboard-editor--delete-dashlet-icon--z-index;
@extend .ibo-button;
@extend .ibo-is-alternative;
@extend .ibo-is-danger;

15
js/dashlet.js
View File

@@ -28,18 +28,17 @@ $(function()
// to call when the contents are changed
_update: function()
{
var me = this;
var me = this;
this.closeBox = $('<div class="ibo-dashlet--delete close-box"/>').append('<i class="fas fa-trash ibo-button--icon"></i>');
this.closeBox = $('<div class="ibo-dashboard-editor--delete-dashlet-icon close-box"/>').append('<i class="fas fa-trash ibo-button--icon"></i>');
this.closeBox
.on('click', function() { me._remove_dashlet(); })
.on('click', function () {
me._remove_dashlet();
})
.prependTo(this.element);
if (this.element.hasClass('dashlet-selected'))
{
if (this.element.hasClass('dashlet-selected')) {
this.closeBox.show();
}
else
{
} else {
this.closeBox.hide();
}