Make BlockingCard.vue extensible

aleksis/apps/lesrooster/frontend/components/timetable_management/BlockingCard.vue

@@ -3,17 +3,30 @@ import { defineComponent } from "vue";
 
 export default defineComponent({
   name: "BlockingCard",
+  props: {
+    color: {
+      type: String,
+      required: false,
+      default: "error",
+    },
+    icon: {
+      type: String,
+      required: false,
+      default: "mdi-close",
+    },
+  },
 });
 </script>
 
 <template>
   <v-card
     height="100%"
-    class="non-important-flex align-center justify-center"
+    class="non-important-flex flex-column align-center justify-center"
     flat
   >
-    <v-icon color="error" large>mdi-close</v-icon>
-    <v-overlay absolute color="error" :value="true" opacity="0.12" />
+    <v-icon :color="color" large v-text="icon"></v-icon>
+    <slot/>
+    <v-overlay absolute :color="color" :value="true" opacity="0.12" />
   </v-card>
 </template>