n8n/packages/nodes-base/nodes/Form/cssVariables.ts

71 lines
1.8 KiB
TypeScript

export const cssVariables = `
:root {
--font-family: 'Open Sans', sans-serif;
--font-weight-normal: 400;
--font-weight-bold: 600;
--font-size-body: 12px;
--font-size-label: 14px;
--font-size-test-notice: 12px;
--font-size-input: 14px;
--font-size-header: 20px;
--font-size-paragraph: 14px;
--font-size-link: 12px;
--font-size-error: 12px;
--font-size-html-h1: 28px;
--font-size-html-h2: 20px;
--font-size-html-h3: 16px;
--font-size-html-h4: 14px;
--font-size-html-h5: 12px;
--font-size-html-h6: 10px;
--font-size-subheader: 14px;
/* Colors */
--color-background: #fbfcfe;
--color-test-notice-text: #e6a23d;
--color-test-notice-bg: #fefaf6;
--color-test-notice-border: #f6dcb7;
--color-card-bg: #ffffff;
--color-card-border: #dbdfe7;
--color-card-shadow: rgba(99, 77, 255, 0.06);
--color-link: #7e8186;
--color-header: #525356;
--color-label: #555555;
--color-input-border: #dbdfe7;
--color-input-text: #71747A;
--color-focus-border: rgb(90, 76, 194);
--color-submit-btn-bg: #ff6d5a;
--color-submit-btn-text: #ffffff;
--color-error: #ea1f30;
--color-required: #ff6d5a;
--color-clear-button-bg: #7e8186;
--color-html-text: #555;
--color-html-link: #ff6d5a;
--color-header-subtext: #7e8186;
/* Border Radii */
--border-radius-card: 8px;
--border-radius-input: 6px;
--border-radius-clear-btn: 50%;
--card-border-radius: 8px;
/* Spacing */
--padding-container-top: 24px;
--padding-card: 24px;
--padding-test-notice-vertical: 12px;
--padding-test-notice-horizontal: 24px;
--margin-bottom-card: 16px;
--padding-form-input: 12px;
--card-padding: 24px;
--card-margin-bottom: 16px;
/* Dimensions */
--container-width: 448px;
--submit-btn-height: 48px;
--checkbox-size: 18px;
/* Others */
--box-shadow-card: 0px 4px 16px 0px var(--color-card-shadow);
--opacity-placeholder: 0.5;
}
`;