1 files changed, 98 insertions, 0 deletions
diff --git a/examples/react-fast-refresh-test/src/index.css b/examples/react-fast-refresh-test/src/index.css
new file mode 100644
index 000000000..c4514199c
--- /dev/null
+++ b/examples/react-fast-refresh-test/src/index.css
@@ -0,0 +1,98 @@
+@import "./colors.css";
+
+:root {
+  --heading-font: "Space Mono", system-ui;
+  --body-font: "IBM Plex Sans", system-ui;
+
+  --color-brand: #02ff00;
+  --color-brand-muted: rgb(2, 150, 0);
+
+  --padding-horizontal: 90px;
+
+  --page-background: black;
+  --page-background-alpha: rgba(0, 0, 0, 0.8);
+
+  --result__background-color: black;
+  --result__primary-color: var(--color-brand);
+  --result__foreground-color: white;
+  --result__muted-color: rgb(165, 165, 165);
+
+  --card-width: 352px;
+
+  --page-width: 1152px;
+
+  --snippets_container-background-unfocused: #171717;
+  --snippets_container-background-focused: #0017e9;
+  --snippets_container-background: var(
+    --snippets_container-background-unfocused
+  );
+  --snippets_container-muted-color: rgb(153, 153, 153);
+}
+
+body {
+  color: white;
+  margin: 0;
+
+  padding: 0;
+  font-family: var(--body-font);
+  background-color: var(--page-background);
+  color: var(--result__muted-color);
+  display: flex;
+  flex-direction: column;
+  height: 100%;
+}
+
+#reactroot,
+#__next,
+body,
+html {
+  height: 100%;
+}
+
+.RenderCounter {
+  border: 10px solid var(--snippets_container-background-focused);
+  margin: 10px;
+  padding: 10px;
+  animation: flash 0.2s linear;
+  animation-fill-mode: forwards;
+}
+
+.RenderCounter-meta {
+  display: flex;
+  flex-direction: row;
+  justify-content: space-between;
+  margin: -10px;
+  padding: 10px;
+  background-color: #111;
+}
+
+.RenderCounter-lastRender,
+.RenderCounter-title {
+  white-space: nowrap;
+  color: rgb(153, 153, 153);
+}
+
+@keyframes flash {
+  from {
+    border-color: var(--snippets_container-background-focused);
+  }
+
+  to {
+    border-color: var(--snippets_container-background-unfocused);
+  }
+}
+
+.Button {
+  display: block;
+
+  border: 1px solid rgb(20, 180, 0);
+  background-color: rgb(2, 150, 0);
+  color: white;
+  font-weight: 500;
+  padding: 10px 12px;
+  border-radius: 4px;
+  text-transform: uppercase;
+  text-align: center;
+  width: fit-content;
+  cursor: pointer;
+}