in tailwind.defaults.js [50:419]
function addCustomDefinitions({ addComponents, addUtilities }) {
addComponents({
'.animate-skeleton-loader': {
overflow: 'hidden',
'max-width': '32rem',
'background-size': '32rem 100%',
'background-position': '-32rem 0',
'background-color': 'var(--gl-skeleton-loader-background-color)',
'background-image':
'linear-gradient(to right, var(--gl-skeleton-loader-background-color) 0, var(--gl-skeleton-loader-shimmer-color) 23%, var(--gl-skeleton-loader-shimmer-color) 27%, var(--gl-skeleton-loader-background-color) 50%)',
'background-repeat': 'no-repeat',
'@media (prefers-reduced-motion: no-preference)': {
animation: 'gl-keyframes-skeleton-loader 2.5s linear',
'animation-delay': 'inherit',
'animation-iteration-count': '3',
},
'@keyframes gl-keyframes-skeleton-loader': {
'0%': {
// absolute numbers are required to make the animation width-independent
'background-position-x': '-32rem',
},
'100%': {
'background-position-x': '32rem',
},
},
},
'.border': {
'border-style': 'solid',
'border-color': 'var(--gl-border-color-default)',
},
'.border-t': {
'border-top-style': 'solid',
'border-top-color': 'var(--gl-border-color-default)',
},
'.border-r': {
'border-right-style': 'solid',
'border-right-color': 'var(--gl-border-color-default)',
},
'.border-b': {
'border-bottom-style': 'solid',
'border-bottom-color': 'var(--gl-border-color-default)',
},
'.border-l': {
'border-left-style': 'solid',
'border-left-color': 'var(--gl-border-color-default)',
},
'.str-truncated': {
display: 'inline-block',
overflow: 'hidden',
'text-overflow': 'ellipsis',
'vertical-align': 'top',
'white-space': 'nowrap',
'max-width': '82%',
},
'.no-spin[type="number"]': {
'&::-webkit-outer-spin-button': {
'-webkit-appearance': 'none',
margin: '0',
},
'&::-webkit-inner-spin-button': {
'-webkit-appearance': 'none',
margin: '0',
},
'-moz-appearance': 'textfield',
},
'.heading-6': {
'font-weight': '600',
'margin-top': '0',
'font-size': '0.8125rem',
'letter-spacing': 'inherit',
'line-height': '1.25',
'margin-bottom': '1rem',
color: 'var(--gl-text-color-heading)',
},
'.heading-6-fixed': {
'font-weight': '600',
'margin-top': '0',
'font-size': '0.8125rem',
'letter-spacing': 'inherit',
'line-height': '1.25',
'margin-bottom': '1rem',
color: 'var(--gl-text-color-heading)',
},
'.heading-5': {
'font-weight': '600',
'margin-top': '0',
'font-size': '0.875rem',
'letter-spacing': 'inherit',
'line-height': '1.25',
'margin-bottom': '1rem',
color: 'var(--gl-text-color-heading)',
},
'.heading-5-fixed': {
'font-weight': '600',
'margin-top': '0',
'font-size': '0.875rem',
'letter-spacing': 'inherit',
'line-height': '1.25',
'margin-bottom': '1rem',
color: 'var(--gl-text-color-heading)',
},
'.heading-4': {
'font-weight': '600',
'margin-top': '0',
'font-size': '1rem',
'letter-spacing': 'inherit',
'line-height': '1.25',
'margin-bottom': '1rem',
color: 'var(--gl-text-color-heading)',
},
'.heading-4-fixed': {
'font-weight': '600',
'margin-top': '0',
'font-size': '1rem',
'letter-spacing': 'inherit',
'line-height': '1.25',
'margin-bottom': '1rem',
color: 'var(--gl-text-color-heading)',
},
'.heading-3': {
'font-weight': '600',
'margin-top': '0',
'font-size': 'clamp(1.125rem, 0.9027777778rem + 0.462962963vw, 1.25rem)',
'letter-spacing': 'inherit',
'line-height': '1.25',
'margin-bottom': '1rem',
color: 'var(--gl-text-color-heading)',
},
'.heading-3-fixed': {
'font-weight': '600',
'margin-top': '0',
'font-size': '1.125rem',
'letter-spacing': 'inherit',
'line-height': '1.25',
'margin-bottom': '1rem',
color: 'var(--gl-text-color-heading)',
},
'.heading-2': {
'font-weight': '600',
'margin-top': '0',
'font-size': 'clamp(1.3125rem, 0.8680555556rem + 0.9259259259vw, 1.5625rem)',
'letter-spacing': '-0.01em',
'line-height': '1.25',
'margin-bottom': '1rem',
color: 'var(--gl-text-color-heading)',
},
'.heading-2-fixed': {
'font-weight': '600',
'margin-top': '0',
'font-size': '1.3125rem',
'letter-spacing': '-0.01em',
'line-height': '1.25',
'margin-bottom': '1rem',
color: 'var(--gl-text-color-heading)',
},
'.heading-1': {
'font-weight': '600',
'margin-top': '0',
'font-size': 'clamp(1.5rem, 0.8333333333rem + 1.3888888889vw, 1.875rem)',
'letter-spacing': '-0.01em',
'line-height': '1.25',
'margin-bottom': '1rem',
color: 'var(--gl-text-color-heading)',
},
'.heading-1-fixed': {
'font-weight': '600',
'margin-top': '0',
'font-size': '1.5rem',
'letter-spacing': '-0.01em',
'line-height': '1.25',
'margin-bottom': '1rem',
color: 'var(--gl-text-color-heading)',
},
'.heading-display': {
'font-weight': '600',
'margin-top': '0',
'font-size': 'clamp(1.75rem, 0.8611111111rem + 1.8518518519vw, 2.25rem)',
'letter-spacing': '-0.01em',
'line-height': '1.125',
'margin-bottom': '1.5rem',
color: 'var(--gl-text-color-heading)',
},
/**
* gl-heading-scale classes define default properties for heading typography
* based on font-size scale value and default or fixed sizing.
*
* Note: overrides Bootstrap margin-top, other margin is determined by
* individual context. Larger headings have reduced letter spacing.
* Display heading (800) has different line height.
*/
'.heading-scale-100': {
'font-weight': '600',
'margin-top': '0',
'font-size': '0.75rem',
'letter-spacing': 'inherit',
'line-height': '1.25',
color: 'var(--gl-text-color-heading)',
},
'.heading-scale-100-fixed': {
'font-weight': '600',
'margin-top': '0',
'font-size': '0.75rem',
'letter-spacing': 'inherit',
'line-height': '1.25',
color: 'var(--gl-text-color-heading)',
},
'.heading-scale-200': {
'font-weight': '600',
'margin-top': '0',
'font-size': '0.8125rem',
'letter-spacing': 'inherit',
'line-height': '1.25',
color: 'var(--gl-text-color-heading)',
},
'.heading-scale-200-fixed': {
'font-weight': '600',
'margin-top': '0',
'font-size': '0.8125rem',
'letter-spacing': 'inherit',
'line-height': '1.25',
color: 'var(--gl-text-color-heading)',
},
'.heading-scale-300': {
'font-weight': '600',
'margin-top': '0',
'font-size': '0.875rem',
'letter-spacing': 'inherit',
'line-height': '1.25',
color: 'var(--gl-text-color-heading)',
},
'.heading-scale-300-fixed': {
'font-weight': '600',
'margin-top': '0',
'font-size': '0.875rem',
'letter-spacing': 'inherit',
'line-height': '1.25',
color: 'var(--gl-text-color-heading)',
},
'.heading-scale-400': {
'font-weight': '600',
'margin-top': '0',
'font-size': '1rem',
'letter-spacing': 'inherit',
'line-height': '1.25',
color: 'var(--gl-text-color-heading)',
},
'.heading-scale-400-fixed': {
'font-weight': '600',
'margin-top': '0',
'font-size': '1rem',
'letter-spacing': 'inherit',
'line-height': '1.25',
color: 'var(--gl-text-color-heading)',
},
'.heading-scale-500': {
'font-weight': '600',
'margin-top': '0',
'font-size': 'clamp(1.125rem, 0.9027777778rem + 0.462962963vw, 1.25rem)',
'letter-spacing': 'inherit',
'line-height': '1.25',
color: 'var(--gl-text-color-heading)',
},
'.heading-scale-500-fixed': {
'font-weight': '600',
'margin-top': '0',
'font-size': '1.125rem',
'letter-spacing': 'inherit',
'line-height': '1.25',
color: 'var(--gl-text-color-heading)',
},
'.heading-scale-600': {
'font-weight': '600',
'margin-top': '0',
'font-size': 'clamp(1.3125rem, 0.8680555556rem + 0.9259259259vw, 1.5625rem)',
'letter-spacing': '-0.01em',
'line-height': '1.25',
color: 'var(--gl-text-color-heading)',
},
'.heading-scale-600-fixed': {
'font-weight': '600',
'margin-top': '0',
'font-size': '1.3125rem',
'letter-spacing': '-0.01em',
'line-height': '1.25',
color: 'var(--gl-text-color-heading)',
},
'.heading-scale-700': {
'font-weight': '600',
'margin-top': '0',
'font-size': 'clamp(1.5rem, 0.8333333333rem + 1.3888888889vw, 1.875rem)',
'letter-spacing': '-0.01em',
'line-height': '1.25',
color: 'var(--gl-text-color-heading)',
},
'.heading-scale-700-fixed': {
'font-weight': '600',
'margin-top': '0',
'font-size': '1.5rem',
'letter-spacing': '-0.01em',
'line-height': '1.25',
color: 'var(--gl-text-color-heading)',
},
'.heading-scale-800': {
'font-weight': '600',
'margin-top': '0',
'font-size': 'clamp(1.75rem, 0.8611111111rem + 1.8518518519vw, 2.25rem)',
'letter-spacing': '-0.01em',
'line-height': '1.125',
color: 'var(--gl-text-color-heading)',
},
'.heading-scale-800-fixed': {
'font-weight': '600',
'margin-top': '0',
'font-size': '1.75rem',
'letter-spacing': '-0.01em',
'line-height': '1.125',
color: 'var(--gl-text-color-heading)',
},
});
addUtilities({
'.font-monospace': {
'font-family':
'var(--default-mono-font, "GitLab Mono"), "JetBrains Mono", "Menlo", "DejaVu Sans Mono", "Liberation Mono", "Consolas", "Ubuntu Mono", "Courier New", "andale mono", "lucida console", monospace',
'font-variant-ligatures': 'none',
},
'.break-anywhere': {
'overflow-wrap': 'anywhere',
'word-break': 'normal',
},
'.wrap-anywhere': {
'overflow-wrap': 'anywhere',
},
'.border-b-solid': {
'border-bottom-style': 'solid',
},
'.border-b-initial': {
'border-bottom-style': 'initial',
},
'.border-l-solid': {
'border-left-style': 'solid',
},
'.border-r-solid': {
'border-right-style': 'solid',
},
'.border-t-solid': {
'border-top-style': 'solid',
},
'.clearfix': {
'&::after': {
display: 'block',
clear: 'both',
content: '""',
},
},
'.focus': {
'box-shadow':
'0 0 0 1px var(--gl-focus-ring-inner-color), 0 0 0 3px var(--gl-focus-ring-outer-color)',
outline: 'none',
},
'.focus-inset': {
'box-shadow':
'inset 0 0 0 2px var(--gl-focus-ring-outer-color), inset 0 0 0 3px var(--gl-focus-ring-inner-color), inset 0 0 0 1px var(--gl-focus-ring-inner-color)',
outline: 'none',
},
'.text-align-inherit': {
'text-align': 'inherit',
},
});
}