diff --git a/frontend/src/pages/Admin/Admin.jsx b/frontend/src/pages/Admin/Admin.jsx
index 545841ac..312af9f5 100644
--- a/frontend/src/pages/Admin/Admin.jsx
+++ b/frontend/src/pages/Admin/Admin.jsx
@@ -258,7 +258,7 @@ export const Admin = (props) => {
           ) : tab === 15 ? (
             <ResetPassword />
           ) : tab === 16 ? (
-            <ManageBroadcasts theme={props.theme}/>
+            <ManageBroadcasts />
           ) : tab === 18 ? (
             <QandA setQId={setQId} setTab={setTab} tab={tab} />
           ) : tab === 19 ? (
diff --git a/frontend/src/pages/Admin/Components/Broadcast/ManageBroadcasts/ManageBroadcasts.jsx b/frontend/src/pages/Admin/Components/Broadcast/ManageBroadcasts/ManageBroadcasts.jsx
index aa607a13..cc597290 100644
--- a/frontend/src/pages/Admin/Components/Broadcast/ManageBroadcasts/ManageBroadcasts.jsx
+++ b/frontend/src/pages/Admin/Components/Broadcast/ManageBroadcasts/ManageBroadcasts.jsx
@@ -10,7 +10,7 @@ import Loader from "../../../../../components/util/Loader";
 import { Button4 } from "../../../../../components/util/Button";
 import { customBoardcast } from "../../../../../service/Broadcast.jsx";
 
-export function ManageBroadcasts(props) {
+export function ManageBroadcasts() {
   const [array, setArray] = useState([]);
   const [index, setIndex] = useState(0);
   const [visible, setVisible] = useState(false);
@@ -86,7 +86,6 @@ export function ManageBroadcasts(props) {
     setArray(result);
     setLoaded(true);
   }
-  const { theme } = props;
   return (
     <div>
       <Edit
@@ -94,7 +93,6 @@ export function ManageBroadcasts(props) {
         setVisible={setVisible}
         handleChange={handleChange}
         data={array[index]}
-        theme={theme}
       />
       <div id={style["hero"]}>
         <div className={style["motive"]}>
diff --git a/frontend/src/pages/Broadcast/Component/AllBroadcasts/Edit/Edit.jsx b/frontend/src/pages/Broadcast/Component/AllBroadcasts/Edit/Edit.jsx
index c63c006a..2083b5c2 100644
--- a/frontend/src/pages/Broadcast/Component/AllBroadcasts/Edit/Edit.jsx
+++ b/frontend/src/pages/Broadcast/Component/AllBroadcasts/Edit/Edit.jsx
@@ -1,166 +1,83 @@
-import React, { useState } from "react";
+import React, { useEffect, useState } from "react";
 import style from "./edit.module.scss";
-import { Button2 } from "../../../../../components/util/Button/index";
-import SunEditor from "suneditor-react";
-import "suneditor/dist/css/suneditor.min.css";
-import { SimpleToast } from "../../../../../components/util/Toast";
-import { UpdateBoardCast } from "../../../../../service/Broadcast.jsx";
+import { TextField } from "@material-ui/core";
+import CloseIcon from "@material-ui/icons/Close";
 
 export function Edit(props) {
-  const [toast, setToast] = useState({
-    toastStatus: false,
-    toastType: "",
-    toastMessage: "",
-  });
+  const [a, seta] = useState();
+  function scrolls() {
+    let b = window.scrollY;
+    seta(b);
+  }
+  useEffect(() => {
+    window.addEventListener("scroll", scrolls);
+  }, []);
 
-  const handleCloseToast = (event, reason) => {
-    if (reason === "clickaway") {
-      return;
-    }
-    setToast({ ...toast, toastStatus: false });
-    props.setVisible(false);
-  };
-
-  const handleInputChange = (e) => {
-    const { name, value } = e.target;
-    props.handleChange({ target: { name, value } });
-  };
-
-  const handleContentChange = (content) => {
-    props.handleChange({ target: { name: 'content', value: content } });
-  };
-
-  const handleSubmit = async (e) => {
-    e.preventDefault();
-    const { data } = props;
-    const newData = {
-      id: data._id,
-      content:data.content,
-      link: data.link,
-      expiresOn: data.expiresOn,
-      imageUrl: data.imageUrl,
-      tags: data.tags,
-      isApproved: data.isApproved,
-      title: data.title,
-    };
-
-   try {
-      await UpdateBoardCast(newData,setToast, toast);
-      setToast({
-        toastStatus: true,
-        toastType: "success",
-        toastMessage: "Broadcast updated successfully!",
-      });
-    } catch (error) {
-      console.error("Error updating broadcast:", error);
-      setToast({
-        toastStatus: true,
-        toastType: "error",
-        toastMessage: "Failed to update broadcast. Please try again.",
-      });
-    }
-  };
-
-  const { visible, data} = props;
   let dark = props.theme;
-
-  return visible ? (
-    <div className={style["popup"]}>
-      <div  className={
-            dark
-              ? `${style["card"]} ${style["card-dark"]} `
-              : `${style["card"]} ${style["card-light"]}`
-          }>
-        <form className={style["editor"]} onSubmit={handleSubmit}>
-          <div className={style["motive"]}>
-            <h1 className={
-              dark
-                ? `${style["header-text"]} ${style["header-text-dark"]} `
-                : `${style["header-text"]} ${style["header-text-light"]}`
-            }>Edit Broadcast</h1>
-            <div className={
-                  dark 
-                    ? `${style.dash} ${style["dash-dark"]}` 
-                    : `${style.dash} ${style["dash-light"]}`
-            } />
-          </div>
-          <div>
-            <div className={
-                  dark
-                    ? `${style["input"]} ${style["input-dark"]} `
-                    : `${style["input"]} ${style["input-light"]}`
-                }>
-              <input
-                type="text"
-                name="title"
-                // className={style["form-control-input"]}
-                placeholder="Title"
-                value={data.title}
-                onChange={handleInputChange}
-              />
-              <i className="fas fa-pencil-alt" />
-            </div>
-          </div>
-          <div>
-            <div className={
-                  dark
-                    ? `${style["input"]} ${style["input-dark"]} `
-                    : `${style["input"]} ${style["input-light"]}`
-                }>
-              <SunEditor
-                name="content"
-                placeholder="Description"
-                setContents={data.content}
-                onChange={handleContentChange} 
-                height="100px"
-                className={style["edit"]}
-                onSetContents={(content) =>
-                  handleInputChange({ target: { name: "content", value: content } })
-                }
-              />
-            </div>
-          </div>
-          <div>
-            <div className={
-                  dark
-                    ? `${style["input"]} ${style["input-dark"]} `
-                    : `${style["input"]} ${style["input-light"]}`
-                }>
-              <input
-                type="text"
-                name="link"
-                placeholder="Resource Link"
-                value={data.link}
-                onChange={handleInputChange}
-              />
-              <i className="fas fa-link" />
-            </div>
+  return props.visible ? (
+    <div className={style["popup"]} style={{ top: a }}>
+      <div className={dark ? style["div-dark"] : style["div"]}>
+        <h1 className={style["heading"]}>
+          Edit modal
+          <CloseIcon
+            style={{ float: "right", cursor: "pointer" }}
+            onClick={() => props.setVisible(false)}
+          />
+        </h1>
+        <form>
+          <div className={style["form"]}>
+            <h5>Title:</h5>
+            <TextField
+              type="text"
+              name="title"
+              placeholder="Title"
+              multiline
+              value={props.data.title}
+              className={style["input"]}
+              InputProps={{
+                className: `${dark ? style["input-dark"] : ""}`,
+              }}
+              onChange={props.handleChange}
+            />
           </div>
-          <div className={style["submit-btn"]}>
-            <Button2
-              className={style["submit-btn-text"]}
-              label="Update"
-              type="submit"
+          <div className={style.form}>
+            <h5>Description:</h5>
+            <TextField
+              type="text"
+              name="desc"
+              multiline
+              placeholder="Description"
+              value={props.data.desc}
+              className={style["input"]}
+              InputProps={{
+                className: `${dark ? style["input-dark"] : ""}`,
+              }}
+              onChange={props.handleChange}
             />
-            <Button2
-              className={style["submit-btn-text"]}
-              label="Cancel"
-              type="button"
-              onClick={() => props.setVisible(false)}
+          </div>
+          <div className={style.form}>
+            <h5>Link:</h5>
+            <TextField
+              type="text"
+              name="link"
+              placeholder="Link"
+              className={style["input"]}
+              InputProps={{
+                className: `${dark ? style["input-dark"] : ""}`,
+              }}
+              onChange={props.handleChange}
+              value={props.data.link}
+              multiline
             />
           </div>
+          <button
+            className={style["btns1"]}
+            onClick={() => props.setVisible(false)}
+          >
+            Edit
+          </button>
         </form>
       </div>
-      {toast.toastStatus && (
-        <div className={style["toast-overlay"]}>
-          <SimpleToast
-            open={toast.toastStatus}
-            message={toast.toastMessage}
-            handleCloseToast={handleCloseToast}
-            severity={toast.toastType}
-          />
-        </div>
-      )}
     </div>
   ) : null;
-}
\ No newline at end of file
+}
diff --git a/frontend/src/pages/Broadcast/Component/AllBroadcasts/Edit/edit.module.scss b/frontend/src/pages/Broadcast/Component/AllBroadcasts/Edit/edit.module.scss
index ca7eaeff..a1a39a74 100644
--- a/frontend/src/pages/Broadcast/Component/AllBroadcasts/Edit/edit.module.scss
+++ b/frontend/src/pages/Broadcast/Component/AllBroadcasts/Edit/edit.module.scss
@@ -1,388 +1,90 @@
 .popup {
-  position: fixed;
-  top: 0;
-  left: 0;
+  position: absolute;
+  background: rgba(0, 0, 0, 0.2);
   width: 100%;
+  left: 0;
   height: 100%;
-  background-color: rgba(0, 0, 0, 0.5);
-  backdrop-filter: blur(5px);
   display: flex;
   justify-content: center;
   align-items: center;
   z-index: 1000;
 }
 
-.editor {
-  padding: 20px;
-  overflow-x: hidden;
-}
-
-.error {
-  color: red;
-  font-size: 12px;
-  margin-top: 5px;
+.input-dark {
+  color: whitesmoke !important;
 }
 
-.motive {
-  display: flex;
-  flex-direction: column;
-  justify-content: center;
-  align-items: center;
-  margin-bottom: 20px;
-}
-
-.edit {
-  padding: 20px;
-  border: 1px solid #bbbaba;
-  border-radius: 10px;
-  background-color: #f1f1f1;
-  box-shadow: inset 2px 2px 5px #888888, inset -2px -2px 5px #ffffff;
-  position: fixed;
-}
-
-.dash {
-  width: 200px;
-  height: 5px;
-  border-radius: 20px;
-  margin-bottom: 10px;
-  background: rgb(255, 0, 90);
-  background: linear-gradient(
-    45deg,
-    rgba(255, 0, 90, 1) 0%,
-    rgba(10, 24, 61, 1) 90%
-  );
-}
-
-.dash-light {
-  background: rgb(255, 0, 90);
-  background: linear-gradient(
-    45deg,
-    rgba(255, 0, 90, 1) 0%,
-    rgba(10, 24, 61, 1) 90%
-  );
-}
-
-.dash-dark {
-  background: #2b5876;
-  background: linear-gradient(45deg, #2b5876 0%, #4e4376 90%);
-}
-
-.submit-btn {
-  display: flex;
-  justify-content: center;
-  align-items: center;
-  margin: 20px auto 0 auto;
-  width: 30%;
-}
-
-.submit-btn-text {
-  display: flex;
-  justify-content: center;
-  align-items: center;
-}
-
-@media screen and (max-width: 750px) {
-  .card {
-    width: 80%; 
-    max-width: 600px;
+.div {
+  width: 40%;
+  border-radius: 8px;
+  background: white;
+  padding: 1em;
+  @media (max-width: 600px) {
+    width: 95%;
+  }
+  h1 {
+    width: 100%;
+    font-size: 17px;
+    margin: 0;
+    text-align: center;
   }
-}
-
-.toast-overlay {
-  position: absolute;
-  top: 0;
-  left: 0;
-  right: 0;
-  bottom: 0;
-  background-color: transparent;
-  z-index: 1000;
-  display: flex;
-  align-items: center;
-  justify-content: center;
-}
-
-.card {
-  width: 60%; 
-  height: auto;
-  background-color: #e7e7e7;
-  margin: 0 auto;
-  padding-bottom: 20px;
-  border-radius: 30px;
-}
-
-.card-light {
-  background-color: #e7e7e7;
-  // box-shadow: 5px 5px 15px #888888, -5px -5px 15px #ffffff;
-}
-
-// for dark theme
-.card-dark {
-  color: whitesmoke;
-  background-color: #282c35;
-  -webkit-box-shadow: 0px 8px 16px 0px rgba(72, 127, 255, 0.1),
-    0px -8px 16px 0px rgba(72, 127, 255, 0.1);
-  -moz-box-shadow: 0px 8px 16px 0px rgba(72, 127, 255, 0.1),
-    0px -8px 16px 0px rgba(72, 127, 255, 0.1);
-  box-shadow: 0px 8px 16px 0px rgba(72, 127, 255, 0.1),
-    0px -8px 16px 0px rgba(72, 127, 255, 0.1);
-}
-
-
-.header-text {
-  font-size: 30px;
-  text-align: center;
-  text-transform: capitalize;
-}
-
-// for dark theme
-.header-text-dark {
-  color: #69a9dd;
-}
-
-.header-text-light {
-  color: var(--secondary-color);
-}
-
-.input {
-  position: relative;
-  margin-bottom: 8px;
-}
-
-.input input,
-.input textarea,
-.input1 select {
-  width: 100%;
-  height: 50px;
-  border-radius: 5px;
-  padding: 0 25px;
-  margin-left: auto;
-  margin-right: auto;
-}
-
-.input-light input,
-.input-light textarea,
-.input1-light select {
-  border: 1px solid #bbbaba;
-  color: #777777;
-  background-color: #f1f1f1;
-  box-shadow: inset 2px 2px 5px #888888, inset -2px -2px 5px #ffffff;
-}
-
-// for dark theme
-.input-dark input,
-.input-dark textarea,
-.input1-dark select {
-  border: 1px solid #414a4c;
-  color: whitesmoke;
-  background-color: #333333;
-  box-shadow: inset 2px 2px 5px rgba(72, 127, 255, 0.1),
-    inset -2px -2px 5px rgba(72, 127, 255, 0.4);
-}
-
-.input input::placeholder,
-.input textarea::placeholder {
-  opacity: 1;
-  color: #777777;
-}
-
-// for dark theme
-.input-dark input::placeholder,
-.input-dark textarea::placeholder {
-  opacity: 1;
-  color: whitesmoke;
-}
-
-.input input::-moz-placeholder,
-.input textarea::-moz-placeholder {
-  opacity: 1;
-  color: #777777;
-}
-
-// for dark theme
-.input-dark input::-moz-placeholder,
-.input-dark textarea::-moz-placeholder {
-  opacity: 1;
-  color: whitesmoke;
-}
-
-.input input::-moz-placeholder,
-.input textarea::-moz-placeholder {
-  opacity: 1;
-  color: #777777;
-}
-
-.input input::-webkit-input-placeholder,
-.input textarea::-webkit-input-placeholder {
-  opacity: 1;
-  color: #777777;
-}
-
-// for dark theme
-.input-dark input::-moz-placeholder,
-.input-dark textarea::-moz-placeholder {
-  opacity: 1;
-  color: whitesmoke;
-}
-
-.input-dark input::-webkit-input-placeholder,
-.input-dark textarea::-webkit-input-placeholder {
-  opacity: 1;
-  color: whitesmoke;
-}
-
-.input-light input:focus,
-.input-light textarea:focus,
-.input1-light select:focus {
-  outline: none;
-  border: double 2px transparent;
-  border-radius: 10px;
-  background-image: linear-gradient(white, white),
-    linear-gradient(to right, rgba(255, 0, 90, 1), rgba(10, 24, 61, 1));
-  background-origin: border-box;
-  background-clip: padding-box, border-box;
-  background-color: #ffffff;
 }
 
 // for dark theme
-.input-dark input:focus,
-.input-dark textarea:focus,
-.input1-dark select:focus {
-  outline: none;
-  border: double 2px transparent;
-  border-radius: 10px;
-  background-image: linear-gradient(to right, #2b5876, #4e4376);
-  background-origin: border-box;
-  background-clip: padding-box, border-box;
-  background-color: black;
-}
-
-.input textarea {
-  padding-top: 15px;
-  resize: none;
-  height: 100px;
-}
-
-
-.input > textarea#txt-desc {
-  height: 150px !important;
-}
-
-.input i {
-  position: absolute;
-  right: 25px;
-  top: 15px;
-  font-size: 16px;
-  color: rgb(134, 131, 131);
-}
-
-.input-light i {
-  position: absolute;
-  right: 25px;
-  top: 15px;
-  font-size: 16px;
-  color: rgb(134, 131, 131);
-}
-
-.input-dark i {
-  position: absolute;
-  right: 25px;
-  top: 15px;
-  font-size: 16px;
-  color: rgb(255, 255, 255);
-}
-
-input[type="date"]:not(:valid):before {
-  content: attr(placeholder);
-  /* style it like it is a real placeholder */
-}
-@media screen and (max-width: 750px) {
-  .card {
-    width: 80%;
-    max-width: 600px;
+.div-dark {
+  width: 40%;
+  border-radius: 8px;
+  background: #282c35;
+  color: white !important;
+  padding: 1em;
+  @media (max-width: 600px) {
+    width: 95%;
   }
-
-  .submit-btn {
-    width: 50%;
+  h1 {
+    width: 100%;
+    font-size: 17px;
+    margin: 0;
+    text-align: center;
   }
 }
 
-/* For screen sizes between 750px and 1024px */
-@media screen and (min-width: 751px) and (max-width: 1024px) {
-  .card {
-    width: 60%;
-    max-width: 800px;
-  }
-
-  .submit-btn {
-    width: 40%;
+.form {
+  display: flex;
+  width: 100%;
+  align-items: center;
+  justify-content: space-between;
+  div {
+    margin: 0.5em 0;
   }
-}
-
-/* For screen sizes greater than 1024px */
-@media screen and (min-width: 1025px) {
-  .card {
-    width: 50%;
-    max-width: 900px;
+  h5 {
+    margin: 0;
+    width: 20%;
   }
-
-  .submit-btn {
-    width: 30%;
+  .input {
+    width: 75% !important;
   }
 }
 
-/* For dark theme */
-@media (prefers-color-scheme: dark) {
-  body {
-    background-color: #121212;
-    color: #e0e0e0;
-  }
-
-  .card-light, .input-light, .header-text-light {
-    background-color: #2c2c2c;
-    color: #e0e0e0;
-  }
-
-  .dash-light {
-    background: linear-gradient(
-      45deg,
-      rgba(255, 0, 90, 1) 0%,
-      rgba(10, 24, 61, 1) 90%
-    );
-  }
-
-  .input-light input,
-  .input-light textarea,
-  .input1-light select {
-    border: 1px solid #555555;
-    background-color: #333333;
-    color: #e0e0e0;
-    box-shadow: inset 2px 2px 5px #555555, inset -2px -2px 5px #1a1a1a;
-  }
-
-  .input-light input:focus,
-  .input-light textarea:focus,
-  .input1-light select:focus {
-    outline: none;
-    border: double 2px transparent;
-    border-radius: 10px;
-    background-image: linear-gradient(#333333, #333333),
-      linear-gradient(to right, rgba(255, 0, 90, 1), rgba(10, 24, 61, 1));
-    background-origin: border-box;
-    background-clip: padding-box, border-box;
-    background-color: #333333;
-  }
+.heading {
+  color: #69a9dd !important;
+  font-size: 25px !important;
 }
 
-@media screen and (max-width: 480px) {
-  .header-text {
-    font-size: 24px;
-  }
-
-  .editor {
-    padding: 10px;
-  }
-
-  .submit-btn {
-    width: 80%;
-  }
-}
\ No newline at end of file
+.btns1 {
+  background: linear-gradient(to right, #121f3a 0%, #2a4886 50%, #162f66 100%);
+  background-size: 200% auto;
+  outline: none;
+  background-position: left center;
+  -webkit-box-shadow: 0px 8px 16px 0px rgba(72, 127, 255, 0.23);
+  -moz-box-shadow: 0px 8px 16px 0px rgba(72, 127, 255, 0.23);
+  box-shadow: 0px 8px 16px 0px rgba(72, 127, 255, 0.23);
+  border-radius: 50px;
+  color: #fff;
+  width: 15%;
+  margin: 0 auto;
+  display: flex;
+  justify-content: center;
+  padding-top: 5px;
+  padding-bottom: 5px;
+  font-size: 15px;
+}