diff --git a/frontend/app/components/InfoCard.vue b/frontend/app/components/InfoCard.vue
new file mode 100644
index 0000000..be45527
--- /dev/null
+++ b/frontend/app/components/InfoCard.vue
@@ -0,0 +1,57 @@
+<template>
+    <v-card variant="outlined" :width="300" class="d-flex flex-column" style="margin: 20px; cursor: pointer">
+        <v-card-title class="text-wrap">
+            <div class="title-row">
+                <v-icon v-if="icon" :icon="icon" size="24" class="title-icon" />
+                <strong class="title-text">{{ title }}</strong>
+            </div>
+        </v-card-title>
+        <v-card-text>
+            {{ description }}
+        </v-card-text>
+    </v-card>
+</template>
+
+<script lang="ts">
+function basicPropValidator(value: string, _other_props: any) {
+    // zatiaľ stačí vedieť či obsah nie je prázdny reťazec
+    return value.trim().length > 0
+}
+
+export default {
+    props: {
+        title: {
+            required: true,
+            type: String,
+            validator: basicPropValidator
+        },
+        description: {
+            required: true,
+            type: String,
+            validator: basicPropValidator
+        },
+        icon: {
+            required: false,
+            type: String,
+            default: null,
+            validator: basicPropValidator
+        },
+    }
+}
+</script>
+
+<style scoped>
+.title-row {
+    display: flex;
+    align-items: center;
+    gap: 8px;
+}
+
+.title-icon {
+    transform: translateY(1px);
+}
+
+.title-text {
+    line-height: 1.2;
+}
+</style>
diff --git a/frontend/app/pages/info/company.vue b/frontend/app/pages/info/company.vue
index 07bbdd5..2d87850 100644
--- a/frontend/app/pages/info/company.vue
+++ b/frontend/app/pages/info/company.vue
@@ -11,7 +11,7 @@
             <h3 class="page-container section-title">Zmluvné podmienky</h3>
 
             <v-row class="pc" align="stretch" justify="start">
-                <PageCard title="Zmluva o odbornej praxi" description="Medzi firmou a študentom sa uzatvára Zmluva o odbornej praxi, ktorá definuje práva a povinnosti oboch strán. 
+                <InfoCard title="Zmluva o odbornej praxi" description="Medzi firmou a študentom sa uzatvára Zmluva o odbornej praxi, ktorá definuje práva a povinnosti oboch strán. 
       Zmluva musí byť v súlade s legislatívou a internými predpismi školy." link="/"
                     icon="mdi mdi-file-document-edit-outline" />
             </v-row>
@@ -19,15 +19,15 @@
             <h3 class="page-container section-title">Pravidlá a povinnost počas praxe</h3>
 
             <v-row class="pc" align="stretch" justify="start">
-                <PageCard title="Pridelenie mentora"
+                <InfoCard title="Pridelenie mentora"
                     description="Každému študentovi musí byť pridelený zodpovedný zamestnanec (mentor), ktorý ho bude viesť, zadávať mu úlohy a poskytovať spätnú väzbu."
-                    link="/" icon="mdi mdi-account-multiple-outline" />
-                <PageCard title="Relevantné úlohy"
+                    icon="mdi mdi-account-multiple-outline" />
+                <InfoCard title="Relevantné úlohy"
                     description="Náplň práce študenta musí zodpovedať jeho študijnému odboru a umožniť mu získať praktické zručnosti a vedomosti."
-                    link="/" icon="mdi mdi-notebook-check-outline" />
-                <PageCard title="Bezpečnosť pri práci"
+                    icon="mdi mdi-notebook-check-outline" />
+                <InfoCard title="Bezpečnosť pri práci"
                     description="Firma je povinná zabezpečiť preškolenie o bezpečnosti a ochrane zdravia pri práci (BOZP) a poskytnúť potrebné ochranné pomôcky."
-                    link="/" icon="mdi mdi-shield-outline" />
+                    icon="mdi mdi-shield-outline" />
             </v-row>
 
             <h3 class="page-container section-title">Hodnotenie a ukončenie praxe</h3>
diff --git a/frontend/app/pages/info/student.vue b/frontend/app/pages/info/student.vue
index 141f39a..49c3f75 100644
--- a/frontend/app/pages/info/student.vue
+++ b/frontend/app/pages/info/student.vue
@@ -11,20 +11,20 @@
             <h3 class="page-container section-title">Podmienky absolvovania predmetu</h3>
 
             <v-row class="pc" align="stretch" justify="start">
-                <PageCard title="Rozsah a účasť"
+                <InfoCard title="Rozsah a účasť"
                     description="Absolvovanie praxe v minimálnom rozsahu 130 hodín a povinná účasť na úvodnom stretnutí"
-                    link="/" icon="mdi-clock-time-five-outline" />
-                <PageCard title="Denník praxe"
+                    icon="mdi-clock-time-five-outline" />
+                <InfoCard title="Denník praxe"
                     description="Priebežné vedenie denníka praxe podľa predpísanej štruktúry a jeho odovzdanie na konci obdobia."
-                    link="/" icon="mdi-notebook-edit-outline" />
-                <PageCard title="Poster a prezentácia"
+                    icon="mdi-notebook-edit-outline" />
+                <InfoCard title="Poster a prezentácia"
                     description="Príprava a prezentácia posteru. Hodnotí sa obsah, vizuálna stránka a kvalita prezentácie."
-                    link="/" icon="mdi-presentation" />
-                <PageCard title="Bodové hodnotenie"
+                    icon="mdi-presentation" />
+                <InfoCard title="Bodové hodnotenie"
                     description="Max. 100 bodov (50b firma, 50b poster a prezentácia). Minimum pre absolvovanie je 51 bodov."
-                    link="/" icon="mdi-checkbox-marked-outline" />
-                <PageCard title="Kredity" description="Po úspešnom absolvovaní predmetu študent získa 5 kreditov"
-                    link="/" icon="mdi-school-outline" />
+                    icon="mdi-checkbox-marked-outline" />
+                <InfoCard title="Kredity" description="Po úspešnom absolvovaní predmetu študent získa 5 kreditov"
+                    icon="mdi-school-outline" />
             </v-row>
         </v-card>
     </v-container>