UNPKG

@gravityforms/components

Version:

UI components for use in Gravity Forms development. Both React and vanilla js flavors.

314 lines (257 loc) 8.43 kB
.admin-bar .gform-admin .gform-dialog__mask--position-fixed { block-size: calc(100vh - 46px); inset-block-start: 46px; } @media (min-width: 783px) {.admin-bar .gform-admin .gform-dialog__mask--position-fixed { block-size: calc(100vh - 32px); inset-block-start: 32px } } @media (min-width: 783px) { .wp-admin .gform-admin .gform-dialog__mask--position-fixed { inline-size: calc(100% - 160px) } } @media (min-width: 783px) { .wp-admin.folded .gform-admin .gform-dialog__mask--position-fixed, .wp-admin.auto-fold .gform-admin .gform-dialog__mask--position-fixed { inline-size: calc(100% - 36px) } } @media (min-width: 961px) { .wp-admin.auto-fold:not(.folded) .gform-admin .gform-dialog__mask--position-fixed { inline-size: calc(100% - 160px) } } .gform-admin .gform-dialog__mask { align-items: center; display: none; height: 100%; justify-content: center; opacity: 0; top: 0; transition: opacity 200ms ease-in-out; width: 100%; } .gform-admin .gform-dialog__mask.gform-dialog--alignment-top { align-items: flex-start; overflow-y: auto; padding-bottom: 50px; padding-top: 110px; } .gform-admin .gform-dialog__mask.gform-dialog--anim-in-ready { display: flex; opacity: 0; } .gform-admin .gform-dialog__mask.gform-dialog--anim-in-active { opacity: 1; } .gform-admin .gform-dialog__mask.gform-dialog--anim-in-active .gform-dialog { transform: scale(1); } .gform-admin .gform-dialog__mask.gform-dialog__mask--position-fixed { position: fixed; } .gform-admin .gform-dialog__mask.gform-dialog__mask--position-absolute { position: absolute; } .gform-admin .gform-dialog__mask.gform-dialog__mask--theme-light { background: rgba(255, 255, 255, 0.65); } .gform-admin .gform-dialog__mask.gform-dialog__mask--theme-dark { background-color: rgba(36, 39, 72, 0.75); } .gform-admin .gform-dialog__mask.gform-dialog__mask--blur { -webkit-backdrop-filter: blur(8px); backdrop-filter: blur(8px); } .gform-admin .gform-dialog { background: #fff; border: 1px solid #f6f9fc; box-shadow: 0 0 1px rgba(18, 25, 97, 0.24), 0 24px 24px rgba(18, 25, 97, 0.03), 0 2px 2px rgba(18, 25, 97, 0.03), 0 4px 4px rgba(18, 25, 97, 0.03), 0 8px 8px rgba(18, 25, 97, 0.03), 0 16px 16px rgba(18, 25, 97, 0.03); box-sizing: border-box; max-width: 600px; overflow-y: auto; padding: 14px 25px 25px; position: relative; transform: scale(0.95); transition: transform 200ms ease-in-out; width: calc(100% - 40px); } .gform-admin .gform-dialog.gform-dialog--container { border: none; box-shadow: none; height: 100%; max-width: none; padding: 0; width: 100%; } .gform-admin .gform-dialog.gform-dialog--animated { opacity: 0; position: relative; top: 20px; transform: scale(1); transition: transform 600ms, opacity 600ms, top 600ms; } .gform-admin .gform-dialog.gform-dialog--animated.gform-dialog--animate-reveal { opacity: 1; top: 0; transform: scale(1); } .gform-admin .gform-dialog.gform-dialog__theme--cosmos { border-radius: 3px; box-shadow: 0 24px 24px rgba(18, 25, 97, 0.03), 0 2px 2px rgba(18, 25, 97, 0.03), 0 4px 4px rgba(18, 25, 97, 0.03), 0 8px 8px rgba(18, 25, 97, 0.03), 0 16px 16px rgba(18, 25, 97, 0.03); } .gform-admin .gform-dialog.gform-dialog__theme--cosmos .gform-dialog__content { color: #667085; } .gform-admin .gform-dialog.gform-dialog__theme--cosmos .gform-dialog__footer { padding-top: 32px; } .gform-admin .gform-dialog.gform-dialog--simplebar { align-items: stretch; display: flex; flex-direction: column; overflow-y: inherit; padding: 0; } .gform-admin .gform-dialog.gform-dialog--simplebar [data-simplebar="init"] { box-sizing: border-box; display: flex; flex-grow: 1; overflow-y: auto; padding: 14px 25px 25px; width: 100%; } .gform-admin .gform-dialog.gform-dialog--simplebar .simplebar-content-wrapper { border: 0; outline: 0; } .gform-admin .gform-dialog .gform-dialog__close { inset-inline-end: 25px; position: absolute; top: 25px; } .gform-admin .gform-dialog .gform-dialog__close.gform-button--size-xs { height: 1.875rem; width: 1.875rem; } .gform-admin .gform-dialog .gform-dialog__close.gform-button--size-xs .gform-button__icon { top: 0; } .gform-admin .gform-dialog .gform-dialog__close.gform-button--size-md { height: 2.5rem; inset-inline-end: 20px; top: 20px; width: 2.5rem; } .gform-admin .gform-dialog .gform-dialog__close.gform-button--size-md .gform-button__icon { top: 0; } .gform-admin .gform-dialog .gform-dialog__close.gform-button--circular.gform-dialog__close--plain { background: none; border: none; } .gform-admin .gform-dialog .gform-dialog__close.gform-button--circular.gform-dialog__close--plain .gform-button__icon { color: #fff; font-size: 2rem; } .gform-admin .gform-dialog .gform-dialog__close.gform-button--unstyled.gform-button--size-md { justify-content: flex-end; } .gform-admin .gform-dialog .gform-dialog__close.gform-button--unstyled .gform-button__icon { color: #5b5e80; } .gform-admin .gform-dialog .gform-dialog__head.gform-dialog__head--with-divider { border-bottom: 1px solid #e4e4ee; padding-bottom: 15px; } .gform-admin .gform-dialog .gform-dialog__head .gform-indicator { position: absolute; } .gform-admin .gform-dialog .gform-dialog__head .gform-indicator--confirm { inset-block-start: 28px; } .gform-admin .gform-dialog .gform-dialog__title { color: #242748; font-family: inter, -apple-system, blinkmacsystemfont, "Segoe UI", roboto, oxygen-sans, ubuntu, cantarell, "Helvetica Neue", sans-serif; font-size: 1.1875rem; font-weight: 500; line-height: normal; line-height: initial; margin: 10px 0 0 0; padding-inline-end: 30px; position: relative; } .gform-admin .gform-dialog .gform-dialog__title.gform-dialog__title--has-icon { padding-block-start: 6px; padding-inline-start: 50px; } .gform-admin .gform-dialog .gform-dialog__title.gform-dialog__title--icon-type-confirm { padding-block-start: 0; padding-inline-start: 30px; } .gform-admin .gform-dialog.gform-dialog--title-size-md .gform-dialog__title { font-size: 1.5rem; font-weight: 600; } .gform-admin .gform-dialog .gform-dialog__description { color: #5b5e80; display: inline-block; font-family: inter, -apple-system, blinkmacsystemfont, "Segoe UI", roboto, oxygen-sans, ubuntu, cantarell, "Helvetica Neue", sans-serif; font-size: 0.875rem; font-weight: 400; line-height: normal; line-height: initial; margin: 0.75rem 0 0 0; padding-inline-end: 30px; position: relative; } .gform-admin .gform-dialog .gform-dialog__description.gform-dialog__title--has-icon { padding-inline-start: 50px; } .gform-admin .gform-dialog .gform-dialog__title-icon { font-size: 1.5rem; inset-inline-start: 0; position: absolute; top: 3px; } .gform-admin .gform-dialog .gform-dialog__content { padding-bottom: 0; padding-inline-start: 0; padding-top: 10px; } .gform-admin .gform-dialog .gform-dialog__content.gform-dialog__content--with-divider { padding-top: 15px; } .gform-admin .gform-dialog .gform-dialog__content.gform-dialog__content--pad-content { padding-inline-end: 30px; } .gform-admin .gform-dialog .gform-dialog__content, .gform-admin .gform-dialog .gform-dialog__content p { color: #242748; font-family: inter, -apple-system, blinkmacsystemfont, "Segoe UI", roboto, oxygen-sans, ubuntu, cantarell, "Helvetica Neue", sans-serif; font-size: 0.875rem; line-height: 1.188rem; } .gform-admin .gform-dialog .gform-dialog__footer { align-items: center; display: flex; padding-top: 20px; width: 100%; } .gform-admin .gform-dialog .gform-dialog__confirm { margin-inline-start: 12px; } .gform-admin .gform-dialog .gform-dialog__confirm.gform-button--icon-leading .gform-button__icon { font-size: 1.5rem; } .gform-admin .gform-dialog--full-screen { height: calc(100vh - 40px); max-width: 1280px; overflow: auto; padding: 0; } .gform-admin .gform-dialog--full-screen .gform-dialog__content { margin: 0; padding: 0; } /*# sourceMappingURL=dialog.css.map */