diff options
| author |  Jonathan Neal <jonathantneal@hotmail.com>
| 2021-12-22 16:11:05 -0500 |
|---|---|---|
| committer |  GitHub <noreply@github.com>
| 2021-12-22 16:11:05 -0500 |
| commit | 6ddd7678ffb6598ae6e263706813cb5e94535f02 (patch) | |
| tree | d4b45f7590b59c3574bd6593b17d8066f71007c6 /examples/framework-react/src | |
| parent | 305ce4182fbe89abcfb88008ddce178bd8863b6a (diff) | |
| download | astro-6ddd7678ffb6598ae6e263706813cb5e94535f02.tar.gz astro-6ddd7678ffb6598ae6e263706813cb5e94535f02.tar.zst astro-6ddd7678ffb6598ae6e263706813cb5e94535f02.zip | |
Use accessible indentation (#2253)
Diffstat (limited to 'examples/framework-react/src')
| -rw-r--r-- | examples/framework-react/src/components/Counter.css | 12 | ||||
| -rw-r--r-- | examples/framework-react/src/components/Counter.jsx | 26 | ||||
| -rw-r--r-- | examples/framework-react/src/pages/index.astro | 51 |
3 files changed, 45 insertions, 44 deletions
diff --git a/examples/framework-react/src/components/Counter.css b/examples/framework-react/src/components/Counter.css index 5d3de4803..fb21044d7 100644 --- a/examples/framework-react/src/components/Counter.css +++ b/examples/framework-react/src/components/Counter.css @@ -1,11 +1,11 @@ .counter { - display: grid; - font-size: 2em; - grid-template-columns: repeat(3, minmax(0, 1fr)); - margin-top: 2em; - place-items: center; + display: grid; + font-size: 2em; + grid-template-columns: repeat(3, minmax(0, 1fr)); + margin-top: 2em; + place-items: center; } .counter-message { - text-align: center; + text-align: center; } diff --git a/examples/framework-react/src/components/Counter.jsx b/examples/framework-react/src/components/Counter.jsx index e222d680f..97ddf34c7 100644 --- a/examples/framework-react/src/components/Counter.jsx +++ b/examples/framework-react/src/components/Counter.jsx @@ -2,18 +2,18 @@ import React, { useState } from 'react'; import './Counter.css'; export default function Counter({ children, count: initialCount }) { - const [count, setCount] = useState(initialCount); - const add = () => setCount((i) => i + 1); - const subtract = () => setCount((i) => i - 1); + const [count, setCount] = useState(initialCount); + const add = () => setCount((i) => i + 1); + const subtract = () => setCount((i) => i - 1); - return ( - <> - <div className="counter"> - <button onClick={subtract}>-</button> - <pre>{count}</pre> - <button onClick={add}>+</button> - </div> - <div className="counter-message">{children}</div> - </> - ); + return ( + <> + <div className="counter"> + <button onClick={subtract}>-</button> + <pre>{count}</pre> + <button onClick={add}>+</button> + </div> + <div className="counter-message">{children}</div> + </> + ); } diff --git a/examples/framework-react/src/pages/index.astro b/examples/framework-react/src/pages/index.astro index dd2950782..39a15a797 100644 --- a/examples/framework-react/src/pages/index.astro +++ b/examples/framework-react/src/pages/index.astro @@ -1,34 +1,35 @@ --- // Component Imports -import Counter from '../components/Counter.jsx' +import Counter from '../components/Counter.jsx'; const someProps = { - count: 0, -} + count: 0, +}; // Full Astro Component Syntax: // https://docs.astro.build/core-concepts/astro-components/ --- + <html lang="en"> - <head> - <meta charset="utf-8" /> - <meta name="viewport" content="width=device-width" /> - <link rel="icon" type="image/x-icon" href="/favicon.ico" /> - <style> - html, - body { - font-family: system-ui; - margin: 0; - } - body { - padding: 2rem; - } - </style> - </head> - <body> - <main> - <Counter {...someProps} client:visible> - <h1>Hello, React!</h1> - </Counter> - </main> - </body> + <head> + <meta charset="utf-8" /> + <meta name="viewport" content="width=device-width" /> + <link rel="icon" type="image/x-icon" href="/favicon.ico" /> + <style> + html, + body { + font-family: system-ui; + margin: 0; + } + body { + padding: 2rem; + } + </style> + </head> + <body> + <main> + <Counter {...someProps} client:visible> + <h1>Hello, React!</h1> + </Counter> + </main> + </body> </html> |