cometchat-react-ui-kit2/dist/Shared/SDKDerivedComponents/CometChatGroupListItem/style.js

CometChat UI Kit for React App

"use strict";

Object.defineProperty(exports, "__esModule", {
  value: true
});
exports.listItemName = exports.listItem = exports.itemThumbnailStyle = exports.itemNameWrapperStyle = exports.itemNameStyle = exports.itemDetailStyle = exports.itemDescStyle = void 0;
var listItem = function listItem(props, theme) {
  var backgroundStyle = props.style.background;
  if (props.isActive) {
    backgroundStyle = props.style.activeBackground;
  }
  return {
    display: "flex",
    flexDirection: "row",
    justifyContent: "left",
    alignItems: "center",
    cursor: "pointer",
    width: props.style.width,
    height: props.style.height,
    borderRadius: props.style.borderRadius,
    padding: "8px 16px",
    background: backgroundStyle,
    "&:hover": {
      background: props.style.activeBackground
    }
  };
};
exports.listItem = listItem;
var itemThumbnailStyle = function itemThumbnailStyle() {
  return {
    display: "inline-block",
    position: "relative",
    flexShrink: "0",
    justifyContent: "center",
    alignItems: "center"
  };
};
exports.itemThumbnailStyle = itemThumbnailStyle;
var itemDetailStyle = function itemDetailStyle(props, theme) {
  return {
    borderBottom: props.style.border || "1px solid " + theme.palette.accent200[theme.palette.mode],
    width: "calc(100% - 40px)",
    flexGrow: "1",
    marginLeft: "16px",
    "&[dir=rtl]": {
      marginRight: "16px",
      marginLeft: "0"
    },
    "&:hover": {
      borderBottom: props.style.border || "1px solid " + theme.palette.accent200[theme.palette.mode]
    }
  };
};
exports.itemDetailStyle = itemDetailStyle;
var itemNameStyle = function itemNameStyle(props) {
  return {
    font: props.style.titleFont,
    overflow: "hidden",
    textOverflow: "ellipsis",
    whiteSpace: "nowrap",
    width: "100%",
    lineHeight: "22px",
    color: props.style.titleColor
  };
};
exports.itemNameStyle = itemNameStyle;
var itemNameWrapperStyle = function itemNameWrapperStyle(props) {
  return {
    display: "flex",
    alignItems: "center",
    width: props.style.width,
    margin: "0"
  };
};
exports.itemNameWrapperStyle = itemNameWrapperStyle;
var listItemName = function listItemName(props) {
  return {
    font: props.style.titleFont,
    maxWidth: "calc(100% - 30px)",
    overflow: "hidden",
    textOverflow: "ellipsis",
    whiteSpace: "nowrap",
    margin: "0",
    lineHeight: "22px",
    color: props.style.titleColor
  };
};
exports.listItemName = listItemName;
var itemDescStyle = function itemDescStyle(props) {
  return {
    padding: "0 0 5px 0",
    font: props.style.subtitleFont,
    lineHeight: "20px",
    color: props.style.subtitleColor,
    display: "flex",
    justifyContent: "left",
    alignItems: "center",
    // paddingBottom: "10px",
    width: "100%",
    letterSpacing: -1
  };
};
exports.itemDescStyle = itemDescStyle;