129 lines
3.3 KiB
JavaScript
129 lines
3.3 KiB
JavaScript
/*
|
||
Парус 8 - Панели мониторинга
|
||
Вспомогательные стили Typography
|
||
*/
|
||
|
||
//---------------------
|
||
//Подключение библиотек
|
||
//---------------------
|
||
|
||
import { P8P_COLOR_STATE } from "../colors/common"; //Дополнительные цвета - общие
|
||
import { STATE } from "../../../app.text"; //Типовые текстовые ресурсы и константы
|
||
|
||
//---------
|
||
//Константы
|
||
//---------
|
||
|
||
//Цвета текста индикатора заголовка
|
||
const P8P_HEADER_INDICATOR_COLOR = {
|
||
[STATE.OK]: P8P_COLOR_STATE[STATE.OK],
|
||
[STATE.ERR]: P8P_COLOR_STATE[STATE.ERR],
|
||
[STATE.WARN]: P8P_COLOR_STATE[STATE.WARN],
|
||
DEFAULT: "P8PHeader.text"
|
||
};
|
||
|
||
//----------------
|
||
//Интерфейс модуля
|
||
//----------------
|
||
|
||
//---------
|
||
//Общие стили текста
|
||
//---------
|
||
|
||
//Текст с возможностью нажатия
|
||
export const P8P_TYPOGRAPHY_CLICKABLE = {
|
||
cursor: "pointer"
|
||
};
|
||
|
||
//Заголовок полноэкранного диалога
|
||
export const P8P_TYPOGRAPHY_DIALOG_TITLE = {
|
||
marginLeft: "16px",
|
||
flex: 1
|
||
};
|
||
|
||
//Заголовок
|
||
export const P8P_TYPOGRAPHY_TITLE = {
|
||
height: "44px"
|
||
};
|
||
|
||
//Максимальное количество строк
|
||
export const P8P_TYPOGRAPHY_MAX_LINES = ({ maxLines }) => ({
|
||
width: "100%",
|
||
whiteSpace: "wrap",
|
||
display: "-webkit-box",
|
||
overflow: "hidden",
|
||
WebkitBoxOrient: "vertical",
|
||
WebkitLineClamp: maxLines
|
||
});
|
||
|
||
//Сокрытие лишнего текста
|
||
export const P8P_TYPOGRAPHY_HIDDEN = {
|
||
textTransform: "none",
|
||
overflow: "hidden",
|
||
textOverflow: "ellipsis",
|
||
whiteSpace: "nowrap"
|
||
};
|
||
|
||
//---------
|
||
//Стили приложения
|
||
//---------
|
||
|
||
//Описание панели на рабочем столе
|
||
export const P8P_TYPOGRAPHY_PANEL_DESK = {
|
||
maxWidth: "140px",
|
||
display: "-webkit-box",
|
||
overflow: "hidden",
|
||
WebkitBoxOrient: "vertical",
|
||
WebkitLineClamp: 2
|
||
};
|
||
|
||
//---------
|
||
//Стили циклограммы
|
||
//---------
|
||
|
||
//Колонка циклограммы
|
||
export const P8P_TYPOGRAPHY_CG_HEADER = {
|
||
textOverflow: "ellipsis",
|
||
overflow: "hidden",
|
||
whiteSpace: "pre",
|
||
textAlign: "center",
|
||
lineHeight: "35px",
|
||
padding: "0px 5px"
|
||
};
|
||
|
||
//Группа циклограммы
|
||
export const P8P_TYPOGRAPHY_CG_GROUP = ({ maxWidth, maxHeight }) => ({
|
||
maxWidth,
|
||
maxHeight,
|
||
textAlign: "center",
|
||
wordWrap: "break-word"
|
||
});
|
||
|
||
//Задача циклограммы
|
||
export const P8P_TYPOGRAPHY_CG_TASK = ({ maxHeight, availableLines }) => ({
|
||
width: "100%",
|
||
maxHeight,
|
||
padding: "0px 5px",
|
||
overflowWrap: "break-word",
|
||
wordBreak: "break-all",
|
||
overflow: "hidden",
|
||
textOverflow: "ellipsis",
|
||
display: "-webkit-box",
|
||
WebkitBoxOrient: "vertical",
|
||
WebkitLineClamp: availableLines < 1 ? 1 : availableLines
|
||
});
|
||
|
||
//---------
|
||
//Стили заголовка
|
||
//---------
|
||
|
||
//Индикатор заголовка
|
||
export const P8P_TYPOGRAPY_HDR_INDICATOR = ({ maxLines, state, isDefaultColor = false, color }) => ({
|
||
...P8P_TYPOGRAPHY_MAX_LINES({ maxLines }),
|
||
color: isDefaultColor
|
||
? P8P_HEADER_INDICATOR_COLOR.DEFAULT
|
||
: color
|
||
? color
|
||
: P8P_HEADER_INDICATOR_COLOR[state] || P8P_HEADER_INDICATOR_COLOR.DEFAULT
|
||
});
|