diff --git a/packages/redux-devtools-rtk-query-inspector-monitor/demo/public/index.html b/packages/redux-devtools-rtk-query-inspector-monitor/demo/public/index.html
index 89cf6a1d..ad9c2ff3 100644
--- a/packages/redux-devtools-rtk-query-inspector-monitor/demo/public/index.html
+++ b/packages/redux-devtools-rtk-query-inspector-monitor/demo/public/index.html
@@ -8,7 +8,7 @@
name="description"
content="Web site created using create-snowpack-app"
/>
-
(['bulbasaur']);
return (
-
-
-
-
-
+
+ RTK Query inspector monitor demo
+
+ Pokemon polling demo
+
+
+
+
- {pokemon.map((name, index) => (
-
- ))}
-
+
+ {pokemon.map((name, index) => (
+
+ ))}
+
+
+
+ Dock controls
+
+
+ {`toggleVisibilityKey="ctrl-h"\nchangePositionKey="ctrl-q"`}
+
+
+
+
+
);
}
diff --git a/packages/redux-devtools-rtk-query-inspector-monitor/demo/src/Pokemon.tsx b/packages/redux-devtools-rtk-query-inspector-monitor/demo/src/Pokemon.tsx
index 49c076c6..b809ba8b 100644
--- a/packages/redux-devtools-rtk-query-inspector-monitor/demo/src/Pokemon.tsx
+++ b/packages/redux-devtools-rtk-query-inspector-monitor/demo/src/Pokemon.tsx
@@ -28,9 +28,8 @@ export function Pokemon({ name }: { name: PokemonName }) {
return (
diff --git a/packages/redux-devtools-rtk-query-inspector-monitor/demo/src/index.css b/packages/redux-devtools-rtk-query-inspector-monitor/demo/src/index.css
index ec2585e8..6a611e5d 100644
--- a/packages/redux-devtools-rtk-query-inspector-monitor/demo/src/index.css
+++ b/packages/redux-devtools-rtk-query-inspector-monitor/demo/src/index.css
@@ -11,3 +11,53 @@ code {
font-family: source-code-pro, Menlo, Monaco, Consolas, 'Courier New',
monospace;
}
+
+h1 {
+ font-size: 1.4em;
+}
+
+h2 {
+ font-size: 1.2em;
+}
+
+h1,
+h2,
+h3,
+h4,
+h5,
+h6 {
+ text-align: left;
+ font-family: inherit;
+ padding: 0.5em;
+ margin: 0;
+}
+
+.demo-toolbar {
+ display: flex;
+ padding: 1em;
+ justify-content: flex-start;
+}
+
+section {
+ display: block;
+}
+
+.pokemon-list {
+ display: flex;
+ max-width: 80vw;
+ flex-flow: row wrap;
+ overflow-x: hidden;
+}
+
+.pokemon {
+ padding: 0.2em;
+ text-align: center;
+}
+
+pre code {
+ white-space: pre-wrap;
+}
+
+article {
+ padding: 0.4em;
+}
diff --git a/packages/redux-devtools-rtk-query-inspector-monitor/demo/src/index.tsx b/packages/redux-devtools-rtk-query-inspector-monitor/demo/src/index.tsx
index ee93252d..7c48f576 100644
--- a/packages/redux-devtools-rtk-query-inspector-monitor/demo/src/index.tsx
+++ b/packages/redux-devtools-rtk-query-inspector-monitor/demo/src/index.tsx
@@ -2,6 +2,7 @@ import React from 'react';
import ReactDOM from 'react-dom';
import { Provider } from 'react-redux';
import App from './App';
+import './index.css';
import { store } from './store';
import DevTools from './DevTools';