add new widget color tabs module pandora_enterprise#8621
This commit is contained in:
Daniel Barbero Martin
parent
8e6ca7da9a
commit
9d2c179423
Binary file not shown.
|
After Width: | Height: | Size: 3.5 KiB |
|
|
@ -5367,6 +5367,108 @@ function html_print_input($data, $wrapper='div', $input_only=false)
|
|||
);
|
||||
break;
|
||||
|
||||
case 'select_multiple_modules_filtered_select2':
|
||||
$output .= '<li class="agents_select2">';
|
||||
$output .= html_print_label(__('Agents'), '', true);
|
||||
$output .= html_print_select(
|
||||
$data['agent_values'],
|
||||
$data['agent_name'],
|
||||
$data['agent_ids'],
|
||||
'agent_multiple_change(this, \''.base64_encode(json_encode($data)).'\')',
|
||||
'',
|
||||
0,
|
||||
true,
|
||||
true,
|
||||
true,
|
||||
'',
|
||||
false,
|
||||
'min-width: 150px; max-height: 100px',
|
||||
false,
|
||||
false,
|
||||
false,
|
||||
'',
|
||||
false,
|
||||
false,
|
||||
false,
|
||||
false,
|
||||
true,
|
||||
true,
|
||||
true
|
||||
);
|
||||
$output .= '</li>';
|
||||
|
||||
// $output .= html_print_input_hidden(
|
||||
// 'id_agents2-multiple-text',
|
||||
// json_encode($agents_select)
|
||||
// );
|
||||
$selection = [
|
||||
0 => __('Show common modules'),
|
||||
1 => __('Show all modules'),
|
||||
];
|
||||
|
||||
$output .= '<li>';
|
||||
$output .= html_print_label(__('Type'), '', true);
|
||||
$output .= html_print_select(
|
||||
$selection,
|
||||
$data['selectionModulesNameId'],
|
||||
$data['selectionModules'],
|
||||
'selection_multiple_change(\''.base64_encode(json_encode($data)).'\')',
|
||||
'',
|
||||
0,
|
||||
true,
|
||||
false,
|
||||
true,
|
||||
'',
|
||||
false,
|
||||
'min-width: 180px'
|
||||
);
|
||||
$output .= '</li>';
|
||||
|
||||
$all_modules = [];
|
||||
if (empty($data['agent_ids']) === false) {
|
||||
$all_modules = get_modules_agents(
|
||||
0,
|
||||
$data['agent_ids'],
|
||||
$data['selectionModules'],
|
||||
true
|
||||
);
|
||||
}
|
||||
|
||||
$output .= '<li class="modules_select2">';
|
||||
$output .= html_print_label(__('Modules'), '', true);
|
||||
$output .= html_print_select(
|
||||
$all_modules,
|
||||
$data['modules_name'],
|
||||
$data['modules_ids'],
|
||||
'',
|
||||
'',
|
||||
0,
|
||||
true,
|
||||
true,
|
||||
true,
|
||||
'',
|
||||
false,
|
||||
'min-width: 150px; max-width: 500px; max-height: 100px',
|
||||
false,
|
||||
false,
|
||||
false,
|
||||
'',
|
||||
false,
|
||||
false,
|
||||
false,
|
||||
false,
|
||||
true,
|
||||
true,
|
||||
true
|
||||
);
|
||||
$output .= '</li>';
|
||||
|
||||
// $output .= html_print_input_hidden(
|
||||
// 'module-multiple-text',
|
||||
// json_encode($agents_select)
|
||||
// );
|
||||
break;
|
||||
|
||||
default:
|
||||
// Ignore.
|
||||
break;
|
||||
|
|
|
|||
|
|
@ -2820,6 +2820,40 @@ function modules_get_color_status($status, $force_module=false)
|
|||
}
|
||||
|
||||
|
||||
/**
|
||||
* Text color status.
|
||||
*
|
||||
* @param string $status Type status.
|
||||
*
|
||||
* @return string Color.
|
||||
*/
|
||||
function modules_get_textcolor_status($status)
|
||||
{
|
||||
$result = '#ffffff';
|
||||
switch ($status) {
|
||||
case AGENT_MODULE_STATUS_WARNING:
|
||||
case AGENT_MODULE_STATUS_CRITICAL_ALERT:
|
||||
case AGENT_MODULE_STATUS_WARNING_ALERT:
|
||||
case AGENT_MODULE_STATUS_NORMAL_ALERT:
|
||||
$result = '#000000';
|
||||
break;
|
||||
|
||||
case AGENT_MODULE_STATUS_CRITICAL_BAD:
|
||||
case AGENT_MODULE_STATUS_NOT_NORMAL:
|
||||
case AGENT_MODULE_STATUS_NO_DATA:
|
||||
case AGENT_MODULE_STATUS_NOT_INIT:
|
||||
case AGENT_MODULE_STATUS_NORMAL:
|
||||
case AGENT_MODULE_STATUS_ALL:
|
||||
case AGENT_MODULE_STATUS_UNKNOWN:
|
||||
default:
|
||||
$result = '#ffffff';
|
||||
break;
|
||||
}
|
||||
|
||||
return $result;
|
||||
}
|
||||
|
||||
|
||||
/**
|
||||
* Gets a module status an modify the status and title reference variables
|
||||
*
|
||||
|
|
|
|||
|
|
@ -1,4 +1,4 @@
|
|||
/* global $ */
|
||||
/* global $ jQuery */
|
||||
/* exported load_modal */
|
||||
|
||||
var ENTERPRISE_DIR = "enterprise";
|
||||
|
|
@ -2027,3 +2027,64 @@ function inArray(needle, haystack) {
|
|||
}
|
||||
return false;
|
||||
}
|
||||
|
||||
// eslint-disable-next-line no-unused-vars
|
||||
function agent_multiple_change(e, info) {
|
||||
info = JSON.parse(atob(info));
|
||||
jQuery.post(
|
||||
"ajax.php",
|
||||
{
|
||||
page: "operation/agentes/ver_agente",
|
||||
get_modules_group_json: 1,
|
||||
selection: $("#" + info.selectionModulesNameId).val(),
|
||||
id_agents: $("#" + info.agent_name.replace("[]", "")).val(),
|
||||
select_mode: 1
|
||||
},
|
||||
function(data) {
|
||||
var name = info.modules_name.replace("[]", "");
|
||||
if (JSON.stringify($(e).val()) !== JSON.stringify(info.agent_ids)) {
|
||||
$("#" + name).html("");
|
||||
$("#checkbox-" + name + "-check-all").prop("checked", false);
|
||||
if (data) {
|
||||
jQuery.each(data, function(id, value) {
|
||||
var option = $("<option></option>")
|
||||
.attr("value", id)
|
||||
.html(value);
|
||||
$("#" + name).append(option);
|
||||
});
|
||||
}
|
||||
}
|
||||
},
|
||||
"json"
|
||||
);
|
||||
}
|
||||
|
||||
// eslint-disable-next-line no-unused-vars
|
||||
function selection_multiple_change(info) {
|
||||
info = JSON.parse(atob(info));
|
||||
jQuery.post(
|
||||
"ajax.php",
|
||||
{
|
||||
page: "operation/agentes/ver_agente",
|
||||
get_modules_group_json: 1,
|
||||
id_agents: $("#" + info.agent_name.replace("[]", "")).val(),
|
||||
selection: $("#" + info.selectionModulesNameId).val(),
|
||||
select_mode: 1
|
||||
},
|
||||
function(data) {
|
||||
var name = info.modules_name.replace("[]", "");
|
||||
$("#" + name).html("");
|
||||
// Check module all.
|
||||
$("#checkbox-" + name + "-check-all").prop("checked", false);
|
||||
if (data) {
|
||||
jQuery.each(data, function(id, value) {
|
||||
var option = $("<option></option>")
|
||||
.attr("value", id)
|
||||
.html(value);
|
||||
$("#" + name).append(option);
|
||||
});
|
||||
}
|
||||
},
|
||||
"json"
|
||||
);
|
||||
}
|
||||
|
|
|
|||
|
|
@ -412,6 +412,10 @@ class Widget
|
|||
$className .= '\WuxWidget';
|
||||
break;
|
||||
|
||||
case 'ColorModuleTabs':
|
||||
$className .= '\\'.$name;
|
||||
break;
|
||||
|
||||
default:
|
||||
$className = false;
|
||||
break;
|
||||
|
|
|
|||
|
|
@ -0,0 +1,404 @@
|
|||
<?php
|
||||
/**
|
||||
* Widget Color tabs modules Pandora FMS Console
|
||||
*
|
||||
* @category Console Class
|
||||
* @package Pandora FMS
|
||||
* @subpackage Widget
|
||||
* @version 1.0.0
|
||||
* @license See below
|
||||
*
|
||||
* ______ ___ _______ _______ ________
|
||||
* | __ \.-----.--.--.--| |.-----.----.-----. | ___| | | __|
|
||||
* | __/| _ | | _ || _ | _| _ | | ___| |__ |
|
||||
* |___| |___._|__|__|_____||_____|__| |___._| |___| |__|_|__|_______|
|
||||
*
|
||||
* ============================================================================
|
||||
* Copyright (c) 2005-2022 Artica Soluciones Tecnologicas
|
||||
* Please see http://pandorafms.org for full contribution list
|
||||
* This program is free software; you can redistribute it and/or
|
||||
* modify it under the terms of the GNU General Public License
|
||||
* as published by the Free Software Foundation for version 2.
|
||||
* This program 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 General Public License for more details.
|
||||
* ============================================================================
|
||||
*/
|
||||
|
||||
namespace PandoraFMS\Dashboard;
|
||||
|
||||
global $config;
|
||||
|
||||
/**
|
||||
* URL Widgets
|
||||
*/
|
||||
class ColorModuleTabs extends Widget
|
||||
{
|
||||
|
||||
/**
|
||||
* Name widget.
|
||||
*
|
||||
* @var string
|
||||
*/
|
||||
protected $name;
|
||||
|
||||
/**
|
||||
* Title widget.
|
||||
*
|
||||
* @var string
|
||||
*/
|
||||
protected $title;
|
||||
|
||||
/**
|
||||
* Page widget;
|
||||
*
|
||||
* @var string
|
||||
*/
|
||||
protected $page;
|
||||
|
||||
/**
|
||||
* Class name widget.
|
||||
*
|
||||
* @var [type]
|
||||
*/
|
||||
protected $className;
|
||||
|
||||
/**
|
||||
* Values options for each widget.
|
||||
*
|
||||
* @var [type]
|
||||
*/
|
||||
protected $values;
|
||||
|
||||
/**
|
||||
* Configuration required.
|
||||
*
|
||||
* @var boolean
|
||||
*/
|
||||
protected $configurationRequired;
|
||||
|
||||
/**
|
||||
* Error load widget.
|
||||
*
|
||||
* @var boolean
|
||||
*/
|
||||
protected $loadError;
|
||||
|
||||
/**
|
||||
* Width.
|
||||
*
|
||||
* @var integer
|
||||
*/
|
||||
protected $width;
|
||||
|
||||
/**
|
||||
* Heigth.
|
||||
*
|
||||
* @var integer
|
||||
*/
|
||||
protected $height;
|
||||
|
||||
/**
|
||||
* Grid Width.
|
||||
*
|
||||
* @var integer
|
||||
*/
|
||||
protected $gridWidth;
|
||||
|
||||
/**
|
||||
* Cell ID.
|
||||
*
|
||||
* @var integer
|
||||
*/
|
||||
protected $cellId;
|
||||
|
||||
|
||||
/**
|
||||
* Construct.
|
||||
*
|
||||
* @param integer $cellId Cell ID.
|
||||
* @param integer $dashboardId Dashboard ID.
|
||||
* @param integer $widgetId Widget ID.
|
||||
* @param integer|null $width New width.
|
||||
* @param integer|null $height New height.
|
||||
* @param integer|null $gridWidth Grid width.
|
||||
*/
|
||||
public function __construct(
|
||||
int $cellId,
|
||||
int $dashboardId=0,
|
||||
int $widgetId=0,
|
||||
?int $width=0,
|
||||
?int $height=0,
|
||||
?int $gridWidth=0
|
||||
) {
|
||||
global $config;
|
||||
|
||||
// WARNING: Do not edit. This chunk must be in the constructor.
|
||||
parent::__construct(
|
||||
$cellId,
|
||||
$dashboardId,
|
||||
$widgetId
|
||||
);
|
||||
|
||||
// Width.
|
||||
$this->width = $width;
|
||||
|
||||
// Height.
|
||||
$this->height = $height;
|
||||
|
||||
// Grid Width.
|
||||
$this->gridWidth = $gridWidth;
|
||||
|
||||
// Cell Id.
|
||||
$this->cellId = $cellId;
|
||||
|
||||
// Options.
|
||||
$this->values = $this->decoders($this->getOptionsWidget());
|
||||
|
||||
// Positions.
|
||||
$this->position = $this->getPositionWidget();
|
||||
|
||||
// Page.
|
||||
$this->page = basename(__FILE__);
|
||||
|
||||
// ClassName.
|
||||
$class = new \ReflectionClass($this);
|
||||
$this->className = $class->getShortName();
|
||||
|
||||
// Title.
|
||||
$this->title = __('Color tabs modules');
|
||||
|
||||
// Name.
|
||||
if (empty($this->name) === true) {
|
||||
$this->name = 'single_graph';
|
||||
}
|
||||
|
||||
// This forces at least a first configuration.
|
||||
$this->configurationRequired = false;
|
||||
if (empty($this->values['moduleColorModuleTabs']) === true) {
|
||||
$this->configurationRequired = true;
|
||||
}
|
||||
|
||||
$this->overflow_scrollbars = false;
|
||||
}
|
||||
|
||||
|
||||
/**
|
||||
* Decoders hack for retrocompability.
|
||||
*
|
||||
* @param array $decoder Values.
|
||||
*
|
||||
* @return array Returns the values with the correct key.
|
||||
*/
|
||||
public function decoders(array $decoder): array
|
||||
{
|
||||
$values = [];
|
||||
// Retrieve global - common inputs.
|
||||
$values = parent::decoders($decoder);
|
||||
|
||||
$values['agentsColorModuleTabs'] = [];
|
||||
if (isset($decoder['agentsColorModuleTabs']) === true) {
|
||||
if (isset($decoder['agentsColorModuleTabs'][0]) === true
|
||||
&& empty($decoder['agentsColorModuleTabs']) === false
|
||||
) {
|
||||
$values['agentsColorModuleTabs'] = explode(
|
||||
',',
|
||||
$decoder['agentsColorModuleTabs'][0]
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
if (isset($decoder['selectionColorModuleTabs']) === true) {
|
||||
$values['selectionColorModuleTabs'] = $decoder['selectionColorModuleTabs'];
|
||||
}
|
||||
|
||||
$values['moduleColorModuleTabs'] = [];
|
||||
if (isset($decoder['moduleColorModuleTabs']) === true) {
|
||||
if (isset($decoder['moduleColorModuleTabs'][0]) === true
|
||||
&& empty($decoder['moduleColorModuleTabs']) === false
|
||||
) {
|
||||
$values['moduleColorModuleTabs'] = explode(
|
||||
',',
|
||||
$decoder['moduleColorModuleTabs'][0]
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
if (isset($decoder['formatData']) === true) {
|
||||
$values['formatData'] = $decoder['formatData'];
|
||||
}
|
||||
|
||||
return $values;
|
||||
}
|
||||
|
||||
|
||||
/**
|
||||
* Generates inputs for form (specific).
|
||||
*
|
||||
* @return array Of inputs.
|
||||
*
|
||||
* @throws Exception On error.
|
||||
*/
|
||||
public function getFormInputs(): array
|
||||
{
|
||||
$values = $this->values;
|
||||
|
||||
// Retrieve global - common inputs.
|
||||
$inputs = parent::getFormInputs();
|
||||
|
||||
$inputs[] = [
|
||||
'arguments' => [
|
||||
'type' => 'select_multiple_modules_filtered_select2',
|
||||
'agent_values' => agents_get_agents_selected(0),
|
||||
'agent_name' => 'agentsColorModuleTabs[]',
|
||||
'agent_ids' => $values['agentsColorModuleTabs'],
|
||||
'selectionModules' => true,
|
||||
'selectionModulesNameId' => 'selectionColorModuleTabs',
|
||||
'modules_ids' => $values['moduleColorModuleTabs'],
|
||||
'modules_name' => 'moduleColorModuleTabs[]',
|
||||
],
|
||||
];
|
||||
|
||||
// Format Data.
|
||||
$inputs[] = [
|
||||
'label' => __('Format Data'),
|
||||
'arguments' => [
|
||||
'name' => 'formatData',
|
||||
'id' => 'formatData',
|
||||
'type' => 'switch',
|
||||
'value' => $values['formatData'],
|
||||
],
|
||||
];
|
||||
|
||||
return $inputs;
|
||||
}
|
||||
|
||||
|
||||
/**
|
||||
* Get Post for widget.
|
||||
*
|
||||
* @return array
|
||||
*/
|
||||
public function getPost():array
|
||||
{
|
||||
// Retrieve global - common inputs.
|
||||
$values = parent::getPost();
|
||||
|
||||
$values['agentsColorModuleTabs'] = \get_parameter('agentsColorModuleTabs', []);
|
||||
$values['selectionColorModuleTabs'] = \get_parameter('selectionColorModuleTabs', 0);
|
||||
$values['moduleColorModuleTabs'] = \get_parameter('moduleColorModuleTabs', []);
|
||||
$values['formatData'] = \get_parameter_switch('formatData', 0);
|
||||
|
||||
return $values;
|
||||
}
|
||||
|
||||
|
||||
/**
|
||||
* Draw widget.
|
||||
*
|
||||
* @return string;
|
||||
*/
|
||||
public function load()
|
||||
{
|
||||
global $config;
|
||||
|
||||
$size = parent::getSize();
|
||||
|
||||
$sql = sprintf(
|
||||
'SELECT tagente_modulo.id_agente_modulo AS `id`,
|
||||
tagente_modulo.nombre AS `name`,
|
||||
tagente_modulo.unit AS `unit`,
|
||||
tagente_estado.datos AS `data`,
|
||||
tagente_estado.timestamp AS `timestamp`,
|
||||
tagente_estado.estado AS `status`
|
||||
FROM tagente_modulo
|
||||
LEFT JOIN tagente_estado
|
||||
ON tagente_modulo.id_agente_modulo = tagente_estado.id_agente_modulo
|
||||
WHERE tagente_modulo.id_agente_modulo IN (%s)',
|
||||
implode(',', $this->values['moduleColorModuleTabs'])
|
||||
);
|
||||
|
||||
$modules = db_get_all_rows_sql($sql);
|
||||
|
||||
$output = '<div class="container-tabs">';
|
||||
foreach ($modules as $module) {
|
||||
$output .= $this->drawTabs($module);
|
||||
}
|
||||
|
||||
$output .= '</div>';
|
||||
return $output;
|
||||
}
|
||||
|
||||
|
||||
/**
|
||||
* Draw tab module.
|
||||
*
|
||||
* @param array $data Info module.
|
||||
*
|
||||
* @return string Output.
|
||||
*/
|
||||
private function drawTabs(array $data):string
|
||||
{
|
||||
global $config;
|
||||
|
||||
$background = modules_get_color_status($data['status'], true);
|
||||
$color = modules_get_textcolor_status($data['status']);
|
||||
|
||||
$style = 'background-color:'.$background.'; color:'.$color.';';
|
||||
$output = '<div class="widget-module-tabs" style="'.$style.'">';
|
||||
$output .= '<span class="widget-module-tabs-title">';
|
||||
$output .= $data['name'];
|
||||
$output .= '</span>';
|
||||
$output .= '<span class="widget-module-tabs-data">';
|
||||
if ($data['data'] !== null && $data['data'] !== '') {
|
||||
if (isset($this->values['formatData']) === true
|
||||
&& (bool) $this->values['formatData'] === true
|
||||
) {
|
||||
$output .= format_for_graph(
|
||||
$data['data'],
|
||||
$config['graph_precision']
|
||||
);
|
||||
} else {
|
||||
$output .= sla_truncate(
|
||||
$data['data'],
|
||||
$config['graph_precision']
|
||||
);
|
||||
}
|
||||
} else {
|
||||
$output .= '--';
|
||||
}
|
||||
|
||||
$output .= '<span class="widget-module-tabs-unit">';
|
||||
$output .= ' '.$data['unit'];
|
||||
$output .= '</span>';
|
||||
$output .= '</span>';
|
||||
$output .= '</div>';
|
||||
|
||||
return $output;
|
||||
}
|
||||
|
||||
|
||||
/**
|
||||
* Get description.
|
||||
*
|
||||
* @return string.
|
||||
*/
|
||||
public static function getDescription()
|
||||
{
|
||||
return __('Color tabs modules');
|
||||
}
|
||||
|
||||
|
||||
/**
|
||||
* Get Name.
|
||||
*
|
||||
* @return string.
|
||||
*/
|
||||
public static function getName()
|
||||
{
|
||||
return 'ColorModuleTabs';
|
||||
}
|
||||
|
||||
|
||||
}
|
||||
|
|
@ -1,10 +1,10 @@
|
|||
<?php
|
||||
/**
|
||||
* Widget URL Pandora FMS Console
|
||||
* Widget Simple graph Pandora FMS Console
|
||||
*
|
||||
* @category Console Class
|
||||
* @package Pandora FMS
|
||||
* @subpackage Widget URL
|
||||
* @subpackage Widget
|
||||
* @version 1.0.0
|
||||
* @license See below
|
||||
*
|
||||
|
|
@ -14,7 +14,7 @@
|
|||
* |___| |___._|__|__|_____||_____|__| |___._| |___| |__|_|__|_______|
|
||||
*
|
||||
* ============================================================================
|
||||
* Copyright (c) 2005-2021 Artica Soluciones Tecnologicas
|
||||
* Copyright (c) 2005-2022 Artica Soluciones Tecnologicas
|
||||
* Please see http://pandorafms.org for full contribution list
|
||||
* This program is free software; you can redistribute it and/or
|
||||
* modify it under the terms of the GNU General Public License
|
||||
|
|
@ -279,7 +279,6 @@ class SingleGraphWidget extends Widget
|
|||
'label' => __('Module'),
|
||||
'arguments' => [
|
||||
'type' => 'autocomplete_module',
|
||||
'fields' => $fields,
|
||||
'name' => 'moduleId',
|
||||
'selected' => $values['moduleId'],
|
||||
'return' => true,
|
||||
|
|
@ -353,8 +352,8 @@ class SingleGraphWidget extends Widget
|
|||
include_once $config['homedir'].'/include/functions_agents.php';
|
||||
include_once $config['homedir'].'/include/functions_modules.php';
|
||||
|
||||
$module_name = \modules_get_agentmodule_name($id_module);
|
||||
$units_name = \modules_get_unit($id_module);
|
||||
$module_name = \modules_get_agentmodule_name($this->values['moduleId']);
|
||||
$units_name = \modules_get_unit($this->values['moduleId']);
|
||||
|
||||
$trickHight = 10;
|
||||
if ($this->values['showLegend'] === 1) {
|
||||
|
|
|
|||
|
|
@ -572,3 +572,74 @@ div#main_pure {
|
|||
#main_page > .ui-content div.label > p {
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
form.modal-dashboard ul.wizard li label {
|
||||
max-width: 30%;
|
||||
}
|
||||
|
||||
form.modal-dashboard ul.wizard li.agents_select2,
|
||||
form.modal-dashboard ul.wizard li.modules_select2 {
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
form.modal-dashboard
|
||||
ul.wizard
|
||||
li.agents_select2
|
||||
div.flex-row-center
|
||||
div.flex-column,
|
||||
form.modal-dashboard
|
||||
ul.wizard
|
||||
li.modules_select2
|
||||
div.flex-row-center
|
||||
div.flex-column {
|
||||
flex: 0;
|
||||
height: 45px;
|
||||
}
|
||||
|
||||
.ui-dialog .ui-dialog-title {
|
||||
top: -3px !important;
|
||||
}
|
||||
|
||||
.select2-container--default
|
||||
.select2-selection--multiple
|
||||
.select2-selection__choice {
|
||||
margin: 0px;
|
||||
}
|
||||
|
||||
.container-tabs {
|
||||
width: 100%;
|
||||
height: calc(100% + 80px);
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
justify-content: flex-start;
|
||||
align-items: center;
|
||||
align-content: space-around;
|
||||
flex-wrap: wrap;
|
||||
}
|
||||
|
||||
.widget-module-tabs {
|
||||
flex: 1;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
min-width: 100px;
|
||||
min-height: 95px;
|
||||
margin: 2px;
|
||||
padding: 5px;
|
||||
}
|
||||
|
||||
.widget-module-tabs-title {
|
||||
word-break: break-word;
|
||||
}
|
||||
|
||||
.widget-module-tabs-data {
|
||||
font-size: larger;
|
||||
font-weight: bolder;
|
||||
}
|
||||
|
||||
.widget-module-tabs-unit {
|
||||
font-size: smaller;
|
||||
font-style: italic;
|
||||
}
|
||||
|
|
|
|||
Loading…
Reference in New Issue