change img

src/app/components/board/board.component.html

@@ -45,7 +45,7 @@
       >
         <div class="headline">
           <span>To do</span
-          ><img src="./../../../assets/img/add.svg" alt="add" />
+          ><img src="./../../../assets/img/board/plus.svg" alt="add" />
         </div>
         <div id="todo" class="details">
           @for(task of getTaskStatus("todo"); track task) {
@@ -62,7 +62,7 @@
       >
         <div class="headline">
           <span>In progress</span
-          ><img src="./../../../assets/img/add.svg" alt="add" />
+          ><img src="./../../../assets/img/board/plus.svg" alt="add" />
         </div>
         <div id="inprogress" class="details">
           @for(task of getTaskStatus("inprogress"); track task) {
@@ -79,7 +79,7 @@
       >
         <div class="headline">
           <span>Await feedback</span
-          ><img src="./../../../assets/img/add.svg" alt="add" />
+          ><img src="./../../../assets/img/board/plus.svg" alt="add" />
         </div>
         <div id="awaitfeedback" class="details">
           @for(task of getTaskStatus("awaitfeedback"); track task) {
@@ -95,7 +95,8 @@
         (drop)="dragDropService.drop($event, 'done')"
       >
         <div class="headline">
-          <span>Done</span><img src="./../../../assets/img/add.svg" alt="add" />
+          <span>Done</span
+          ><img src="./../../../assets/img/board/plus.svg" alt="add" />
         </div>
         <div id="done" class="details">
           @for(task of getTaskStatus("done"); track task) {

src/app/components/board/board.component.scss

@@ -122,11 +122,12 @@ d-none {
     font-weight: 700;
   }
   img {
-    border-radius: 8px;
-    border: 2px solid var(--dark-blue);
+    width: 24px;
+    height: 24px;
     cursor: pointer;
     &:hover {
-      filter: invert(60%) sepia(58%) saturate(1629%) hue-rotate(165deg);
+      filter: brightness(0) saturate(100%) invert(56%) sepia(64%) saturate(570%)
+        hue-rotate(154deg) brightness(92%) contrast(92%);
     }
   }
 }

src/assets/img/board/plus.svg

@@ -0,0 +1,5 @@
+<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
+<rect x="1" y="1" width="22" height="22" rx="7" stroke="#2A3647" stroke-width="2"/>
+<path d="M12 8V16" stroke="#2A3647" stroke-width="2" stroke-linecap="round"/>
+<path d="M16 12.0754L8 12.0754" stroke="#2A3647" stroke-width="2" stroke-linecap="round"/>
+</svg>