@cn-npm/search-autocomplete 0.2.16 → 0.2.17
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +2 -2
- package/dist/bundle.js +8 -8
- package/npmkey +3 -0
- package/package.json +3 -4
- package/src/components/Loader/Loader.module.scss +1 -1
- package/src/components/SearchAutocomplete/SearchAutocomplete.module.scss +1 -1
- package/src/components/SearchAutocomplete/SearchAutocomplete.tsx +22 -22
- package/src/components/SearchAutocompleteSection/SearchAutocompleteSection.module.scss +16 -16
- package/src/components/SearchAutocompleteSection/SearchAutocompleteSection.tsx +4 -4
- package/src/components/SearchAutocompleteTag/SearchAutocompleteTag.module.scss +2 -2
- package/src/index.css +4 -4
- package/tailwind.config.js +2 -1
package/README.md
CHANGED
|
@@ -51,13 +51,13 @@ npm run release
|
|
|
51
51
|
### Installation
|
|
52
52
|
|
|
53
53
|
```bash
|
|
54
|
-
npm install @
|
|
54
|
+
npm install @cn-npm/search-autocomplete
|
|
55
55
|
```
|
|
56
56
|
|
|
57
57
|
### Importing component
|
|
58
58
|
|
|
59
59
|
```js
|
|
60
|
-
import { SearchAutocomplete } from "@
|
|
60
|
+
import { SearchAutocomplete } from "@cn-npm/search-autocomplete";
|
|
61
61
|
```
|
|
62
62
|
|
|
63
63
|
### Component
|
package/dist/bundle.js
CHANGED
|
@@ -122,7 +122,7 @@ var css_248z$4 = ".SearchAutocomplete-module_SearchAutocomplete__7VjKd {\n po
|
|
|
122
122
|
var styles$3 = {"SearchAutocomplete":"SearchAutocomplete-module_SearchAutocomplete__7VjKd"};
|
|
123
123
|
styleInject(css_248z$4);
|
|
124
124
|
|
|
125
|
-
var css_248z$3 = ".SearchAutocompleteTag-module_SearchAutocompleteTag__edz93 {\n\n margin: 0.25rem;\n\n display: inline-block;\n\n border-radius: 0.5rem;\n\n --tw-bg-opacity: 1;\n\n background-color: rgb(242 243 247 / var(--tw-bg-opacity));\n\n padding-top: 0.5rem;\n\n padding-bottom: 0.5rem;\n\n padding-left: 0.75rem;\n\n padding-right: 0.75rem;\n\n text-align: left;\n\n font-family: sofia-pro, sans-serif;\n\n font-size: 1rem;\n\n font-weight: 400;\n\n line-height: 1.5rem;\n\n letter-spacing: 0em;\n\n --tw-text-opacity: 1;\n\n color: rgb(0 25 54 / var(--tw-text-opacity));\n\n --tw-ring-
|
|
125
|
+
var css_248z$3 = ".SearchAutocompleteTag-module_SearchAutocompleteTag__edz93 {\n\n margin: 0.25rem;\n\n display: inline-block;\n\n border-radius: 0.5rem;\n\n --tw-bg-opacity: 1;\n\n background-color: rgb(242 243 247 / var(--tw-bg-opacity));\n\n padding-top: 0.5rem;\n\n padding-bottom: 0.5rem;\n\n padding-left: 0.75rem;\n\n padding-right: 0.75rem;\n\n text-align: left;\n\n font-family: sofia-pro, sans-serif;\n\n font-size: 1rem;\n\n font-weight: 400;\n\n line-height: 1.5rem;\n\n letter-spacing: 0em;\n\n --tw-text-opacity: 1;\n\n color: rgb(0 25 54 / var(--tw-text-opacity));\n\n --tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);\n\n --tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(1px + var(--tw-ring-offset-width)) var(--tw-ring-color);\n\n box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow, 0 0 #0000);\n\n --tw-ring-color: transparent;\n\n --tw-ring-offset-width: 2px;\n\n transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, outline-color, focus-color;\n\n transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);\n\n transition-duration: 150ms\n}\n\n.SearchAutocompleteTag-module_SearchAutocompleteTag__edz93:hover {\n\n --tw-bg-opacity: 1;\n\n background-color: rgb(230 232 239 / var(--tw-bg-opacity))\n}\n\n.highlighted-text {\n\n font-weight: 600\n}";
|
|
126
126
|
var styles$2 = {"SearchAutocompleteTag":"SearchAutocompleteTag-module_SearchAutocompleteTag__edz93"};
|
|
127
127
|
styleInject(css_248z$3);
|
|
128
128
|
|
|
@@ -177,7 +177,7 @@ var resultsLimit = function (title) {
|
|
|
177
177
|
};
|
|
178
178
|
var SearchAutocompleteSection = function (props) {
|
|
179
179
|
var _a;
|
|
180
|
-
return (jsxRuntime.jsxs("div", __assign({ className: classNames__default["default"](styles$1.SearchAutocompleteSection, "autocomplete-section"), "data-testid": "searchAutocompleteSection" }, { children: [jsxRuntime.jsx("h2", __assign({ className: "text-night-sky-800 mb-2 text-base", "data-testid": "searchResultTitle" }, { children: props.title })), jsxRuntime.jsx("div", __assign({ className: "flow-root" }, { children: jsxRuntime.jsxs("div", __assign({ className: "-m-1 flex flex-wrap autocomplete-section", "data-testid": "searchTag" }, { children: [(props.results == null || props.results.length === 0) && (jsxRuntime.jsx("p", __assign({ className: "pl-3" }, { children: "No results found" }))), props.results &&
|
|
180
|
+
return (jsxRuntime.jsxs("div", __assign({ className: classNames__default["default"](styles$1.SearchAutocompleteSection, "autocomplete-section"), "data-testid": "searchAutocompleteSection" }, { children: [jsxRuntime.jsx("h2", __assign({ className: "sa-text-night-sky-800 sa-mb-2 sa-text-base", "data-testid": "searchResultTitle" }, { children: props.title })), jsxRuntime.jsx("div", __assign({ className: "sa-flow-root" }, { children: jsxRuntime.jsxs("div", __assign({ className: "sa-m-1 sa-flex sa-flex-wrap autocomplete-section", "data-testid": "searchTag" }, { children: [(props.results == null || props.results.length === 0) && (jsxRuntime.jsx("p", __assign({ className: "sa-pl-3" }, { children: "No results found" }))), props.results &&
|
|
181
181
|
props.results.length > 0 &&
|
|
182
182
|
((_a = props.results) === null || _a === void 0 ? void 0 : _a.slice(0, resultsLimit(props.title || "")).map(function (results) { return (jsxRuntime.jsx(SearchAutocompleteTag, { section: props.title || "", searchTerm: props.searchTerm, ein: results.ein, name: results.title, url: results.url }, results.url)); }))] })) }))] })));
|
|
183
183
|
};
|
|
@@ -268,11 +268,11 @@ var SearchAutocomplete = function (props) {
|
|
|
268
268
|
React__default["default"].useEffect(function () {
|
|
269
269
|
var tags = document.querySelectorAll(".autocomplete-tag, .autocomplete-custom-search");
|
|
270
270
|
tags.forEach(function (x, i) {
|
|
271
|
-
x.classList.remove("autocomplete-selected", "!bg-grey-100", "!ring-blue-600");
|
|
271
|
+
x.classList.remove("autocomplete-selected", "!sa-bg-grey-100", "!sa-ring-blue-600");
|
|
272
272
|
if (i + 1 === selectedTag) {
|
|
273
273
|
x.classList.add("autocomplete-selected", tags[i].classList.contains("autocomplete-tag")
|
|
274
|
-
? "!bg-grey-100"
|
|
275
|
-
: "none", "!ring-blue-600");
|
|
274
|
+
? "!sa-bg-grey-100"
|
|
275
|
+
: "sa-none", "!sa-ring-blue-600");
|
|
276
276
|
x.scrollIntoView({
|
|
277
277
|
behavior: "smooth",
|
|
278
278
|
});
|
|
@@ -395,12 +395,12 @@ var SearchAutocomplete = function (props) {
|
|
|
395
395
|
}
|
|
396
396
|
}
|
|
397
397
|
};
|
|
398
|
-
return (jsxRuntime.jsxs("div", __assign({ className: classNames__default["default"](styles$3.SearchAutocomplete, "autocomplete"), "data-testid": "SearchAutocomplete" }, { children: [jsxRuntime.jsxs("form", __assign({ action: "/search?q=".concat(searchTerm), className: "flex font-sofia-pro", autoComplete: "off" }, { children: [jsxRuntime.jsx("label", __assign({ htmlFor: "search", className: "hidden" }, { children: label })), jsxRuntime.jsxs("div", __assign({ className: "relative flex flex-grow" }, { children: [jsxRuntime.jsx(reactDebounceInput.DebounceInput, { type: "text", name: "q", id: "search", placeholder: label, className: "flex-auto pr-0 items-stretch flex-grow text-night-sky-800 ring-0 py-0 shadow-none focus:ring-0 bg-white transition-colors border-opacity-100 hover:bg-grey-100 hover:border-grey-500 hover:border-opacity-50 focus:bg-grey-100 focus:border-blue-400 inline-block sm:text-sm border-grey-500 rounded-md rounded-tr-none rounded-br-none placeholder:text-gray-600", debounceTimeout: 300, minLength: 2, value: searchTerm, onChange: function (e) { return setSearchTerm(e.target.value); }, onClick: function () { return setOpen(true); }, onFocus: function () { return setOpen(true); }, onBlur: function () { return setOpen(false); }, onKeyDown: function (e) { return keyDownHandler(e); } }), searchTerm !== "" && (jsxRuntime.jsx("button", __assign({ type: "button", className: "absolute right-3 top-[50%] -translate-y-[50%] text-night-sky-800 hover:text-blue-500 transition-colors !bg-[transparent] cursor-pointer", onClick: clearSearch }, { children: jsxRuntime.jsx(SvgCircleClose, { className: "fill-night-sky-800 hover:fill-blue-500 h-4 w-4" }) })))] })), jsxRuntime.jsx("button", __assign({ type: "submit", className: "inline-flex transition-colors items-center justify-center px-4 h-[38px] font-medium rounded-md shadow-sm border border-blue-500 text-white bg-blue-500 hover:bg-blue-600 hover:border-blue-600 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-blue-500 sm:text-sm rounded-tl-none rounded-bl-none" }, { children: jsxRuntime.jsx(SvgSearch, { className: "fill-white h-4 w-4" }) }))] })), jsxRuntime.jsx("div", __assign({ className: "relative" }, { children: jsxRuntime.jsx(CSSTransition__default["default"], __assign({ mountOnEnter: true, unmountOnExit: true, in: open, timeout: 300, classNames: "fade-slide", "data-testid": "searchResults" }, { children: jsxRuntime.jsxs("div", __assign({ className: classNames__default["default"]("search-results-container absolute top-0 left-1/2 -translate-x-1/2 mt-2 bg-white py-5 rounded-[1.25rem] z-50 shadow-lg border border-[#a6abbd] border-opacity-60 w-full tablet:w-[70vw] min-h-[8rem] overflow-hidden") }, { children: [jsxRuntime.jsxs(ErrorBoundary, { children: [loading && (jsxRuntime.jsx(Loader, { "data-testid": "Loader", className: "absolute top-5 right-5" })), jsxRuntime.jsxs("div", __assign({ className: "px-6 h-full mb-12 max-h-[70vh] overflow-y-auto", "data-testid": "Sections" }, { children: [hasError && (jsxRuntime.jsx("p", { children: "Sorry, there was a problem. Please try your search again." })), searchData.data &&
|
|
398
|
+
return (jsxRuntime.jsxs("div", __assign({ className: classNames__default["default"](styles$3.SearchAutocomplete, "autocomplete"), "data-testid": "SearchAutocomplete" }, { children: [jsxRuntime.jsxs("form", __assign({ action: "/search?q=".concat(searchTerm), className: "sa-flex sa-font-sofia-pro", autoComplete: "off" }, { children: [jsxRuntime.jsx("label", __assign({ htmlFor: "search", className: "sa-hidden" }, { children: label })), jsxRuntime.jsxs("div", __assign({ className: "sa-relative sa-flex sa-flex-grow" }, { children: [jsxRuntime.jsx(reactDebounceInput.DebounceInput, { type: "text", name: "q", id: "search", placeholder: label, className: "sa-flex-auto sa-pr-0 sa-items-stretch sa-flex-grow sa-text-night-sky-800 sa-ring-0 sa-py-0 sa-shadow-none sa-focus:ring-0 sa-bg-white sa-transition-colors sa-border-opacity-100 sa-hover:bg-grey-100 sa-hover:border-grey-500 sa-hover:border-opacity-50 sa-focus:bg-grey-100 sa-focus:border-blue-400 sa-inline-block sm:sa-text-sm sa-border-grey-500 sa-rounded-md sa-rounded-tr-none sa-rounded-br-none sa-placeholder:text-gray-600", debounceTimeout: 300, minLength: 2, value: searchTerm, onChange: function (e) { return setSearchTerm(e.target.value); }, onClick: function () { return setOpen(true); }, onFocus: function () { return setOpen(true); }, onBlur: function () { return setOpen(false); }, onKeyDown: function (e) { return keyDownHandler(e); } }), searchTerm !== "" && (jsxRuntime.jsx("button", __assign({ type: "button", className: "sa-absolute sa-right-3 sa-top-[50%] -sa-translate-y-[50%] sa-text-night-sky-800 hover:sa-text-blue-500 sa-transition-colors !sa-bg-[transparent] sa-cursor-pointer", onClick: clearSearch }, { children: jsxRuntime.jsx(SvgCircleClose, { className: "sa-fill-night-sky-800 hover:sa-fill-blue-500 sa-h-4 sa-w-4" }) })))] })), jsxRuntime.jsx("button", __assign({ type: "submit", className: "sa-inline-flex sa-transition-colors sa-items-center sa-justify-center sa-px-4 sa-h-[38px] sa-font-medium sa-rounded-md sa-shadow-sm sa-border sa-border-blue-500 sa-text-white sa-bg-blue-500 hover:sa-bg-blue-600 hover:sa-border-blue-600 focus:sa-outline-none focus:sa-ring-2 focus:sa-ring-offset-2 focus:sa-ring-blue-500 sm:sa-text-sm sa-rounded-tl-none sa-rounded-bl-none" }, { children: jsxRuntime.jsx(SvgSearch, { className: "sa-fill-white sa-h-4 sa-w-4" }) }))] })), jsxRuntime.jsx("div", __assign({ className: "sa-relative" }, { children: jsxRuntime.jsx(CSSTransition__default["default"], __assign({ mountOnEnter: true, unmountOnExit: true, in: open, timeout: 300, classNames: "sa-fade-slide", "data-testid": "searchResults" }, { children: jsxRuntime.jsxs("div", __assign({ className: classNames__default["default"]("search-results-container sa-absolute sa-top-0 sa-left-1/2 -sa-translate-x-1/2 sa-mt-2 sa-bg-white sa-py-5 sa-rounded-[1.25rem] sa-z-50 sa-shadow-lg sa-border border-[#a6abbd] sa-border-opacity-60 sa-w-full tablet:sa-w-[70vw] sa-min-h-[8rem] sa-overflow-hidden") }, { children: [jsxRuntime.jsxs(ErrorBoundary, { children: [loading && (jsxRuntime.jsx(Loader, { "data-testid": "Loader", className: "sa-absolute sa-top-5 sa-right-5" })), jsxRuntime.jsxs("div", __assign({ className: "sa-px-6 sa-h-full sa-mb-12 sa-max-h-[70vh] sa-overflow-y-auto", "data-testid": "Sections" }, { children: [hasError && (jsxRuntime.jsx("p", { children: "Sorry, there was a problem. Please try your search again." })), searchData.data &&
|
|
399
399
|
searchData.data.searchAutocomplete &&
|
|
400
|
-
searchData.data.searchAutocomplete.map(function (section) { return (jsxRuntime.jsx(SearchAutocompleteSection, { searchTerm: searchTerm, title: section.title, results: section.results }, section.title)); })] }))] }), jsxRuntime.jsx("div", __assign({ className: "border-t border-[#a6abbd] border-opacity-60 flex items-center absolute bottom-0 left-0 w-full bg-white h-16" }, { children: jsxRuntime.jsxs("a", __assign({ href: "/search?q=".concat(searchTerm), className: "px-3 py-1 ml-6 flex items-center space-x-3 ring
|
|
400
|
+
searchData.data.searchAutocomplete.map(function (section) { return (jsxRuntime.jsx(SearchAutocompleteSection, { searchTerm: searchTerm, title: section.title, results: section.results }, section.title)); })] }))] }), jsxRuntime.jsx("div", __assign({ className: "sa-border-t sa-border-[#a6abbd] sa-border-opacity-60 sa-flex sa-items-center sa-absolute sa-bottom-0 sa-left-0 sa-w-full sa-bg-white sa-h-16" }, { children: jsxRuntime.jsxs("a", __assign({ href: "/search?q=".concat(searchTerm), className: "sa-px-3 sa-py-1 sa-ml-6 sa-flex sa-items-center sa-space-x-3 sa-ring-1 sa-ring-offset-2 sa-ring-transparent sa-transition-colors sa-text-blue-500 hover:sa-text-blue-600 sa-rounded-lg autocomplete-custom-search" }, { children: [jsxRuntime.jsx(SvgSearch, { className: "sa-fill-blue-500 hover:sa-fill-blue-600 sa-h-4 sa-w-4" }), jsxRuntime.jsx("span", __assign({ className: "sa-font-semibold sa-text-[1.125rem] " }, { children: searchTerm === "" ? "Custom Search" : "View All Results" }))] })) }))] })) })) }))] })));
|
|
401
401
|
};
|
|
402
402
|
|
|
403
|
-
var css_248z = "/*\n! tailwindcss v3.1.8 | MIT License | https://tailwindcss.com\n*//*\n1. Prevent padding and border from affecting element width. (https://github.com/mozdevs/cssremedy/issues/4)\n2. Allow adding a border to an element by just adding a border-width. (https://github.com/tailwindcss/tailwindcss/pull/116)\n*/\n\n*,\n::before,\n::after {\n box-sizing: border-box; /* 1 */\n border-width: 0; /* 2 */\n border-style: solid; /* 2 */\n border-color: currentColor; /* 2 */\n}\n\n::before,\n::after {\n --tw-content: '';\n}\n\n/*\n1. Use a consistent sensible line-height in all browsers.\n2. Prevent adjustments of font size after orientation changes in iOS.\n3. Use a more readable tab size.\n4. Use the user's configured `sans` font-family by default.\n*/\n\nhtml {\n line-height: 1.5; /* 1 */\n -webkit-text-size-adjust: 100%; /* 2 */ /* 3 */\n tab-size: 4; /* 3 */\n font-family: ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, \"Helvetica Neue\", Arial, \"Noto Sans\", sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\", \"Noto Color Emoji\"; /* 4 */\n}\n\n/*\n1. Remove the margin in all browsers.\n2. Inherit line-height from `html` so users can set them as a class directly on the `html` element.\n*/\n\nbody {\n margin: 0; /* 1 */\n line-height: inherit; /* 2 */\n}\n\n/*\n1. Add the correct height in Firefox.\n2. Correct the inheritance of border color in Firefox. (https://bugzilla.mozilla.org/show_bug.cgi?id=190655)\n3. Ensure horizontal rules are visible by default.\n*/\n\nhr {\n height: 0; /* 1 */\n color: inherit; /* 2 */\n border-top-width: 1px; /* 3 */\n}\n\n/*\nAdd the correct text decoration in Chrome, Edge, and Safari.\n*/\n\nabbr:where([title]) {\n -webkit-text-decoration: underline dotted;\n text-decoration: underline dotted;\n}\n\n/*\nRemove the default font size and weight for headings.\n*/\n\nh1,\nh2,\nh3,\nh4,\nh5,\nh6 {\n font-size: inherit;\n font-weight: inherit;\n}\n\n/*\nReset links to optimize for opt-in styling instead of opt-out.\n*/\n\na {\n color: inherit;\n text-decoration: inherit;\n}\n\n/*\nAdd the correct font weight in Edge and Safari.\n*/\n\nb,\nstrong {\n font-weight: bolder;\n}\n\n/*\n1. Use the user's configured `mono` font family by default.\n2. Correct the odd `em` font sizing in all browsers.\n*/\n\ncode,\nkbd,\nsamp,\npre {\n font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, \"Liberation Mono\", \"Courier New\", monospace; /* 1 */\n font-size: 1em; /* 2 */\n}\n\n/*\nAdd the correct font size in all browsers.\n*/\n\nsmall {\n font-size: 80%;\n}\n\n/*\nPrevent `sub` and `sup` elements from affecting the line height in all browsers.\n*/\n\nsub,\nsup {\n font-size: 75%;\n line-height: 0;\n position: relative;\n vertical-align: baseline;\n}\n\nsub {\n bottom: -0.25em;\n}\n\nsup {\n top: -0.5em;\n}\n\n/*\n1. Remove text indentation from table contents in Chrome and Safari. (https://bugs.chromium.org/p/chromium/issues/detail?id=999088, https://bugs.webkit.org/show_bug.cgi?id=201297)\n2. Correct table border color inheritance in all Chrome and Safari. (https://bugs.chromium.org/p/chromium/issues/detail?id=935729, https://bugs.webkit.org/show_bug.cgi?id=195016)\n3. Remove gaps between table borders by default.\n*/\n\ntable {\n text-indent: 0; /* 1 */\n border-color: inherit; /* 2 */\n border-collapse: collapse; /* 3 */\n}\n\n/*\n1. Change the font styles in all browsers.\n2. Remove the margin in Firefox and Safari.\n3. Remove default padding in all browsers.\n*/\n\nbutton,\ninput,\noptgroup,\nselect,\ntextarea {\n font-family: inherit; /* 1 */\n font-size: 100%; /* 1 */\n font-weight: inherit; /* 1 */\n line-height: inherit; /* 1 */\n color: inherit; /* 1 */\n margin: 0; /* 2 */\n padding: 0; /* 3 */\n}\n\n/*\nRemove the inheritance of text transform in Edge and Firefox.\n*/\n\nbutton,\nselect {\n text-transform: none;\n}\n\n/*\n1. Correct the inability to style clickable types in iOS and Safari.\n2. Remove default button styles.\n*/\n\nbutton,\n[type='button'],\n[type='reset'],\n[type='submit'] {\n -webkit-appearance: button; /* 1 */\n background-color: transparent; /* 2 */\n background-image: none; /* 2 */\n}\n\n/*\nUse the modern Firefox focus style for all focusable elements.\n*/\n\n:-moz-focusring {\n outline: auto;\n}\n\n/*\nRemove the additional `:invalid` styles in Firefox. (https://github.com/mozilla/gecko-dev/blob/2f9eacd9d3d995c937b4251a5557d95d494c9be1/layout/style/res/forms.css#L728-L737)\n*/\n\n:-moz-ui-invalid {\n box-shadow: none;\n}\n\n/*\nAdd the correct vertical alignment in Chrome and Firefox.\n*/\n\nprogress {\n vertical-align: baseline;\n}\n\n/*\nCorrect the cursor style of increment and decrement buttons in Safari.\n*/\n\n::-webkit-inner-spin-button,\n::-webkit-outer-spin-button {\n height: auto;\n}\n\n/*\n1. Correct the odd appearance in Chrome and Safari.\n2. Correct the outline style in Safari.\n*/\n\n[type='search'] {\n -webkit-appearance: textfield; /* 1 */\n outline-offset: -2px; /* 2 */\n}\n\n/*\nRemove the inner padding in Chrome and Safari on macOS.\n*/\n\n::-webkit-search-decoration {\n -webkit-appearance: none;\n}\n\n/*\n1. Correct the inability to style clickable types in iOS and Safari.\n2. Change font properties to `inherit` in Safari.\n*/\n\n::-webkit-file-upload-button {\n -webkit-appearance: button; /* 1 */\n font: inherit; /* 2 */\n}\n\n/*\nAdd the correct display in Chrome and Safari.\n*/\n\nsummary {\n display: list-item;\n}\n\n/*\nRemoves the default spacing and border for appropriate elements.\n*/\n\nblockquote,\ndl,\ndd,\nh1,\nh2,\nh3,\nh4,\nh5,\nh6,\nhr,\nfigure,\np,\npre {\n margin: 0;\n}\n\nfieldset {\n margin: 0;\n padding: 0;\n}\n\nlegend {\n padding: 0;\n}\n\nol,\nul,\nmenu {\n list-style: none;\n margin: 0;\n padding: 0;\n}\n\n/*\nPrevent resizing textareas horizontally by default.\n*/\n\ntextarea {\n resize: vertical;\n}\n\n/*\n1. Reset the default placeholder opacity in Firefox. (https://github.com/tailwindlabs/tailwindcss/issues/3300)\n2. Set the default placeholder color to the user's configured gray 400 color.\n*/\n\ninput::placeholder,\ntextarea::placeholder {\n opacity: 1; /* 1 */\n color: #9ca3af; /* 2 */\n}\n\n/*\nSet the default cursor for buttons.\n*/\n\nbutton,\n[role=\"button\"] {\n cursor: pointer;\n}\n\n/*\nMake sure disabled buttons don't get the pointer cursor.\n*/\n:disabled {\n cursor: default;\n}\n\n/*\n1. Make replaced elements `display: block` by default. (https://github.com/mozdevs/cssremedy/issues/14)\n2. Add `vertical-align: middle` to align replaced elements more sensibly by default. (https://github.com/jensimmons/cssremedy/issues/14#issuecomment-634934210)\n This can trigger a poorly considered lint error in some tools but is included by design.\n*/\n\nimg,\nsvg,\nvideo,\ncanvas,\naudio,\niframe,\nembed,\nobject {\n display: block; /* 1 */\n vertical-align: middle; /* 2 */\n}\n\n/*\nConstrain images and videos to the parent width and preserve their intrinsic aspect ratio. (https://github.com/mozdevs/cssremedy/issues/14)\n*/\n\nimg,\nvideo {\n max-width: 100%;\n height: auto;\n}\n\n[type='text'],[type='email'],[type='url'],[type='password'],[type='number'],[type='date'],[type='datetime-local'],[type='month'],[type='search'],[type='tel'],[type='time'],[type='week'],[multiple],textarea,select {\n appearance: none;\n background-color: #fff;\n border-color: #6b7280;\n border-width: 1px;\n border-radius: 0px;\n padding-top: 0.5rem;\n padding-right: 0.75rem;\n padding-bottom: 0.5rem;\n padding-left: 0.75rem;\n font-size: 1rem;\n line-height: 1.5rem;\n --tw-shadow: 0 0 #0000;\n}\n\n[type='text']:focus, [type='email']:focus, [type='url']:focus, [type='password']:focus, [type='number']:focus, [type='date']:focus, [type='datetime-local']:focus, [type='month']:focus, [type='search']:focus, [type='tel']:focus, [type='time']:focus, [type='week']:focus, [multiple]:focus, textarea:focus, select:focus {\n outline: 2px solid transparent;\n outline-offset: 2px;\n --tw-ring-inset: var(--tw-empty,/*!*/ /*!*/);\n --tw-ring-offset-width: 0px;\n --tw-ring-offset-color: #fff;\n --tw-ring-color: #2563eb;\n --tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);\n --tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(1px + var(--tw-ring-offset-width)) var(--tw-ring-color);\n box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);\n border-color: #2563eb;\n}\n\ninput::placeholder,textarea::placeholder {\n color: #6b7280;\n opacity: 1;\n}\n\n::-webkit-datetime-edit-fields-wrapper {\n padding: 0;\n}\n\n::-webkit-date-and-time-value {\n min-height: 1.5em;\n}\n\n::-webkit-datetime-edit,::-webkit-datetime-edit-year-field,::-webkit-datetime-edit-month-field,::-webkit-datetime-edit-day-field,::-webkit-datetime-edit-hour-field,::-webkit-datetime-edit-minute-field,::-webkit-datetime-edit-second-field,::-webkit-datetime-edit-millisecond-field,::-webkit-datetime-edit-meridiem-field {\n padding-top: 0;\n padding-bottom: 0;\n}\n\nselect {\n background-image: url(\"data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 20 20'%3e%3cpath stroke='%236b7280' stroke-linecap='round' stroke-linejoin='round' stroke-width='1.5' d='M6 8l4 4 4-4'/%3e%3c/svg%3e\");\n background-position: right 0.5rem center;\n background-repeat: no-repeat;\n background-size: 1.5em 1.5em;\n padding-right: 2.5rem;\n -webkit-print-color-adjust: exact;\n print-color-adjust: exact;\n}\n\n[multiple] {\n background-image: initial;\n background-position: initial;\n background-repeat: unset;\n background-size: initial;\n padding-right: 0.75rem;\n -webkit-print-color-adjust: unset;\n print-color-adjust: unset;\n}\n\n[type='checkbox'],[type='radio'] {\n appearance: none;\n padding: 0;\n -webkit-print-color-adjust: exact;\n print-color-adjust: exact;\n display: inline-block;\n vertical-align: middle;\n background-origin: border-box;\n -webkit-user-select: none;\n user-select: none;\n flex-shrink: 0;\n height: 1rem;\n width: 1rem;\n color: #2563eb;\n background-color: #fff;\n border-color: #6b7280;\n border-width: 1px;\n --tw-shadow: 0 0 #0000;\n}\n\n[type='checkbox'] {\n border-radius: 0px;\n}\n\n[type='radio'] {\n border-radius: 100%;\n}\n\n[type='checkbox']:focus,[type='radio']:focus {\n outline: 2px solid transparent;\n outline-offset: 2px;\n --tw-ring-inset: var(--tw-empty,/*!*/ /*!*/);\n --tw-ring-offset-width: 2px;\n --tw-ring-offset-color: #fff;\n --tw-ring-color: #2563eb;\n --tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);\n --tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color);\n box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);\n}\n\n[type='checkbox']:checked,[type='radio']:checked {\n border-color: transparent;\n background-color: currentColor;\n background-size: 100% 100%;\n background-position: center;\n background-repeat: no-repeat;\n}\n\n[type='checkbox']:checked {\n background-image: url(\"data:image/svg+xml,%3csvg viewBox='0 0 16 16' fill='white' xmlns='http://www.w3.org/2000/svg'%3e%3cpath d='M12.207 4.793a1 1 0 010 1.414l-5 5a1 1 0 01-1.414 0l-2-2a1 1 0 011.414-1.414L6.5 9.086l4.293-4.293a1 1 0 011.414 0z'/%3e%3c/svg%3e\");\n}\n\n[type='radio']:checked {\n background-image: url(\"data:image/svg+xml,%3csvg viewBox='0 0 16 16' fill='white' xmlns='http://www.w3.org/2000/svg'%3e%3ccircle cx='8' cy='8' r='3'/%3e%3c/svg%3e\");\n}\n\n[type='checkbox']:checked:hover,[type='checkbox']:checked:focus,[type='radio']:checked:hover,[type='radio']:checked:focus {\n border-color: transparent;\n background-color: currentColor;\n}\n\n[type='checkbox']:indeterminate {\n background-image: url(\"data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 16 16'%3e%3cpath stroke='white' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M4 8h8'/%3e%3c/svg%3e\");\n border-color: transparent;\n background-color: currentColor;\n background-size: 100% 100%;\n background-position: center;\n background-repeat: no-repeat;\n}\n\n[type='checkbox']:indeterminate:hover,[type='checkbox']:indeterminate:focus {\n border-color: transparent;\n background-color: currentColor;\n}\n\n[type='file'] {\n background: unset;\n border-color: inherit;\n border-width: 0;\n border-radius: 0;\n padding: 0;\n font-size: unset;\n line-height: inherit;\n}\n\n[type='file']:focus {\n outline: 1px solid ButtonText;\n outline: 1px auto -webkit-focus-ring-color;\n}\n @import url(\"https://p.typekit.net/p.css?s=1&k=etf0mna&ht=tk&f=24536.24553.24554.24558.24559.24539.24540.24545.24546.24547.24548.24549.24552.24580.24581.24586.24587.24588.24589.24590.24591&a=27633482&app=typekit&e=css\");\n\n @font-face {\n font-family: \"sofia-pro-soft\";\n src: url(\"https://use.typekit.net/af/745ea3/00000000000000007735a146/30/l?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=n5&v=3\")\n format(\"woff2\"),\n url(\"https://use.typekit.net/af/745ea3/00000000000000007735a146/30/d?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=n5&v=3\")\n format(\"woff\"),\n url(\"https://use.typekit.net/af/745ea3/00000000000000007735a146/30/a?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=n5&v=3\")\n format(\"opentype\");\n font-display: auto;\n font-style: normal;\n font-weight: 500;\n font-stretch: normal;\n }\n\n @font-face {\n font-family: \"sofia-pro-soft\";\n src: url(\"https://use.typekit.net/af/cdf40b/00000000000000007735a147/30/l?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=n7&v=3\")\n format(\"woff2\"),\n url(\"https://use.typekit.net/af/cdf40b/00000000000000007735a147/30/d?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=n7&v=3\")\n format(\"woff\"),\n url(\"https://use.typekit.net/af/cdf40b/00000000000000007735a147/30/a?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=n7&v=3\")\n format(\"opentype\");\n font-display: auto;\n font-style: normal;\n font-weight: 700;\n font-stretch: normal;\n }\n\n @font-face {\n font-family: \"sofia-pro-soft\";\n src: url(\"https://use.typekit.net/af/691282/00000000000000007735a149/30/l?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=i7&v=3\")\n format(\"woff2\"),\n url(\"https://use.typekit.net/af/691282/00000000000000007735a149/30/d?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=i7&v=3\")\n format(\"woff\"),\n url(\"https://use.typekit.net/af/691282/00000000000000007735a149/30/a?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=i7&v=3\")\n format(\"opentype\");\n font-display: auto;\n font-style: italic;\n font-weight: 700;\n font-stretch: normal;\n }\n\n @font-face {\n font-family: \"sofia-pro-soft\";\n src: url(\"https://use.typekit.net/af/54ce76/00000000000000007735a154/30/l?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=n4&v=3\")\n format(\"woff2\"),\n url(\"https://use.typekit.net/af/54ce76/00000000000000007735a154/30/d?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=n4&v=3\")\n format(\"woff\"),\n url(\"https://use.typekit.net/af/54ce76/00000000000000007735a154/30/a?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=n4&v=3\")\n format(\"opentype\");\n font-display: auto;\n font-style: normal;\n font-weight: 400;\n font-stretch: normal;\n }\n\n @font-face {\n font-family: \"sofia-pro-soft\";\n src: url(\"https://use.typekit.net/af/9f41be/00000000000000007735a157/30/l?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=i4&v=3\")\n format(\"woff2\"),\n url(\"https://use.typekit.net/af/9f41be/00000000000000007735a157/30/d?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=i4&v=3\")\n format(\"woff\"),\n url(\"https://use.typekit.net/af/9f41be/00000000000000007735a157/30/a?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=i4&v=3\")\n format(\"opentype\");\n font-display: auto;\n font-style: italic;\n font-weight: 400;\n font-stretch: normal;\n }\n\n @font-face {\n font-family: \"sofia-pro\";\n src: url(\"https://use.typekit.net/af/5d97ff/00000000000000007735f999/30/l?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=n7&v=3\")\n format(\"woff2\"),\n url(\"https://use.typekit.net/af/5d97ff/00000000000000007735f999/30/d?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=n7&v=3\")\n format(\"woff\"),\n url(\"https://use.typekit.net/af/5d97ff/00000000000000007735f999/30/a?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=n7&v=3\")\n format(\"opentype\");\n font-display: auto;\n font-style: normal;\n font-weight: 700;\n font-stretch: normal;\n }\n\n @font-face {\n font-family: \"sofia-pro\";\n src: url(\"https://use.typekit.net/af/66e20c/00000000000000007735f993/30/l?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=i7&v=3\")\n format(\"woff2\"),\n url(\"https://use.typekit.net/af/66e20c/00000000000000007735f993/30/d?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=i7&v=3\")\n format(\"woff\"),\n url(\"https://use.typekit.net/af/66e20c/00000000000000007735f993/30/a?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=i7&v=3\")\n format(\"opentype\");\n font-display: auto;\n font-style: italic;\n font-weight: 700;\n font-stretch: normal;\n }\n\n @font-face {\n font-family: \"sofia-pro\";\n src: url(\"https://use.typekit.net/af/19ced7/00000000000000007735f992/30/l?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=n5&v=3\")\n format(\"woff2\"),\n url(\"https://use.typekit.net/af/19ced7/00000000000000007735f992/30/d?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=n5&v=3\")\n format(\"woff\"),\n url(\"https://use.typekit.net/af/19ced7/00000000000000007735f992/30/a?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=n5&v=3\")\n format(\"opentype\");\n font-display: auto;\n font-style: normal;\n font-weight: 500;\n font-stretch: normal;\n }\n\n @font-face {\n font-family: \"sofia-pro\";\n src: url(\"https://use.typekit.net/af/33e8a4/00000000000000007735f99b/30/l?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=i5&v=3\")\n format(\"woff2\"),\n url(\"https://use.typekit.net/af/33e8a4/00000000000000007735f99b/30/d?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=i5&v=3\")\n format(\"woff\"),\n url(\"https://use.typekit.net/af/33e8a4/00000000000000007735f99b/30/a?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=i5&v=3\")\n format(\"opentype\");\n font-display: auto;\n font-style: italic;\n font-weight: 500;\n font-stretch: normal;\n }\n\n @font-face {\n font-family: \"sofia-pro\";\n src: url(\"https://use.typekit.net/af/b718ff/00000000000000007735f98d/30/l?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=n4&v=3\")\n format(\"woff2\"),\n url(\"https://use.typekit.net/af/b718ff/00000000000000007735f98d/30/d?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=n4&v=3\")\n format(\"woff\"),\n url(\"https://use.typekit.net/af/b718ff/00000000000000007735f98d/30/a?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=n4&v=3\")\n format(\"opentype\");\n font-display: auto;\n font-style: normal;\n font-weight: 400;\n font-stretch: normal;\n }\n\n @font-face {\n font-family: \"sofia-pro\";\n src: url(\"https://use.typekit.net/af/c09857/00000000000000007735f98c/30/l?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=i4&v=3\")\n format(\"woff2\"),\n url(\"https://use.typekit.net/af/c09857/00000000000000007735f98c/30/d?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=i4&v=3\")\n format(\"woff\"),\n url(\"https://use.typekit.net/af/c09857/00000000000000007735f98c/30/a?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=i4&v=3\")\n format(\"opentype\");\n font-display: auto;\n font-style: italic;\n font-weight: 400;\n font-stretch: normal;\n }\n\n @font-face {\n font-family: \"sofia-pro\";\n src: url(\"https://use.typekit.net/af/262452/00000000000000007735f99a/30/l?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=n6&v=3\")\n format(\"woff2\"),\n url(\"https://use.typekit.net/af/262452/00000000000000007735f99a/30/d?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=n6&v=3\")\n format(\"woff\"),\n url(\"https://use.typekit.net/af/262452/00000000000000007735f99a/30/a?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=n6&v=3\")\n format(\"opentype\");\n font-display: auto;\n font-style: normal;\n font-weight: 600;\n font-stretch: normal;\n }\n\n @font-face {\n font-family: \"sofia-pro\";\n src: url(\"https://use.typekit.net/af/36f509/00000000000000007735f994/30/l?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=i6&v=3\")\n format(\"woff2\"),\n url(\"https://use.typekit.net/af/36f509/00000000000000007735f994/30/d?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=i6&v=3\")\n format(\"woff\"),\n url(\"https://use.typekit.net/af/36f509/00000000000000007735f994/30/a?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=i6&v=3\")\n format(\"opentype\");\n font-display: auto;\n font-style: italic;\n font-weight: 600;\n font-stretch: normal;\n }\n\n @font-face {\n font-family: \"sofia-pro-condensed\";\n src: url(\"https://use.typekit.net/af/8b3e11/00000000000000007735a150/30/l?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=n7&v=3\")\n format(\"woff2\"),\n url(\"https://use.typekit.net/af/8b3e11/00000000000000007735a150/30/d?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=n7&v=3\")\n format(\"woff\"),\n url(\"https://use.typekit.net/af/8b3e11/00000000000000007735a150/30/a?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=n7&v=3\")\n format(\"opentype\");\n font-display: auto;\n font-style: normal;\n font-weight: 700;\n font-stretch: normal;\n }\n\n @font-face {\n font-family: \"sofia-pro-condensed\";\n src: url(\"https://use.typekit.net/af/2fe268/00000000000000007735a153/30/l?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=i7&v=3\")\n format(\"woff2\"),\n url(\"https://use.typekit.net/af/2fe268/00000000000000007735a153/30/d?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=i7&v=3\")\n format(\"woff\"),\n url(\"https://use.typekit.net/af/2fe268/00000000000000007735a153/30/a?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=i7&v=3\")\n format(\"opentype\");\n font-display: auto;\n font-style: italic;\n font-weight: 700;\n font-stretch: normal;\n }\n\n @font-face {\n font-family: \"sofia-pro-condensed\";\n src: url(\"https://use.typekit.net/af/a33c9d/00000000000000007735a15e/30/l?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=n5&v=3\")\n format(\"woff2\"),\n url(\"https://use.typekit.net/af/a33c9d/00000000000000007735a15e/30/d?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=n5&v=3\")\n format(\"woff\"),\n url(\"https://use.typekit.net/af/a33c9d/00000000000000007735a15e/30/a?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=n5&v=3\")\n format(\"opentype\");\n font-display: auto;\n font-style: normal;\n font-weight: 500;\n font-stretch: normal;\n }\n\n @font-face {\n font-family: \"sofia-pro-condensed\";\n src: url(\"https://use.typekit.net/af/fa5448/00000000000000007735a161/30/l?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=i5&v=3\")\n format(\"woff2\"),\n url(\"https://use.typekit.net/af/fa5448/00000000000000007735a161/30/d?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=i5&v=3\")\n format(\"woff\"),\n url(\"https://use.typekit.net/af/fa5448/00000000000000007735a161/30/a?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=i5&v=3\")\n format(\"opentype\");\n font-display: auto;\n font-style: italic;\n font-weight: 500;\n font-stretch: normal;\n }\n\n @font-face {\n font-family: \"sofia-pro-condensed\";\n src: url(\"https://use.typekit.net/af/cf0830/00000000000000007735a162/30/l?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=n4&v=3\")\n format(\"woff2\"),\n url(\"https://use.typekit.net/af/cf0830/00000000000000007735a162/30/d?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=n4&v=3\")\n format(\"woff\"),\n url(\"https://use.typekit.net/af/cf0830/00000000000000007735a162/30/a?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=n4&v=3\")\n format(\"opentype\");\n font-display: auto;\n font-style: normal;\n font-weight: 400;\n font-stretch: normal;\n }\n\n @font-face {\n font-family: \"sofia-pro-condensed\";\n src: url(\"https://use.typekit.net/af/7da024/00000000000000007735a164/30/l?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=i4&v=3\")\n format(\"woff2\"),\n url(\"https://use.typekit.net/af/7da024/00000000000000007735a164/30/d?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=i4&v=3\")\n format(\"woff\"),\n url(\"https://use.typekit.net/af/7da024/00000000000000007735a164/30/a?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=i4&v=3\")\n format(\"opentype\");\n font-display: auto;\n font-style: italic;\n font-weight: 400;\n font-stretch: normal;\n }\n\n @font-face {\n font-family: \"sofia-pro-condensed\";\n src: url(\"https://use.typekit.net/af/ef0e2d/00000000000000007735a166/30/l?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=n6&v=3\")\n format(\"woff2\"),\n url(\"https://use.typekit.net/af/ef0e2d/00000000000000007735a166/30/d?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=n6&v=3\")\n format(\"woff\"),\n url(\"https://use.typekit.net/af/ef0e2d/00000000000000007735a166/30/a?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=n6&v=3\")\n format(\"opentype\");\n font-display: auto;\n font-style: normal;\n font-weight: 600;\n font-stretch: normal;\n }\n\n @font-face {\n font-family: \"sofia-pro-condensed\";\n src: url(\"https://use.typekit.net/af/1ff8be/00000000000000007735a168/30/l?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=i6&v=3\")\n format(\"woff2\"),\n url(\"https://use.typekit.net/af/1ff8be/00000000000000007735a168/30/d?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=i6&v=3\")\n format(\"woff\"),\n url(\"https://use.typekit.net/af/1ff8be/00000000000000007735a168/30/a?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=i6&v=3\")\n format(\"opentype\");\n font-display: auto;\n font-style: italic;\n font-weight: 600;\n font-stretch: normal;\n }\n\n*, ::before, ::after {\n --tw-border-spacing-x: 0;\n --tw-border-spacing-y: 0;\n --tw-translate-x: 0;\n --tw-translate-y: 0;\n --tw-rotate: 0;\n --tw-skew-x: 0;\n --tw-skew-y: 0;\n --tw-scale-x: 1;\n --tw-scale-y: 1;\n --tw-pan-x: ;\n --tw-pan-y: ;\n --tw-pinch-zoom: ;\n --tw-scroll-snap-strictness: proximity;\n --tw-ordinal: ;\n --tw-slashed-zero: ;\n --tw-numeric-figure: ;\n --tw-numeric-spacing: ;\n --tw-numeric-fraction: ;\n --tw-ring-inset: ;\n --tw-ring-offset-width: 0px;\n --tw-ring-offset-color: #fff;\n --tw-ring-color: rgb(59 130 246 / 0.5);\n --tw-ring-offset-shadow: 0 0 #0000;\n --tw-ring-shadow: 0 0 #0000;\n --tw-shadow: 0 0 #0000;\n --tw-shadow-colored: 0 0 #0000;\n --tw-blur: ;\n --tw-brightness: ;\n --tw-contrast: ;\n --tw-grayscale: ;\n --tw-hue-rotate: ;\n --tw-invert: ;\n --tw-saturate: ;\n --tw-sepia: ;\n --tw-drop-shadow: ;\n --tw-backdrop-blur: ;\n --tw-backdrop-brightness: ;\n --tw-backdrop-contrast: ;\n --tw-backdrop-grayscale: ;\n --tw-backdrop-hue-rotate: ;\n --tw-backdrop-invert: ;\n --tw-backdrop-opacity: ;\n --tw-backdrop-saturate: ;\n --tw-backdrop-sepia: ;\n}\n\n::backdrop {\n --tw-border-spacing-x: 0;\n --tw-border-spacing-y: 0;\n --tw-translate-x: 0;\n --tw-translate-y: 0;\n --tw-rotate: 0;\n --tw-skew-x: 0;\n --tw-skew-y: 0;\n --tw-scale-x: 1;\n --tw-scale-y: 1;\n --tw-pan-x: ;\n --tw-pan-y: ;\n --tw-pinch-zoom: ;\n --tw-scroll-snap-strictness: proximity;\n --tw-ordinal: ;\n --tw-slashed-zero: ;\n --tw-numeric-figure: ;\n --tw-numeric-spacing: ;\n --tw-numeric-fraction: ;\n --tw-ring-inset: ;\n --tw-ring-offset-width: 0px;\n --tw-ring-offset-color: #fff;\n --tw-ring-color: rgb(59 130 246 / 0.5);\n --tw-ring-offset-shadow: 0 0 #0000;\n --tw-ring-shadow: 0 0 #0000;\n --tw-shadow: 0 0 #0000;\n --tw-shadow-colored: 0 0 #0000;\n --tw-blur: ;\n --tw-brightness: ;\n --tw-contrast: ;\n --tw-grayscale: ;\n --tw-hue-rotate: ;\n --tw-invert: ;\n --tw-saturate: ;\n --tw-sepia: ;\n --tw-drop-shadow: ;\n --tw-backdrop-blur: ;\n --tw-backdrop-brightness: ;\n --tw-backdrop-contrast: ;\n --tw-backdrop-grayscale: ;\n --tw-backdrop-hue-rotate: ;\n --tw-backdrop-invert: ;\n --tw-backdrop-opacity: ;\n --tw-backdrop-saturate: ;\n --tw-backdrop-sepia: ;\n}\n.static {\n position: static;\n}\n.absolute {\n position: absolute;\n}\n.relative {\n position: relative;\n}\n.right-3 {\n right: 0.75rem;\n}\n.top-\\[50\\%\\] {\n top: 50%;\n}\n.top-0 {\n top: 0px;\n}\n.left-1\\/2 {\n left: 50%;\n}\n.top-5 {\n top: 1.25rem;\n}\n.right-5 {\n right: 1.25rem;\n}\n.bottom-0 {\n bottom: 0px;\n}\n.left-0 {\n left: 0px;\n}\n.z-50 {\n z-index: 50;\n}\n.-m-1 {\n margin: -0.25rem;\n}\n.mb-12 {\n margin-bottom: 3rem;\n}\n.mt-2 {\n margin-top: 0.5rem;\n}\n.ml-6 {\n margin-left: 1.5rem;\n}\n.mb-2 {\n margin-bottom: 0.5rem;\n}\n.block {\n display: block;\n}\n.inline-block {\n display: inline-block;\n}\n.flex {\n display: flex;\n}\n.inline-flex {\n display: inline-flex;\n}\n.table {\n display: table;\n}\n.flow-root {\n display: flow-root;\n}\n.hidden {\n display: none;\n}\n.h-full {\n height: 100%;\n}\n.h-4 {\n height: 1rem;\n}\n.h-\\[38px\\] {\n height: 38px;\n}\n.h-16 {\n height: 4rem;\n}\n.max-h-\\[70vh\\] {\n max-height: 70vh;\n}\n.min-h-\\[8rem\\] {\n min-height: 8rem;\n}\n.w-4 {\n width: 1rem;\n}\n.w-full {\n width: 100%;\n}\n.flex-auto {\n flex: 1 1 auto;\n}\n.flex-grow {\n flex-grow: 1;\n}\n.-translate-y-\\[50\\%\\] {\n --tw-translate-y: -50%;\n transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));\n}\n.-translate-x-1\\/2 {\n --tw-translate-x: -50%;\n transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));\n}\n.cursor-pointer {\n cursor: pointer;\n}\n.flex-wrap {\n flex-wrap: wrap;\n}\n.items-center {\n align-items: center;\n}\n.items-stretch {\n align-items: stretch;\n}\n.justify-center {\n justify-content: center;\n}\n.space-x-3 > :not([hidden]) ~ :not([hidden]) {\n --tw-space-x-reverse: 0;\n margin-right: calc(0.75rem * var(--tw-space-x-reverse));\n margin-left: calc(0.75rem * calc(1 - var(--tw-space-x-reverse)));\n}\n.overflow-hidden {\n overflow: hidden;\n}\n.overflow-y-auto {\n overflow-y: auto;\n}\n.rounded-md {\n border-radius: 0.375rem;\n}\n.rounded-\\[1\\.25rem\\] {\n border-radius: 1.25rem;\n}\n.rounded-lg {\n border-radius: 0.5rem;\n}\n.rounded-tr-none {\n border-top-right-radius: 0px;\n}\n.rounded-br-none {\n border-bottom-right-radius: 0px;\n}\n.rounded-tl-none {\n border-top-left-radius: 0px;\n}\n.rounded-bl-none {\n border-bottom-left-radius: 0px;\n}\n.border {\n border-width: 1px;\n}\n.border-t {\n border-top-width: 1px;\n}\n.border-grey-500 {\n --tw-border-opacity: 1;\n border-color: rgb(155 163 192 / var(--tw-border-opacity));\n}\n.border-blue-500 {\n --tw-border-opacity: 1;\n border-color: rgb(53 95 254 / var(--tw-border-opacity));\n}\n.border-\\[\\#a6abbd\\] {\n --tw-border-opacity: 1;\n border-color: rgb(166 171 189 / var(--tw-border-opacity));\n}\n.border-opacity-100 {\n --tw-border-opacity: 1;\n}\n.border-opacity-60 {\n --tw-border-opacity: 0.6;\n}\n.\\!bg-grey-100 {\n --tw-bg-opacity: 1 !important;\n background-color: rgb(230 232 239 / var(--tw-bg-opacity)) !important;\n}\n.bg-white {\n --tw-bg-opacity: 1;\n background-color: rgb(255 255 255 / var(--tw-bg-opacity));\n}\n.\\!bg-\\[transparent\\] {\n background-color: transparent !important;\n}\n.bg-blue-500 {\n --tw-bg-opacity: 1;\n background-color: rgb(53 95 254 / var(--tw-bg-opacity));\n}\n.bg-grey-100 {\n --tw-bg-opacity: 1;\n background-color: rgb(230 232 239 / var(--tw-bg-opacity));\n}\n.fill-night-sky-800 {\n fill: #001936;\n}\n.fill-white {\n fill: #FFFFFF;\n}\n.fill-blue-500 {\n fill: #355FFE;\n}\n.px-6 {\n padding-left: 1.5rem;\n padding-right: 1.5rem;\n}\n.py-0 {\n padding-top: 0px;\n padding-bottom: 0px;\n}\n.px-4 {\n padding-left: 1rem;\n padding-right: 1rem;\n}\n.py-5 {\n padding-top: 1.25rem;\n padding-bottom: 1.25rem;\n}\n.px-3 {\n padding-left: 0.75rem;\n padding-right: 0.75rem;\n}\n.py-1 {\n padding-top: 0.25rem;\n padding-bottom: 0.25rem;\n}\n.pr-0 {\n padding-right: 0px;\n}\n.pl-3 {\n padding-left: 0.75rem;\n}\n.font-sofia-pro {\n font-family: sofia-pro, sans-serif;\n}\n.text-\\[1\\.125rem\\] {\n font-size: 1.125rem;\n}\n.text-base {\n font-size: 1rem;\n line-height: 1.5rem;\n}\n.font-medium {\n font-weight: 500;\n}\n.font-semibold {\n font-weight: 600;\n}\n.text-night-sky-800 {\n --tw-text-opacity: 1;\n color: rgb(0 25 54 / var(--tw-text-opacity));\n}\n.text-white {\n --tw-text-opacity: 1;\n color: rgb(255 255 255 / var(--tw-text-opacity));\n}\n.text-blue-500 {\n --tw-text-opacity: 1;\n color: rgb(53 95 254 / var(--tw-text-opacity));\n}\n.shadow-none {\n --tw-shadow: 0 0 #0000;\n --tw-shadow-colored: 0 0 #0000;\n box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);\n}\n.shadow-sm {\n --tw-shadow: 0 1px 2px 0 rgb(0 0 0 / 0.05);\n --tw-shadow-colored: 0 1px 2px 0 var(--tw-shadow-color);\n box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);\n}\n.shadow-lg {\n --tw-shadow: 0 10px 15px -3px rgb(0 0 0 / 0.1), 0 4px 6px -4px rgb(0 0 0 / 0.1);\n --tw-shadow-colored: 0 10px 15px -3px var(--tw-shadow-color), 0 4px 6px -4px var(--tw-shadow-color);\n box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);\n}\n.ring-0 {\n --tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);\n --tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(0px + var(--tw-ring-offset-width)) var(--tw-ring-color);\n box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow, 0 0 #0000);\n}\n.ring {\n --tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);\n --tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(3px + var(--tw-ring-offset-width)) var(--tw-ring-color);\n box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow, 0 0 #0000);\n}\n.ring-1 {\n --tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);\n --tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(1px + var(--tw-ring-offset-width)) var(--tw-ring-color);\n box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow, 0 0 #0000);\n}\n.\\!ring-blue-600 {\n --tw-ring-opacity: 1 !important;\n --tw-ring-color: rgb(35 74 224 / var(--tw-ring-opacity)) !important;\n}\n.ring-transparent {\n --tw-ring-color: transparent;\n}\n.ring-offset-2 {\n --tw-ring-offset-width: 2px;\n}\n.transition-colors {\n transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, outline-color, focus-color;\n transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);\n transition-duration: 150ms;\n}\n\n/* Search Results Container Styles */\n.fade-slide-enter {\n --tw-translate-y: -0.75rem;\n --tw-scale-x: .95;\n --tw-scale-y: .95;\n transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));\n opacity: 0;\n}\n\n.fade-slide-enter-active, \n.fade-slide-enter-done {\n --tw-translate-y: 0px;\n --tw-scale-x: 1;\n --tw-scale-y: 1;\n transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));\n opacity: 1;\n transition-property: all;\n transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);\n transition-duration: 300ms;\n transition-timing-function: cubic-bezier(0, 0, 0.2, 1);\n}\n\n.fade-slide-exit {\n --tw-translate-y: 0px;\n --tw-scale-x: 1;\n --tw-scale-y: 1;\n transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));\n opacity: 1;\n}\n\n.fade-slide-exit-active, \n.fade-slide-exit-done {\n --tw-translate-y: -0.75rem;\n --tw-scale-x: .95;\n --tw-scale-y: .95;\n transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));\n opacity: 0;\n transition-property: all;\n transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);\n transition-duration: 300ms;\n transition-timing-function: cubic-bezier(0, 0, 0.2, 1);\n}\n\n.hover\\:border-grey-500:hover {\n --tw-border-opacity: 1;\n border-color: rgb(155 163 192 / var(--tw-border-opacity));\n}\n\n.hover\\:border-blue-600:hover {\n --tw-border-opacity: 1;\n border-color: rgb(35 74 224 / var(--tw-border-opacity));\n}\n\n.hover\\:border-opacity-50:hover {\n --tw-border-opacity: 0.5;\n}\n\n.hover\\:bg-grey-100:hover {\n --tw-bg-opacity: 1;\n background-color: rgb(230 232 239 / var(--tw-bg-opacity));\n}\n\n.hover\\:bg-blue-600:hover {\n --tw-bg-opacity: 1;\n background-color: rgb(35 74 224 / var(--tw-bg-opacity));\n}\n\n.hover\\:fill-blue-500:hover {\n fill: #355FFE;\n}\n\n.hover\\:fill-blue-600:hover {\n fill: #234AE0;\n}\n\n.hover\\:text-blue-500:hover {\n --tw-text-opacity: 1;\n color: rgb(53 95 254 / var(--tw-text-opacity));\n}\n\n.hover\\:text-blue-600:hover {\n --tw-text-opacity: 1;\n color: rgb(35 74 224 / var(--tw-text-opacity));\n}\n\n.focus\\:border-blue-400:focus {\n --tw-border-opacity: 1;\n border-color: rgb(72 112 254 / var(--tw-border-opacity));\n}\n\n.focus\\:bg-grey-100:focus {\n --tw-bg-opacity: 1;\n background-color: rgb(230 232 239 / var(--tw-bg-opacity));\n}\n\n.focus\\:outline-none:focus {\n outline: 2px solid transparent;\n outline-offset: 2px;\n}\n\n.focus\\:ring-0:focus {\n --tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);\n --tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(0px + var(--tw-ring-offset-width)) var(--tw-ring-color);\n box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow, 0 0 #0000);\n}\n\n.focus\\:ring-2:focus {\n --tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);\n --tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color);\n box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow, 0 0 #0000);\n}\n\n.focus\\:ring-blue-500:focus {\n --tw-ring-opacity: 1;\n --tw-ring-color: rgb(53 95 254 / var(--tw-ring-opacity));\n}\n\n.focus\\:ring-offset-2:focus {\n --tw-ring-offset-width: 2px;\n}\n\n@media (min-width: 1000px) {\n\n .tablet\\:w-\\[70vw\\] {\n width: 70vw;\n }\n}\n";
|
|
403
|
+
var css_248z = "/*\n! tailwindcss v3.4.1 | MIT License | https://tailwindcss.com\n*//*\n1. Prevent padding and border from affecting element width. (https://github.com/mozdevs/cssremedy/issues/4)\n2. Allow adding a border to an element by just adding a border-width. (https://github.com/tailwindcss/tailwindcss/pull/116)\n*/\n\n*,\n::before,\n::after {\n box-sizing: border-box; /* 1 */\n border-width: 0; /* 2 */\n border-style: solid; /* 2 */\n border-color: currentColor; /* 2 */\n}\n\n::before,\n::after {\n --tw-content: '';\n}\n\n/*\n1. Use a consistent sensible line-height in all browsers.\n2. Prevent adjustments of font size after orientation changes in iOS.\n3. Use a more readable tab size.\n4. Use the user's configured `sans` font-family by default.\n5. Use the user's configured `sans` font-feature-settings by default.\n6. Use the user's configured `sans` font-variation-settings by default.\n7. Disable tap highlights on iOS\n*/\n\nhtml,\n:host {\n line-height: 1.5; /* 1 */\n -webkit-text-size-adjust: 100%; /* 2 */ /* 3 */\n tab-size: 4; /* 3 */\n font-family: ui-sans-serif, system-ui, sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\", \"Noto Color Emoji\"; /* 4 */\n font-feature-settings: normal; /* 5 */\n font-variation-settings: normal; /* 6 */\n -webkit-tap-highlight-color: transparent; /* 7 */\n}\n\n/*\n1. Remove the margin in all browsers.\n2. Inherit line-height from `html` so users can set them as a class directly on the `html` element.\n*/\n\nbody {\n margin: 0; /* 1 */\n line-height: inherit; /* 2 */\n}\n\n/*\n1. Add the correct height in Firefox.\n2. Correct the inheritance of border color in Firefox. (https://bugzilla.mozilla.org/show_bug.cgi?id=190655)\n3. Ensure horizontal rules are visible by default.\n*/\n\nhr {\n height: 0; /* 1 */\n color: inherit; /* 2 */\n border-top-width: 1px; /* 3 */\n}\n\n/*\nAdd the correct text decoration in Chrome, Edge, and Safari.\n*/\n\nabbr:where([title]) {\n -webkit-text-decoration: underline dotted;\n text-decoration: underline dotted;\n}\n\n/*\nRemove the default font size and weight for headings.\n*/\n\nh1,\nh2,\nh3,\nh4,\nh5,\nh6 {\n font-size: inherit;\n font-weight: inherit;\n}\n\n/*\nReset links to optimize for opt-in styling instead of opt-out.\n*/\n\na {\n color: inherit;\n text-decoration: inherit;\n}\n\n/*\nAdd the correct font weight in Edge and Safari.\n*/\n\nb,\nstrong {\n font-weight: bolder;\n}\n\n/*\n1. Use the user's configured `mono` font-family by default.\n2. Use the user's configured `mono` font-feature-settings by default.\n3. Use the user's configured `mono` font-variation-settings by default.\n4. Correct the odd `em` font sizing in all browsers.\n*/\n\ncode,\nkbd,\nsamp,\npre {\n font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, \"Liberation Mono\", \"Courier New\", monospace; /* 1 */\n font-feature-settings: normal; /* 2 */\n font-variation-settings: normal; /* 3 */\n font-size: 1em; /* 4 */\n}\n\n/*\nAdd the correct font size in all browsers.\n*/\n\nsmall {\n font-size: 80%;\n}\n\n/*\nPrevent `sub` and `sup` elements from affecting the line height in all browsers.\n*/\n\nsub,\nsup {\n font-size: 75%;\n line-height: 0;\n position: relative;\n vertical-align: baseline;\n}\n\nsub {\n bottom: -0.25em;\n}\n\nsup {\n top: -0.5em;\n}\n\n/*\n1. Remove text indentation from table contents in Chrome and Safari. (https://bugs.chromium.org/p/chromium/issues/detail?id=999088, https://bugs.webkit.org/show_bug.cgi?id=201297)\n2. Correct table border color inheritance in all Chrome and Safari. (https://bugs.chromium.org/p/chromium/issues/detail?id=935729, https://bugs.webkit.org/show_bug.cgi?id=195016)\n3. Remove gaps between table borders by default.\n*/\n\ntable {\n text-indent: 0; /* 1 */\n border-color: inherit; /* 2 */\n border-collapse: collapse; /* 3 */\n}\n\n/*\n1. Change the font styles in all browsers.\n2. Remove the margin in Firefox and Safari.\n3. Remove default padding in all browsers.\n*/\n\nbutton,\ninput,\noptgroup,\nselect,\ntextarea {\n font-family: inherit; /* 1 */\n font-feature-settings: inherit; /* 1 */\n font-variation-settings: inherit; /* 1 */\n font-size: 100%; /* 1 */\n font-weight: inherit; /* 1 */\n line-height: inherit; /* 1 */\n color: inherit; /* 1 */\n margin: 0; /* 2 */\n padding: 0; /* 3 */\n}\n\n/*\nRemove the inheritance of text transform in Edge and Firefox.\n*/\n\nbutton,\nselect {\n text-transform: none;\n}\n\n/*\n1. Correct the inability to style clickable types in iOS and Safari.\n2. Remove default button styles.\n*/\n\nbutton,\n[type='button'],\n[type='reset'],\n[type='submit'] {\n -webkit-appearance: button; /* 1 */\n background-color: transparent; /* 2 */\n background-image: none; /* 2 */\n}\n\n/*\nUse the modern Firefox focus style for all focusable elements.\n*/\n\n:-moz-focusring {\n outline: auto;\n}\n\n/*\nRemove the additional `:invalid` styles in Firefox. (https://github.com/mozilla/gecko-dev/blob/2f9eacd9d3d995c937b4251a5557d95d494c9be1/layout/style/res/forms.css#L728-L737)\n*/\n\n:-moz-ui-invalid {\n box-shadow: none;\n}\n\n/*\nAdd the correct vertical alignment in Chrome and Firefox.\n*/\n\nprogress {\n vertical-align: baseline;\n}\n\n/*\nCorrect the cursor style of increment and decrement buttons in Safari.\n*/\n\n::-webkit-inner-spin-button,\n::-webkit-outer-spin-button {\n height: auto;\n}\n\n/*\n1. Correct the odd appearance in Chrome and Safari.\n2. Correct the outline style in Safari.\n*/\n\n[type='search'] {\n -webkit-appearance: textfield; /* 1 */\n outline-offset: -2px; /* 2 */\n}\n\n/*\nRemove the inner padding in Chrome and Safari on macOS.\n*/\n\n::-webkit-search-decoration {\n -webkit-appearance: none;\n}\n\n/*\n1. Correct the inability to style clickable types in iOS and Safari.\n2. Change font properties to `inherit` in Safari.\n*/\n\n::-webkit-file-upload-button {\n -webkit-appearance: button; /* 1 */\n font: inherit; /* 2 */\n}\n\n/*\nAdd the correct display in Chrome and Safari.\n*/\n\nsummary {\n display: list-item;\n}\n\n/*\nRemoves the default spacing and border for appropriate elements.\n*/\n\nblockquote,\ndl,\ndd,\nh1,\nh2,\nh3,\nh4,\nh5,\nh6,\nhr,\nfigure,\np,\npre {\n margin: 0;\n}\n\nfieldset {\n margin: 0;\n padding: 0;\n}\n\nlegend {\n padding: 0;\n}\n\nol,\nul,\nmenu {\n list-style: none;\n margin: 0;\n padding: 0;\n}\n\n/*\nReset default styling for dialogs.\n*/\ndialog {\n padding: 0;\n}\n\n/*\nPrevent resizing textareas horizontally by default.\n*/\n\ntextarea {\n resize: vertical;\n}\n\n/*\n1. Reset the default placeholder opacity in Firefox. (https://github.com/tailwindlabs/tailwindcss/issues/3300)\n2. Set the default placeholder color to the user's configured gray 400 color.\n*/\n\ninput::placeholder,\ntextarea::placeholder {\n opacity: 1; /* 1 */\n color: #9ca3af; /* 2 */\n}\n\n/*\nSet the default cursor for buttons.\n*/\n\nbutton,\n[role=\"button\"] {\n cursor: pointer;\n}\n\n/*\nMake sure disabled buttons don't get the pointer cursor.\n*/\n:disabled {\n cursor: default;\n}\n\n/*\n1. Make replaced elements `display: block` by default. (https://github.com/mozdevs/cssremedy/issues/14)\n2. Add `vertical-align: middle` to align replaced elements more sensibly by default. (https://github.com/jensimmons/cssremedy/issues/14#issuecomment-634934210)\n This can trigger a poorly considered lint error in some tools but is included by design.\n*/\n\nimg,\nsvg,\nvideo,\ncanvas,\naudio,\niframe,\nembed,\nobject {\n display: block; /* 1 */\n vertical-align: middle; /* 2 */\n}\n\n/*\nConstrain images and videos to the parent width and preserve their intrinsic aspect ratio. (https://github.com/mozdevs/cssremedy/issues/14)\n*/\n\nimg,\nvideo {\n max-width: 100%;\n height: auto;\n}\n\n/* Make elements with the HTML hidden attribute stay hidden by default */\n[hidden] {\n display: none;\n}\n @import url(\"https://p.typekit.net/p.css?s=1&k=etf0mna&ht=tk&f=24536.24553.24554.24558.24559.24539.24540.24545.24546.24547.24548.24549.24552.24580.24581.24586.24587.24588.24589.24590.24591&a=27633482&app=typekit&e=css\");\n\n @font-face {\n font-family: \"sofia-pro-soft\";\n src: url(\"https://use.typekit.net/af/745ea3/00000000000000007735a146/30/l?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=n5&v=3\")\n format(\"woff2\"),\n url(\"https://use.typekit.net/af/745ea3/00000000000000007735a146/30/d?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=n5&v=3\")\n format(\"woff\"),\n url(\"https://use.typekit.net/af/745ea3/00000000000000007735a146/30/a?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=n5&v=3\")\n format(\"opentype\");\n font-display: auto;\n font-style: normal;\n font-weight: 500;\n font-stretch: normal;\n }\n\n @font-face {\n font-family: \"sofia-pro-soft\";\n src: url(\"https://use.typekit.net/af/cdf40b/00000000000000007735a147/30/l?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=n7&v=3\")\n format(\"woff2\"),\n url(\"https://use.typekit.net/af/cdf40b/00000000000000007735a147/30/d?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=n7&v=3\")\n format(\"woff\"),\n url(\"https://use.typekit.net/af/cdf40b/00000000000000007735a147/30/a?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=n7&v=3\")\n format(\"opentype\");\n font-display: auto;\n font-style: normal;\n font-weight: 700;\n font-stretch: normal;\n }\n\n @font-face {\n font-family: \"sofia-pro-soft\";\n src: url(\"https://use.typekit.net/af/691282/00000000000000007735a149/30/l?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=i7&v=3\")\n format(\"woff2\"),\n url(\"https://use.typekit.net/af/691282/00000000000000007735a149/30/d?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=i7&v=3\")\n format(\"woff\"),\n url(\"https://use.typekit.net/af/691282/00000000000000007735a149/30/a?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=i7&v=3\")\n format(\"opentype\");\n font-display: auto;\n font-style: italic;\n font-weight: 700;\n font-stretch: normal;\n }\n\n @font-face {\n font-family: \"sofia-pro-soft\";\n src: url(\"https://use.typekit.net/af/54ce76/00000000000000007735a154/30/l?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=n4&v=3\")\n format(\"woff2\"),\n url(\"https://use.typekit.net/af/54ce76/00000000000000007735a154/30/d?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=n4&v=3\")\n format(\"woff\"),\n url(\"https://use.typekit.net/af/54ce76/00000000000000007735a154/30/a?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=n4&v=3\")\n format(\"opentype\");\n font-display: auto;\n font-style: normal;\n font-weight: 400;\n font-stretch: normal;\n }\n\n @font-face {\n font-family: \"sofia-pro-soft\";\n src: url(\"https://use.typekit.net/af/9f41be/00000000000000007735a157/30/l?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=i4&v=3\")\n format(\"woff2\"),\n url(\"https://use.typekit.net/af/9f41be/00000000000000007735a157/30/d?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=i4&v=3\")\n format(\"woff\"),\n url(\"https://use.typekit.net/af/9f41be/00000000000000007735a157/30/a?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=i4&v=3\")\n format(\"opentype\");\n font-display: auto;\n font-style: italic;\n font-weight: 400;\n font-stretch: normal;\n }\n\n @font-face {\n font-family: \"sofia-pro\";\n src: url(\"https://use.typekit.net/af/5d97ff/00000000000000007735f999/30/l?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=n7&v=3\")\n format(\"woff2\"),\n url(\"https://use.typekit.net/af/5d97ff/00000000000000007735f999/30/d?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=n7&v=3\")\n format(\"woff\"),\n url(\"https://use.typekit.net/af/5d97ff/00000000000000007735f999/30/a?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=n7&v=3\")\n format(\"opentype\");\n font-display: auto;\n font-style: normal;\n font-weight: 700;\n font-stretch: normal;\n }\n\n @font-face {\n font-family: \"sofia-pro\";\n src: url(\"https://use.typekit.net/af/66e20c/00000000000000007735f993/30/l?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=i7&v=3\")\n format(\"woff2\"),\n url(\"https://use.typekit.net/af/66e20c/00000000000000007735f993/30/d?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=i7&v=3\")\n format(\"woff\"),\n url(\"https://use.typekit.net/af/66e20c/00000000000000007735f993/30/a?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=i7&v=3\")\n format(\"opentype\");\n font-display: auto;\n font-style: italic;\n font-weight: 700;\n font-stretch: normal;\n }\n\n @font-face {\n font-family: \"sofia-pro\";\n src: url(\"https://use.typekit.net/af/19ced7/00000000000000007735f992/30/l?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=n5&v=3\")\n format(\"woff2\"),\n url(\"https://use.typekit.net/af/19ced7/00000000000000007735f992/30/d?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=n5&v=3\")\n format(\"woff\"),\n url(\"https://use.typekit.net/af/19ced7/00000000000000007735f992/30/a?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=n5&v=3\")\n format(\"opentype\");\n font-display: auto;\n font-style: normal;\n font-weight: 500;\n font-stretch: normal;\n }\n\n @font-face {\n font-family: \"sofia-pro\";\n src: url(\"https://use.typekit.net/af/33e8a4/00000000000000007735f99b/30/l?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=i5&v=3\")\n format(\"woff2\"),\n url(\"https://use.typekit.net/af/33e8a4/00000000000000007735f99b/30/d?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=i5&v=3\")\n format(\"woff\"),\n url(\"https://use.typekit.net/af/33e8a4/00000000000000007735f99b/30/a?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=i5&v=3\")\n format(\"opentype\");\n font-display: auto;\n font-style: italic;\n font-weight: 500;\n font-stretch: normal;\n }\n\n @font-face {\n font-family: \"sofia-pro\";\n src: url(\"https://use.typekit.net/af/b718ff/00000000000000007735f98d/30/l?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=n4&v=3\")\n format(\"woff2\"),\n url(\"https://use.typekit.net/af/b718ff/00000000000000007735f98d/30/d?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=n4&v=3\")\n format(\"woff\"),\n url(\"https://use.typekit.net/af/b718ff/00000000000000007735f98d/30/a?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=n4&v=3\")\n format(\"opentype\");\n font-display: auto;\n font-style: normal;\n font-weight: 400;\n font-stretch: normal;\n }\n\n @font-face {\n font-family: \"sofia-pro\";\n src: url(\"https://use.typekit.net/af/c09857/00000000000000007735f98c/30/l?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=i4&v=3\")\n format(\"woff2\"),\n url(\"https://use.typekit.net/af/c09857/00000000000000007735f98c/30/d?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=i4&v=3\")\n format(\"woff\"),\n url(\"https://use.typekit.net/af/c09857/00000000000000007735f98c/30/a?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=i4&v=3\")\n format(\"opentype\");\n font-display: auto;\n font-style: italic;\n font-weight: 400;\n font-stretch: normal;\n }\n\n @font-face {\n font-family: \"sofia-pro\";\n src: url(\"https://use.typekit.net/af/262452/00000000000000007735f99a/30/l?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=n6&v=3\")\n format(\"woff2\"),\n url(\"https://use.typekit.net/af/262452/00000000000000007735f99a/30/d?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=n6&v=3\")\n format(\"woff\"),\n url(\"https://use.typekit.net/af/262452/00000000000000007735f99a/30/a?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=n6&v=3\")\n format(\"opentype\");\n font-display: auto;\n font-style: normal;\n font-weight: 600;\n font-stretch: normal;\n }\n\n @font-face {\n font-family: \"sofia-pro\";\n src: url(\"https://use.typekit.net/af/36f509/00000000000000007735f994/30/l?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=i6&v=3\")\n format(\"woff2\"),\n url(\"https://use.typekit.net/af/36f509/00000000000000007735f994/30/d?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=i6&v=3\")\n format(\"woff\"),\n url(\"https://use.typekit.net/af/36f509/00000000000000007735f994/30/a?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=i6&v=3\")\n format(\"opentype\");\n font-display: auto;\n font-style: italic;\n font-weight: 600;\n font-stretch: normal;\n }\n\n @font-face {\n font-family: \"sofia-pro-condensed\";\n src: url(\"https://use.typekit.net/af/8b3e11/00000000000000007735a150/30/l?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=n7&v=3\")\n format(\"woff2\"),\n url(\"https://use.typekit.net/af/8b3e11/00000000000000007735a150/30/d?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=n7&v=3\")\n format(\"woff\"),\n url(\"https://use.typekit.net/af/8b3e11/00000000000000007735a150/30/a?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=n7&v=3\")\n format(\"opentype\");\n font-display: auto;\n font-style: normal;\n font-weight: 700;\n font-stretch: normal;\n }\n\n @font-face {\n font-family: \"sofia-pro-condensed\";\n src: url(\"https://use.typekit.net/af/2fe268/00000000000000007735a153/30/l?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=i7&v=3\")\n format(\"woff2\"),\n url(\"https://use.typekit.net/af/2fe268/00000000000000007735a153/30/d?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=i7&v=3\")\n format(\"woff\"),\n url(\"https://use.typekit.net/af/2fe268/00000000000000007735a153/30/a?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=i7&v=3\")\n format(\"opentype\");\n font-display: auto;\n font-style: italic;\n font-weight: 700;\n font-stretch: normal;\n }\n\n @font-face {\n font-family: \"sofia-pro-condensed\";\n src: url(\"https://use.typekit.net/af/a33c9d/00000000000000007735a15e/30/l?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=n5&v=3\")\n format(\"woff2\"),\n url(\"https://use.typekit.net/af/a33c9d/00000000000000007735a15e/30/d?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=n5&v=3\")\n format(\"woff\"),\n url(\"https://use.typekit.net/af/a33c9d/00000000000000007735a15e/30/a?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=n5&v=3\")\n format(\"opentype\");\n font-display: auto;\n font-style: normal;\n font-weight: 500;\n font-stretch: normal;\n }\n\n @font-face {\n font-family: \"sofia-pro-condensed\";\n src: url(\"https://use.typekit.net/af/fa5448/00000000000000007735a161/30/l?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=i5&v=3\")\n format(\"woff2\"),\n url(\"https://use.typekit.net/af/fa5448/00000000000000007735a161/30/d?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=i5&v=3\")\n format(\"woff\"),\n url(\"https://use.typekit.net/af/fa5448/00000000000000007735a161/30/a?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=i5&v=3\")\n format(\"opentype\");\n font-display: auto;\n font-style: italic;\n font-weight: 500;\n font-stretch: normal;\n }\n\n @font-face {\n font-family: \"sofia-pro-condensed\";\n src: url(\"https://use.typekit.net/af/cf0830/00000000000000007735a162/30/l?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=n4&v=3\")\n format(\"woff2\"),\n url(\"https://use.typekit.net/af/cf0830/00000000000000007735a162/30/d?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=n4&v=3\")\n format(\"woff\"),\n url(\"https://use.typekit.net/af/cf0830/00000000000000007735a162/30/a?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=n4&v=3\")\n format(\"opentype\");\n font-display: auto;\n font-style: normal;\n font-weight: 400;\n font-stretch: normal;\n }\n\n @font-face {\n font-family: \"sofia-pro-condensed\";\n src: url(\"https://use.typekit.net/af/7da024/00000000000000007735a164/30/l?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=i4&v=3\")\n format(\"woff2\"),\n url(\"https://use.typekit.net/af/7da024/00000000000000007735a164/30/d?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=i4&v=3\")\n format(\"woff\"),\n url(\"https://use.typekit.net/af/7da024/00000000000000007735a164/30/a?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=i4&v=3\")\n format(\"opentype\");\n font-display: auto;\n font-style: italic;\n font-weight: 400;\n font-stretch: normal;\n }\n\n @font-face {\n font-family: \"sofia-pro-condensed\";\n src: url(\"https://use.typekit.net/af/ef0e2d/00000000000000007735a166/30/l?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=n6&v=3\")\n format(\"woff2\"),\n url(\"https://use.typekit.net/af/ef0e2d/00000000000000007735a166/30/d?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=n6&v=3\")\n format(\"woff\"),\n url(\"https://use.typekit.net/af/ef0e2d/00000000000000007735a166/30/a?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=n6&v=3\")\n format(\"opentype\");\n font-display: auto;\n font-style: normal;\n font-weight: 600;\n font-stretch: normal;\n }\n\n @font-face {\n font-family: \"sofia-pro-condensed\";\n src: url(\"https://use.typekit.net/af/1ff8be/00000000000000007735a168/30/l?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=i6&v=3\")\n format(\"woff2\"),\n url(\"https://use.typekit.net/af/1ff8be/00000000000000007735a168/30/d?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=i6&v=3\")\n format(\"woff\"),\n url(\"https://use.typekit.net/af/1ff8be/00000000000000007735a168/30/a?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=i6&v=3\")\n format(\"opentype\");\n font-display: auto;\n font-style: italic;\n font-weight: 600;\n font-stretch: normal;\n }\n\n*, ::before, ::after {\n --tw-border-spacing-x: 0;\n --tw-border-spacing-y: 0;\n --tw-translate-x: 0;\n --tw-translate-y: 0;\n --tw-rotate: 0;\n --tw-skew-x: 0;\n --tw-skew-y: 0;\n --tw-scale-x: 1;\n --tw-scale-y: 1;\n --tw-pan-x: ;\n --tw-pan-y: ;\n --tw-pinch-zoom: ;\n --tw-scroll-snap-strictness: proximity;\n --tw-gradient-from-position: ;\n --tw-gradient-via-position: ;\n --tw-gradient-to-position: ;\n --tw-ordinal: ;\n --tw-slashed-zero: ;\n --tw-numeric-figure: ;\n --tw-numeric-spacing: ;\n --tw-numeric-fraction: ;\n --tw-ring-inset: ;\n --tw-ring-offset-width: 0px;\n --tw-ring-offset-color: #fff;\n --tw-ring-color: rgb(59 130 246 / 0.5);\n --tw-ring-offset-shadow: 0 0 #0000;\n --tw-ring-shadow: 0 0 #0000;\n --tw-shadow: 0 0 #0000;\n --tw-shadow-colored: 0 0 #0000;\n --tw-blur: ;\n --tw-brightness: ;\n --tw-contrast: ;\n --tw-grayscale: ;\n --tw-hue-rotate: ;\n --tw-invert: ;\n --tw-saturate: ;\n --tw-sepia: ;\n --tw-drop-shadow: ;\n --tw-backdrop-blur: ;\n --tw-backdrop-brightness: ;\n --tw-backdrop-contrast: ;\n --tw-backdrop-grayscale: ;\n --tw-backdrop-hue-rotate: ;\n --tw-backdrop-invert: ;\n --tw-backdrop-opacity: ;\n --tw-backdrop-saturate: ;\n --tw-backdrop-sepia: ;\n}\n\n::backdrop {\n --tw-border-spacing-x: 0;\n --tw-border-spacing-y: 0;\n --tw-translate-x: 0;\n --tw-translate-y: 0;\n --tw-rotate: 0;\n --tw-skew-x: 0;\n --tw-skew-y: 0;\n --tw-scale-x: 1;\n --tw-scale-y: 1;\n --tw-pan-x: ;\n --tw-pan-y: ;\n --tw-pinch-zoom: ;\n --tw-scroll-snap-strictness: proximity;\n --tw-gradient-from-position: ;\n --tw-gradient-via-position: ;\n --tw-gradient-to-position: ;\n --tw-ordinal: ;\n --tw-slashed-zero: ;\n --tw-numeric-figure: ;\n --tw-numeric-spacing: ;\n --tw-numeric-fraction: ;\n --tw-ring-inset: ;\n --tw-ring-offset-width: 0px;\n --tw-ring-offset-color: #fff;\n --tw-ring-color: rgb(59 130 246 / 0.5);\n --tw-ring-offset-shadow: 0 0 #0000;\n --tw-ring-shadow: 0 0 #0000;\n --tw-shadow: 0 0 #0000;\n --tw-shadow-colored: 0 0 #0000;\n --tw-blur: ;\n --tw-brightness: ;\n --tw-contrast: ;\n --tw-grayscale: ;\n --tw-hue-rotate: ;\n --tw-invert: ;\n --tw-saturate: ;\n --tw-sepia: ;\n --tw-drop-shadow: ;\n --tw-backdrop-blur: ;\n --tw-backdrop-brightness: ;\n --tw-backdrop-contrast: ;\n --tw-backdrop-grayscale: ;\n --tw-backdrop-hue-rotate: ;\n --tw-backdrop-invert: ;\n --tw-backdrop-opacity: ;\n --tw-backdrop-saturate: ;\n --tw-backdrop-sepia: ;\n}\n.sa-absolute {\n position: absolute;\n}\n.sa-relative {\n position: relative;\n}\n.sa-bottom-0 {\n bottom: 0px;\n}\n.sa-left-0 {\n left: 0px;\n}\n.sa-left-1\\/2 {\n left: 50%;\n}\n.sa-right-3 {\n right: 0.75rem;\n}\n.sa-right-5 {\n right: 1.25rem;\n}\n.sa-top-0 {\n top: 0px;\n}\n.sa-top-5 {\n top: 1.25rem;\n}\n.sa-top-\\[50\\%\\] {\n top: 50%;\n}\n.sa-z-50 {\n z-index: 50;\n}\n.sa-m-1 {\n margin: 0.25rem;\n}\n.sa-mb-12 {\n margin-bottom: 3rem;\n}\n.sa-mb-2 {\n margin-bottom: 0.5rem;\n}\n.sa-ml-6 {\n margin-left: 1.5rem;\n}\n.sa-mt-2 {\n margin-top: 0.5rem;\n}\n.sa-inline-block {\n display: inline-block;\n}\n.sa-flex {\n display: flex;\n}\n.sa-inline-flex {\n display: inline-flex;\n}\n.sa-flow-root {\n display: flow-root;\n}\n.sa-hidden {\n display: none;\n}\n.sa-h-16 {\n height: 4rem;\n}\n.sa-h-4 {\n height: 1rem;\n}\n.sa-h-\\[38px\\] {\n height: 38px;\n}\n.sa-h-full {\n height: 100%;\n}\n.sa-max-h-\\[70vh\\] {\n max-height: 70vh;\n}\n.sa-min-h-\\[8rem\\] {\n min-height: 8rem;\n}\n.sa-w-4 {\n width: 1rem;\n}\n.sa-w-full {\n width: 100%;\n}\n.sa-flex-auto {\n flex: 1 1 auto;\n}\n.sa-flex-grow {\n flex-grow: 1;\n}\n.-sa-translate-x-1\\/2 {\n --tw-translate-x: -50%;\n transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));\n}\n.-sa-translate-y-\\[50\\%\\] {\n --tw-translate-y: -50%;\n transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));\n}\n.sa-cursor-pointer {\n cursor: pointer;\n}\n.sa-flex-wrap {\n flex-wrap: wrap;\n}\n.sa-items-center {\n align-items: center;\n}\n.sa-items-stretch {\n align-items: stretch;\n}\n.sa-justify-center {\n justify-content: center;\n}\n.sa-space-x-3 > :not([hidden]) ~ :not([hidden]) {\n --tw-space-x-reverse: 0;\n margin-right: calc(0.75rem * var(--tw-space-x-reverse));\n margin-left: calc(0.75rem * calc(1 - var(--tw-space-x-reverse)));\n}\n.sa-overflow-hidden {\n overflow: hidden;\n}\n.sa-overflow-y-auto {\n overflow-y: auto;\n}\n.sa-rounded-\\[1\\.25rem\\] {\n border-radius: 1.25rem;\n}\n.sa-rounded-lg {\n border-radius: 0.5rem;\n}\n.sa-rounded-md {\n border-radius: 0.375rem;\n}\n.sa-rounded-bl-none {\n border-bottom-left-radius: 0px;\n}\n.sa-rounded-br-none {\n border-bottom-right-radius: 0px;\n}\n.sa-rounded-tl-none {\n border-top-left-radius: 0px;\n}\n.sa-rounded-tr-none {\n border-top-right-radius: 0px;\n}\n.sa-border {\n border-width: 1px;\n}\n.sa-border-t {\n border-top-width: 1px;\n}\n.sa-border-\\[\\#a6abbd\\] {\n --tw-border-opacity: 1;\n border-color: rgb(166 171 189 / var(--tw-border-opacity));\n}\n.sa-border-blue-500 {\n --tw-border-opacity: 1;\n border-color: rgb(53 95 254 / var(--tw-border-opacity));\n}\n.sa-border-grey-500 {\n --tw-border-opacity: 1;\n border-color: rgb(155 163 192 / var(--tw-border-opacity));\n}\n.sa-border-opacity-100 {\n --tw-border-opacity: 1;\n}\n.sa-border-opacity-60 {\n --tw-border-opacity: 0.6;\n}\n.\\!sa-bg-\\[transparent\\] {\n background-color: transparent !important;\n}\n.\\!sa-bg-grey-100 {\n --tw-bg-opacity: 1 !important;\n background-color: rgb(230 232 239 / var(--tw-bg-opacity)) !important;\n}\n.sa-bg-blue-500 {\n --tw-bg-opacity: 1;\n background-color: rgb(53 95 254 / var(--tw-bg-opacity));\n}\n.sa-bg-white {\n --tw-bg-opacity: 1;\n background-color: rgb(255 255 255 / var(--tw-bg-opacity));\n}\n.sa-fill-blue-500 {\n fill: #355FFE;\n}\n.sa-fill-night-sky-800 {\n fill: #001936;\n}\n.sa-fill-white {\n fill: #FFFFFF;\n}\n.sa-px-3 {\n padding-left: 0.75rem;\n padding-right: 0.75rem;\n}\n.sa-px-4 {\n padding-left: 1rem;\n padding-right: 1rem;\n}\n.sa-px-6 {\n padding-left: 1.5rem;\n padding-right: 1.5rem;\n}\n.sa-py-0 {\n padding-top: 0px;\n padding-bottom: 0px;\n}\n.sa-py-1 {\n padding-top: 0.25rem;\n padding-bottom: 0.25rem;\n}\n.sa-py-5 {\n padding-top: 1.25rem;\n padding-bottom: 1.25rem;\n}\n.sa-pl-3 {\n padding-left: 0.75rem;\n}\n.sa-pr-0 {\n padding-right: 0px;\n}\n.sa-font-sofia-pro {\n font-family: sofia-pro, sans-serif;\n}\n.sa-text-\\[1\\.125rem\\] {\n font-size: 1.125rem;\n}\n.sa-text-base {\n font-size: 1rem;\n line-height: 1.5rem;\n}\n.sa-font-medium {\n font-weight: 500;\n}\n.sa-font-semibold {\n font-weight: 600;\n}\n.sa-text-blue-500 {\n --tw-text-opacity: 1;\n color: rgb(53 95 254 / var(--tw-text-opacity));\n}\n.sa-text-night-sky-800 {\n --tw-text-opacity: 1;\n color: rgb(0 25 54 / var(--tw-text-opacity));\n}\n.sa-text-white {\n --tw-text-opacity: 1;\n color: rgb(255 255 255 / var(--tw-text-opacity));\n}\n.sa-shadow-lg {\n --tw-shadow: 0 10px 15px -3px rgb(0 0 0 / 0.1), 0 4px 6px -4px rgb(0 0 0 / 0.1);\n --tw-shadow-colored: 0 10px 15px -3px var(--tw-shadow-color), 0 4px 6px -4px var(--tw-shadow-color);\n box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);\n}\n.sa-shadow-none {\n --tw-shadow: 0 0 #0000;\n --tw-shadow-colored: 0 0 #0000;\n box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);\n}\n.sa-shadow-sm {\n --tw-shadow: 0 1px 2px 0 rgb(0 0 0 / 0.05);\n --tw-shadow-colored: 0 1px 2px 0 var(--tw-shadow-color);\n box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);\n}\n.sa-ring-0 {\n --tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);\n --tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(0px + var(--tw-ring-offset-width)) var(--tw-ring-color);\n box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow, 0 0 #0000);\n}\n.sa-ring-1 {\n --tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);\n --tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(1px + var(--tw-ring-offset-width)) var(--tw-ring-color);\n box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow, 0 0 #0000);\n}\n.\\!sa-ring-blue-600 {\n --tw-ring-opacity: 1 !important;\n --tw-ring-color: rgb(35 74 224 / var(--tw-ring-opacity)) !important;\n}\n.sa-ring-transparent {\n --tw-ring-color: transparent;\n}\n.sa-ring-offset-2 {\n --tw-ring-offset-width: 2px;\n}\n.sa-transition-colors {\n transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, outline-color, focus-color;\n transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);\n transition-duration: 150ms;\n}\n\n/* Search Results Container Styles */\n.fade-slide-enter {\n --tw-translate-y: -0.75rem;\n --tw-scale-x: .95;\n --tw-scale-y: .95;\n transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));\n opacity: 0;\n}\n\n.fade-slide-enter-active,\n.fade-slide-enter-done {\n --tw-translate-y: 0px;\n --tw-scale-x: 1;\n --tw-scale-y: 1;\n transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));\n opacity: 1;\n transition-property: all;\n transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);\n transition-duration: 300ms;\n transition-timing-function: cubic-bezier(0, 0, 0.2, 1);\n}\n\n.fade-slide-exit {\n --tw-translate-y: 0px;\n --tw-scale-x: 1;\n --tw-scale-y: 1;\n transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));\n opacity: 1;\n}\n\n.fade-slide-exit-active,\n.fade-slide-exit-done {\n --tw-translate-y: -0.75rem;\n --tw-scale-x: .95;\n --tw-scale-y: .95;\n transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));\n opacity: 0;\n transition-property: all;\n transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);\n transition-duration: 300ms;\n transition-timing-function: cubic-bezier(0, 0, 0.2, 1);\n}\n\n.hover\\:sa-border-blue-600:hover {\n --tw-border-opacity: 1;\n border-color: rgb(35 74 224 / var(--tw-border-opacity));\n}\n\n.hover\\:sa-bg-blue-600:hover {\n --tw-bg-opacity: 1;\n background-color: rgb(35 74 224 / var(--tw-bg-opacity));\n}\n\n.hover\\:sa-fill-blue-500:hover {\n fill: #355FFE;\n}\n\n.hover\\:sa-fill-blue-600:hover {\n fill: #234AE0;\n}\n\n.hover\\:sa-text-blue-500:hover {\n --tw-text-opacity: 1;\n color: rgb(53 95 254 / var(--tw-text-opacity));\n}\n\n.hover\\:sa-text-blue-600:hover {\n --tw-text-opacity: 1;\n color: rgb(35 74 224 / var(--tw-text-opacity));\n}\n\n.focus\\:sa-outline-none:focus {\n outline: 2px solid transparent;\n outline-offset: 2px;\n}\n\n.focus\\:sa-ring-2:focus {\n --tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);\n --tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color);\n box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow, 0 0 #0000);\n}\n\n.focus\\:sa-ring-blue-500:focus {\n --tw-ring-opacity: 1;\n --tw-ring-color: rgb(53 95 254 / var(--tw-ring-opacity));\n}\n\n.focus\\:sa-ring-offset-2:focus {\n --tw-ring-offset-width: 2px;\n}\n\n@media (min-width: 1000px) {\n\n .tablet\\:sa-w-\\[70vw\\] {\n width: 70vw;\n }\n}\n";
|
|
404
404
|
styleInject(css_248z);
|
|
405
405
|
|
|
406
406
|
exports.SearchAutocomplete = SearchAutocomplete;
|
package/npmkey
ADDED
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@cn-npm/search-autocomplete",
|
|
3
|
-
"version": "0.2.
|
|
3
|
+
"version": "0.2.17",
|
|
4
4
|
"main": "dist/bundle.js",
|
|
5
5
|
"peerDependencies": {
|
|
6
6
|
"@headlessui/react": "^1.7.1",
|
|
@@ -71,7 +71,6 @@
|
|
|
71
71
|
"@storybook/react": "^6.5.10",
|
|
72
72
|
"@storybook/testing-library": "^0.0.13",
|
|
73
73
|
"@svgr/rollup": "^6.3.1",
|
|
74
|
-
"@tailwindcss/forms": "^0.5.2",
|
|
75
74
|
"@testing-library/jest-dom": "^5.16.5",
|
|
76
75
|
"@testing-library/react": "^13.3.0",
|
|
77
76
|
"@testing-library/user-event": "^13.5.0",
|
|
@@ -85,7 +84,7 @@
|
|
|
85
84
|
"@types/react-highlight-words": "^0.16.4",
|
|
86
85
|
"@types/react-transition-group": "^4.4.5",
|
|
87
86
|
"autoprefixer": "^10.4.8",
|
|
88
|
-
"axios": "^
|
|
87
|
+
"axios": "^1.6.5",
|
|
89
88
|
"babel-plugin-named-exports-order": "^0.0.2",
|
|
90
89
|
"classnames": "^2.3.1",
|
|
91
90
|
"postcss": "^8.4.16",
|
|
@@ -102,7 +101,7 @@
|
|
|
102
101
|
"rollup-plugin-postcss": "^4.0.2",
|
|
103
102
|
"rollup-plugin-svg": "^2.0.0",
|
|
104
103
|
"sass": "^1.54.3",
|
|
105
|
-
"tailwindcss": "^3.1
|
|
104
|
+
"tailwindcss": "^3.4.1",
|
|
106
105
|
"typescript": "^4.7.4",
|
|
107
106
|
"web-vitals": "^2.1.4",
|
|
108
107
|
"webpack": "^5.74.0"
|
|
@@ -41,16 +41,16 @@ const SearchAutocomplete: FC<SearchAutocompleteProps> = (props) => {
|
|
|
41
41
|
tags.forEach((x, i) => {
|
|
42
42
|
x.classList.remove(
|
|
43
43
|
"autocomplete-selected",
|
|
44
|
-
"!bg-grey-100",
|
|
45
|
-
"!ring-blue-600"
|
|
44
|
+
"!sa-bg-grey-100",
|
|
45
|
+
"!sa-ring-blue-600"
|
|
46
46
|
);
|
|
47
47
|
if (i + 1 === selectedTag) {
|
|
48
48
|
x.classList.add(
|
|
49
49
|
"autocomplete-selected",
|
|
50
50
|
tags[i].classList.contains("autocomplete-tag")
|
|
51
|
-
? "!bg-grey-100"
|
|
52
|
-
: "none",
|
|
53
|
-
"!ring-blue-600"
|
|
51
|
+
? "!sa-bg-grey-100"
|
|
52
|
+
: "sa-none",
|
|
53
|
+
"!sa-ring-blue-600"
|
|
54
54
|
);
|
|
55
55
|
x.scrollIntoView({
|
|
56
56
|
behavior: "smooth",
|
|
@@ -208,19 +208,19 @@ const SearchAutocomplete: FC<SearchAutocompleteProps> = (props) => {
|
|
|
208
208
|
>
|
|
209
209
|
<form
|
|
210
210
|
action={`/search?q=${searchTerm}`}
|
|
211
|
-
className="flex font-sofia-pro"
|
|
211
|
+
className="sa-flex sa-font-sofia-pro"
|
|
212
212
|
autoComplete="off"
|
|
213
213
|
>
|
|
214
|
-
<label htmlFor="search" className="hidden">
|
|
214
|
+
<label htmlFor="search" className="sa-hidden">
|
|
215
215
|
{label}
|
|
216
216
|
</label>
|
|
217
|
-
<div className="relative flex flex-grow">
|
|
217
|
+
<div className="sa-relative sa-flex sa-flex-grow">
|
|
218
218
|
<DebounceInput
|
|
219
219
|
type="text"
|
|
220
220
|
name="q"
|
|
221
221
|
id="search"
|
|
222
222
|
placeholder={label}
|
|
223
|
-
className="flex-auto pr-0 items-stretch flex-grow text-night-sky-800 ring-0 py-0 shadow-none focus:ring-0 bg-white transition-colors border-opacity-100 hover:bg-grey-100 hover:border-grey-500 hover:border-opacity-50 focus:bg-grey-100 focus:border-blue-400 inline-block sm:text-sm border-grey-500 rounded-md rounded-tr-none rounded-br-none placeholder:text-gray-600"
|
|
223
|
+
className="sa-flex-auto sa-pr-0 sa-items-stretch sa-flex-grow sa-text-night-sky-800 sa-ring-0 sa-py-0 sa-shadow-none sa-focus:ring-0 sa-bg-white sa-transition-colors sa-border-opacity-100 sa-hover:bg-grey-100 sa-hover:border-grey-500 sa-hover:border-opacity-50 sa-focus:bg-grey-100 sa-focus:border-blue-400 sa-inline-block sm:sa-text-sm sa-border-grey-500 sa-rounded-md sa-rounded-tr-none sa-rounded-br-none sa-placeholder:text-gray-600"
|
|
224
224
|
debounceTimeout={300}
|
|
225
225
|
minLength={2}
|
|
226
226
|
value={searchTerm}
|
|
@@ -233,43 +233,43 @@ const SearchAutocomplete: FC<SearchAutocompleteProps> = (props) => {
|
|
|
233
233
|
{searchTerm !== "" && (
|
|
234
234
|
<button
|
|
235
235
|
type="button"
|
|
236
|
-
className="absolute right-3 top-[50%] -translate-y-[50%] text-night-sky-800 hover:text-blue-500 transition-colors !bg-[transparent] cursor-pointer"
|
|
236
|
+
className="sa-absolute sa-right-3 sa-top-[50%] -sa-translate-y-[50%] sa-text-night-sky-800 hover:sa-text-blue-500 sa-transition-colors !sa-bg-[transparent] sa-cursor-pointer"
|
|
237
237
|
onClick={clearSearch}
|
|
238
238
|
>
|
|
239
|
-
<CircleCloseIcon className="fill-night-sky-800 hover:fill-blue-500 h-4 w-4" />
|
|
239
|
+
<CircleCloseIcon className="sa-fill-night-sky-800 hover:sa-fill-blue-500 sa-h-4 sa-w-4" />
|
|
240
240
|
</button>
|
|
241
241
|
)}
|
|
242
242
|
</div>
|
|
243
243
|
<button
|
|
244
244
|
type="submit"
|
|
245
|
-
className="inline-flex transition-colors items-center justify-center px-4 h-[38px] font-medium rounded-md shadow-sm border border-blue-500 text-white bg-blue-500 hover:bg-blue-600 hover:border-blue-600 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-blue-500 sm:text-sm rounded-tl-none rounded-bl-none"
|
|
245
|
+
className="sa-inline-flex sa-transition-colors sa-items-center sa-justify-center sa-px-4 sa-h-[38px] sa-font-medium sa-rounded-md sa-shadow-sm sa-border sa-border-blue-500 sa-text-white sa-bg-blue-500 hover:sa-bg-blue-600 hover:sa-border-blue-600 focus:sa-outline-none focus:sa-ring-2 focus:sa-ring-offset-2 focus:sa-ring-blue-500 sm:sa-text-sm sa-rounded-tl-none sa-rounded-bl-none"
|
|
246
246
|
>
|
|
247
|
-
<SearchIcon className="fill-white h-4 w-4" />
|
|
247
|
+
<SearchIcon className="sa-fill-white sa-h-4 sa-w-4" />
|
|
248
248
|
</button>
|
|
249
249
|
</form>
|
|
250
|
-
<div className="relative">
|
|
250
|
+
<div className="sa-relative">
|
|
251
251
|
<CSSTransition
|
|
252
252
|
mountOnEnter
|
|
253
253
|
unmountOnExit
|
|
254
254
|
in={open}
|
|
255
255
|
timeout={300}
|
|
256
|
-
classNames="fade-slide"
|
|
256
|
+
classNames="sa-fade-slide"
|
|
257
257
|
data-testid="searchResults"
|
|
258
258
|
>
|
|
259
259
|
<div
|
|
260
260
|
className={classNames(
|
|
261
|
-
"search-results-container absolute top-0 left-1/2 -translate-x-1/2 mt-2 bg-white py-5 rounded-[1.25rem] z-50 shadow-lg border border-[#a6abbd] border-opacity-60 w-full tablet:w-[70vw] min-h-[8rem] overflow-hidden"
|
|
261
|
+
"search-results-container sa-absolute sa-top-0 sa-left-1/2 -sa-translate-x-1/2 sa-mt-2 sa-bg-white sa-py-5 sa-rounded-[1.25rem] sa-z-50 sa-shadow-lg sa-border border-[#a6abbd] sa-border-opacity-60 sa-w-full tablet:sa-w-[70vw] sa-min-h-[8rem] sa-overflow-hidden"
|
|
262
262
|
)}
|
|
263
263
|
>
|
|
264
264
|
<ErrorBoundary>
|
|
265
265
|
{loading && (
|
|
266
266
|
<Loader
|
|
267
267
|
data-testid="Loader"
|
|
268
|
-
className="absolute top-5 right-5"
|
|
268
|
+
className="sa-absolute sa-top-5 sa-right-5"
|
|
269
269
|
/>
|
|
270
270
|
)}
|
|
271
271
|
<div
|
|
272
|
-
className="px-6 h-full mb-12 max-h-[70vh] overflow-y-auto"
|
|
272
|
+
className="sa-px-6 sa-h-full sa-mb-12 sa-max-h-[70vh] sa-overflow-y-auto"
|
|
273
273
|
data-testid="Sections"
|
|
274
274
|
>
|
|
275
275
|
{hasError && (
|
|
@@ -289,13 +289,13 @@ const SearchAutocomplete: FC<SearchAutocompleteProps> = (props) => {
|
|
|
289
289
|
))}
|
|
290
290
|
</div>
|
|
291
291
|
</ErrorBoundary>
|
|
292
|
-
<div className="border-t border-[#a6abbd] border-opacity-60 flex items-center absolute bottom-0 left-0 w-full bg-white h-16">
|
|
292
|
+
<div className="sa-border-t sa-border-[#a6abbd] sa-border-opacity-60 sa-flex sa-items-center sa-absolute sa-bottom-0 sa-left-0 sa-w-full sa-bg-white sa-h-16">
|
|
293
293
|
<a
|
|
294
294
|
href={`/search?q=${searchTerm}`}
|
|
295
|
-
className="px-3 py-1 ml-6 flex items-center space-x-3 ring
|
|
295
|
+
className="sa-px-3 sa-py-1 sa-ml-6 sa-flex sa-items-center sa-space-x-3 sa-ring-1 sa-ring-offset-2 sa-ring-transparent sa-transition-colors sa-text-blue-500 hover:sa-text-blue-600 sa-rounded-lg autocomplete-custom-search"
|
|
296
296
|
>
|
|
297
|
-
<SearchIcon className="fill-blue-500 hover:fill-blue-600 h-4 w-4" />
|
|
298
|
-
<span className="font-semibold text-[1.125rem] ">
|
|
297
|
+
<SearchIcon className="sa-fill-blue-500 hover:sa-fill-blue-600 sa-h-4 sa-w-4" />
|
|
298
|
+
<span className="sa-font-semibold sa-text-[1.125rem] ">
|
|
299
299
|
{searchTerm === "" ? "Custom Search" : "View All Results"}
|
|
300
300
|
</span>
|
|
301
301
|
</a>
|
|
@@ -1,64 +1,64 @@
|
|
|
1
1
|
.SearchAutocompleteSection {
|
|
2
|
-
@apply font-sofia-pro mb-6;
|
|
2
|
+
@apply sa-font-sofia-pro sa-mb-6;
|
|
3
3
|
}
|
|
4
4
|
|
|
5
5
|
// Hide results over 5 on mobile
|
|
6
6
|
:global(.autocomplete-section a:nth-child(6)) {
|
|
7
|
-
@apply hidden tablet:inline-block;
|
|
7
|
+
@apply sa-hidden tablet:sa-inline-block;
|
|
8
8
|
}
|
|
9
9
|
|
|
10
10
|
:global(.autocomplete-section a:nth-child(7)) {
|
|
11
|
-
@apply hidden tablet:inline-block;
|
|
11
|
+
@apply sa-hidden tablet:sa-inline-block;
|
|
12
12
|
}
|
|
13
13
|
|
|
14
14
|
:global(.autocomplete-section a:nth-child(8)) {
|
|
15
|
-
@apply hidden tablet:inline-block;
|
|
15
|
+
@apply sa-hidden tablet:sa-inline-block;
|
|
16
16
|
}
|
|
17
17
|
|
|
18
18
|
:global(.autocomplete-section a:nth-child(9)) {
|
|
19
|
-
@apply hidden tablet:inline-block;
|
|
19
|
+
@apply sa-hidden tablet:sa-inline-block;
|
|
20
20
|
}
|
|
21
21
|
|
|
22
22
|
:global(.autocomplete-section a:nth-child(10)) {
|
|
23
|
-
@apply hidden tablet:inline-block;
|
|
23
|
+
@apply sa-hidden tablet:sa-inline-block;
|
|
24
24
|
}
|
|
25
25
|
|
|
26
26
|
:global(.autocomplete-section a:nth-child(11)) {
|
|
27
|
-
@apply hidden tablet:inline-block;
|
|
27
|
+
@apply sa-hidden tablet:sa-inline-block;
|
|
28
28
|
}
|
|
29
29
|
|
|
30
30
|
:global(.autocomplete-section a:nth-child(12)) {
|
|
31
|
-
@apply hidden tablet:inline-block;
|
|
31
|
+
@apply sa-hidden tablet:sa-inline-block;
|
|
32
32
|
}
|
|
33
33
|
|
|
34
34
|
:global(.autocomplete-section a:nth-child(13)) {
|
|
35
|
-
@apply hidden tablet:inline-block;
|
|
35
|
+
@apply sa-hidden tablet:sa-inline-block;
|
|
36
36
|
}
|
|
37
37
|
|
|
38
38
|
:global(.autocomplete-section a:nth-child(14)) {
|
|
39
|
-
@apply hidden tablet:inline-block;
|
|
39
|
+
@apply sa-hidden tablet:sa-inline-block;
|
|
40
40
|
}
|
|
41
41
|
|
|
42
42
|
:global(.autocomplete-section a:nth-child(15)) {
|
|
43
|
-
@apply hidden tablet:inline-block;
|
|
43
|
+
@apply sa-hidden tablet:sa-inline-block;
|
|
44
44
|
}
|
|
45
45
|
|
|
46
46
|
:global(.autocomplete-section a:nth-child(16)) {
|
|
47
|
-
@apply hidden tablet:inline-block;
|
|
47
|
+
@apply sa-hidden tablet:sa-inline-block;
|
|
48
48
|
}
|
|
49
49
|
|
|
50
50
|
:global(.autocomplete-section a:nth-child(17)) {
|
|
51
|
-
@apply hidden tablet:inline-block;
|
|
51
|
+
@apply sa-hidden tablet:sa-inline-block;
|
|
52
52
|
}
|
|
53
53
|
|
|
54
54
|
:global(.autocomplete-section a:nth-child(18)) {
|
|
55
|
-
@apply hidden tablet:inline-block;
|
|
55
|
+
@apply sa-hidden tablet:sa-inline-block;
|
|
56
56
|
}
|
|
57
57
|
|
|
58
58
|
:global(.autocomplete-section a:nth-child(19)) {
|
|
59
|
-
@apply hidden tablet:inline-block;
|
|
59
|
+
@apply sa-hidden tablet:sa-inline-block;
|
|
60
60
|
}
|
|
61
61
|
|
|
62
62
|
:global(.autocomplete-section a:nth-child(20)) {
|
|
63
|
-
@apply hidden tablet:inline-block;
|
|
63
|
+
@apply sa-hidden tablet:sa-inline-block;
|
|
64
64
|
}
|
|
@@ -39,18 +39,18 @@ const SearchAutocompleteSection: FC<SearchAutocompleteSectionProps> = (
|
|
|
39
39
|
data-testid="searchAutocompleteSection"
|
|
40
40
|
>
|
|
41
41
|
<h2
|
|
42
|
-
className="text-night-sky-800 mb-2 text-base"
|
|
42
|
+
className="sa-text-night-sky-800 sa-mb-2 sa-text-base"
|
|
43
43
|
data-testid="searchResultTitle"
|
|
44
44
|
>
|
|
45
45
|
{props.title}
|
|
46
46
|
</h2>
|
|
47
|
-
<div className="flow-root">
|
|
47
|
+
<div className="sa-flow-root">
|
|
48
48
|
<div
|
|
49
|
-
className="-m-1 flex flex-wrap autocomplete-section"
|
|
49
|
+
className="sa-m-1 sa-flex sa-flex-wrap autocomplete-section"
|
|
50
50
|
data-testid="searchTag"
|
|
51
51
|
>
|
|
52
52
|
{(props.results == null || props.results.length === 0) && (
|
|
53
|
-
<p className="pl-3">No results found</p>
|
|
53
|
+
<p className="sa-pl-3">No results found</p>
|
|
54
54
|
)}
|
|
55
55
|
{props.results &&
|
|
56
56
|
props.results!.length > 0 &&
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
.SearchAutocompleteTag {
|
|
2
|
-
@apply inline-block font-sofia-pro font-normal text-base leading-6 tracking-normal text-left transition-colors text-night-sky-800 bg-grey-50 hover:bg-grey-100 rounded-lg pt-2 pb-2 pl-3 pr-3 m-1 ring
|
|
2
|
+
@apply sa-inline-block sa-font-sofia-pro sa-font-normal sa-text-base sa-leading-6 sa-tracking-normal sa-text-left sa-transition-colors sa-text-night-sky-800 sa-bg-grey-50 hover:sa-bg-grey-100 sa-rounded-lg sa-pt-2 sa-pb-2 sa-pl-3 sa-pr-3 sa-m-1 sa-ring-1 sa-ring-offset-2 sa-ring-transparent;
|
|
3
3
|
}
|
|
4
4
|
:global(.highlighted-text) {
|
|
5
|
-
@apply font-semibold;
|
|
5
|
+
@apply sa-font-semibold;
|
|
6
6
|
}
|
package/src/index.css
CHANGED
|
@@ -302,19 +302,19 @@
|
|
|
302
302
|
|
|
303
303
|
/* Search Results Container Styles */
|
|
304
304
|
.fade-slide-enter {
|
|
305
|
-
@apply opacity-0 -translate-y-3 scale-95;
|
|
305
|
+
@apply sa-opacity-0 -sa-translate-y-3 sa-scale-95;
|
|
306
306
|
}
|
|
307
307
|
|
|
308
308
|
.fade-slide-enter-active,
|
|
309
309
|
.fade-slide-enter-done {
|
|
310
|
-
@apply opacity-100 transition-all duration-300 ease-out translate-y-0 scale-100;
|
|
310
|
+
@apply sa-opacity-100 sa-transition-all sa-duration-300 sa-ease-out sa-translate-y-0 sa-scale-100;
|
|
311
311
|
}
|
|
312
312
|
|
|
313
313
|
.fade-slide-exit {
|
|
314
|
-
@apply opacity-100 translate-y-0 scale-100;
|
|
314
|
+
@apply sa-opacity-100 sa-translate-y-0 sa-scale-100;
|
|
315
315
|
}
|
|
316
316
|
|
|
317
317
|
.fade-slide-exit-active,
|
|
318
318
|
.fade-slide-exit-done {
|
|
319
|
-
@apply opacity-0 transition-all duration-300 ease-out -translate-y-3 scale-95;
|
|
319
|
+
@apply sa-opacity-0 sa-transition-all sa-duration-300 sa-ease-out -sa-translate-y-3 sa-scale-95;
|
|
320
320
|
}
|
package/tailwind.config.js
CHANGED
|
@@ -2,6 +2,7 @@ const colors = require("tailwindcss/colors");
|
|
|
2
2
|
|
|
3
3
|
/** @type {import('tailwindcss').Config} */
|
|
4
4
|
module.exports = {
|
|
5
|
+
prefix: "sa-",
|
|
5
6
|
content: ["./src/**/*.{js,jsx,ts,tsx}"],
|
|
6
7
|
theme: {
|
|
7
8
|
screens: {
|
|
@@ -89,5 +90,5 @@ module.exports = {
|
|
|
89
90
|
},
|
|
90
91
|
},
|
|
91
92
|
},
|
|
92
|
-
plugins: [
|
|
93
|
+
plugins: [],
|
|
93
94
|
};
|