diff --git a/src/app/components/social/friends/friends.component.sass b/src/app/components/social/friends/friends.component.sass
index 10919ea..253ee4a 100644
--- a/src/app/components/social/friends/friends.component.sass
+++ b/src/app/components/social/friends/friends.component.sass
@@ -10,6 +10,8 @@
   width: 100%
   margin-top: 0.5em
   cursor: pointer
+  outline: none
+  user-select: none
 
   ::ng-deep .mat-card-header-text
     margin: 0 24px
diff --git a/src/app/components/social/groups/groups.component.html b/src/app/components/social/groups/groups.component.html
index 635e734..aa85510 100644
--- a/src/app/components/social/groups/groups.component.html
+++ b/src/app/components/social/groups/groups.component.html
@@ -2,7 +2,7 @@
   <span>Groups</span>
   <div id="button-box">
     <button mat-icon-button (click)="openDialog()" matTooltip="create group" matTooltipPosition="left"
-            matTooltipShowDelay="500">
+      matTooltipShowDelay="500">
       <mat-icon>group_add</mat-icon>
     </button>
   </div>
@@ -10,7 +10,8 @@
 
 <div id="grouplist">
   <mat-card class="group-card" *ngFor="let group of user.groups"
-            [class.selected]="group === selectedGroup" (click)="showGroupProfile(group)">
+    matRipple
+    [class.selected]="group === selectedGroup" (click)="showGroupProfile(group)">
     <mat-card-header>
       <div mat-card-avatar>
         <img class="group-picture" [src]="group.picture"/>