diff --git a/css/backoffice/components/_alert.scss b/css/backoffice/components/_alert.scss new file mode 100644 index 000000000..4ea87c7dd --- /dev/null +++ b/css/backoffice/components/_alert.scss @@ -0,0 +1,59 @@ +$ibo-alert--padding-y: 18px !default; +$ibo-alert--padding-x: 20px !default; +$ibo-alert--border-radius: 2px !default; + +$ibo-alert--title--padding-bottom: 4px !default; + +$ibo-alert--title--highlight--width: 4px !default; +$ibo-alert--title--highlight--height: 100% !default; + +$ibo-alert-colors: ( + 'grey' : ($ibo-color-grey-200, $ibo-color-grey-700, $ibo-color-grey-900), + 'red': ($ibo-color-red-200, $ibo-color-red-700, $ibo-color-red-900), + 'orange' : ($ibo-color-orange-200, $ibo-color-orange-700, $ibo-color-orange-900), + 'green': ($ibo-color-green-200, $ibo-color-green-700, $ibo-color-green-900), + 'blue-grey': ($ibo-color-blue-grey-200, $ibo-color-blue-grey-700, $ibo-color-blue-grey-900), + 'blue': ($ibo-color-blue-200, $ibo-color-blue-700, $ibo-color-blue-900), + 'cyan': ($ibo-color-cyan-100, $ibo-color-blue-700, $ibo-color-cyan-900), + 'pink': ($ibo-color-pink-200, $ibo-color-pink-700, $ibo-color-pink-900), + 'primary': ($ibo-color-primary-200, $ibo-color-primary-700, $ibo-color-primary-900), + 'secondary': ($ibo-color-secondary-200, $ibo-color-secondary-700, $ibo-color-secondary-900), +) !default; + +@each $sColor, $aColorValues in $ibo-alert-colors{ + $bg-color: nth($aColorValues, 1); + $highlight-color: nth($aColorValues, 2); + $text-color: nth($aColorValues, 3); + .ibo-alert.ibo-is-#{$sColor}{ + background-color: $bg-color; + color: $text-color; + &::before{ + background-color: $highlight-color; + } + } +} + +.ibo-alert{ + position: relative; + padding: $ibo-alert--padding-y $ibo-alert--padding-x; + border-radius: $ibo-alert--border-radius; + + @extend %ibo-font-ral-med-150; + + .ibo-alert--title{ + padding-bottom: $ibo-alert--title--padding-bottom; + + @extend %ibo-font-ral-bol-150; + } +} +.ibo-alert::before{ + display: block; + position: absolute; + top: 0; + left: 0; + content: ''; + + border-radius: $ibo-alert--border-radius 0 0 $ibo-alert--border-radius; + width: $ibo-alert--title--highlight--width; + height: $ibo-alert--title--highlight--height; +} diff --git a/css/backoffice/components/_all.scss b/css/backoffice/components/_all.scss index ce70c8ea3..bf0d7be45 100644 --- a/css/backoffice/components/_all.scss +++ b/css/backoffice/components/_all.scss @@ -16,6 +16,7 @@ * You should have received a copy of the GNU Affero General Public License */ +@import "alert"; @import "button"; @import "breadcrumbs"; @import "quick-create"; diff --git a/lib/composer/autoload_classmap.php b/lib/composer/autoload_classmap.php index ea7a04939..4cd4357e5 100644 --- a/lib/composer/autoload_classmap.php +++ b/lib/composer/autoload_classmap.php @@ -148,6 +148,7 @@ return array( 'Combodo\\iTop\\Application\\TwigBase\\Controller\\PageNotFoundException' => $baseDir . '/sources/application/TwigBase/Controller/Controller.php', 'Combodo\\iTop\\Application\\TwigBase\\Twig\\Extension' => $baseDir . '/sources/application/TwigBase/Twig/Extension.php', 'Combodo\\iTop\\Application\\TwigBase\\Twig\\TwigHelper' => $baseDir . '/sources/application/TwigBase/Twig/TwigHelper.php', + 'Combodo\\iTop\\Application\\UI\\Component\\Alert\\Alert\\Alert' => $baseDir . '/sources/application/UI/Component/Alert/Alert.php', 'Combodo\\iTop\\Application\\UI\\Component\\Breadcrumbs\\Breadcrumbs' => $baseDir . '/sources/application/UI/Component/Breadcrumbs/Breadcrumbs.php', 'Combodo\\iTop\\Application\\UI\\Component\\Button\\Button\\Button' => $baseDir . '/sources/application/UI/Component/Button/Button.php', 'Combodo\\iTop\\Application\\UI\\Component\\GlobalSearch\\GlobalSearch' => $baseDir . '/sources/application/UI/Component/GlobalSearch/GlobalSearch.php', diff --git a/lib/composer/autoload_static.php b/lib/composer/autoload_static.php index c2c60501e..51d25f159 100644 --- a/lib/composer/autoload_static.php +++ b/lib/composer/autoload_static.php @@ -378,6 +378,7 @@ class ComposerStaticInit0018331147de7601e7552f7da8e3bb8b 'Combodo\\iTop\\Application\\TwigBase\\Controller\\PageNotFoundException' => __DIR__ . '/../..' . '/sources/application/TwigBase/Controller/Controller.php', 'Combodo\\iTop\\Application\\TwigBase\\Twig\\Extension' => __DIR__ . '/../..' . '/sources/application/TwigBase/Twig/Extension.php', 'Combodo\\iTop\\Application\\TwigBase\\Twig\\TwigHelper' => __DIR__ . '/../..' . '/sources/application/TwigBase/Twig/TwigHelper.php', + 'Combodo\\iTop\\Application\\UI\\Component\\Alert\\Alert\\Alert' => __DIR__ . '/../..' . '/sources/application/UI/Component/Alert/Alert.php', 'Combodo\\iTop\\Application\\UI\\Component\\Breadcrumbs\\Breadcrumbs' => __DIR__ . '/../..' . '/sources/application/UI/Component/Breadcrumbs/Breadcrumbs.php', 'Combodo\\iTop\\Application\\UI\\Component\\Button\\Button\\Button' => __DIR__ . '/../..' . '/sources/application/UI/Component/Button/Button.php', 'Combodo\\iTop\\Application\\UI\\Component\\GlobalSearch\\GlobalSearch' => __DIR__ . '/../..' . '/sources/application/UI/Component/GlobalSearch/GlobalSearch.php', diff --git a/sources/application/UI/Component/Alert/Alert.php b/sources/application/UI/Component/Alert/Alert.php new file mode 100644 index 000000000..47215b153 --- /dev/null +++ b/sources/application/UI/Component/Alert/Alert.php @@ -0,0 +1,119 @@ + + * @package Combodo\iTop\Application\UI\Component\Alert\Alert + * @since 2.8.0 + */ +class Alert extends UIBlock +{ + // Overloaded constants + const BLOCK_CODE = 'ibo-alert'; + const HTML_TEMPLATE_REL_PATH = 'components/alert/layout'; + const JS_TEMPLATE_REL_PATH = 'components/alert/layout'; + + /** @var string $sTitle */ + protected $sTitle; + /** @var array $sMainText */ + protected $sMainText; + /** @var string $sColor */ + protected $sColor; + + /** + * Alert constructor. + * + * @param string $sId + * @param string $sTitle + * @param string $sMainText + * @param string $sColor + */ + public function __construct($sId, $sTitle = '', $sMainText = '', $sColor = 'secondary') + { + $this->sTitle = $sTitle; + $this->sMainText = $sMainText; + $this->sColor = $sColor; + parent::__construct($sId); + } + + /** + * @return string + */ + public function GetTitle() + { + return $this->sTitle; + } + + /** + * @param string $sTitle + * @return $this + */ + public function SetTitle($sTitle) + { + $this->sTitle = $sTitle; + return $this; + } + + /** + * @return string + */ + public function GetMainText() + { + return $this->sMainText; + } + + /** + * @param string $aMainText + * @return $this + */ + public function SetMainText($aMainText) + { + $this->sMainText = $aMainText; + return $this; + } + + + + /** + * @return string + */ + public function GetColor() + { + return $this->sColor; + } + + /** + * @param string $sColor + * @return $this + */ + public function SetColor($sColor) + { + $this->sColor = $sColor; + return $this; + } + +} \ No newline at end of file diff --git a/templates/components/alert/layout.html.twig b/templates/components/alert/layout.html.twig new file mode 100644 index 000000000..2ee6e7f0c --- /dev/null +++ b/templates/components/alert/layout.html.twig @@ -0,0 +1,4 @@ +
+
{{ oUIBlock.GetTitle() }}
+
{{ oUIBlock.GetMainText() }}
+
\ No newline at end of file