UNPKG

@gravityforms/components

Version:

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

1 lines 4.09 kB
{"version":3,"sources":["icon.css"],"names":[],"mappings":"AAEC;EACC,mBAAmB;EACnB,aAAa;EACb,kBAAkB;EAClB,YAAY;EACZ,uBAAuB;EACvB,kBAAkB;EAClB,WAAW;CAmBZ;;EAjBC;GACC,kBAAkB;GAClB,UAAU;EACX;;EAEA;GACC,6BAA6B;GAC7B,kBAAkB;GAClB,sBAAsB;GACtB,WAAW;GACX,YAAY;GACZ,SAAS;GACT,kBAAkB;GAClB,QAAQ;GACR,gCAAgC;GAChC,WAAW;EACZ;;CAGD;EACC,mBAAmB;EACnB,gBAA0C;EAC1C,yBAAgD;EAChD,kBAAkB;EAClB,8CAA8C;EAC9C,cAAqC;EACrC,aAAa;EACb,iBAAiB;EACjB,YAAY;EACZ,uBAAuB;EACvB,kBAAkB;EAClB,WAAW;CACZ;;CAEA,kCAAkC;;CAClC;EACC,mBAAyC;EACzC,qBAAuD;EACvD,cAAqC;CACtC;;CAEA,+BAA+B;;CAC/B;EACC,mBAAmD;EACnD,qBAA0D;EAC1D,cAAsC;CACvC;;CAEA,gCAAgC;;CAChC;EACC,mBAA+C;EAC/C,qBAAqD;EACrD,cAAmC;CACpC;;CAEA,6CAA6C;;CAC7C;EAEC,cAAoC;CAMrC;;CAJC;GACC,yBAA2D;GAC3D,qBAA8C;EAC/C;;CAGD;EACC,cAA8C;CAC/C;;CAEA,+BAA+B;;CAC/B;EACC,cAA4C;CAM7C;;CAJC;GACC,yBAAiD;GACjD,qBAAqD;EACtD;;CAGD,kDAAkD;;CAClD;EAEC,cAA2C;CAM5C;;CAJC;GACC,yBAAqD;GACrD,qBAAmD;EACpD;;CAGD,kCAAkC;;CAClC;EACC,cAAyC;CAM1C;;CAJC;GACC,mBAAyC;GACzC,qBAAuD;EACxD","file":"icon.css","sourcesContent":[".gform-admin {\n\n\t[class*=\"gform-icon-preset--status\"] {\n\t\talign-items: center;\n\t\tdisplay: flex;\n\t\tfont-size: 1.25rem;\n\t\theight: 20px;\n\t\tjustify-content: center;\n\t\tposition: relative;\n\t\twidth: 20px;\n\n\t\t&::before {\n\t\t\tposition: relative;\n\t\t\tz-index: 2;\n\t\t}\n\n\t\t&::after {\n\t\t\tborder: 2px solid transparent;\n\t\t\tborder-radius: 50%;\n\t\t\tbox-sizing: border-box;\n\t\t\tcontent: \"\";\n\t\t\theight: 20px;\n\t\t\tleft: 50%;\n\t\t\tposition: absolute;\n\t\t\ttop: 50%;\n\t\t\ttransform: translate(-50%, -50%);\n\t\t\twidth: 20px;\n\t\t}\n\t}\n\n\t[class*=\"gform-icon-preset--metric\"] {\n\t\talign-items: center;\n\t\tbackground: var(--gform-admin-color-white);\n\t\tborder: 1px solid var(--gform-admin-color-snuff);\n\t\tborder-radius: 3px;\n\t\tbox-shadow: 0 2px 2px 0 rgba(58, 58, 87, 0.06);\n\t\tcolor: var(--gform-admin-color-comet);\n\t\tdisplay: flex;\n\t\tfont-size: 1.5rem;\n\t\theight: 48px;\n\t\tjustify-content: center;\n\t\tposition: relative;\n\t\twidth: 48px;\n\t}\n\n\t/* Style variant: Metric Success */\n\t.gform-icon-preset--metric-success {\n\t\tbackground: var(--gform-admin-color-feta);\n\t\tborder-color: var(--gform-admin-color-enchanted-meadow);\n\t\tcolor: var(--gform-admin-color-green);\n\t}\n\n\t/* Style variant: Metric Warn */\n\t.gform-icon-preset--metric-warn {\n\t\tbackground: var(--gform-admin-color-sazerac-yellow);\n\t\tborder-color: var(--gform-admin-color-light-pastel-yellow);\n\t\tcolor: var(--gform-admin-color-yellow);\n\t}\n\n\t/* Style variant: Metric Error */\n\t.gform-icon-preset--metric-error {\n\t\tbackground: var(--gform-admin-color-rose-white);\n\t\tborder-color: var(--gform-admin-color-background-red);\n\t\tcolor: var(--gform-admin-color-red);\n\t}\n\n\t/* Style variant: Status Default and Locked */\n\t.gform-icon-preset--status-default,\n\t.gform-icon-preset--status-locked {\n\t\tcolor: var(--gform-admin-color-port);\n\n\t\t&::after {\n\t\t\tbackground-color: var(--gform-admin-color-anti-flash-white);\n\t\t\tborder-color: var(--gform-admin-color-mischka);\n\t\t}\n\t}\n\n\t.gform-icon-preset--status-locked {\n\t\tcolor: var(--gform-admin-color-amethyst-smoke);\n\t}\n\n\t/* Style variant: Status Info */\n\t.gform-icon-preset--status-info {\n\t\tcolor: var(--gform-admin-color-science-blue);\n\n\t\t&::after {\n\t\t\tbackground-color: var(--gform-admin-color-zircon);\n\t\t\tborder-color: var(--gform-admin-color-broad-daylight);\n\t\t}\n\t}\n\n\t/* Style variant: Status Error, Status Incorrect */\n\t.gform-icon-preset--status-error,\n\t.gform-icon-preset--status-incorrect {\n\t\tcolor: var(--gform-admin-color-once-bitten);\n\n\t\t&::after {\n\t\t\tbackground-color: var(--gform-admin-color-rose-white);\n\t\t\tborder-color: var(--gform-admin-color-spanish-pink);\n\t\t}\n\t}\n\n\t/* Style variant: Status Correct */\n\t.gform-icon-preset--status-correct {\n\t\tcolor: var(--gform-admin-color-sea-green);\n\n\t\t&::after {\n\t\t\tbackground: var(--gform-admin-color-feta);\n\t\t\tborder-color: var(--gform-admin-color-enchanted-meadow);\n\t\t}\n\t}\n}\n"]}