OpenVisor-Website/src/views/ssse-trume1.vue

87 lines
1.6 KiB
Vue
Raw Normal View History

2024-04-26 21:56:56 +02:00
<template>
<div class="ssse-trume1-container">
<app-navbar rootClassName="navbar-root-class-name"></app-navbar>
<h1 class="ssse-trume1-heading">
<span>Süsse Träume</span>
<br />
</h1>
<span class="ssse-trume1-caption">
<span>Fantasy Mini-LARP</span>
<br />
</span>
<app-footer rootClassName="footer-root-class-name"></app-footer>
</div>
</template>
<script>
import AppNavbar from '../components/navbar'
import AppFooter from '../components/footer'
export default {
name: 'SsseTrume1',
components: {
AppNavbar,
AppFooter,
},
metaInfo: {
title: 'Ssse-Trume1 - MitOffenemVisier',
meta: [
{
property: 'og:title',
content: 'Ssse-Trume1 - MitOffenemVisier',
},
],
},
}
</script>
<style scoped>
.ssse-trume1-container {
width: 100%;
display: flex;
overflow: auto;
min-height: 100vh;
overflow-x: hidden;
align-items: center;
flex-direction: column;
background-color: #0F0F0F;
}
.ssse-trume1-heading {
color: rgb(255, 255, 255);
font-size: 64px;
font-style: normal;
font-family: Poppins;
font-weight: 600;
}
.ssse-trume1-caption {
color: rgb(255, 255, 255);
font-size: 20px;
font-family: Poppins;
line-height: 30px;
}
@media(max-width: 991px) {
.ssse-trume1-heading {
text-align: left;
}
.ssse-trume1-caption {
text-align: left;
}
}
@media(max-width: 767px) {
.ssse-trume1-heading {
font-size: 40px;
}
.ssse-trume1-caption {
color: rgb(255, 255, 255);
font-size: 16px;
font-family: Poppins;
line-height: 24px;
}
}
@media(max-width: 479px) {
.ssse-trume1-heading {
max-width: 280px;
}
}
</style>