forked from potsda.mn/mobilizon
Merge branch 'new-unlogged-homepage' into 'master'
New unlogged homepage See merge request framasoft/mobilizon!630
This commit is contained in:
commit
656cc1f98f
Binary file not shown.
Before Width: | Height: | Size: 1.9 MiB |
Binary file not shown.
Before Width: | Height: | Size: 1.8 MiB |
BIN
js/public/img/pics/homepage_background.png
Normal file
BIN
js/public/img/pics/homepage_background.png
Normal file
Binary file not shown.
After Width: | Height: | Size: 186 KiB |
|
@ -133,6 +133,7 @@ export const ADMIN_SETTINGS_FRAGMENT = gql`
|
|||
instanceName
|
||||
instanceDescription
|
||||
instanceLongDescription
|
||||
instanceSlogan
|
||||
contact
|
||||
instanceTerms
|
||||
instanceTermsType
|
||||
|
@ -160,6 +161,7 @@ export const SAVE_ADMIN_SETTINGS = gql`
|
|||
$instanceName: String
|
||||
$instanceDescription: String
|
||||
$instanceLongDescription: String
|
||||
$instanceSlogan: String
|
||||
$contact: String
|
||||
$instanceTerms: String
|
||||
$instanceTermsType: InstanceTermsType
|
||||
|
@ -175,6 +177,7 @@ export const SAVE_ADMIN_SETTINGS = gql`
|
|||
instanceName: $instanceName
|
||||
instanceDescription: $instanceDescription
|
||||
instanceLongDescription: $instanceLongDescription
|
||||
instanceSlogan: $instanceSlogan
|
||||
contact: $contact
|
||||
instanceTerms: $instanceTerms
|
||||
instanceTermsType: $instanceTermsType
|
||||
|
|
|
@ -5,6 +5,7 @@ export const CONFIG = gql`
|
|||
config {
|
||||
name
|
||||
description
|
||||
slogan
|
||||
registrationsOpen
|
||||
registrationsAllowlist
|
||||
demoMode
|
||||
|
|
|
@ -11,6 +11,7 @@ export const GET_TODO = gql`
|
|||
actor {
|
||||
id
|
||||
preferredUsername
|
||||
domain
|
||||
name
|
||||
}
|
||||
title
|
||||
|
|
|
@ -386,7 +386,6 @@
|
|||
"Welcome back!": "Welcome back!",
|
||||
"Welcome to Mobilizon, {username}!": "Welcome to Mobilizon, {username}!",
|
||||
"Who can view this event and participate": "Who can view this event and participate",
|
||||
"World map": "World map",
|
||||
"Write something…": "Write something…",
|
||||
"You are participating in this event anonymously but didn't confirm participation": "You are participating in this event anonymously but didn't confirm participation",
|
||||
"You are participating in this event anonymously": "You are participating in this event anonymously",
|
||||
|
@ -806,5 +805,15 @@
|
|||
"{username} was invited to {group}": "{username} was invited to {group}",
|
||||
"The member was removed from the group {group}": "The member was removed from the group {group}",
|
||||
"The organiser has chosen to close comments.": "The organiser has chosen to close comments.",
|
||||
"Comments are closed for everybody else.": "Comments are closed for everybody else."
|
||||
"Comments are closed for everybody else.": "Comments are closed for everybody else.",
|
||||
"Instance Slogan": "Instance Slogan",
|
||||
"A short tagline for your instance homepage. Defaults to \"Gather ⋅ Organize ⋅ Mobilize\"": "A short tagline for your instance homepage. Defaults to \"Gather ⋅ Organize ⋅ Mobilize\"",
|
||||
"Learn more about {instance}": "Learn more about {instance}",
|
||||
"Unable to detect timezone.": "Unable to detect timezone.",
|
||||
"A practical tool": "A practical tool",
|
||||
"Mobilizon is a tool that helps you <b>find, create and organise events</b>.": "Mobilizon is a tool that helps you <b>find, create and organise events</b>.",
|
||||
"An ethical alternative": "An ethical alternative",
|
||||
"Ethical alternative to Facebook events, groups and pages, Mobilizon is a <b>tool designed to serve you</b>. Period.": "Ethical alternative to Facebook events, groups and pages, Mobilizon is a <b>tool designed to serve you</b>. Period.",
|
||||
"A federated software": "A federated software",
|
||||
"Mobilizon is not a giant platform, but a <b>multitude of interconnected Mobilizon websites</b>.": "Mobilizon is not a giant platform, but a <b>multitude of interconnected Mobilizon websites</b>."
|
||||
}
|
||||
|
|
|
@ -857,5 +857,15 @@
|
|||
"{username} was invited to {group}": "{username} a été invité à {group}",
|
||||
"The member was removed from the group {group}": "Le ou la membre a été supprimé·e du groupe {group}",
|
||||
"The organiser has chosen to close comments.": "L'organisateur·ice a choisi de fermer les commentaires.",
|
||||
"Comments are closed for everybody else.": "Les commentaires sont fermés pour tous·tes les autres."
|
||||
"Comments are closed for everybody else.": "Les commentaires sont fermés pour tous·tes les autres.",
|
||||
"Instance Slogan": "Slogan de l'instance",
|
||||
"A short tagline for your instance homepage. Defaults to \"Gather ⋅ Organize ⋅ Mobilize\"": "Un court slogan pour la page d'accueil de votre instance. La valeur par défaut est « Rassembler ⋅ Organiser ⋅ Mobiliser »",
|
||||
"Learn more about {instance}": "En savoir plus sur {instance}",
|
||||
"Unable to detect timezone.": "Impossible de détecter le fuseau horaire.",
|
||||
"A practical tool": "Un outil pratique",
|
||||
"Mobilizon is a tool that helps you <b>find, create and organise events</b>.": "Mobilizon est un outil qui vous permet de <b>trouver, créer et organiser des événements</b>.",
|
||||
"An ethical alternative": "Une alternative éthique",
|
||||
"Ethical alternative to Facebook events, groups and pages, Mobilizon is a <b>tool designed to serve you</b>. Period.": "Alternative éthique aux événements, groupes et pages Facebook, Mobilizon est <b>un outil conçu pour vous servir</b>. Point.",
|
||||
"A federated software": "Un logiciel fédéré",
|
||||
"Mobilizon is not a giant platform, but a <b>multitude of interconnected Mobilizon websites</b>.": "Mobilizon n’est pas une plateforme géante, mais une <b>multitude de sites web Mobilizon interconnectés</b>."
|
||||
}
|
||||
|
|
|
@ -34,6 +34,7 @@ export interface ILanguage {
|
|||
export interface IAdminSettings {
|
||||
instanceName: string;
|
||||
instanceDescription: string;
|
||||
instanceSlogan: string;
|
||||
instanceLongDescription: string;
|
||||
contact: string;
|
||||
instanceTerms: string;
|
||||
|
|
|
@ -6,6 +6,7 @@ export interface IConfig {
|
|||
description: string;
|
||||
longDescription: string;
|
||||
contact: string;
|
||||
slogan: string;
|
||||
|
||||
registrationsOpen: boolean;
|
||||
registrationsAllowlist: boolean;
|
||||
|
|
|
@ -28,6 +28,20 @@
|
|||
</small>
|
||||
<b-input type="textarea" v-model="adminSettings.instanceDescription" rows="2" />
|
||||
</div>
|
||||
<div class="field">
|
||||
<label class="label has-help">{{ $t("Instance Slogan") }}</label>
|
||||
<small>
|
||||
{{
|
||||
$t(
|
||||
'A short tagline for your instance homepage. Defaults to "Gather ⋅ Organize ⋅ Mobilize"'
|
||||
)
|
||||
}}
|
||||
</small>
|
||||
<b-input
|
||||
v-model="adminSettings.instanceSlogan"
|
||||
:placeholder="$t('Gather ⋅ Organize ⋅ Mobilize')"
|
||||
/>
|
||||
</div>
|
||||
<div class="field">
|
||||
<label class="label has-help">{{ $t("Contact") }}</label>
|
||||
<small>
|
||||
|
|
|
@ -1,9 +1,9 @@
|
|||
<template>
|
||||
<div>
|
||||
<section class="hero is-light is-bold" v-if="config && (!currentUser.id || !currentActor.id)">
|
||||
<div id="homepage">
|
||||
<section class="hero" v-if="config && (!currentUser.id || !currentActor.id)">
|
||||
<div class="hero-body">
|
||||
<div class="container">
|
||||
<h1 class="title">{{ $t("Gather ⋅ Organize ⋅ Mobilize") }}</h1>
|
||||
<h1 class="title">{{ config.slogan || $t("Gather ⋅ Organize ⋅ Mobilize") }}</h1>
|
||||
<p
|
||||
v-html="$t('Join <b>{instance}</b>, a Mobilizon instance', { instance: config.name })"
|
||||
/>
|
||||
|
@ -26,13 +26,17 @@
|
|||
<!-- We don't invite to find other instances yet -->
|
||||
<!-- <b-button v-else type="is-link" tag="a" href="https://joinmastodon.org">{{ $t('Find an instance') }}</b-button> -->
|
||||
<b-button type="is-text" tag="router-link" :to="{ name: RouteName.ABOUT }">
|
||||
{{ $t("Learn more about Mobilizon") }}
|
||||
{{ $t("Learn more about {instance}", { instance: config.name }) }}
|
||||
</b-button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
<div class="container section" v-if="config && (!currentUser.id || !currentActor.id)">
|
||||
<div
|
||||
id="featured_events"
|
||||
class="container section"
|
||||
v-if="config && (!currentUser.id || !currentActor.id)"
|
||||
>
|
||||
<section class="events-featured">
|
||||
<h2 class="title">{{ $t("Featured events") }}</h2>
|
||||
<b-loading :active.sync="$apollo.loading" />
|
||||
|
@ -48,6 +52,48 @@
|
|||
<b-message v-else type="is-danger">{{ $t("No events found") }}</b-message>
|
||||
</section>
|
||||
</div>
|
||||
<div id="picture" v-if="config && (!currentUser.id || !currentActor.id)">
|
||||
<div class="picture-container">
|
||||
<img src="/img/pics/2020-10-06-mobilizon-illustration-A_homepage.jpg" alt="" />
|
||||
</div>
|
||||
<div class="container section">
|
||||
<div class="columns">
|
||||
<div class="column">
|
||||
<h3 class="title">{{ $t("A practical tool") }}</h3>
|
||||
<p
|
||||
v-html="
|
||||
$t('Mobilizon is a tool that helps you <b>find, create and organise events</b>.')
|
||||
"
|
||||
/>
|
||||
</div>
|
||||
<div class="column">
|
||||
<h3 class="title">{{ $t("An ethical alternative") }}</h3>
|
||||
<p
|
||||
v-html="
|
||||
$t(
|
||||
'Ethical alternative to Facebook events, groups and pages, Mobilizon is a <b>tool designed to serve you</b>. Period.'
|
||||
)
|
||||
"
|
||||
/>
|
||||
</div>
|
||||
<div class="column">
|
||||
<h3 class="title">{{ $t("A federated software") }}</h3>
|
||||
<p
|
||||
v-html="
|
||||
$t(
|
||||
'Mobilizon is not a giant platform, but a <b>multitude of interconnected Mobilizon websites</b>.'
|
||||
)
|
||||
"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
<div class="buttons">
|
||||
<a class="button is-primary is-large" href="https://joinmobilizon.org">{{
|
||||
$t("Learn more about Mobilizon")
|
||||
}}</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="container section" v-if="config && loggedUser && loggedUser.settings">
|
||||
<section v-if="currentActor.id">
|
||||
<b-message type="is-info" v-if="welcomeBack">{{
|
||||
|
@ -343,6 +389,8 @@ export default class Home extends Vue {
|
|||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
@import "~bulma/sass/utilities/mixins.sass";
|
||||
|
||||
main > div > .container {
|
||||
background: $white;
|
||||
padding: 1rem 1.5rem 3rem;
|
||||
|
@ -388,7 +436,20 @@ span.view-all {
|
|||
}
|
||||
|
||||
section.hero {
|
||||
background: lighten($secondary, 20%);
|
||||
position: relative;
|
||||
z-index: 1;
|
||||
|
||||
&::before {
|
||||
content: "";
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
opacity: 0.3;
|
||||
z-index: -1;
|
||||
background: url("/img/pics/homepage_background.png");
|
||||
}
|
||||
|
||||
& > .hero-body {
|
||||
padding: 1rem 1.5rem 3rem;
|
||||
|
@ -406,4 +467,71 @@ section.hero {
|
|||
margin-bottom: 1rem;
|
||||
}
|
||||
}
|
||||
|
||||
#featured_events {
|
||||
padding: 1rem 0;
|
||||
min-height: calc(100vh - 400px);
|
||||
z-index: 10;
|
||||
|
||||
.title {
|
||||
margin: 20px auto 0;
|
||||
}
|
||||
|
||||
.columns {
|
||||
margin: 0rem auto 3rem;
|
||||
}
|
||||
}
|
||||
|
||||
#picture {
|
||||
.picture-container {
|
||||
position: relative;
|
||||
&::before {
|
||||
content: "";
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
background: linear-gradient(
|
||||
0deg,
|
||||
$white 0,
|
||||
rgba(0, 0, 0, 0) 5%,
|
||||
rgba(0, 0, 0, 0) 90%,
|
||||
$white 100%
|
||||
);
|
||||
z-index: 1;
|
||||
}
|
||||
|
||||
& > img {
|
||||
object-fit: cover;
|
||||
max-height: 80vh;
|
||||
display: block;
|
||||
margin: auto;
|
||||
width: 100%;
|
||||
}
|
||||
}
|
||||
|
||||
.container.section {
|
||||
background: $white;
|
||||
|
||||
@include tablet {
|
||||
margin-top: -4rem;
|
||||
}
|
||||
z-index: 10;
|
||||
|
||||
.title {
|
||||
margin: 0 0 10px;
|
||||
font-size: 30px;
|
||||
}
|
||||
|
||||
.buttons {
|
||||
justify-content: center;
|
||||
margin-top: 2rem;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
#homepage {
|
||||
background: $white;
|
||||
}
|
||||
</style>
|
||||
|
|
|
@ -75,6 +75,7 @@ defmodule Mobilizon.GraphQL.Resolvers.Config do
|
|||
demo_mode: Config.instance_demo_mode?(),
|
||||
description: Config.instance_description(),
|
||||
long_description: Config.instance_long_description(),
|
||||
slogan: Config.instance_slogan(),
|
||||
languages: Config.instance_languages(),
|
||||
anonymous: %{
|
||||
participation: %{
|
||||
|
|
|
@ -89,6 +89,7 @@ defmodule Mobilizon.GraphQL.Schema.AdminType do
|
|||
field(:instance_name, :string)
|
||||
field(:instance_description, :string)
|
||||
field(:instance_long_description, :string)
|
||||
field(:instance_slogan, :string)
|
||||
field(:contact, :string)
|
||||
field(:instance_terms, :string)
|
||||
field(:instance_terms_type, :instance_terms_type)
|
||||
|
@ -181,6 +182,7 @@ defmodule Mobilizon.GraphQL.Schema.AdminType do
|
|||
arg(:instance_name, :string)
|
||||
arg(:instance_description, :string)
|
||||
arg(:instance_long_description, :string)
|
||||
arg(:instance_slogan, :string)
|
||||
arg(:contact, :string)
|
||||
arg(:instance_terms, :string)
|
||||
arg(:instance_terms_type, :instance_terms_type)
|
||||
|
|
|
@ -12,6 +12,7 @@ defmodule Mobilizon.GraphQL.Schema.ConfigType do
|
|||
field(:name, :string)
|
||||
field(:description, :string)
|
||||
field(:long_description, :string)
|
||||
field(:slogan, :string)
|
||||
field(:contact, :string)
|
||||
|
||||
field(:languages, list_of(:string))
|
||||
|
|
|
@ -36,6 +36,9 @@ defmodule Mobilizon.Config do
|
|||
"instance_long_description"
|
||||
)
|
||||
|
||||
@spec instance_slogan :: String.t()
|
||||
def instance_slogan, do: Mobilizon.Admin.get_admin_setting_value("instance", "instance_slogan")
|
||||
|
||||
@spec contact :: String.t()
|
||||
def contact do
|
||||
Mobilizon.Admin.get_admin_setting_value("instance", "contact")
|
||||
|
@ -320,6 +323,7 @@ defmodule Mobilizon.Config do
|
|||
instance_description: instance_description(),
|
||||
instance_long_description: instance_long_description(),
|
||||
instance_name: instance_name(),
|
||||
instance_slogan: instance_slogan(),
|
||||
registrations_open: instance_registrations_open?(),
|
||||
contact: contact(),
|
||||
instance_terms: instance_terms(),
|
||||
|
|
Loading…
Reference in a new issue