mirror of
https://github.com/PostHog/posthog.git
synced 2024-11-25 11:17:50 +01:00
3b4aaf093a
* Move web analytics CTEs to their own file * Add overview stats query * Add very basic structure of web dashboard * Add missing entry in SavedInsights * Move session_cte into from * Replace dashboard css with "tailwind" * Make top pages query not a f-string
237 lines
15 KiB
JavaScript
237 lines
15 KiB
JavaScript
// NOTE: We do not actually use Tailwind but having this file allows
|
|
// Tailwind-supporting IDEs to autocomplete classnames, most of which we follow by convention
|
|
|
|
// NOTE: Currently this has to be manually synced wit ./frontend/styles/vars.scss
|
|
module.exports = {
|
|
content: ['./frontend/**/*.{js,jsx,ts,tsx}'],
|
|
theme: {
|
|
colors: {
|
|
'primary-highlight': 'rgba(#1d4aff, 0.1)',
|
|
'primary-light': '#345cff',
|
|
primary: '#1d4aff',
|
|
'primary-dark': '#1330a6',
|
|
'danger-highlight': 'rgba(#db3707, 0.1)',
|
|
'danger-lighter': '#ffa599',
|
|
'danger-light': '#df4b20',
|
|
danger: '#db3707',
|
|
'danger-dark': '#992705',
|
|
'warning-highlight': 'rgba(#f7a501, 0.1)',
|
|
'warning-light': '#f8b633',
|
|
warning: '#f7a501',
|
|
'warning-dark': '#a06b01',
|
|
'success-highlight': 'rgba(#388600, 0.1)',
|
|
'success-light': '#5f9d32',
|
|
success: '#388600',
|
|
'success-dark': '#245700',
|
|
'primary-alt-highlight': 'rgba(#35416b, 0.1)',
|
|
'primary-alt': '#35416b',
|
|
'primary-alt-dark': '#222a46',
|
|
default: '#2d2d2d',
|
|
'default-dark': '#050505',
|
|
muted: '#5f5f5f',
|
|
'muted-dark': '#403939',
|
|
'muted-alt': '#747ea1',
|
|
'muted-alt-dark': '#515871',
|
|
mark: 'hsl(42deg 93% 86% / 80%)',
|
|
white: '#fff',
|
|
'bg-light': '#fff',
|
|
side: '#fafaf9',
|
|
mid: '#f2f2f2',
|
|
border: 'rgba(0, 0, 0, 0.15)',
|
|
'border-light': 'rgba(0, 0, 0, 0.08)',
|
|
'border-bold': 'rgba(0, 0, 0, 0.24)',
|
|
'border-active': 'rgba(0, 0, 0, 0.36)',
|
|
transparent: 'transparent',
|
|
|
|
'brand-blue': '#1d4aff',
|
|
'brand-red': '#f54e00',
|
|
'brand-yellow': '#f9bd2b',
|
|
'brand-key': '#000',
|
|
},
|
|
extend: {
|
|
screens: {
|
|
sm: '576px',
|
|
md: '768px',
|
|
lg: '992px',
|
|
xl: '1200px',
|
|
xxl: '1600px',
|
|
},
|
|
},
|
|
},
|
|
plugins: [],
|
|
// Comment in plugins that we have managed to replicate in our utilities.scss
|
|
corePlugins: [
|
|
// 'accentColor', // The accent-color utilities like accent-green-700
|
|
// 'accessibility', // The sr-only and not-sr-only utilities
|
|
'alignContent', // The align-content utilities like content-end
|
|
'alignItems', // The align-items utilities like items-center
|
|
// 'alignSelf', // The align-self utilities like self-end
|
|
// 'animation', // The animation utilities like animate-ping
|
|
// 'appearance', // The appearance utilities like appearance-none
|
|
'aspectRatio', // The aspect-ratio utilities like aspect-square
|
|
// 'backdropBlur', // The backdrop-blur utilities like backdrop-blur-md
|
|
// 'backdropBrightness', // The backdrop-brightness utilities like backdrop-brightness-100
|
|
// 'backdropContrast', // The backdrop-contrast utilities like backdrop-contrast-100
|
|
// 'backdropFilter', // The backdrop-filter utilities like backdrop-filter
|
|
// 'backdropGrayscale', // The backdrop-grayscale utilities like backdrop-grayscale-0
|
|
// 'backdropHueRotate', // The backdrop-hue-rotate utilities like backdrop-hue-rotate-30
|
|
// 'backdropInvert', // The backdrop-invert utilities like backdrop-invert-0
|
|
// 'backdropOpacity', // The backdrop-opacity utilities like backdrop-opacity-50
|
|
// 'backdropSaturate', // The backdrop-saturate utilities like backdrop-saturate-100
|
|
// 'backdropSepia', // The backdrop-sepia utilities like backdrop-sepia-0
|
|
// 'backgroundAttachment', // The background-attachment utilities like bg-local
|
|
// 'backgroundBlendMode', // The background-blend-mode utilities like bg-blend-color-burn
|
|
// 'backgroundClip', // The background-clip utilities like bg-clip-padding
|
|
'backgroundColor', // The background-color utilities like bg-green-700
|
|
// 'backgroundImage', // The background-image utilities like bg-gradient-to-br
|
|
// 'backgroundOpacity', // The background-color opacity utilities like bg-opacity-25
|
|
// 'backgroundOrigin', // The background-origin utilities like bg-origin-padding
|
|
// 'backgroundPosition', // The background-position utilities like bg-left-top
|
|
// 'backgroundRepeat', // The background-repeat utilities like bg-repeat-x
|
|
// 'backgroundSize', // The background-size utilities like bg-cover
|
|
// 'blur', // The blur utilities like blur-md
|
|
// 'borderCollapse', // The border-collapse utilities like border-collapse
|
|
'borderColor', // The border-color utilities like border-t-green-700
|
|
// 'borderOpacity', // The border-color opacity utilities like border-opacity-25
|
|
'borderRadius', // The border-radius utilities like rounded-l-lg
|
|
// 'borderSpacing', // The border-spacing utilities like border-spacing-x-28
|
|
'borderStyle', // The border-style utilities like border-dotted
|
|
'borderWidth', // The border-width utilities like border-t-4
|
|
// 'boxDecorationBreak', // The box-decoration-break utilities like decoration-clone
|
|
// 'boxShadow', // The box-shadow utilities like shadow-lg
|
|
// 'boxShadowColor', // The box-shadow-color utilities like shadow-green-700
|
|
// 'boxSizing', // The box-sizing utilities like box-border
|
|
// 'breakAfter', // The break-after utilities like break-after-avoid-page
|
|
// 'breakBefore', // The break-before utilities like break-before-avoid-page
|
|
// 'breakInside', // The break-inside utilities like break-inside-avoid
|
|
// 'brightness', // The brightness utilities like brightness-100
|
|
// 'caretColor', // The caret-color utilities like caret-green-700
|
|
// 'clear', // The clear utilities like clear-right
|
|
// 'columns', // The columns utilities like columns-auto
|
|
// 'container', // The container component
|
|
// 'content', // The content utilities like content-none
|
|
// 'contrast', // The contrast utilities like contrast-100
|
|
'cursor', // The cursor utilities like cursor-grab
|
|
// 'display', // The display utilities like table-column-group
|
|
// 'divideColor', // The between elements border-color utilities like divide-slate-500
|
|
// 'divideOpacity', // The divide-opacity utilities like divide-opacity-50
|
|
// 'divideStyle', // The divide-style utilities like divide-dotted
|
|
// 'divideWidth', // The between elements border-width utilities like divide-x-2
|
|
// 'dropShadow', // The drop-shadow utilities like drop-shadow-lg
|
|
// 'fill', // The fill utilities like fill-green-700
|
|
// 'filter', // The filter utilities like filter
|
|
'flex', // The flex utilities like flex-auto
|
|
// 'flexBasis', // The flex-basis utilities like basis-px
|
|
'flexDirection', // The flex-direction utilities like flex-row-reverse
|
|
'flexGrow', // The flex-grow utilities like flex-grow
|
|
'flexShrink', // The flex-shrink utilities like flex-shrink
|
|
'flexWrap', // The flex-wrap utilities like flex-wrap-reverse
|
|
'float', // The float utilities like float-left
|
|
'fontFamily', // The font-family utilities like font-serif
|
|
'fontSize', // The font-size utilities like text-3xl
|
|
// 'fontSmoothing', // The font-smoothing utilities like antialiased
|
|
'fontStyle', // The font-style utilities like italic
|
|
// 'fontVariantNumeric', // The font-variant-numeric utilities like oldstyle-nums
|
|
'fontWeight', // The font-weight utilities like font-medium
|
|
'gap', // The gap utilities like gap-x-28
|
|
// 'gradientColorStops', // The gradient-color-stops utilities like via-green-700
|
|
// 'grayscale', // The grayscale utilities like grayscale-0
|
|
// 'gridAutoColumns', // The grid-auto-columns utilities like auto-cols-min
|
|
// 'gridAutoFlow', // The grid-auto-flow utilities like grid-flow-dense
|
|
// 'gridAutoRows', // The grid-auto-rows utilities like auto-rows-min
|
|
'gridColumn', // The grid-column utilities like col-span-6
|
|
'gridColumnEnd', // The grid-column-end utilities like col-end-7
|
|
'gridColumnStart', // The grid-column-start utilities like col-start-7
|
|
'gridRow', // The grid-row utilities like row-span-3
|
|
'gridRowEnd', // The grid-row-end utilities like row-end-4
|
|
'gridRowStart', // The grid-row-start utilities like row-start-4
|
|
'gridTemplateColumns', // The grid-template-columns utilities like grid-cols-7
|
|
// 'gridTemplateRows', // The grid-template-rows utilities like grid-rows-4
|
|
'height', // The height utilities like h-72
|
|
// 'hueRotate', // The hue-rotate utilities like hue-rotate-30
|
|
// 'inset', // The inset utilities like top-44
|
|
// 'invert', // The invert utilities like invert-0
|
|
// 'isolation', // The isolation utilities like isolate
|
|
'justifyContent', // The justify-content utilities like justify-center
|
|
// 'justifyItems', // The justify-items utilities like justify-items-end
|
|
// 'justifySelf', // The justify-self utilities like justify-self-end
|
|
'letterSpacing', // The letter-spacing utilities like tracking-normal
|
|
'lineHeight', // The line-height utilities like leading-9
|
|
// 'listStylePosition', // The list-style-position utilities like list-inside
|
|
'listStyleType', // The list-style-type utilities like list-disc
|
|
'margin', // The margin utilities like mt-28
|
|
'maxHeight', // The max-height utilities like max-h-36
|
|
'maxWidth', // The max-width utilities like max-w-6xl
|
|
'minHeight', // The min-height utilities like min-h-screen
|
|
'minWidth', // The min-width utilities like min-w-min
|
|
// 'mixBlendMode', // The mix-blend-mode utilities like mix-blend-hard-light
|
|
'objectFit', // The object-fit utilities like object-fill
|
|
// 'objectPosition', // The object-position utilities like object-left-top
|
|
'opacity', // The opacity utilities like opacity-50
|
|
// 'order', // The order utilities like order-8
|
|
// 'outlineColor', // The outline-color utilities like outline-green-700
|
|
// 'outlineOffset', // The outline-offset utilities like outline-offset-2
|
|
// 'outlineStyle', // The outline-style utilities like outline-dashed
|
|
// 'outlineWidth', // The outline-width utilities like outline-2
|
|
'overflow', // The overflow utilities like overflow-x-hidden
|
|
// 'overscrollBehavior', // The overscroll-behavior utilities like overscroll-y-contain
|
|
'padding', // The padding utilities like pt-28
|
|
// 'placeContent', // The place-content utilities like place-content-between
|
|
// 'placeItems', // The place-items utilities like place-items-end
|
|
// 'placeSelf', // The place-self utilities like place-self-end
|
|
// 'placeholderColor', // The placeholder color utilities like placeholder-red-600
|
|
// 'placeholderOpacity', // The placeholder color opacity utilities like placeholder-opacity-25
|
|
'pointerEvents', // The pointer-events utilities like pointer-events-none
|
|
'position', // The position utilities like absolute
|
|
// 'preflight', // Tailwind's base/reset styles
|
|
// 'resize', // The resize utilities like resize-y
|
|
// 'ringColor', // The ring-color utilities like ring-green-700
|
|
// 'ringOffsetColor', // The ring-offset-color utilities like ring-offset-green-700
|
|
// 'ringOffsetWidth', // The ring-offset-width utilities like ring-offset-2
|
|
// 'ringOpacity', // The ring-opacity utilities like ring-opacity-50
|
|
// 'ringWidth', // The ring-width utilities like ring-4
|
|
'rotate', // The rotate utilities like rotate-6
|
|
// 'saturate', // The saturate utilities like saturate-100
|
|
// 'scale', // The scale utilities like scale-x-95
|
|
// 'scrollBehavior', // The scroll-behavior utilities like scroll-auto
|
|
// 'scrollMargin', // The scroll-margin utilities like scroll-mt-28
|
|
// 'scrollPadding', // The scroll-padding utilities like scroll-pt-28
|
|
// 'scrollSnapAlign', // The scroll-snap-align utilities like snap-end
|
|
// 'scrollSnapStop', // The scroll-snap-stop utilities like snap-normal
|
|
// 'scrollSnapType', // The scroll-snap-type utilities like snap-y
|
|
// 'sepia', // The sepia utilities like sepia-0
|
|
// 'skew', // The skew utilities like skew-x-12
|
|
// 'space', // The "space-between" utilities like space-x-4
|
|
// 'stroke', // The stroke utilities like stroke-green-700
|
|
// 'strokeWidth', // The stroke-width utilities like stroke-1
|
|
// 'tableLayout', // The table-layout utilities like table-auto
|
|
'textAlign', // The text-align utilities like text-right
|
|
'textColor', // The text-color utilities like text-green-700
|
|
'textDecoration', // The text-decoration utilities like overline
|
|
'textDecorationColor', // The text-decoration-color utilities like decoration-green-700
|
|
// 'textDecorationStyle', // The text-decoration-style utilities like decoration-dotted
|
|
// 'textDecorationThickness', // The text-decoration-thickness utilities like decoration-4
|
|
// 'textIndent', // The text-indent utilities like indent-28
|
|
// 'textOpacity', // The text-opacity utilities like text-opacity-50
|
|
'textOverflow', // The text-overflow utilities like overflow-ellipsis
|
|
// 'textTransform', // The text-transform utilities like lowercase
|
|
// 'textUnderlineOffset', // The text-underline-offset utilities like underline-offset-2
|
|
// 'touchAction', // The touch-action utilities like touch-pan-right
|
|
// 'transform', // The transform utility (for enabling transform features)
|
|
// 'transformOrigin', // The transform-origin utilities like origin-bottom-right
|
|
// 'transitionDelay', // The transition-delay utilities like delay-200
|
|
// 'transitionDuration', // The transition-duration utilities like duration-200
|
|
// 'transitionProperty', // The transition-property utilities like transition-colors
|
|
// 'transitionTimingFunction', // The transition-timing-function utilities like ease-in
|
|
// 'translate', // The translate utilities like translate-x-full
|
|
'userSelect', // The user-select utilities like select-text
|
|
// 'verticalAlign', // The vertical-align utilities like align-bottom
|
|
// 'visibility', // The visibility utilities like visible
|
|
'whitespace', // The whitespace utilities like whitespace-pre
|
|
'width', // The width utilities like w-1.5
|
|
// 'willChange', // The will-change utilities like will-change-scroll
|
|
// 'wordBreak', // The word-break utilities like break-words
|
|
'zIndex', // The z-index utilities like z-30
|
|
],
|
|
}
|