UNPKG

@gravityforms/components

Version:

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

1 lines 4.52 kB
{"version":3,"sources":["multi-option-button.css"],"names":[],"mappings":"AAEC;EACC,oBAAoB;EACpB,0DAA0D;EAC1D,kBAAkB;CAKnB;;EAHC;GACC,sBAAsB;EACvB;;CAGD;EACC,+CAA+C;EAC/C,iBAAiB;CAmClB;;CAjCC;GACC,uBAAuB;EACxB;;CAEA;GACC,wBAAwB;EACzB;;CAEA;GACC,6BAA6B;EAC9B;;CAEA;GACC,6BAA6B;EAC9B;;CAEA;GACC,6BAA6B;EAC9B;;CAEA;GACC,4BAA4B;EAC7B;;CAEA;GACC,0BAA0B;EAC3B;;CAEA;GAGC,2BAA2B;EAC5B;;CAKA;GACC,0BAA0B;EAC3B;;CAEA;GACC,wBAAwB;EACzB;;CAGD;EACC,wBAAwB;EACxB,0BAA0B;EAC1B,cAAc;EACd,WAAW;EACX,iBAAiB;CAClB;;CAEA;EAEC,WAAW;CACZ;;CAEA;EACC,0BAA0B;EAC1B,4BAA4B;EAC5B,cAAc;EACd,WAAW;EACX,qBAAqB;EACrB,uBAAuB;EACvB,+BAA+B;EAC/B,iBAAiB;CAgBlB;;CAdC;GACC,mBAA6C;GAC7C,qBAA+C;EAWhD;;CATC;IAEC,mBAAyC;IACzC,qBAA2C;GAC5C;;CAEA;IACC,qBAAiD;GAClD;;CAIF;EACC,mBAAmB;EACnB,WAAW;EACX,iBAAiB;CAClB;;CAEA;EACC,qBAAqB;CACtB;;CAEA;EACC,aAAa;EACb,sBAAsB;CACvB;;CAEA;EACC,aAAa;EACb,aAAa;EACb,sBAAsB;EACtB,mBAAmB;EACnB,WAAW;EACX,oBAAoB;EACpB,kBAAkB;CACnB;;CAEA;EACC,gBAAgB;EAChB,8BAA8B;CAc/B;;CAZC;GACC,gBAAgB;EACjB;;CAEA;GACC,0BAA0B;GAC1B,4BAA4B;EAC7B;;CAEA;GACC,UAAU;EACX;;CAGD;EACC,iBAAiB;CAClB","file":"multi-option-button.css","sourcesContent":[".gform-admin {\n\n\t.gform-multi-option-button {\n\t\tdisplay: inline-grid;\n\t\tgrid-template-columns: minmax(max-content, auto) 1.8125rem;\n\t\tposition: relative;\n\n\t\t* {\n\t\t\tbox-sizing: border-box;\n\t\t}\n\t}\n\n\t.gform-multi-option-button--width-full {\n\t\tgrid-template-columns: minmax(0, 1fr) 1.8125rem;\n\t\tinline-size: 100%;\n\n\t\t.gform-multi-option-button__main {\n\t\t\tjustify-content: center;\n\t\t}\n\n\t\t.gform-multi-option-button__option {\n\t\t\tpadding-inline-end: 3rem;\n\t\t}\n\n\t\t.gform-multi-option-button__option.gform-button--size-xs {\n\t\t\tpadding-inline-end: 2.5625rem;\n\t\t}\n\n\t\t.gform-multi-option-button__option.gform-button--size-sm {\n\t\t\tpadding-inline-end: 2.6875rem;\n\t\t}\n\n\t\t.gform-multi-option-button__option.gform-button--size-xl {\n\t\t\tpadding-inline-end: 3.4375rem;\n\t\t}\n\n\t\t.gform-multi-option-button__option.gform-button--size-height-s {\n\t\t\tpadding-inline-end: 2.375rem;\n\t\t}\n\n\t\t.gform-multi-option-button__option.gform-button--size-height-m {\n\t\t\tpadding-inline-end: 2.5rem;\n\t\t}\n\n\t\t.gform-multi-option-button__option.gform-button--size-height-l,\n\t\t.gform-multi-option-button__option.gform-button--size-height-xl,\n\t\t.gform-multi-option-button__option.gform-button--size-height-xxl {\n\t\t\tpadding-inline-end: 2.75rem;\n\t\t}\n\t}\n\n\t.gform-multi-option-button--open {\n\n\t\t.gform-multi-option-button__main {\n\t\t\tborder-end-start-radius: 0;\n\t\t}\n\n\t\t.gform-multi-option-button__trigger {\n\t\t\tborder-end-end-radius: 0;\n\t\t}\n\t}\n\n\t.gform-multi-option-button__main {\n\t\tborder-end-end-radius: 0;\n\t\tborder-start-end-radius: 0;\n\t\tgrid-column: 1;\n\t\tgrid-row: 1;\n\t\tinline-size: 100%;\n\t}\n\n\t.gform-multi-option-button__main:focus,\n\t.gform-multi-option-button__trigger:focus {\n\t\tz-index: 11;\n\t}\n\n\t.gform-multi-option-button__trigger {\n\t\tborder-end-start-radius: 0;\n\t\tborder-start-start-radius: 0;\n\t\tgrid-column: 2;\n\t\tgrid-row: 1;\n\t\tinline-size: 1.875rem;\n\t\tjustify-content: center;\n\t\tmargin-inline-start: -0.0625rem;\n\t\tpadding-inline: 0;\n\n\t\t&.gform-button--primary-new {\n\t\t\tbackground: var(--gform-admin-color-blue-jay);\n\t\t\tborder-color: var(--gform-admin-color-blue-jay);\n\n\t\t\t&:hover,\n\t\t\t&:active {\n\t\t\t\tbackground: var(--gform-admin-color-port);\n\t\t\t\tborder-color: var(--gform-admin-color-port);\n\t\t\t}\n\n\t\t\t&:focus {\n\t\t\t\tborder-color: var(--gform-admin-color-light-blue);\n\t\t\t}\n\t\t}\n\t}\n\n\t.gform-multi-option-button__popover {\n\t\tgrid-column: 1 / -1;\n\t\tgrid-row: 1;\n\t\tinline-size: 100%;\n\t}\n\n\t.gform-multi-option-button__popover-inner {\n\t\tmin-inline-size: 100%;\n\t}\n\n\t.gform-multi-option-button__options {\n\t\tdisplay: flex;\n\t\tflex-direction: column;\n\t}\n\n\t.gform-multi-option-button__sizer {\n\t\tblock-size: 0;\n\t\tdisplay: flex;\n\t\tflex-direction: column;\n\t\tgrid-column: 1 / -1;\n\t\tgrid-row: 1;\n\t\tpointer-events: none;\n\t\tvisibility: hidden;\n\t}\n\n\t.gform-multi-option-button__option {\n\t\tbox-shadow: none;\n\t\tmargin-block-start: -0.0625rem;\n\n\t\t&:not(:last-child) {\n\t\t\tborder-radius: 0;\n\t\t}\n\n\t\t&:last-child {\n\t\t\tborder-start-end-radius: 0;\n\t\t\tborder-start-start-radius: 0;\n\t\t}\n\n\t\t&:focus {\n\t\t\tz-index: 1;\n\t\t}\n\t}\n\n\t.gform-multi-option-button__sizer-option {\n\t\tinline-size: auto;\n\t}\n}\n"]}