diff --git a/assets/fl-query-logo.svg b/assets/fl-query-logo.svg index a9367c1..e6fea07 100644 --- a/assets/fl-query-logo.svg +++ b/assets/fl-query-logo.svg @@ -24,9 +24,9 @@ inkscape:deskcolor="#d1d1d1" inkscape:document-units="mm" showgrid="false" - inkscape:zoom="0.4788028" + inkscape:zoom="0.1197007" inkscape:cx="401.00016" - inkscape:cy="536.75542" + inkscape:cy="534.66688" inkscape:window-width="1280" inkscape:window-height="955" inkscape:window-x="0" @@ -60,13 +60,13 @@ cy="130.65985" rx="58.309181" ry="59.124962" />>; + Svg?: React.ComponentType>; + Png?: string; description: JSX.Element; }; const FeatureList: FeatureItem[] = [ { title: 'No boilerplate & high code reusability', - Svg: require('@site/static/img/undraw_docusaurus_mountain.svg').default, + Png: 'img/no_boilerplate_code.png', description: ( <> Fl-Query is designed to be less cluttering + reusable and lets you focus on only the logic you actually want to implement without handling hazard of cached data management @@ -20,7 +21,7 @@ const FeatureList: FeatureItem[] = [ }, { title: 'Declarative & Easy to use', - Svg: require('@site/static/img/undraw_docusaurus_tree.svg').default, + Svg: require('@site/static/img/declarative_ui_icon.svg').default, description: ( <> Define your logic once and distribute it thousand times. By using Fl-Query you never have to write the same logic twice. It has an easy to understand API that you can learn in only 2-4 hours @@ -29,7 +30,7 @@ const FeatureList: FeatureItem[] = [ }, { title: 'Optimistic data with smart refetching', - Svg: require('@site/static/img/undraw_docusaurus_react.svg').default, + Svg: require('@site/static/img/optimistic_data.svg').default, description: ( <> The days of Loading Screen is over. Fetch and update your data transparently without disturbing the user with a Loading Indicator. Update your Data even before a data updates on the server and after finally getting the actual data, replace the predicted data with the real one @@ -38,11 +39,12 @@ const FeatureList: FeatureItem[] = [ }, ]; -function Feature({ title, Svg, description }: FeatureItem) { +function Feature({ title, Svg, description, Png }: FeatureItem) { return (
- + {Svg && } + {Png && }

{title}

diff --git a/docs/src/pages/index.tsx b/docs/src/pages/index.tsx index 23e5efc..2b6b223 100644 --- a/docs/src/pages/index.tsx +++ b/docs/src/pages/index.tsx @@ -8,9 +8,9 @@ import { FiGithub } from "react-icons/fi" function HomepageHeader() { const { siteConfig } = useDocusaurusContext(); return ( -
+

- + {siteConfig.title}

{siteConfig.tagline}

@@ -36,7 +36,7 @@ export default function Home(): JSX.Element { const { siteConfig } = useDocusaurusContext(); return (
diff --git a/docs/static/img/declarative_ui_icon.svg b/docs/static/img/declarative_ui_icon.svg new file mode 100644 index 0000000..5d77cbf --- /dev/null +++ b/docs/static/img/declarative_ui_icon.svg @@ -0,0 +1,159 @@ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/docs/static/img/favicon.ico b/docs/static/img/favicon.ico index c01d54b..7ee0c88 100644 Binary files a/docs/static/img/favicon.ico and b/docs/static/img/favicon.ico differ diff --git a/docs/static/img/logo.svg b/docs/static/img/logo.svg index 15f2231..e6fea07 100644 --- a/docs/static/img/logo.svg +++ b/docs/static/img/logo.svg @@ -2,9 +2,9 @@