mirror of
https://github.com/oven-sh/bun
synced 2026-02-09 18:38:55 +00:00
9388b3f825
* Add a zig fmt action * add failing file * Setup prettier better * Update prettier-fmt.yml * Fail on error * Update prettier-fmt.yml * boop * boop2 * tar.gz * Update zig-fmt.yml * Update zig-fmt.yml * Update zig-fmt.yml * Update zig-fmt.yml * Update zig-fmt.yml * boop * Update prettier-fmt.yml * tag * newlines * multiline * fixup * Update zig-fmt.yml * update it * fixup * both * w * Update prettier-fmt.yml * prettier all the things * Update package.json * zig fmt * ❌ ✅ * bump * . * quotes * fix prettier ignore * once more * Update prettier-fmt.yml * Update fallback.ts * consistentcy --------- Co-authored-by: Jarred Sumner <709451+Jarred-Sumner@users.noreply.github.com>
63 lines
1.9 KiB
TypeScript
63 lines
1.9 KiB
TypeScript
import React from "react";
|
|
|
|
export const Main = ({ productName }) => {
|
|
return (
|
|
<>
|
|
<header>
|
|
<div className="Title">CSS HMR Stress Test</div>
|
|
<p className="Description">
|
|
This page visually tests how quickly a bundler can update CSS over Hot Module Reloading.
|
|
</p>
|
|
</header>
|
|
<main className="main">
|
|
<section className="ProgressSection">
|
|
<p className="Subtitle">
|
|
<span className="Subtitle-part">
|
|
Ran: <span className="timer"></span>
|
|
</span>
|
|
</p>
|
|
|
|
<div className="ProgressBar-container">
|
|
<div className="ProgressBar"></div>
|
|
</div>
|
|
<div className="SectionLabel">The progress bar should move from left to right smoothly.</div>
|
|
</section>
|
|
|
|
<section>
|
|
<div className="Spinners">
|
|
<div className="Spinner-container Spinner-1">
|
|
<div className="Spinner"></div>
|
|
</div>
|
|
|
|
<div className="Spinner-container Spinner-2">
|
|
<div className="Spinner"></div>
|
|
</div>
|
|
|
|
<div className="Spinner-container Spinner-3">
|
|
<div className="Spinner"></div>
|
|
</div>
|
|
|
|
<div className="Spinner-container Spinner-4">
|
|
<div className="Spinner"></div>
|
|
</div>
|
|
</div>
|
|
<div className="SectionLabel">The spinners should rotate & change color smoothly.</div>
|
|
</section>
|
|
</main>
|
|
<footer>
|
|
<div className="SectionLabel FooterLabel">There are no CSS animations on this page.</div>
|
|
|
|
<div className="Bundler-container">
|
|
<div className="Bundler">{productName}</div>
|
|
<div className="Bundler-updateRate">
|
|
Saving a css file every
|
|
<span className="highlight">
|
|
<span className="interval"></span>ms
|
|
</span>
|
|
</div>
|
|
</div>
|
|
</footer>
|
|
</>
|
|
);
|
|
};
|