File Manager

Editing File: /home/markqprx/iniasli.pro/client/notifications/shared.tailwind.js

module.exports = {
  sharedOverride: {
    spacing: {
      px: '1px',
      0: '0px',
      1: '0.063rem',
      2: '0.125rem',
      3: '0.188rem',
      4: '0.25rem',
      5: '0.313rem',
      6: '0.375rem',
      8: '0.5rem',
      10: '0.625rem',
      12: '0.75rem',
      14: '0.875rem',
      16: '1rem',
      18: '1.125rem',
      20: '1.25rem',
      22: '1.375rem',
      24: '1.5rem',
      26: '1.625rem',
      28: '1.75rem',
      30: '1.875rem',
      32: '2rem',
      34: '2.125rem',
      36: '2.25rem',
      38: '2.375rem',
      40: '2.5rem',
      42: '2.625rem',
      44: '2.75rem',
      46: '2.875rem',
      48: '3rem',
      50: '3.125rem',
      52: '3.25rem',
      54: '3.375rem',
      56: '3.5rem',
      60: '3.75rem',
      64: '4rem',
      66: '4.125rem',
      68: '4.25rem',
      70: '4.375rem',
      76: '4.75rem',
      80: '5rem',
      82: '5.125rem',
      84: '5.25rem',
      86: '5.375rem',
      90: '5.625rem',
      92: '5.75rem',
      96: '6rem',
      100: '6.25rem',
      110: '6.875rem',
      112: '7rem',
      120: '7.5rem',
      124: '7.75rem',
      128: '8rem',
      132: '8.25rem',
      136: '8.5rem',
      140: '8.75rem',
      144: '9rem',
      160: '10rem',
      172: '10.75rem',
      176: '11rem',
      180: '11.25rem',
      184: '11.5rem',
      192: '12rem',
      200: '12.5rem',
      204: '12.75rem',
      208: '13rem',
      224: '14rem',
      240: '15rem',
      256: '16rem',
      264: '16.5rem',
      280: '17.5rem',
      288: '18rem',
      320: '20rem',
      350: '21.875rem',
      375: '23.438rem',
      384: '24rem',
      400: '25rem',
      440: '27.5rem',
      450: '28.125rem',
      500: '31.25rem',
      512: '32rem',
      580: '36.25rem',
      620: '38.75rem',
      640: '40rem',
      672: '42rem',
      680: '42.5rem',
      720: '45rem',
      780: '48.75rem',
      850: '53.125rem',
      950: '59.375rem',
      1280: '80rem',
      1408: '88rem',
      '5vw': '5vw',
      '10vw': '10vw',
      'safe-area': 'env(safe-area-inset-bottom)',
      font: '1em',
      inherit: 'inherit',
    },
    colors: theme => ({
      transparent: 'transparent',
      inherit: 'inherit',
      current: 'currentColor',
      white: 'rgb(255 255 255)',
      black: 'rgb(0 0 0)',
      toast: 'rgb(50, 50, 50)',
      'slider-disabled': 'rgb(189, 189, 189)',
      hover: `rgb(var(--be-foreground-base) / ${theme('opacity.hover')})`,
      selected: `rgb(var(--be-foreground-base) / ${theme('opacity.selected')})`,
      focus: `rgb(var(--be-foreground-base) / ${theme('opacity.focus')})`,
      divider: `rgb(var(--be-foreground-base) / var(--be-divider-opacity))`,
      'disabled-bg':
        'rgb(var(--be-foreground-base) / var(--be-disabled-bg-opacity))',
      'disabled-fg':
        'rgb(var(--be-foreground-base) / var(--be-disabled-fg-opacity))',
      'primary-light': 'rgb(var(--be-primary-light) / <alpha-value>)',
      primary: 'rgb(var(--be-primary) / <alpha-value>)',
      'primary-dark': 'rgb(var(--be-primary-dark) / <alpha-value>)',
      'on-primary': 'rgb(var(--be-on-primary) / <alpha-value>)',
      'danger-lighter': '#fecaca',
      danger: '#ef4444',
      'danger-darker': '#991b1b',
      'positive-lighter': '#bbf7d0',
      positive: '#22c55e',
      'positive-darker': '#166534',
      warning: '#f3a432',
      google: '#d34836',
      facebook: '#3b5998',
      twitter: '#1da1f2',
      envato: '#6ca12b',
      tumblr: '#2b5a9f',
      background: 'rgb(var(--be-background) / <alpha-value>)',
      'background-alt': 'rgb(var(--be-background-alt) / <alpha-value>)',
      chip: 'rgb(var(--be-background-chip) / <alpha-value>)',
      paper: 'rgb(var(--be-paper) / <alpha-value>)',
      'fg-base': 'rgb(var(--be-foreground-base) / <alpha-value>)',
      'text-muted':
        'rgb(var(--be-foreground-base) / var(--be-text-muted-opacity))',
      'text-main':
        'rgb(var(--be-foreground-base) / var(--be-text-main-opacity))',
    }),
    borderColor: theme => ({
      ...theme('colors'),
      bg: theme('backgroundColor.DEFAULT'),
      'bg-alt': theme('backgroundColor.alt'),
      'text-muted': theme('textColor.muted'),
      DEFAULT: theme('colors.divider'),
    }),
    borderWidth: theme => ({
      ...theme('spacing'),
      DEFAULT: '1px',
    }),
    textColor: theme => ({
      ...theme('colors'),
      main: theme('colors.text-main'),
      muted: theme('colors.text-muted'),
      disabled: theme('colors.disabled-fg'),
      DEFAULT: theme('colors.text-main'),
    }),
    ringColor: theme => ({
      ...theme('colors'),
      DEFAULT: 'rgb(var(--be-primary) / <alpha-value>)',
    }),
    ringWidth: () => ({
      0: '0px',
      1: '1px',
      2: '2px',
      4: '4px',
      8: '8px',
      DEFAULT: '4px',
    }),
    backgroundColor: theme => ({
      ...theme('colors'),
      disabled: theme('colors.disabled-bg'),
      DEFAULT: 'rgb(var(--be-background) / <alpha-value>)',
      alt: 'rgb(var(--be-background-alt) / <alpha-value>)',
    }),
  },
  sharedExtend: {
    borderRadius: {
      button: 'var(--be-button-radius, 0.25rem)',
      input: 'var(--be-input-radius, 0.25rem)',
      panel: 'var(--be-panel-radius, 0.25rem)',
    },
    flex: {
      2: '2 1 0%',
      3: '3 1 0%',
    },
    outlineColor: {
      DEFAULT: 'rgb(var(--be-primary-lighter) / <alpha-value>)',
    },
    outlineWidth: {
      DEFAULT: 2,
    },
    height: {
      screen: '100dvh',
      dialog: 'calc(var(--be-viewport-height, 100vh) * 0.9 - 2px)',
    },
    width: {
      screen: '100vw',
      dialog: 'calc(var(--be-viewport-width, 100vw) * 0.9 - 2px)',
    },
    minHeight: theme => ({
      ...theme('spacing'),
      screen: '100dvh',
      dialog: 'calc(var(--be-viewport-height, 100vh) * 0.9)',
    }),
    minWidth: theme => ({
      ...theme('spacing'),
    }),
    maxWidth: theme => ({
      ...theme('spacing'),
      '4/5': '80%',
      dialog: ' calc(var(--be-viewport-width, 100vw) * 0.9)',
    }),
    maxHeight: theme => ({
      ...theme('spacing'),
      dialog: 'calc(var(--be-viewport-height, 100vh) * 0.9)',
      tray: 'calc(var(--be-viewport-height, 100vh) * 0.9)',
    }),
    zIndex: {
      toast: 160,
      tooltip: 150,
      'overlay-container': 140,
      popover: 130,
      tray: 120,
      modal: 110,
    },
    opacity: {
      2: '2%',
      4: '4%',
      6: '6%',
      8: '8%',
      12: '12%',
      26: '26%',
      15: '15%',
      87: '87%',
      selected: 'var(--be-selected-opacity)',
      hover: 'var(--be-hover-opacity)',
      focus: 'var(--be-focus-opacity)',
    },
    transitionProperty: {
      height: 'height',
      width: 'width',
      left: 'left',
      size: 'width, height',
      fill: 'fill',
      'transform-opacity': 'transform, opacity',
      'shadow-opacity': 'box-shadow, opacity',
      'bg-color': 'background-color',
      icon: 'transform, fill',
      button: 'background-color, box-shadow, border-color, color',
    },
    cursor: {
      'nwse-resize': 'nwse-resize',
      'nesw-resize': 'nesw-resize',
      'sw-resize': 'sw-resize',
      'se-resize': 'se-resize',
      inherit: 'inherit',
    },
    scale: {
      10: '.1',
    },
    backgroundPosition: {
      '1/2': '50%',
    },
  },
  sharedPlugins: plugin => {
    return [
      require('@tailwindcss/container-queries'),
      plugin(({addUtilities, addComponents}) => {
        addUtilities({
          // ICONS
          '.icon-2xs': {
            'font-size': '0.75rem',
          },
          '.icon-xs': {
            'font-size': '1rem',
          },
          '.icon-sm': {
            'font-size': '1.25rem',
          },
          '.icon-md': {
            'font-size': '1.5rem',
          },
          '.icon-lg': {
            'font-size': '2.1875rem',
          },
          '.icon-xl': {
            'font-size': '2.6875rem',
          },

// UTILS
          '.no-tap-highlight': {
            '-webkit-tap-highlight-color': 'transparent',
          },
        });
        addComponents({
          '.svg-icon': {
            '@apply select-none inline-block fill-current flex-shrink-0 transition-icon':
              {},
          },
        });
      }),
    ];
  },
};

Back to Directory File Manager