Changed all static inline style to CSS classes

src/components/messages/AudioPlayer.vue

@@ -1,5 +1,5 @@
 <template>
-  <div class="audio-player d-flex flex-row" style="align-items: center">
+  <div class="audio-player d-flex flex-row align-center">
     <audio ref="player" :src="src" @durationchange="updateDuration">
       <slot></slot>
     </audio>
@@ -9,15 +9,14 @@
     <v-btn v-else id="btn-play" @click.stop="play" icon
       ><v-icon size="20">play_arrow</v-icon></v-btn
     >
-    <div class="play-time" style="flex: 1 0 80px">
+    <div class="play-time">
       {{ currentTime }} / {{ totalTime }}
     </div>
-    <v-slider 
+    <v-slider
       color="currentColor"
       track-color="#cccccc"
       class="play-progress"
       v-model="playheadPercent"
-      style="flex: 1 1 100%; height: 30px"
       min="0"
       max="100"
     />

src/components/messages/MessageIncomingFile.vue

@@ -13,7 +13,7 @@
       <div class="message">
         <span>{{ $t('message.file_prefix') }}</span>
         <span
-          style="cursor: pointer"
+         class="cursor-pointer"
           @click.stop="$emit('download')"
           v-html="linkify($sanitize(messageText))"
         />

src/components/messages/MessageIncomingVideo.vue

@@ -2,7 +2,7 @@
   <message-incoming v-bind="{ ...$props, ...$attrs }" v-on="$listeners">
     <div class="bubble image-bubble">
       <v-responsive :aspect-ratio="16 / 9" :src="src">
-        <video :src="src" controls style="width: 100%; height: 100%">
+        <video :src="src" controls class="w-100 h-100">
           {{$t('fallbacks.video_file')}}
         </video>
         <div v-if="downloadProgress" class="download-overlay">

src/components/messages/MessageOutgoingFile.vue

@@ -14,7 +14,7 @@
       <div class="message">
         <span>{{ $t('message.file_prefix') }}</span>
         <span
-          style="cursor: pointer"
+          class="cursor-pointer"
           @click.stop="$emit('download')"
           v-html="linkify($sanitize(messageText))"
         />

src/components/messages/MessageOutgoingVideo.vue

@@ -2,7 +2,7 @@
   <message-outgoing v-bind="{ ...$props, ...$attrs }" v-on="$listeners">
     <div class="bubble image-bubble">
       <v-responsive :aspect-ratio="16 / 9" class="ma-0 pa-0">
-        <video :src="src" controls style="width: 100%; height: 100%">
+        <video :src="src" controls class="w-100 h-100">
           {{$t('fallbacks.video_file')}}
         </video>
       </v-responsive>