@gravityforms/components
Version:
UI components for use in Gravity Forms development. Both React and vanilla js flavors.
1 lines • 7.2 kB
Source Map (JSON)
{"version":3,"sources":["repeater.css"],"names":[],"mappings":"AAEC;EACC,qBAAqB;CAKtB;;EAHC;GACC,sBAAsB;EACvB;;CAGD;EACC,gBAA0C;EAC1C,eAAe;CA0EhB;;CAxEC;GACC,gBAAgB;EACjB;;CAEA;GAEC,wBAA+C;EAChD;;CAIC;IACC,UAAU;IACV,wBAAwB;GAKzB;;CAHC;KACC,UAAU;IACX;;CAKA;KACC,UAAU;IACX;;CAKA;KACC,UAAU;KACV,wBAAwB;IACzB;;CAKC;MACC,UAAU;KACX;;CAOF;IACC,uBAAuB;GAmBxB;;CAjBC;;KAMC;;;;;OAKE;IACH;;CAVC;MACC,SAAS;KACV;;CAUD;KACC,yBAAyB;IAC1B;;CAGD;IACC,2BAA2B;GAC5B;;CAIF;EACC,YAAY;CACb;;CAEA;EACC,YAAY;CACb;;CAEA;EACC,0CAA0C;EAC1C,gCAAgC;CACjC;;CAEA;EACC,yBAAgD;EAChD,kBAAkB;CACnB;;CAEA;EACC,qBAAqB;EACrB,aAAa;EACb,YAAgC;EAChC,8BAA8B;CAC/B;;CAEA;EACC,gCAAuD;EACvD,sBAA0C;EAC1C,sBAA2C;CAC5C;;CAEA;EACC,aAAa;CAiBd;;CAfC;GACC,wBAAwB;GACxB,8BAA8B;GAC9B,0BAA0B;EAM3B;;CAJC;IACC,oCAAiE;IACjE,+BAAwD;GACzD;;CAGD;GACC,0BAA0B;GAC1B,4BAA4B;EAC7B;;CAMA;GACC,qBAA4C;GAC5C,aAAa;EACd;;CAEA;GACC,qBAAkD;GAClD,+BAAwD;GACxD,UAAU;EACX;;CAKA;GACC,wBAAwB;GACxB,8BAA8B;GAC9B,0BAA0B;EAM3B;;CAJC;IACC,oCAAiE;IACjE,+BAAwD;GACzD;;CAMD;GACC,0BAA0B;GAC1B,4BAA4B;EAC7B;;CAGD;EACC,aAAa;EACb,WAAgC;EAChC,2BAA2B;CAC5B;;CAIC;GAEC,sBAAsB;EACvB;;CAEA;GACC,yBAAyB;GACzB,gBAAgB;EACjB;;CAEA;GACC,mBAAmB;GACnB,aAAa;GACb,YAAgC;GAChC,2BAA2B;EAO5B;;CALC;IACC,gBAAgB;IAChB,uBAAuB;IACvB,mBAAmB;GACpB;;CAKA;IACC,yBAAyB;GAC1B;;CAEA;IACC,mBAAmB;GACpB;;CAMD;GACC,aAAa;EACd;;CAGD;EACC,aAAa;EACb,sBAAsB;EACtB,YAAgC;EAChC,iBAAiB;EACjB,sBAA0C;EAC1C,sBAA2C;CAC5C;;CAIC;GACC,OAAO;EAKR;;CAHC;IACC,WAAW;GACZ;;CAIF;EACC,uBAAuB;EACvB,WAAW;CACZ;;CAEA;EACC,mBAA6C;CAC9C","file":"repeater.css","sourcesContent":[".gform-admin {\n\n\t.gform-repeater {\n\t\tmax-inline-size: 100%;\n\n\t\t* {\n\t\t\tbox-sizing: border-box;\n\t\t}\n\t}\n\n\t.gform-repeater-item {\n\t\tbackground: var(--gform-admin-color-white);\n\t\tcursor: default;\n\n\t\tinput[type=\"text\"] {\n\t\t\ttransition: none;\n\t\t}\n\n\t\t+ .gform-repeater-item,\n\t\t+ .gform-repeater__add-button {\n\t\t\tmargin-block-start: var(--gform-admin-spacer-4);\n\t\t}\n\n\t\t&.gform-repeater-item--show-actions-on-hover {\n\n\t\t\t.gform-repeater-item__minimal-actions {\n\t\t\t\topacity: 0;\n\t\t\t\ttransition: opacity 0.2s;\n\n\t\t\t\t&:focus-within {\n\t\t\t\t\topacity: 1;\n\t\t\t\t}\n\t\t\t}\n\n\t\t\t&:hover {\n\n\t\t\t\t.gform-repeater-item__minimal-actions {\n\t\t\t\t\topacity: 1;\n\t\t\t\t}\n\t\t\t}\n\n\t\t\t&:not(.gform-repeater-item--style-minimal) {\n\n\t\t\t\t.gform-repeater-item__action-control {\n\t\t\t\t\topacity: 0;\n\t\t\t\t\ttransition: opacity 0.2s;\n\t\t\t\t}\n\n\t\t\t\t&:hover,\n\t\t\t\t&:focus-within {\n\n\t\t\t\t\t.gform-repeater-item__action-control {\n\t\t\t\t\t\topacity: 1;\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t}\n\t\t}\n\n\t\t&.gform-repeater-item--style-minimal {\n\n\t\t\t.gform-repeater-item__wrapper {\n\t\t\t\talign-items: flex-start;\n\n\t\t\t\t.gform-button {\n\n\t\t\t\t\t.gform-button__icon {\n\t\t\t\t\t\tmargin: 0;\n\t\t\t\t\t}\n\n\t\t\t\t\t/* &.gform-button--simplified {\n\n\t\t\t\t\t\t&:disabled {\n\t\t\t\t\t\t\tborder-color: transparent;\n\t\t\t\t\t\t}\n\t\t\t\t\t}*/\n\t\t\t\t}\n\n\t\t\t\t.gform-button--size-height-s {\n\t\t\t\t\tpadding: 0.375rem 0.25rem;\n\t\t\t\t}\n\t\t\t}\n\n\t\t\t+ .gform-repeater-item {\n\t\t\t\tmargin-block-start: 0.25rem;\n\t\t\t}\n\t\t}\n\t}\n\n\t.gform-repeater-item--is-draggable:not(.gform-repeater-item--disable-item-drag) {\n\t\tcursor: move;\n\t}\n\n\t.gform-repeater-item--is-dragging {\n\t\topacity: 0.2;\n\t}\n\n\t.gform-repeater-item--is-keyboard-nav {\n\t\tbox-shadow: 2px 5px 5px rgba(0, 0, 0, 0.3);\n\t\ttransform: translate(-2px, -2px);\n\t}\n\n\t.gform-repeater-item--type-block {\n\t\tborder: 1px solid var(--gform-admin-color-snuff);\n\t\tborder-radius: 3px;\n\t}\n\n\t.gform-repeater-item__wrapper {\n\t\talign-items: flex-end;\n\t\tdisplay: flex;\n\t\tgap: var(--gform-admin-spacer-3);\n\t\tjustify-content: space-between;\n\t}\n\n\t.gform-repeater-item--type-block .gform-repeater-item__wrapper {\n\t\tborder-bottom: 1px solid var(--gform-admin-color-snuff);\n\t\tpadding-block: var(--gform-admin-spacer-5);\n\t\tpadding-inline: var(--gform-admin-spacer-6);\n\t}\n\n\t.gform-repeater-item__controls {\n\t\tdisplay: flex;\n\n\t\t.gform-repeater-item__control--up {\n\t\t\tborder-end-end-radius: 0;\n\t\t\tborder-inline-end: transparent;\n\t\t\tborder-start-end-radius: 0;\n\n\t\t\t&:focus-visible {\n\t\t\t\tborder-inline-end: 1px solid var(--gform-admin-color-blue-ribbon);\n\t\t\t\toutline: 0.125rem solid var(--gform-admin-color-spindle);\n\t\t\t}\n\t\t}\n\n\t\t.gform-repeater-item__control--down {\n\t\t\tborder-end-start-radius: 0;\n\t\t\tborder-start-start-radius: 0;\n\t\t}\n\t}\n\n\t.gform-repeater-item__control,\n\t.gform-repeater-item__delete {\n\n\t\t&:focus {\n\t\t\tborder-color: var(--gform-admin-color-snuff);\n\t\t\toutline: none;\n\t\t}\n\n\t\t&:focus-visible {\n\t\t\tborder-color: var(--gform-admin-color-blue-ribbon);\n\t\t\toutline: 0.125rem solid var(--gform-admin-color-spindle);\n\t\t\tz-index: 3;\n\t\t}\n\t}\n\n\t.gform-repeater-item--has-arrows .gform-repeater-item__controls {\n\n\t\t.gform-repeater-item__control--drag-toggle {\n\t\t\tborder-end-end-radius: 0;\n\t\t\tborder-inline-end: transparent;\n\t\t\tborder-start-end-radius: 0;\n\n\t\t\t&:focus-visible {\n\t\t\t\tborder-inline-end: 1px solid var(--gform-admin-color-blue-ribbon);\n\t\t\t\toutline: 0.125rem solid var(--gform-admin-color-spindle);\n\t\t\t}\n\t\t}\n\t}\n\n\t.gform-repeater-item--has-drag-handle .gform-repeater-item__controls {\n\n\t\t.gform-repeater-item__control--up {\n\t\t\tborder-end-start-radius: 0;\n\t\t\tborder-start-start-radius: 0;\n\t\t}\n\t}\n\n\t.gform-repeater-item__block-content-footer {\n\t\tdisplay: flex;\n\t\tgap: var(--gform-admin-spacer-2);\n\t\tjustify-content: flex-start;\n\t}\n\n\t.gform-repeater--type-block {\n\n\t\t.gform-repeater-item__delete,\n\t\t.gform-repeater-item__action {\n\t\t\talign-self: flex-start;\n\t\t}\n\n\t\t.gform-repeater-item__collapsible {\n\t\t\tmargin-inline-start: auto;\n\t\t\ttransition: none;\n\t\t}\n\n\t\t.gform-repeater-item__wrapper {\n\t\t\talign-items: center;\n\t\t\tdisplay: flex;\n\t\t\tgap: var(--gform-admin-spacer-3);\n\t\t\tjustify-content: flex-start;\n\n\t\t\t.gform-text {\n\t\t\t\toverflow: hidden;\n\t\t\t\ttext-overflow: ellipsis;\n\t\t\t\twhite-space: nowrap;\n\t\t\t}\n\t\t}\n\n\t\t.gform-repeater-item--is-collapsed {\n\n\t\t\t.gform-repeater-item__collapsible {\n\t\t\t\ttransform: rotate(180deg);\n\t\t\t}\n\n\t\t\t.gform-repeater-item__wrapper {\n\t\t\t\tborder-bottom: none;\n\t\t\t}\n\t\t}\n\t}\n\n\t.gform-repeater-item--is-collapsed {\n\n\t\t.gform-repeater-item__block-content {\n\t\t\tdisplay: none;\n\t\t}\n\t}\n\n\t.gform-repeater-item__block-content {\n\t\tdisplay: flex;\n\t\tflex-direction: column;\n\t\tgap: var(--gform-admin-spacer-3);\n\t\tinline-size: 100%;\n\t\tpadding-block: var(--gform-admin-spacer-5);\n\t\tpadding-inline: var(--gform-admin-spacer-6);\n\t}\n\n\t.gform-repeater-item--fill-content {\n\n\t\t.gform-input-wrapper {\n\t\t\tflex: 1;\n\n\t\t\t.gform-input {\n\t\t\t\twidth: 100%;\n\t\t\t}\n\t\t}\n\t}\n\n\t.gform-repeater__drop-indicator {\n\t\tbackground: transparent;\n\t\theight: 3px;\n\t}\n\n\t.gform-repeater__drop-indicator--active {\n\t\tbackground: var(--gform-admin-color-chathams);\n\t}\n}\n"]}