UNPKG

@freshworks/crayons

Version:
79 lines (74 loc) 2.12 kB
/* Need to check with designer */ /* Need to check with designer */ :host { font-family: var(--fw-font-family, -apple-system, blinkmacsystemfont, "Segoe UI", roboto, oxygen, ubuntu, cantarell, "Open Sans", "Helvetica Neue", sans-serif); -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; box-sizing: border-box; } /* @prop --fw-hint-color: Color of the hint text. @prop --fw-warning-color: Color of the warning text. @prop --fw-error-color: Color of the error text. */ .field-control { position: relative; } .field-control-label { display: block; font-size: 12px; color: var(--fw-label-color, #475867); font-weight: 600; margin-bottom: 4px; padding-left: 2px; line-height: 20px; } .field-control-label.required::after { content: "*"; position: relative; display: inline-block; top: 2px; font-size: 14px; color: #d72d30; padding-left: 2px; font-weight: 700; } .field-control-hint-text { font-family: -apple-system, blinkmacsystemfont, "Segoe UI", "Roboto", "Helvetica Neue", arial, sans-serif; font-size: 12px; line-height: 20px; margin-top: 4px; margin-bottom: 0; color: var(--fw-hint-color, #acb6be); position: inherit; display: block; padding-left: 2px; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; } .field-control-error-text { font-family: -apple-system, blinkmacsystemfont, "Segoe UI", "Roboto", "Helvetica Neue", arial, sans-serif; font-size: 12px; line-height: 20px; margin-top: 4px; margin-bottom: 0; color: var(--fw-error-color, #d72d30); position: inherit; display: block; padding-left: 2px; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; } .field-control-warning-text { font-family: -apple-system, blinkmacsystemfont, "Segoe UI", "Roboto", "Helvetica Neue", arial, sans-serif; font-size: 12px; line-height: 20px; margin-top: 4px; margin-bottom: 0; color: var(--fw-warning-color, #f8ab59); position: inherit; display: block; padding-left: 2px; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; }