Layout of the Basic task is now completed

src/Sass/_assignmentComplete.scss

@@ -1,6 +1,7 @@
 @import "./_esuiteVariables.scss";
 
 $assignmentComplete-border-color: darken($mode--light-bg, 50%);
+$border-radius: 12px;
 
 .assignmentComplete {
   display: flex;
@@ -66,12 +67,13 @@ $assignmentComplete-border-color: darken($mode--light-bg, 50%);
 
       .taskDetails {
         border: 1px solid $assignmentComplete-border-color;
-        border-radius: 4px;
+        border-radius: $border-radius;
         padding: 12px;
         margin-bottom: 12px;
 
         .taskDetailsHeader {
           background-color: $assignmentComplete-border-color;
+          border-radius: $border-radius $border-radius 0 0;
           margin: -12px -12px 12px;
           padding: 8px 12px;
         }
@@ -111,3 +113,12 @@ $assignmentComplete-border-color: darken($mode--light-bg, 50%);
     }
   }
 }
+
+.basicTask {
+  .banner {
+    background-color: $assignmentComplete-border-color;
+    padding: 12px;
+    border-radius: $border-radius;
+    margin-bottom: 20px;
+  }
+}

src/modules/manager/task/assignments/components/tasksProcessor/BasicTask.tsx

@@ -88,8 +88,8 @@ const BasicTask: React.FC<BasicTaskProps> = ({
   };
 
   return (
-    <div className="workareaInner">
+    <div className="basicTask">
-      <div>{description}</div>
+      <div className="banner">{description}</div>
 
       {renderInput(
         "comments",