@@ -76,13 +76,13 @@ const DialogCode = () => {
7676 < div className = "main-content" >
7777 < p > Here is a live example of the Dialog component in action:</ p >
7878 < SistentThemeProvider initialMode = { isDark ? "dark" : "light" } >
79- < Button onClick = { handleOpen } > Open Dialog</ Button >
79+ < Button variant = "contained" onClick = { handleOpen } > Open Dialog</ Button >
8080 < Dialog open = { open } onClose = { handleClose } >
8181 < DialogTitle > Confirm Action</ DialogTitle >
8282 < DialogContent > Do you want to proceed with this action?</ DialogContent >
8383 < DialogActions >
84- < Button onClick = { handleClose } > Cancel</ Button >
85- < Button color = "primary" onClick = { handleClose } > Confirm</ Button >
84+ < Button variant = "contained" onClick = { handleClose } > Cancel</ Button >
85+ < Button variant = "contained" color = "primary" onClick = { handleClose } > Confirm</ Button >
8686 </ DialogActions >
8787 </ Dialog >
8888 </ SistentThemeProvider >
@@ -93,7 +93,7 @@ const DialogCode = () => {
9393 { /* Full Screen Dialog */ }
9494 < h3 style = { { marginTop : "3rem" } } > Full-Screen Dialog Example</ h3 >
9595 < SistentThemeProvider initialMode = { isDark ? "dark" : "light" } >
96- < Button onClick = { ( ) => setOpenFull ( true ) } > Open Full-Screen Dialog</ Button >
96+ < Button variant = "contained" onClick = { ( ) => setOpenFull ( true ) } > Open Full-Screen Dialog</ Button >
9797 < Dialog
9898 open = { openFull }
9999 onClose = { ( ) => setOpenFull ( false ) }
@@ -104,16 +104,16 @@ const DialogCode = () => {
104104 < p > This dialog stretches to full screen. Use it when the user's full attention is needed.</ p >
105105 </ DialogContent >
106106 < DialogActions >
107- < Button onClick = { ( ) => setOpenFull ( false ) } > Cancel</ Button >
108- < Button color = "primary" onClick = { ( ) => setOpenFull ( false ) } > Save</ Button >
107+ < Button variant = "contained" onClick = { ( ) => setOpenFull ( false ) } > Cancel</ Button >
108+ < Button variant = "contained" color = "primary" onClick = { ( ) => setOpenFull ( false ) } > Save</ Button >
109109 </ DialogActions >
110110 </ Dialog >
111111 </ SistentThemeProvider >
112112
113113 { /* Form Inside Dialog */ }
114114 < h3 style = { { marginTop : "3rem" } } > Dialog with Form Example</ h3 >
115115 < SistentThemeProvider initialMode = { isDark ? "dark" : "light" } >
116- < Button onClick = { ( ) => setOpenForm ( true ) } > Open Form Dialog</ Button >
116+ < Button variant = "contained" onClick = { ( ) => setOpenForm ( true ) } > Open Form Dialog</ Button >
117117 < Dialog open = { openForm } onClose = { ( ) => setOpenForm ( false ) } >
118118 < DialogTitle > Subscribe</ DialogTitle >
119119 < DialogContent >
@@ -129,8 +129,8 @@ const DialogCode = () => {
129129 </ form >
130130 </ DialogContent >
131131 < DialogActions >
132- < Button onClick = { ( ) => setOpenForm ( false ) } > Cancel</ Button >
133- < Button color = "primary" onClick = { ( ) => setOpenForm ( false ) } > Subscribe</ Button >
132+ < Button variant = "contained" onClick = { ( ) => setOpenForm ( false ) } > Cancel</ Button >
133+ < Button variant = "contained" color = "primary" onClick = { ( ) => setOpenForm ( false ) } > Subscribe</ Button >
134134 </ DialogActions >
135135 </ Dialog >
136136 </ SistentThemeProvider >
0 commit comments