Why Gemfury? Push, build, and install  RubyGems npm packages Python packages Maven artifacts PHP packages Go Modules Debian packages RPM packages NuGet packages

Repository URL to install this package:

Details    
@filerobot/explorer / lib / components / CollectionsView / VirtualFoldersGrid.styled.js
Size: Mime:
var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6, _templateObject7, _templateObject8, _templateObject9, _templateObject10, _templateObject11, _templateObject12, _templateObject13;
function _taggedTemplateLiteral(strings, raw) { if (!raw) { raw = strings.slice(0); } return Object.freeze(Object.defineProperties(strings, { raw: { value: Object.freeze(raw) } })); }
import styled from 'styled-components';
import { TableContainer as SfxTableContainer, TableCell } from '@scaleflex/ui/core';
import { FV, PC } from '@filerobot/common';
import { COLLECTIONS_LIST_COLS_IDS } from '@filerobot/utils/lib/constants';
import truncateMixin from '@filerobot/utils/lib/styledComponentsMixins/truncate.mixin';
var Item = styled.div(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n  position: relative;\n  cursor: pointer;\n\n  > svg {\n    max-width: 100%;\n    max-height: 100%;\n  }\n"])));
var ItemTitle = styled.div(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n  ", "\n  ", "\n  text-align: left;\n  padding: 12px;\n  position: absolute;\n  bottom: 25px;\n"])), truncateMixin(), function (_ref) {
  var font = _ref.theme.typography.font;
  return font[FV.LabelMedium];
});
var StyledTableCell = styled(TableCell)(_templateObject3 || (_templateObject3 = _taggedTemplateLiteral(["\n  height: 80px;\n  cursor: pointer;\n  text-overflow: ellipsis;\n  overflow: hidden;\n  white-space: nowrap;\n  text-align: left;\n"])));
var FirstTableCell = styled(StyledTableCell)(_templateObject4 || (_templateObject4 = _taggedTemplateLiteral(["\n  display: flex;\n  align-items: center;\n  padding-left: 4px;\n"])));
var CheckBoxTableCell = styled(TableCell)(_templateObject5 || (_templateObject5 = _taggedTemplateLiteral(["\n  height: ", ";\n  padding-left: 12px;\n  cursor: pointer;\n"])), function (_ref2) {
  var header = _ref2.header;
  return header ? '' : '80px';
});
var HeaderTableCell = styled(TableCell)(_templateObject6 || (_templateObject6 = _taggedTemplateLiteral(["\n  ", "\n  padding-left: ", ";\n  width: ", ";\n  cursor: ", ";\n"])), truncateMixin(), function (_ref3) {
  var columnName = _ref3.columnName;
  return columnName === COLLECTIONS_LIST_COLS_IDS.NAME ? 0 : '';
}, function (_ref4) {
  var columnName = _ref4.columnName;
  return columnName !== COLLECTIONS_LIST_COLS_IDS.NAME ? '150px' : '';
}, function (_ref5) {
  var cursorPointer = _ref5.cursorPointer;
  return cursorPointer ? 'pointer' : 'default';
});
var LabelFlex = styled.label(_templateObject7 || (_templateObject7 = _taggedTemplateLiteral(["\n  display: flex;\n  align-items: center;\n  cursor: pointer;\n"])));
var Truncate = styled.div(_templateObject8 || (_templateObject8 = _taggedTemplateLiteral(["\n  ", "\n  display: block;\n  white-space: nowrap;\n  cursor: pointer;\n"])), truncateMixin());
var AddBtnWrapper = styled.div(_templateObject9 || (_templateObject9 = _taggedTemplateLiteral(["\n  margin: 15px 0 40px 0;\n"])));
var TableContainer = styled(SfxTableContainer)(_templateObject10 || (_templateObject10 = _taggedTemplateLiteral(["\n  &::-webkit-scrollbar {\n    width: 6px;\n    height: 8px;\n  }\n"])));
var HeaderItemLabel = styled.div(_templateObject11 || (_templateObject11 = _taggedTemplateLiteral(["\n  ", "\n  display: flex;\n  align-items: center;\n  color: ", ";\n  position: sticky;\n  top: 0;\n\n  svg {\n    margin-left: 10px;\n    color: ", ";\n  }\n"])), function (_ref6) {
  var font = _ref6.theme.typography.font;
  return font[FV.LabelMedium];
}, function (_ref7) {
  var palette = _ref7.theme.palette;
  return palette[PC.TextSecondary];
}, function (_ref8) {
  var palette = _ref8.theme.palette;
  return palette[PC.IconsPrimary];
});
var BrowserList = styled.div(_templateObject12 || (_templateObject12 = _taggedTemplateLiteral(["\n  height: ", ";\n  background-color: ", ";\n  overflow: auto;\n  padding: ", "; // Replaced 100px with 0 as it causes issue in virtual grid scrolling (and maybe the padding is not needed anymore?)\n\n  [data-filerobot-floaty=\"true\"] & {\n    &-collections {\n      padding-left: 48px;\n      padding-right: 48px;\n    }\n\n    &-labels {\n      padding-left: 48px;\n      padding-right: 48px;\n    }\n  }\n"])), function (_ref9) {
  var isWidgetSmallSize = _ref9.isWidgetSmallSize,
    topSectionHeight = _ref9.topSectionHeight,
    height = _ref9.height;
  return !isWidgetSmallSize && topSectionHeight && !height ? "calc(100% - ".concat(topSectionHeight, "px)") : '100%';
}, function (_ref10) {
  var palette = _ref10.theme.palette;
  return palette[PC.BackgroundStateless];
}, function (_ref11) {
  var withSidePadding = _ref11.withSidePadding;
  return "0 ".concat(withSidePadding ? '24px' : 0, " 0");
});
var ItemCategoryList = styled.div(_templateObject13 || (_templateObject13 = _taggedTemplateLiteral(["\n  list-style: none;\n  padding: 0;\n  width: 100%;\n  display: grid;\n  grid-template-columns: repeat(auto-fill, minmax(214px, 1fr));\n  gap: 12px;\n\n  // <= 1084px\n  // media query\n  ", " {\n    grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));\n    gap: 8px;\n  }\n\n  // <= 1084px\n  // container\n  ", " & {\n    grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));\n    gap: 8px;\n  }\n\n  ", " & {\n    grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));\n    gap: 8px;\n  }\n"])), function (props) {
  return props.theme.breakpoints.down('lg');
}, function (props) {
  return props.theme.breakpoints.classes.md;
}, function (props) {
  return props.theme.breakpoints.classes.sm;
});
var Styled = {
  TableContainer: TableContainer,
  Item: Item,
  ItemTitle: ItemTitle,
  StyledTableCell: StyledTableCell,
  HeaderTableCell: HeaderTableCell,
  FirstTableCell: FirstTableCell,
  CheckBoxTableCell: CheckBoxTableCell,
  LabelFlex: LabelFlex,
  Truncate: Truncate,
  AddBtnWrapper: AddBtnWrapper,
  HeaderItemLabel: HeaderItemLabel,
  BrowserList: BrowserList,
  ItemCategoryList: ItemCategoryList
};
export default Styled;