110 lines
3.0 KiB
Vue
Executable File
110 lines
3.0 KiB
Vue
Executable File
<template>
|
|
<div class="chat-container">
|
|
<header class="header">
|
|
<router-link to="/" class="app-brand app-brand-link">
|
|
<span class="app-brand-mark">S</span>
|
|
<div class="app-brand-copy">
|
|
<span class="app-brand-eyebrow">YpChat</span>
|
|
<h1>Partner</h1>
|
|
</div>
|
|
</router-link>
|
|
<HeaderAdBanner />
|
|
</header>
|
|
|
|
<MenuBar />
|
|
|
|
<div class="horizontal-box">
|
|
<UserList />
|
|
|
|
<div class="content">
|
|
<div class="partners-view">
|
|
<h2>Partner</h2>
|
|
<p class="partners-intro">
|
|
Auf dieser Seite findest du Empfehlungen und befreundete Projekte. Wir verlinken nur Seiten, die wir als
|
|
sinnvoll für unsere Community einschätzen. Die Inhalte der verlinkten Seiten liegen in der Verantwortung der
|
|
jeweiligen Betreiber.
|
|
</p>
|
|
<p class="partners-intro">
|
|
Hinweis: Externe Links öffnen sich in einem neuen Tab. Wenn du Partner werden möchtest, schreib uns bitte
|
|
über die Feedback-Seite.
|
|
</p>
|
|
<p class="partners-intro">
|
|
Wenn du zuerst wissen möchtest, wie privater und anonymer Chat bei uns funktioniert, schau in unsere
|
|
<router-link to="/faq">FAQ</router-link> oder auf die Seite
|
|
<router-link to="/sicherheit">Sicherheit & Privatsphäre</router-link>.
|
|
</p>
|
|
<div v-if="!chatStore.isLoggedIn" class="back-link">
|
|
<router-link to="/">Zurück zur Hauptseite</router-link>
|
|
</div>
|
|
<ul class="partners-list">
|
|
<li v-for="partner in partners" :key="partner.url">
|
|
<a :href="partner.url" target="_blank" rel="noopener noreferrer">
|
|
{{ partner['Page Name'] }}
|
|
</a>
|
|
<span class="partners-meta">Externer Link</span>
|
|
</li>
|
|
</ul>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<ImprintContainer />
|
|
</div>
|
|
</template>
|
|
|
|
<script setup>
|
|
import { ref, onMounted } from 'vue';
|
|
import axios from 'axios';
|
|
import { useRouter } from 'vue-router';
|
|
import MenuBar from '../components/MenuBar.vue';
|
|
import UserList from '../components/UserList.vue';
|
|
import HeaderAdBanner from '../components/HeaderAdBanner.vue';
|
|
import ImprintContainer from '../components/ImprintContainer.vue';
|
|
import { useChatStore } from '../stores/chat';
|
|
|
|
const router = useRouter();
|
|
const chatStore = useChatStore();
|
|
const partners = ref([]);
|
|
|
|
onMounted(async () => {
|
|
try {
|
|
const response = await axios.get('/api/partners');
|
|
partners.value = response.data;
|
|
} catch (error) {
|
|
console.error('Fehler beim Laden der Partner:', error);
|
|
}
|
|
});
|
|
</script>
|
|
|
|
<style scoped>
|
|
.partners-view {
|
|
padding: 20px;
|
|
max-width: 980px;
|
|
}
|
|
|
|
.partners-intro {
|
|
margin: 10px 0;
|
|
color: #344038;
|
|
line-height: 1.55;
|
|
}
|
|
|
|
.partners-list {
|
|
margin-top: 16px;
|
|
padding-left: 18px;
|
|
}
|
|
|
|
.partners-list li {
|
|
margin-bottom: 10px;
|
|
}
|
|
|
|
.partners-meta {
|
|
margin-left: 10px;
|
|
font-size: 12px;
|
|
color: #637067;
|
|
}
|
|
|
|
.app-brand-link {
|
|
text-decoration: none;
|
|
}
|
|
</style>
|