mirror of
https://github.com/Ocelot-Social-Community/Ocelot-Social.git
synced 2025-12-13 07:46:06 +00:00
Implement internal page component, first step
This commit is contained in:
Wolfgang Huß
parent
59dd7ba104
commit
df1e622094
@ -26,12 +26,12 @@
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { isInternalPage } from '~/components/utils/InternalPages.js'
|
||||
import links from '~/constants/links.js'
|
||||
import { isInternalPage } from '~/components/utils/InternalPages.js'
|
||||
|
||||
export default {
|
||||
data() {
|
||||
return { isInternalPage, links, version: `v${this.$env.VERSION}` }
|
||||
return { links, isInternalPage, version: `v${this.$env.VERSION}` }
|
||||
},
|
||||
}
|
||||
</script>
|
||||
|
||||
@ -2,7 +2,7 @@
|
||||
<section class="login-form">
|
||||
<base-card>
|
||||
<template #imageColumn>
|
||||
<a :href="links.ORGANIZATION" :title="$t('login.moreInfo', metadata)" target="_blank">
|
||||
<a :href="pageLink(links.ORGANIZATION)" :title="$t('login.moreInfo', metadata)" target="_blank">
|
||||
<logo logoType="signup" />
|
||||
</a>
|
||||
</template>
|
||||
@ -45,6 +45,7 @@
|
||||
<script>
|
||||
import links from '~/constants/links.js'
|
||||
import metadata from '~/constants/metadata.js'
|
||||
import { pageLink } from '~/components/utils/InternalPages.js'
|
||||
import ComponentSlider from '~/components/ComponentSlider/ComponentSlider'
|
||||
import LocaleSwitch from '~/components/LocaleSwitch/LocaleSwitch'
|
||||
import Logo from '~/components/Logo/Logo'
|
||||
@ -161,6 +162,7 @@ export default {
|
||||
}
|
||||
|
||||
return {
|
||||
pageLink,
|
||||
links,
|
||||
metadata,
|
||||
sliderData: {
|
||||
|
||||
@ -0,0 +1,84 @@
|
||||
<template>
|
||||
<div>
|
||||
<ds-space margin="small">
|
||||
<ds-heading v-if="pageParams.internalPage.headlineIdent !== null" tag="h2">{{ $t(pageParams.internalPage.headlineIdent === '' ? pageValues.defaultHeadlineIdent : pageParams.internalPage.headlineIdent) }}</ds-heading>
|
||||
</ds-space>
|
||||
<ds-container v-if="pageParams.internalPage.hasContainer">
|
||||
<div v-if="!pageParams.internalPage.hasBaseCard">
|
||||
<br>
|
||||
<div v-html="$t(pageValues.htmlIdent)" />
|
||||
</div>
|
||||
<base-card v-else>
|
||||
<div v-html="$t(pageValues.htmlIdent)" />
|
||||
</base-card>
|
||||
</ds-container>
|
||||
<div v-else-if="!pageParams.internalPage.hasBaseCard">
|
||||
<br>
|
||||
<div v-html="$t(pageValues.htmlIdent)" />
|
||||
</div>
|
||||
<base-card v-else>
|
||||
<div v-html="$t(pageValues.htmlIdent)" />
|
||||
</base-card>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
// import links from '~/constants/links.js'
|
||||
// import { pageLink } from '~/components/utils/InternalPages.js'
|
||||
// import Logo from '~/components/Logo/Logo'
|
||||
|
||||
export default {
|
||||
name: 'InternalPage',
|
||||
head() {
|
||||
return {
|
||||
title: this.$t(this.pageParams.internalPage.headTitleIdent),
|
||||
}
|
||||
},
|
||||
// layout: 'basic',
|
||||
// components: {
|
||||
// Logo,
|
||||
// },
|
||||
props: {
|
||||
pageParams: { type: Object, required: true },
|
||||
},
|
||||
// data() {
|
||||
// return { links, pageLink }
|
||||
// },
|
||||
computed: {
|
||||
pageValues() {
|
||||
let values = {}
|
||||
switch (this.pageParams.name) {
|
||||
case 'organization':
|
||||
values.defaultHeadlineIdent = 'site.made'
|
||||
values.htmlIdent = 'html.organization'
|
||||
break;
|
||||
case 'donate':
|
||||
values.defaultHeadlineIdent = 'site.donate'
|
||||
values.htmlIdent = 'html.donate'
|
||||
break;
|
||||
case 'imprint':
|
||||
values.defaultHeadlineIdent = 'site.imprint'
|
||||
values.htmlIdent = 'html.imprint'
|
||||
break;
|
||||
case 'terms-and-conditions':
|
||||
values.defaultHeadlineIdent = 'site.termsAndConditions'
|
||||
values.htmlIdent = 'html.termsAndConditions'
|
||||
break;
|
||||
case 'code-of-conduct':
|
||||
values.defaultHeadlineIdent = 'site.code-of-conduct'
|
||||
values.htmlIdent = 'html.codeOfConduct'
|
||||
break;
|
||||
case 'data-privacy':
|
||||
values.defaultHeadlineIdent = 'site.data-privacy'
|
||||
values.htmlIdent = 'html.dataPrivacy'
|
||||
break;
|
||||
case 'faq':
|
||||
values.defaultHeadlineIdent = 'site.faq'
|
||||
values.htmlIdent = 'html.faq'
|
||||
break;
|
||||
}
|
||||
return values
|
||||
},
|
||||
},
|
||||
}
|
||||
</script>
|
||||
@ -5,3 +5,7 @@ export function isInternalPage(pageParams) {
|
||||
export function noStringDefined(string) {
|
||||
return !string || string === 0
|
||||
}
|
||||
|
||||
export function pageLink(pageParams) {
|
||||
return isInternalPage(pageParams) ? pageParams.internalLink : pageParams.externalLink
|
||||
}
|
||||
|
||||
@ -10,9 +10,11 @@ const ORGANIZATION = {
|
||||
internalLink: '/organization', // static, don't change! internal page in case no external is defined
|
||||
internalPage: {
|
||||
footerIdent: 'site.made', // localized string identifier
|
||||
// Wolle headlineIdent: null, // on null default is used, on empty string it's hidden
|
||||
headlineIdent: '', // localized string identifier. on null default is used, on empty string it's hidden
|
||||
hasBaseCard: true,
|
||||
headTitleIdent: 'site.made', // localized string identifier
|
||||
// Wolle headlineIdent: 'site.made', // localized string identifier. on null it's hidden, on empty string default is used
|
||||
headlineIdent: null, // localized string identifier. on null it's hidden, on empty string default is used
|
||||
hasContainer: true,
|
||||
hasBaseCard: true, // no baseCard without a container
|
||||
hasLoginInHeader: true,
|
||||
},
|
||||
}
|
||||
@ -26,7 +28,8 @@ const DONATE = {
|
||||
internalLink: '/donate', // static, don't change! internal page in case no external is defined
|
||||
internalPage: {
|
||||
footerIdent: 'site.donate', // localized string identifier
|
||||
headlineIdent: null, // localized string identifier. on null default is used, on empty string it's hidden
|
||||
headTitleIdent: 'site.donate', // localized string identifier
|
||||
headlineIdent: null, // localized string identifier. on null it's hidden, on empty string default is used
|
||||
hasBaseCard: true,
|
||||
hasLoginInHeader: true,
|
||||
},
|
||||
@ -41,7 +44,8 @@ const IMPRINT = {
|
||||
internalLink: '/imprint', // static, don't change! internal page in case no external is defined
|
||||
internalPage: {
|
||||
footerIdent: 'site.imprint', // localized string identifier
|
||||
headlineIdent: null, // localized string identifier. on null default is used, on empty string it's hidden
|
||||
headTitleIdent: 'site.imprint', // localized string identifier
|
||||
headlineIdent: null, // localized string identifier. on null it's hidden, on empty string default is used
|
||||
hasBaseCard: true,
|
||||
hasLoginInHeader: true,
|
||||
},
|
||||
@ -55,7 +59,8 @@ const TERMS_AND_CONDITIONS = {
|
||||
internalLink: '/terms-and-conditions', // static, don't change! internal page in case no external is defined
|
||||
internalPage: {
|
||||
footerIdent: 'site.termsAndConditions', // localized string identifier
|
||||
headlineIdent: null, // localized string identifier. on null default is used, on empty string it's hidden
|
||||
headTitleIdent: 'site.termsAndConditions', // localized string identifier
|
||||
headlineIdent: null, // localized string identifier. on null it's hidden, on empty string default is used
|
||||
hasBaseCard: true,
|
||||
hasLoginInHeader: true,
|
||||
},
|
||||
@ -69,7 +74,8 @@ const CODE_OF_CONDUCT = {
|
||||
internalLink: '/code-of-conduct', // static, don't change! internal page in case no external is defined
|
||||
internalPage: {
|
||||
footerIdent: 'site.code-of-conduct', // localized string identifier
|
||||
headlineIdent: null, // localized string identifier. on null default is used, on empty string it's hidden
|
||||
headTitleIdent: 'site.code-of-conduct', // localized string identifier
|
||||
headlineIdent: null, // localized string identifier. on null it's hidden, on empty string default is used
|
||||
hasBaseCard: true,
|
||||
hasLoginInHeader: true,
|
||||
},
|
||||
@ -83,7 +89,8 @@ const DATA_PRIVACY = {
|
||||
internalLink: '/data-privacy', // static, don't change! internal page in case no external is defined
|
||||
internalPage: {
|
||||
footerIdent: 'site.data-privacy', // localized string identifier
|
||||
headlineIdent: null, // localized string identifier. on null default is used, on empty string it's hidden
|
||||
headTitleIdent: 'site.data-privacy', // localized string identifier
|
||||
headlineIdent: null, // localized string identifier. on null it's hidden, on empty string default is used
|
||||
hasBaseCard: true,
|
||||
hasLoginInHeader: true,
|
||||
},
|
||||
@ -98,8 +105,9 @@ const FAQ = {
|
||||
internalLink: '/faq', // static, don't change! internal page in case no external is defined
|
||||
internalPage: {
|
||||
footerIdent: 'site.faq', // localized string identifier
|
||||
headTitleIdent: 'site.faq', // localized string identifier
|
||||
// Wolle headlineIdent: null, // on null default is used, on empty string it's hidden
|
||||
headlineIdent: null, // localized string identifier. on null default is used, on empty string it's hidden
|
||||
headlineIdent: null, // localized string identifier. on null it's hidden, on empty string default is used
|
||||
hasBaseCard: true,
|
||||
hasLoginInHeader: true,
|
||||
},
|
||||
|
||||
@ -1,31 +1,31 @@
|
||||
<!-- this file is replaced on rebranding by https://github.com/Ocelot-Social-Community/Ocelot-Social-Deploy-Rebranding/tree/master/branding/locales/html/ -->
|
||||
<!-- you can find and store templates at https://github.com/Ocelot-Social-Community/Ocelot-Social-Deploy-Rebranding/tree/master/branding/templates/ -->
|
||||
|
||||
<br>
|
||||
<h1 class="h3-headline-big">
|
||||
<!-- <br> -->
|
||||
<!-- <h1 class="h3-headline-big">
|
||||
sender.fm
|
||||
</h1>
|
||||
</h1> -->
|
||||
<!-- <img class="logo" alt="ocelot.social Header" src="/img/custom/logo-horizontal.svg" style="width: 360px;"><br> -->
|
||||
<p class="paragraph">
|
||||
<!-- <p class="paragraph">
|
||||
Hier wird sender.fm in Zukunft vorgestellt …
|
||||
</p>
|
||||
<p class="link">
|
||||
</p> -->
|
||||
<!-- <p class="link">
|
||||
<a href="/login" target="_blank">
|
||||
Zum Login …
|
||||
</a><br>
|
||||
</p>
|
||||
<br>
|
||||
<h3 class="h3-headline">
|
||||
<br> -->
|
||||
<h1 class="h1-headline">
|
||||
Unser Radio-Stream
|
||||
</h3>
|
||||
</h1>
|
||||
<br>
|
||||
<!-- <iframe id="embed_player" frameborder="0" width="280" height="216" src="https://senderfm.airtime.pro/embed/player?stream=s1&skin=1"></iframe> -->
|
||||
<iframe class="player" id="embed_player" frameborder="0" width="350" height="396" src="https://senderfm.airtime.pro/embed/player?stream=s1&skin=2"></iframe>
|
||||
<iframe class="player" id="embed_player" frameborder="0" width="510px" height="396px" src="https://senderfm.airtime.pro/embed/player?stream=s1&skin=2"></iframe>
|
||||
<br>
|
||||
<h4 class="h4-headline">
|
||||
<h3 class="h3-headline">
|
||||
Sende-Wochenplan
|
||||
</h4>
|
||||
<iframe class="weekly-plan" height="400px" width="550px" scrolling="yes" frameborder="0" src=https://senderfm.airtime.pro/embed/weekly-program></iframe>
|
||||
<iframe class="weekly-plan" height="802px" width="550px" scrolling="yes" frameborder="0" src=https://senderfm.airtime.pro/embed/weekly-program></iframe>
|
||||
<br>
|
||||
<br>
|
||||
|
||||
@ -38,6 +38,12 @@ https://senderfm.out.airtime.pro/senderfm_a -->
|
||||
margin-bottom: 48px;
|
||||
}
|
||||
|
||||
.h1-headline {
|
||||
font-size: 48px;
|
||||
margin-top: 12px;
|
||||
margin-bottom: 8px;
|
||||
}
|
||||
|
||||
.h3-headline-big {
|
||||
font-size: 64px;
|
||||
margin-top: 12px;
|
||||
@ -45,7 +51,7 @@ https://senderfm.out.airtime.pro/senderfm_a -->
|
||||
}
|
||||
|
||||
.h3-headline {
|
||||
font-size: 24px;
|
||||
font-size: 32px;
|
||||
margin-top: 12px;
|
||||
margin-bottom: 8px;
|
||||
}
|
||||
@ -77,4 +83,7 @@ https://senderfm.out.airtime.pro/senderfm_a -->
|
||||
margin-bottom: 0px;
|
||||
margin-left: -20px;
|
||||
}
|
||||
.schedule.current, .schedule_content {
|
||||
max-height: 900px;
|
||||
}
|
||||
</style>
|
||||
|
||||
@ -1,20 +1,20 @@
|
||||
<!-- this file is replaced on rebranding by https://github.com/Ocelot-Social-Community/Ocelot-Social-Deploy-Rebranding/tree/master/branding/locales/html/ -->
|
||||
<!-- you can find and store templates at https://github.com/Ocelot-Social-Community/Ocelot-Social-Deploy-Rebranding/tree/master/branding/templates/ -->
|
||||
|
||||
<br>
|
||||
<h1 class="h3-headline-big">
|
||||
<!-- <br> -->
|
||||
<!-- <h1 class="h3-headline-big">
|
||||
sender.fm
|
||||
</h1>
|
||||
</h1> -->
|
||||
<!-- <img class="logo" alt="ocelot.social Header" src="/img/custom/logo-horizontal.svg" style="width: 360px;"><br> -->
|
||||
<p class="paragraph">
|
||||
<!-- <p class="paragraph">
|
||||
Here sender.fm will be described in the future …
|
||||
</p>
|
||||
<p class="link">
|
||||
</p> -->
|
||||
<!-- <p class="link">
|
||||
<a href="/login" target="_blank">
|
||||
Login …
|
||||
</a><br>
|
||||
</p>
|
||||
<br>
|
||||
<br> -->
|
||||
<h3 class="h3-headline">
|
||||
Our Radio Stream
|
||||
</h3>
|
||||
|
||||
@ -1,21 +1,35 @@
|
||||
<template>
|
||||
<div>
|
||||
<internal-page
|
||||
:pageParams="links.ORGANIZATION"
|
||||
/>
|
||||
<!-- Wolle <div>
|
||||
<ds-space margin="small">
|
||||
<ds-heading tag="h2">{{ $t('site.made') }}</ds-heading>
|
||||
</ds-space>
|
||||
<ds-container>
|
||||
<div v-html="$t('html.organization')" />
|
||||
</ds-container>
|
||||
</div>
|
||||
</div> -->
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import links from '~/constants/links.js'
|
||||
import InternalPage from '~/components/_new/features/InternalPage/InternalPage.vue'
|
||||
|
||||
export default {
|
||||
layout: 'basic',
|
||||
head() {
|
||||
return {
|
||||
title: this.$t('site.made'),
|
||||
}
|
||||
components: {
|
||||
InternalPage,
|
||||
},
|
||||
// Wolle
|
||||
layout: 'basic',
|
||||
data() {
|
||||
// Wolle console.log(links.ORGANIZATION)
|
||||
return { links }
|
||||
},
|
||||
// Wolle head() {
|
||||
// return {
|
||||
// title: this.$t('site.made'),
|
||||
// }
|
||||
// },
|
||||
}
|
||||
</script>
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user