diff --git a/application/displayblock.class.inc.php b/application/displayblock.class.inc.php index 15345d4d0..45ad0f830 100644 --- a/application/displayblock.class.inc.php +++ b/application/displayblock.class.inc.php @@ -6,11 +6,11 @@ use Combodo\iTop\Application\Search\SearchForm; use Combodo\iTop\Application\UI\Base\Component\Alert\AlertUIBlockFactory; -use Combodo\iTop\Application\UI\Base\Component\Badge\BadgeFactory; use Combodo\iTop\Application\UI\Base\Component\Button\ButtonUIBlockFactory; use Combodo\iTop\Application\UI\Base\Component\Dashlet\DashletFactory; use Combodo\iTop\Application\UI\Base\Component\DataTable\DataTableUIBlockFactory; use Combodo\iTop\Application\UI\Base\Component\Html\Html; +use Combodo\iTop\Application\UI\Base\Component\Pill\PillFactory; use Combodo\iTop\Application\UI\Base\Component\Toolbar\ToolbarUIBlockFactory; use Combodo\iTop\Application\UI\Base\iUIBlock; use Combodo\iTop\Application\UI\Base\Layout\UIContentBlock; @@ -1016,12 +1016,12 @@ JS $oBlock = new UIContentBlockWithJSRefreshCallback(null, ["ibo-dashlet-header-dynamic--container"]); foreach ($aStateLabels as $sStateValue => $sStateLabel) { $aCount = $aCounts[$sStateValue]; - $oBadge = BadgeFactory::MakeForState($sClass, $sStateValue); + $oBadge = PillFactory::MakeForState($sClass, $sStateValue); $sHyperlink = $aCount['link']; $sCountLabel = $aCount['label']; $sColor = $oBadge->GetColor(); - $oBadge->AddHtml("$sCountLabel"); - $oBadge->AddHtml("$sStateLabel"); + $oBadge->AddHtml("$sCountLabel"); + $oBadge->AddHtml("$sStateLabel"); $oBlock->AddSubBlock($oBadge); } $aExtraParams['query_params'] = $this->m_oFilter->GetInternalParams(); diff --git a/css/backoffice/components/_all.scss b/css/backoffice/components/_all.scss index ee6866d9a..3f9374413 100644 --- a/css/backoffice/components/_all.scss +++ b/css/backoffice/components/_all.scss @@ -4,7 +4,6 @@ */ @import "alert"; -@import "badge"; @import "button"; @import "breadcrumbs"; @import "collapsible-section"; @@ -17,6 +16,7 @@ @import "modal"; @import "dashlet/all"; @import "input/all"; +@import "pill"; @import "prop"; @import "title"; diff --git a/css/backoffice/components/_badge.scss b/css/backoffice/components/_badge.scss deleted file mode 100644 index 5896df4a1..000000000 --- a/css/backoffice/components/_badge.scss +++ /dev/null @@ -1,99 +0,0 @@ -/*! - * Copyright (C) 2013-2021 Combodo SARL - * - * This file is part of iTop. - * - * iTop is free software; you can redistribute it and/or modify - * it under the terms of the GNU Affero General Public License as published by - * the Free Software Foundation, either version 3 of the License, or - * (at your option) any later version. - * - * iTop is distributed in the hope that it will be useful, - * but WITHOUT ANY WARRANTY; without even the implied warranty of - * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the - * GNU Affero General Public License for more details. - * - * You should have received a copy of the GNU Affero General Public License - */ - -/* SCSS variables */ -$ibo-badge--margin: 4px 8px !default; -$ibo-badge--padding: 6px 10px !default; -$ibo-badge--border-radius: $ibo-border-radius-300 !default; - -$ibo-badge-new-state-primary-color: $ibo-color-blue-100 !default; -$ibo-badge-new-state-secondary-color: $ibo-color-blue-900 !default; - -$ibo-badge-neutral-state-primary-color: $ibo-color-blue-100 !default; -$ibo-badge-neutral-state-secondary-color: $ibo-color-blue-900 !default; - -$ibo-badge-waiting-state-primary-color: $ibo-color-orange-100 !default; -$ibo-badge-waiting-state-secondary-color: $ibo-color-orange-800 !default; - -$ibo-badge-success-state-primary-color: $ibo-color-green-100 !default; -$ibo-badge-success-state-secondary-color: $ibo-color-green-900 !default; - -$ibo-badge-failure-state-primary-color: $ibo-color-red-100 !default; -$ibo-badge-failure-state-secondary-color: $ibo-color-red-800 !default; - -$ibo-badge-frozen-state-primary-color: $ibo-color-grey-100 !default; -$ibo-badge-frozen-state-secondary-color: $ibo-color-grey-700 !default; - -/* - For basic badge */ -$ibo-badge-active-state-primary-color: $ibo-color-green-100 !default; -$ibo-badge-active-state-secondary-color: $ibo-color-green-900 !default; - -$ibo-badge-inactive-state-primary-color: $ibo-color-orange-100 !default; -$ibo-badge-inactive-state-secondary-color: $ibo-color-orange-800 !default; - -$ibo-badge-states-colors: ( - 'new': ( - 'primary-color': $ibo-badge-new-state-primary-color, - 'secondary-color': $ibo-badge-new-state-secondary-color, - ), - 'neutral': ( - 'primary-color': $ibo-badge-neutral-state-primary-color, - 'secondary-color': $ibo-badge-neutral-state-secondary-color, - ), - 'waiting': ( - 'primary-color': $ibo-badge-waiting-state-primary-color, - 'secondary-color': $ibo-badge-waiting-state-secondary-color, - ), - 'success': ( - 'primary-color': $ibo-badge-success-state-primary-color, - 'secondary-color': $ibo-badge-success-state-secondary-color, - ), - 'failure': ( - 'primary-color': $ibo-badge-failure-state-primary-color, - 'secondary-color': $ibo-badge-failure-state-secondary-color, - ), - 'frozen': ( - 'primary-color': $ibo-badge-frozen-state-primary-color, - 'secondary-color': $ibo-badge-frozen-state-secondary-color, - ), - 'active': ( - 'primary-color': $ibo-badge-active-state-primary-color, - 'secondary-color': $ibo-badge-active-state-secondary-color, - ), - 'inactive': ( - 'primary-color': $ibo-badge-inactive-state-primary-color, - 'secondary-color': $ibo-badge-inactive-state-secondary-color, - ), -); - -@each $sType, $aColors in $ibo-badge-states-colors { - .ibo-badge-is-#{$sType} { - color: map-get($aColors, 'secondary-color'); - background-color: map-get($aColors, 'primary-color'); - } -} - -/* Rules */ -.ibo-badge { - display: flex; - flex-direction: row; - align-items: center; - margin: $ibo-badge--margin; - padding: $ibo-badge--padding; - border-radius: $ibo-badge--border-radius; -} \ No newline at end of file diff --git a/css/backoffice/components/_pill.scss b/css/backoffice/components/_pill.scss new file mode 100644 index 000000000..af2305feb --- /dev/null +++ b/css/backoffice/components/_pill.scss @@ -0,0 +1,99 @@ +/*! + * Copyright (C) 2013-2021 Combodo SARL + * + * This file is part of iTop. + * + * iTop is free software; you can redistribute it and/or modify + * it under the terms of the GNU Affero General Public License as published by + * the Free Software Foundation, either version 3 of the License, or + * (at your option) any later version. + * + * iTop is distributed in the hope that it will be useful, + * but WITHOUT ANY WARRANTY; without even the implied warranty of + * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the + * GNU Affero General Public License for more details. + * + * You should have received a copy of the GNU Affero General Public License + */ + +/* SCSS variables */ +$ibo-pill--margin: 4px 8px !default; +$ibo-pill--padding: 6px 10px !default; +$ibo-pill--border-radius: $ibo-border-radius-300 !default; + +$ibo-pill-new-state-primary-color: $ibo-color-blue-100 !default; +$ibo-pill-new-state-secondary-color: $ibo-color-blue-900 !default; + +$ibo-pill-neutral-state-primary-color: $ibo-color-blue-100 !default; +$ibo-pill-neutral-state-secondary-color: $ibo-color-blue-900 !default; + +$ibo-pill-waiting-state-primary-color: $ibo-color-orange-100 !default; +$ibo-pill-waiting-state-secondary-color: $ibo-color-orange-800 !default; + +$ibo-pill-success-state-primary-color: $ibo-color-green-100 !default; +$ibo-pill-success-state-secondary-color: $ibo-color-green-900 !default; + +$ibo-pill-failure-state-primary-color: $ibo-color-red-100 !default; +$ibo-pill-failure-state-secondary-color: $ibo-color-red-800 !default; + +$ibo-pill-frozen-state-primary-color: $ibo-color-grey-100 !default; +$ibo-pill-frozen-state-secondary-color: $ibo-color-grey-700 !default; + +/* - For basic badge */ +$ibo-pill-active-state-primary-color: $ibo-color-green-100 !default; +$ibo-pill-active-state-secondary-color: $ibo-color-green-900 !default; + +$ibo-pill-inactive-state-primary-color: $ibo-color-orange-100 !default; +$ibo-pill-inactive-state-secondary-color: $ibo-color-orange-800 !default; + +$ibo-pill-states-colors: ( + 'new': ( + 'primary-color': $ibo-pill-new-state-primary-color, + 'secondary-color': $ibo-pill-new-state-secondary-color, + ), + 'neutral': ( + 'primary-color': $ibo-pill-neutral-state-primary-color, + 'secondary-color': $ibo-pill-neutral-state-secondary-color, + ), + 'waiting': ( + 'primary-color': $ibo-pill-waiting-state-primary-color, + 'secondary-color': $ibo-pill-waiting-state-secondary-color, + ), + 'success': ( + 'primary-color': $ibo-pill-success-state-primary-color, + 'secondary-color': $ibo-pill-success-state-secondary-color, + ), + 'failure': ( + 'primary-color': $ibo-pill-failure-state-primary-color, + 'secondary-color': $ibo-pill-failure-state-secondary-color, + ), + 'frozen': ( + 'primary-color': $ibo-pill-frozen-state-primary-color, + 'secondary-color': $ibo-pill-frozen-state-secondary-color, + ), + 'active': ( + 'primary-color': $ibo-pill-active-state-primary-color, + 'secondary-color': $ibo-pill-active-state-secondary-color, + ), + 'inactive': ( + 'primary-color': $ibo-pill-inactive-state-primary-color, + 'secondary-color': $ibo-pill-inactive-state-secondary-color, + ), +); + +@each $sType, $aColors in $ibo-pill-states-colors { + .ibo-pill-is-#{$sType} { + color: map-get($aColors, 'secondary-color'); + background-color: map-get($aColors, 'primary-color'); + } +} + +/* Rules */ +.ibo-pill { + display: flex; + flex-direction: row; + align-items: center; + margin: $ibo-pill--margin; + padding: $ibo-pill--padding; + border-radius: $ibo-pill--border-radius; +} \ No newline at end of file diff --git a/lib/composer/autoload_classmap.php b/lib/composer/autoload_classmap.php index d5c76c9bf..01c42333c 100644 --- a/lib/composer/autoload_classmap.php +++ b/lib/composer/autoload_classmap.php @@ -157,8 +157,6 @@ return array( 'Combodo\\iTop\\Application\\UI\\Base\\AbstractUIBlockFactory' => $baseDir . '/sources/application/UI/Base/AbstractUIBlockFactory.php', 'Combodo\\iTop\\Application\\UI\\Base\\Component\\Alert\\Alert' => $baseDir . '/sources/application/UI/Base/Component/Alert/Alert.php', 'Combodo\\iTop\\Application\\UI\\Base\\Component\\Alert\\AlertUIBlockFactory' => $baseDir . '/sources/application/UI/Base/Component/Alert/AlertUIBlockFactory.php', - 'Combodo\\iTop\\Application\\UI\\Base\\Component\\Badge\\Badge' => $baseDir . '/sources/application/UI/Base/Component/Badge/Badge.php', - 'Combodo\\iTop\\Application\\UI\\Base\\Component\\Badge\\BadgeFactory' => $baseDir . '/sources/application/UI/Base/Component/Badge/BadgeFactory.php', 'Combodo\\iTop\\Application\\UI\\Base\\Component\\Breadcrumbs\\Breadcrumbs' => $baseDir . '/sources/application/UI/Base/Component/Breadcrumbs/Breadcrumbs.php', 'Combodo\\iTop\\Application\\UI\\Base\\Component\\Button\\Button' => $baseDir . '/sources/application/UI/Base/Component/Button/Button.php', 'Combodo\\iTop\\Application\\UI\\Base\\Component\\Button\\ButtonUIBlockFactory' => $baseDir . '/sources/application/UI/Base/Component/Button/ButtonUIBlockFactory.php', @@ -202,6 +200,8 @@ return array( 'Combodo\\iTop\\Application\\UI\\Base\\Component\\MedallionIcon\\MedallionIcon' => $baseDir . '/sources/application/UI/Base/Component/MedallionIcon/MedallionIcon.php', 'Combodo\\iTop\\Application\\UI\\Base\\Component\\Panel\\Panel' => $baseDir . '/sources/application/UI/Base/Component/Panel/Panel.php', 'Combodo\\iTop\\Application\\UI\\Base\\Component\\Panel\\PanelUIBlockFactory' => $baseDir . '/sources/application/UI/Base/Component/Panel/PanelUIBlockFactory.php', + 'Combodo\\iTop\\Application\\UI\\Base\\Component\\Pill\\Pill' => $baseDir . '/sources/application/UI/Base/Component/Pill/Pill.php', + 'Combodo\\iTop\\Application\\UI\\Base\\Component\\Pill\\PillFactory' => $baseDir . '/sources/application/UI/Base/Component/Pill/PillFactory.php', 'Combodo\\iTop\\Application\\UI\\Base\\Component\\PopoverMenu\\NewsroomMenu\\NewsroomMenu' => $baseDir . '/sources/application/UI/Base/Component/PopoverMenu/NewsroomMenu/NewsroomMenu.php', 'Combodo\\iTop\\Application\\UI\\Base\\Component\\PopoverMenu\\NewsroomMenu\\NewsroomMenuFactory' => $baseDir . '/sources/application/UI/Base/Component/PopoverMenu/NewsroomMenu/NewsroomMenuFactory.php', 'Combodo\\iTop\\Application\\UI\\Base\\Component\\PopoverMenu\\PopoverMenu' => $baseDir . '/sources/application/UI/Base/Component/PopoverMenu/PopoverMenu.php', diff --git a/lib/composer/autoload_static.php b/lib/composer/autoload_static.php index 0d853571b..9392a7daa 100644 --- a/lib/composer/autoload_static.php +++ b/lib/composer/autoload_static.php @@ -387,8 +387,6 @@ class ComposerStaticInit0018331147de7601e7552f7da8e3bb8b 'Combodo\\iTop\\Application\\UI\\Base\\AbstractUIBlockFactory' => __DIR__ . '/../..' . '/sources/application/UI/Base/AbstractUIBlockFactory.php', 'Combodo\\iTop\\Application\\UI\\Base\\Component\\Alert\\Alert' => __DIR__ . '/../..' . '/sources/application/UI/Base/Component/Alert/Alert.php', 'Combodo\\iTop\\Application\\UI\\Base\\Component\\Alert\\AlertUIBlockFactory' => __DIR__ . '/../..' . '/sources/application/UI/Base/Component/Alert/AlertUIBlockFactory.php', - 'Combodo\\iTop\\Application\\UI\\Base\\Component\\Badge\\Badge' => __DIR__ . '/../..' . '/sources/application/UI/Base/Component/Badge/Badge.php', - 'Combodo\\iTop\\Application\\UI\\Base\\Component\\Badge\\BadgeFactory' => __DIR__ . '/../..' . '/sources/application/UI/Base/Component/Badge/BadgeFactory.php', 'Combodo\\iTop\\Application\\UI\\Base\\Component\\Breadcrumbs\\Breadcrumbs' => __DIR__ . '/../..' . '/sources/application/UI/Base/Component/Breadcrumbs/Breadcrumbs.php', 'Combodo\\iTop\\Application\\UI\\Base\\Component\\Button\\Button' => __DIR__ . '/../..' . '/sources/application/UI/Base/Component/Button/Button.php', 'Combodo\\iTop\\Application\\UI\\Base\\Component\\Button\\ButtonUIBlockFactory' => __DIR__ . '/../..' . '/sources/application/UI/Base/Component/Button/ButtonUIBlockFactory.php', @@ -432,6 +430,8 @@ class ComposerStaticInit0018331147de7601e7552f7da8e3bb8b 'Combodo\\iTop\\Application\\UI\\Base\\Component\\MedallionIcon\\MedallionIcon' => __DIR__ . '/../..' . '/sources/application/UI/Base/Component/MedallionIcon/MedallionIcon.php', 'Combodo\\iTop\\Application\\UI\\Base\\Component\\Panel\\Panel' => __DIR__ . '/../..' . '/sources/application/UI/Base/Component/Panel/Panel.php', 'Combodo\\iTop\\Application\\UI\\Base\\Component\\Panel\\PanelUIBlockFactory' => __DIR__ . '/../..' . '/sources/application/UI/Base/Component/Panel/PanelUIBlockFactory.php', + 'Combodo\\iTop\\Application\\UI\\Base\\Component\\Pill\\Pill' => __DIR__ . '/../..' . '/sources/application/UI/Base/Component/Pill/Pill.php', + 'Combodo\\iTop\\Application\\UI\\Base\\Component\\Pill\\PillFactory' => __DIR__ . '/../..' . '/sources/application/UI/Base/Component/Pill/PillFactory.php', 'Combodo\\iTop\\Application\\UI\\Base\\Component\\PopoverMenu\\NewsroomMenu\\NewsroomMenu' => __DIR__ . '/../..' . '/sources/application/UI/Base/Component/PopoverMenu/NewsroomMenu/NewsroomMenu.php', 'Combodo\\iTop\\Application\\UI\\Base\\Component\\PopoverMenu\\NewsroomMenu\\NewsroomMenuFactory' => __DIR__ . '/../..' . '/sources/application/UI/Base/Component/PopoverMenu/NewsroomMenu/NewsroomMenuFactory.php', 'Combodo\\iTop\\Application\\UI\\Base\\Component\\PopoverMenu\\PopoverMenu' => __DIR__ . '/../..' . '/sources/application/UI/Base/Component/PopoverMenu/PopoverMenu.php', diff --git a/sources/application/UI/Base/Component/Badge/Badge.php b/sources/application/UI/Base/Component/Pill/Pill.php similarity index 56% rename from sources/application/UI/Base/Component/Badge/Badge.php rename to sources/application/UI/Base/Component/Pill/Pill.php index 13b061ac4..714d031a1 100644 --- a/sources/application/UI/Base/Component/Badge/Badge.php +++ b/sources/application/UI/Base/Component/Pill/Pill.php @@ -5,19 +5,27 @@ */ -namespace Combodo\iTop\Application\UI\Base\Component\Badge; +namespace Combodo\iTop\Application\UI\Base\Component\Pill; use Combodo\iTop\Application\UI\Base\Layout\UIContentBlock; -class Badge extends UIContentBlock +/** + * Class Pill + * + * @internal + * @author Eric Espie + * @since 3.0.0 + * @package Combodo\iTop\Application\UI\Base\Component\Pill + */ +class Pill extends UIContentBlock { /** @var string */ protected $sColor; public function __construct(string $sColor) { - parent::__construct(null, ["ibo-badge ibo-badge-is-{$sColor}"]); + parent::__construct(null, ["ibo-pill ibo-pill-is-{$sColor}"]); $this->SetColor($sColor); } @@ -32,11 +40,12 @@ class Badge extends UIContentBlock /** * @param string $sColor * - * @return Badge + * @return Pill */ - public function SetColor(string $sColor): Badge + public function SetColor(string $sColor): Pill { $this->sColor = $sColor; + return $this; } } \ No newline at end of file diff --git a/sources/application/UI/Base/Component/Badge/BadgeFactory.php b/sources/application/UI/Base/Component/Pill/PillFactory.php similarity index 54% rename from sources/application/UI/Base/Component/Badge/BadgeFactory.php rename to sources/application/UI/Base/Component/Pill/PillFactory.php index ccbb8472e..5208c606b 100644 --- a/sources/application/UI/Base/Component/Badge/BadgeFactory.php +++ b/sources/application/UI/Base/Component/Pill/PillFactory.php @@ -5,18 +5,27 @@ */ -namespace Combodo\iTop\Application\UI\Base\Component\Badge; +namespace Combodo\iTop\Application\UI\Base\Component\Pill; use Combodo\iTop\Application\UI\Helper\UIHelper; -class BadgeFactory +/** + * Class PillFactory + * + * @internal + * @author Eric Espie + * @since 3.0.0 + * @package Combodo\iTop\Application\UI\Base\Component\Pill + */ +class PillFactory { public static function MakeForState(string $sClass, string $sStateCode) { $sColor = UIHelper::GetColorFromStatus($sClass, $sStateCode); - return new Badge($sColor); + + return new Pill($sColor); } } \ No newline at end of file diff --git a/sources/application/UI/Helper/UIHelper.php b/sources/application/UI/Helper/UIHelper.php index 447607744..afeccfb89 100644 --- a/sources/application/UI/Helper/UIHelper.php +++ b/sources/application/UI/Helper/UIHelper.php @@ -11,6 +11,15 @@ namespace Combodo\iTop\Application\UI\Helper; use MetaModel; // TODO 3.0.0: Delete this class as it is only a temporary helper while code is being reworked. + +/** + * Class UIHelper + * + * @internal + * @author Eric Espie + * @package Combodo\iTop\Application\UI\Helper + * @since 3.0.0 + */ class UIHelper { public static function GetColorFromStatus(string $sClass, ?string $sStateCode): string