Skip to content

Commit 48c8cd0

Browse files
committed
Added buttons to dialog
Signed-off-by: Aryan Shah <aryanashah11@gmail.com>
1 parent 0dbaecd commit 48c8cd0

3 files changed

Lines changed: 20 additions & 20 deletions

File tree

src/sections/Projects/Sistent/components/dialog/code.js

Lines changed: 9 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -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>

src/sections/Projects/Sistent/components/dialog/guidance.js

Lines changed: 8 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -98,15 +98,15 @@ const DialogGuidance = () => {
9898
</p>
9999
<Row $Hcenter className="image-container">
100100
<SistentThemeProvider initialMode={isDark ? "dark" : "light"}>
101-
<Button onClick={() => setOpenBasic(true)}>Open Basic Dialog</Button>
101+
<Button variant="contained" onClick={() => setOpenBasic(true)}>Open Basic Dialog</Button>
102102
<Dialog open={openBasic} onClose={() => setOpenBasic(false)}>
103103
<DialogTitle>Confirm Action</DialogTitle>
104104
<DialogContent>
105105
Do you want to proceed with this action?
106106
</DialogContent>
107107
<DialogActions>
108-
<Button onClick={() => setOpenBasic(false)}>Cancel</Button>
109-
<Button color="primary" onClick={() => setOpenBasic(false)}>
108+
<Button variant="contained" onClick={() => setOpenBasic(false)}>Cancel</Button>
109+
<Button variant="contained" color="primary" onClick={() => setOpenBasic(false)}>
110110
Confirm
111111
</Button>
112112
</DialogActions>
@@ -124,7 +124,7 @@ const DialogGuidance = () => {
124124
</p>
125125
<Row $Hcenter className="image-container">
126126
<SistentThemeProvider initialMode={isDark ? "dark" : "light"}>
127-
<Button onClick={() => setOpenForm(true)}>Open Form Dialog</Button>
127+
<Button variant="contained" onClick={() => setOpenForm(true)}>Open Form Dialog</Button>
128128
<Dialog open={openForm} onClose={() => setOpenForm(false)}>
129129
<DialogTitle>Subscribe</DialogTitle>
130130
<DialogContent>
@@ -144,8 +144,8 @@ const DialogGuidance = () => {
144144
</div>
145145
</DialogContent>
146146
<DialogActions>
147-
<Button onClick={() => setOpenForm(false)}>Cancel</Button>
148-
<Button color="primary" onClick={() => setOpenForm(false)}>
147+
<Button variant="contained" onClick={() => setOpenForm(false)}>Cancel</Button>
148+
<Button variant="contained" color="primary" onClick={() => setOpenForm(false)}>
149149
Subscribe
150150
</Button>
151151
</DialogActions>
@@ -163,7 +163,7 @@ const DialogGuidance = () => {
163163
</p>
164164
<Row $Hcenter className="image-container">
165165
<SistentThemeProvider initialMode={isDark ? "dark" : "light"}>
166-
<Button onClick={() => setOpenFullScreen(true)}>Open Full-Screen Dialog</Button>
166+
<Button variant="contained" onClick={() => setOpenFullScreen(true)}>Open Full-Screen Dialog</Button>
167167
<Dialog
168168
open={openFullScreen}
169169
onClose={() => setOpenFullScreen(false)}
@@ -179,7 +179,7 @@ const DialogGuidance = () => {
179179
</DialogContent>
180180
<DialogActions>
181181
<Button onClick={() => setOpenFullScreen(false)}>Cancel</Button>
182-
<Button color="primary" onClick={() => setOpenFullScreen(false)}>
182+
<Button variant="contained" color="primary" onClick={() => setOpenFullScreen(false)}>
183183
Save
184184
</Button>
185185
</DialogActions>

src/sections/Projects/Sistent/components/dialog/index.js

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -85,15 +85,15 @@ const SistentDialog = () => {
8585
<br />
8686
<Row $Hcenter className="image-container">
8787
<SistentThemeProvider initialMode={isDark ? "dark" : "light"}>
88-
<Button onClick={handleOpen}>Open Dialog</Button>
88+
<Button variant="contained" onClick={handleOpen}>Open Dialog</Button>
8989
<Dialog open={open} onClose={handleClose}>
9090
<DialogTitle>Confirm Action</DialogTitle>
9191
<DialogContent>
9292
Do you want to proceed with this action?
9393
</DialogContent>
9494
<DialogActions>
95-
<Button onClick={handleClose}>Cancel</Button>
96-
<Button color="primary" onClick={handleClose}>
95+
<Button variant="contained" onClick={handleClose}>Cancel</Button>
96+
<Button variant="contained" color="primary" onClick={handleClose}>
9797
Confirm
9898
</Button>
9999
</DialogActions>

0 commit comments

Comments
 (0)