Add ripple everywhere.

frontend/src/app/components/side-menu/side-menu.component.html

@@ -4,7 +4,11 @@
             <img src="assets/images/codiki.png" alt="logo"/>
             Codiki
         </a>
-        <button type="button" (click)="close()" matTooltip="Close the menu" i18n-matTooltip>
+        <button type="button"
+                (click)="close()"
+                matTooltip="Close the menu"
+                matRipple
+                i18n-matTooltip>
             <mat-icon>close</mat-icon>
         </button>
     </h1>

frontend/src/app/components/side-menu/side-menu.component.ts

@@ -3,13 +3,20 @@ import { MatIconModule } from '@angular/material/icon';
 import { MatTooltipModule } from '@angular/material/tooltip';
 import { RouterModule } from '@angular/router';
 import { CategoriesMenuComponent } from './categories-menu/categories-menu.component';
+import { MatRippleModule } from '@angular/material/core';
 
 @Component({
   selector: 'app-side-menu',
   standalone: true,
-  imports: [CategoriesMenuComponent, MatIconModule, MatTooltipModule, RouterModule],
   templateUrl: './side-menu.component.html',
-  styleUrl: './side-menu.component.scss'
+  styleUrl: './side-menu.component.scss',
+  imports: [
+    CategoriesMenuComponent, 
+    MatIconModule,
+    MatRippleModule, 
+    MatTooltipModule,
+    RouterModule
+  ]
 })
 export class SideMenuComponent {
   isOpenned: boolean = false;