diff --git a/packages/app/src/pages/tv/tabs/livestreamControlPanel/components/ProfileEditor/index.less b/packages/app/src/pages/tv/tabs/livestreamControlPanel/components/ProfileEditor/index.less
index 21f41192..5d7b9cbd 100644
--- a/packages/app/src/pages/tv/tabs/livestreamControlPanel/components/ProfileEditor/index.less
+++ b/packages/app/src/pages/tv/tabs/livestreamControlPanel/components/ProfileEditor/index.less
@@ -2,6 +2,12 @@
     display: flex;
     flex-direction: column;
 
+    padding: 30px;
+
+    background-color: var(--background-color-accent);
+
+    border-radius: 12px;
+
     .field {
         display: flex;
         flex-direction: column;
@@ -10,7 +16,6 @@
 
         .value {
             margin-top: 5px;
-            margin-left: 20px;
 
             .ant-select {
                 min-width: 200px;
diff --git a/packages/app/src/pages/tv/tabs/livestreamControlPanel/index.jsx b/packages/app/src/pages/tv/tabs/livestreamControlPanel/index.jsx
index 94ba818c..d4c23703 100755
--- a/packages/app/src/pages/tv/tabs/livestreamControlPanel/index.jsx
+++ b/packages/app/src/pages/tv/tabs/livestreamControlPanel/index.jsx
@@ -89,7 +89,7 @@ export default (props) => {
         if (result) {
             app.message.success("Profile updated")
 
-            app.ModalController.close()
+            app.layout.modal.close()
 
             M_Profiles()
         }
@@ -116,7 +116,7 @@ export default (props) => {
                 if (result) {
                     app.message.success("Profile deleted")
 
-                    app.ModalController.close()
+                    app.layout.modal.close()
 
                     setSelectedProfileId(null)
 
@@ -131,7 +131,7 @@ export default (props) => {
             return
         }
 
-        app.ModalController.open(() => <ProfileEditor
+        app.layout.modal.open("profile_editor", () => <ProfileEditor
             profileData={profileData}
             onDelete={handleCurrentProfileDelete}
             onSave={handleCurrentProfileDataUpdate}