fix:<Coming Soon> coming soon image add and image centralize

Author: raj-rathod

src/app/components/Algorithms/sorting/insertion-sort/insertion-sort.component.html

@@ -1,8 +1,8 @@
 <h1 class="text-center">Insertion Sort</h1>
 <div class="mt-md-4 mt-3" [innerHtml]="insertionSortMetaData.defination"></div>
 <div class="mt-md-4 mt-3" [innerHtml]="insertionSortMetaData.workingProcedure"></div>
-<div class="mt-md-4 mt-3 col-md-7" [innerHtml]="insertionSortMetaData.flowChart"></div>
-<div class="mt-md-4 mt-3 col-md-7" [innerHtml]="insertionSortMetaData.explainImage"></div>
+<div class="mt-md-4 mt-3" [innerHtml]="insertionSortMetaData.flowChart"></div>
+<div class="mt-md-4 mt-3 " [innerHtml]="insertionSortMetaData.explainImage"></div>
 <div class="mt-md-4 mt-3" [innerHtml]="insertionSortMetaData.properties"></div>
 <div class="mt-md-4 mt-3" [innerHtml]="insertionSortMetaData.applications"></div>
 <div class="mt-md-4 mt-3" [innerHtml]="insertionSortMetaData.other"></div>

src/app/components/Algorithms/sorting/merge-sort/merge-sort.component.html

@@ -1,8 +1,8 @@
 <h1 class="text-center"> Merge Sort </h1>
 <div class="mt-md-4 mt-3" [innerHtml]="mergeSortMetaData.defination"></div>
 <div class="mt-md-4 mt-3" [innerHtml]="mergeSortMetaData.workingProcedure"></div>
-<div class="mt-md-4 mt-3 col-md-7" [innerHtml]="mergeSortMetaData.flowChart"></div>
-<div class="mt-md-4 mt-3 col-md-7" [innerHtml]="mergeSortMetaData.explainImage"></div>
+<div class="mt-md-4 mt-3" [innerHtml]="mergeSortMetaData.flowChart"></div>
+<div class="mt-md-4 mt-3" [innerHtml]="mergeSortMetaData.explainImage"></div>
 <div class="mt-md-4 mt-3" [innerHtml]="mergeSortMetaData.properties"></div>
 <div class="mt-md-4 mt-3" [innerHtml]="mergeSortMetaData.applications"></div>
 <div class="mt-md-4 mt-3" [innerHtml]="mergeSortMetaData.other"></div>

src/app/components/Algorithms/sorting/selection-sort/selection-sort.component.html

@@ -2,8 +2,8 @@ <h1 class="text-center">Selection Sort</h1>
 <div class="mt-md-4 mt-3" [innerHtml]="selectionSortMetaData.defination"></div>
 <div class="mt-md-4 mt-3" [innerHtml]="selectionSortMetaData.properties"></div>
 <div class="mt-md-4 mt-3" [innerHtml]="selectionSortMetaData.workingProcedure"></div>
-<div class="mt-md-4 mt-3 col-md-7" [innerHtml]="selectionSortMetaData.flowChart"></div>
-<div class="mt-md-4 mt-3 col-md-7" [innerHtml]="selectionSortMetaData.explainImage"></div>
+<div class="mt-md-4 mt-3" [innerHtml]="selectionSortMetaData.flowChart"></div>
+<div class="mt-md-4 mt-3" [innerHtml]="selectionSortMetaData.explainImage"></div>
 <div class="mt-md-4 mt-3" [innerHtml]="selectionSortMetaData.applications"></div>
 <div class="mt-md-4 mt-3" [innerHtml]="selectionSortMetaData.advantage"></div>
 <div class="mt-md-4 mt-3" [innerHtml]="selectionSortMetaData.disadvantage"></div>

src/app/core/algorithms/backtracking-meta-data.ts

