CHANGED: README

app/components/buttons.tsx

@@ -12,9 +12,24 @@ export default function Buttons() {
     );
 
     return (
-        <div className={'m3 m3-wrapper'}>
+        <div
+            style={{
+                display: 'flex',
+                flexDirection: 'column',
+                alignItems: 'center',
+                justifyContent: 'center',
+            }}
+        >
             <h1> Buttons </h1>
-            <div style={{ display: 'flex', flexDirection: 'row', gap: '2em' }}>
+            <div
+                style={{
+                    display: 'flex',
+                    flexDirection: 'row',
+                    gap: '2em',
+                    width: '100%',
+                    height: '100%',
+                }}
+            >
                 <div>
                     <h2> Default buttons </h2>
                     <div
@@ -30,7 +45,7 @@ export default function Buttons() {
                             onClick={callback}
                             variant={'filled'}
                         >
-                            Label + {state}
+                            Label
                         </Button>
                         <Button variant={'outlined'}>Label</Button>
                         <Button variant={'tonal'}>Label</Button>

app/components/icon-buttons.tsx

@@ -5,7 +5,14 @@ import { IconButton } from '../../src/primitive-components/components';
 
 function IconButtons() {
     return (
-        <div className={'m3 m3-wrapper'}>
+        <div
+            style={{
+                display: 'flex',
+                flexDirection: 'column',
+                alignItems: 'center',
+                justifyContent: 'center',
+            }}
+        >
             <h1> Icon buttons </h1>
             <div style={{ display: 'flex', flexDirection: 'row', gap: '2em' }}>
                 <div>