@@ -17,7 +17,7 @@ const backtracking = {
     at 'A' and we divided our problem into three smaller sub-probelms 'B', 'D' and 'F'. And using this sub-problem, we have three 
     possible path to get to our solution -- 'C', 'E', & 'G'.`,
 
-    example:'assets/ds-image/DSA-404.webp',
+    example:'assets/ds-image/comming-soon.jpg',
 
     properties:[
         `A backtracking algorithm uses the depth-first search method. When it starts exploring the solutions, a bounding function is 

src/app/core/algorithms/greedy-meta-data.ts

@@ -8,7 +8,7 @@ const greedyData = {
    This algorithm may not produce the best result for all the problems. It's because it always goes for the local best 
    choice to produce the global best result.
    `,
-   example: 'assets/ds-image/DSA-404.webp',
+   example: 'assets/ds-image/comming-soon.jpg',
    properties:[
     `<b>Greedy Choice Property:</b> If an optimal solution to the problem can be found by choosing the best choice at 
     each step without reconsidering the previous steps once chosen, the problem can be solved using a greedy approach. 

src/app/core/algorithms/searching-meta-data.ts

@@ -31,8 +31,8 @@ const linearSearchData = {
   defination: `Linear Search is defined as a sequential search algorithm that starts at one end and goes through each 
   element of a list until the desired element is found, otherwise the search continues till the end of the data set. 
   It is the easiest searching algorithm`,
-  flowChart: 'assets/ds-image/DSA-404.webp',
-  explainImage: 'assets/ds-image/DSA-404.webp',
+  flowChart: 'assets/ds-image/comming-soon.jpg',
+  explainImage: 'assets/ds-image/comming-soon.jpg',
   workingProcedure: [
     `Start from the leftmost element of arr and one by one compare 'x' with each element of arr`,
     `If 'x' matches with an element, return the index`,
@@ -92,8 +92,8 @@ export const linearSearchMetaData: Algorithms = {
 const binarySearchData = {
   defination:`Binary Search is a searching algorithm used in a sorted array by repeatedly dividing the search interval in half. 
   The idea of binary search is to use the information that the array is sorted and reduce the time complexity to O(Log n)`,
-  flowChart: 'assets/ds-image/DSA-404.webp',
-  explainImage: 'assets/ds-image/DSA-404.webp',
+  flowChart: 'assets/ds-image/comming-soon.jpg',
+  explainImage: 'assets/ds-image/comming-soon.jpg',
   properties: [
     `The pre-condition for the binary search is that the elements must be arranged in a sorted order`,
     `The implementation of binary search is limited as it can be implemented only on those data structures 
@@ -157,8 +157,8 @@ export const binarySearchMetaData : Algorithms = {
 const jumpSearchData = {
   defination:`Jump Search is a searching algorithm for sorted arrays. The basic idea is to check fewer elements by 
   jumping ahead by fixed steps or skipping some elements in place of searching all elements.`,
-  flowChart: 'assets/ds-image/DSA-404.webp',
-  explainImage: 'assets/ds-image/DSA-404.webp',
+  flowChart: 'assets/ds-image/comming-soon.jpg',
+  explainImage: 'assets/ds-image/comming-soon.jpg',
   properties:[
     `This algorithm works only for sorted input arrays`,
     `Optimal size of the block to be skipped is √n, thus resulting in the time complexity O(√n2)`,
@@ -215,8 +215,8 @@ const interpolationSearchData = {
   data points. Binary Search always goes to the middle element to check. On the other hand, interpolation search may go to
   different locations according to the value of the key being searched. For example, if the value of the key is closer to the 
   last element, interpolation search is likely to start search toward the end side.`,
-  flowChart: 'assets/ds-image/DSA-404.webp',
-  explainImage: 'assets/ds-image/DSA-404.webp',
+  flowChart: 'assets/ds-image/comming-soon.jpg',
+  explainImage: 'assets/ds-image/comming-soon.jpg',
   properties: [
     `Interpolation searching algorithm is only used when the elements in an array is sorted and uniformly distributed`,
     `pos = low + ((target – A[low]) * (high – low) / (A[high] – A[low]))`
@@ -273,8 +273,8 @@ const exponentialSearchData = {
   assuming that the list is sorted in ascending order, the algorithm looks for the first exponent, j, where the value 2^j is greater 
   than the search key. This value, 2^j becomes the upper bound for the binary search with the previous power of 2, 2^(j - 1), being the 
   lower bound for the binary search`,
-  flowChart: 'assets/ds-image/DSA-404.webp',
-  explainImage: 'assets/ds-image/DSA-404.webp',
+  flowChart: 'assets/ds-image/comming-soon.jpg',
+  explainImage: 'assets/ds-image/comming-soon.jpg',
   properties: [
     `Finding the range in which the key could sit`,
     `Applying binary search in this range`,

src/app/core/algorithms/sorting-meta-data.ts

@@ -245,8 +245,8 @@ const quickSortData = {
     The list is divided into two partitions such that "all elements to the left of pivot are smaller than the pivot 
     and all elements to the right of pivot are greater than or equal to the pivot".
   `,
-  flowChart:"assets/ds-image/DSA-404.webp",
-  explainImage:"assets/ds-image/DSA-404.webp",
+  flowChart:"assets/ds-image/comming-soon.jpg",
+  explainImage:"assets/ds-image/comming-soon.jpg",
   workingProcedure:[
     'Consider the first element of the list as pivot (i.e., Element at first position in the list)',
     'Define two variables i and j. Set i and j to first and last elements of the list respectively',
@@ -314,8 +314,8 @@ const countingSortData = {
   defination: `Counting sort is a sorting algorithm that sorts the elements of an array by counting the number 
     of occurrences of each unique element in the array. The count is stored in an auxiliary array and 
     the sorting is done by mapping the count as an index of the auxiliary array.`,
-  flowChart:"assets/ds-image/DSA-404.webp",
-  explainImage:"assets/ds-image/DSA-404.webp",
+  flowChart:"assets/ds-image/comming-soon.jpg",
+  explainImage:"assets/ds-image/comming-soon.jpg",
   workingProcedure:[
     `Iterate through the input array to find the highest value`,
     `Declare a new array with the value 0 and a size of max+1`,
@@ -384,8 +384,8 @@ const radixSortData = {
   defination: `Radix sort is an algorithm that uses counting sort as a subroutine to sort an array of integers/strings in 
     either ascending or descending order. The main idea of radix sort revolves around applying counting sort digit by 
     digit on the given array`,
-  flowChart:"assets/ds-image/DSA-404.webp",
-  explainImage:"assets/ds-image/DSA-404.webp",
+  flowChart:"assets/ds-image/comming-soon.jpg",
+  explainImage:"assets/ds-image/comming-soon.jpg",
   workingProcedure:[
     `Find the maximum element of the array, let it be max`,
     `Find the number of digits in max, let it be k`,
@@ -449,8 +449,8 @@ const bucketSortData = {
   defination: `Bucket sort is a sorting technique that uses the Scatter-Gather-Approach to sort the array. 
     It divides the unsorted array into separate groups and calls them buckets. Sort the individual buckets, 
     and then gather them all together to form the final sorted array`,
-  flowChart: 'assets/ds-image/DSA-404.webp',
-  explainImage: 'assets/ds-image/DSA-404.webp',
+  flowChart: 'assets/ds-image/comming-soon.jpg',
+  explainImage: 'assets/ds-image/comming-soon.jpg',
   workingProcedure: [
     `If All the elements are in the range of [0,1] then no need to follow initial two steps
     and in third step create 10 empty buckets and in step four bucketIndex = array[i]*10`,
@@ -542,8 +542,8 @@ const shellSortData = {
   When an element has to be moved far ahead, many movements are involved. The idea of ShellSort is to allow the exchange 
   of far items. In Shell sort, we make the array gap-sorted for a large value of gap. We keep reducing the value of gap 
   until it becomes 1. An array is said to be gap-sorted if all sublists of every gap’th element are sorted.`,
-  flowChart: 'assets/ds-image/DSA-404.webp',
-  explainImage: 'assets/ds-image/DSA-404.webp',
+  flowChart: 'assets/ds-image/comming-soon.jpg',
+  explainImage: 'assets/ds-image/comming-soon.jpg',
   workingProcedure:[
     'Initialize the value of gap size. Example: gap',
     ' Divide the list into smaller sub-part. Each must have equal intervals to gap',

src/app/helper/helper.ts

@@ -14,7 +14,7 @@ export class Helper{
      }
 
      static setExampleImage(title:string, url:string): string {
-      return `<h4>${title}</h4> <img src="${url}" class="img-fluid" alt="${title}" />`;
+      return `<h4>${title}</h4> <div class="text-center"><img src="${url}" class="img-fluid col-md-7" alt="${title}" /></div>`;
      }
 
      static setHeader(header:string):string {