tykayn
/
funky-framadate-front
mirror of https://framagit.org/framasoft/framadate/funky-framadate-front.git
1
1
Fork 0
Code Issues Projects Releases Wiki Activity

🎨 landing page white background

This commit is contained in:
Tykayn 2022-02-08 14:04:09 +01:00 committed by tykayn
parent f9c4eda5e7
commit 00f48d102a
10 changed files with 62 additions and 119 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

113
src/app/core/components/header/header.component.html
View File

@ -1,72 +1,55 @@
<header class="big-header"> <header class="big-header">
<div class="contained-desktop"> <div class="contained-desktop">
<nav class="navbar" role="navigation" aria-label="main navigation"> <div class="container">
<div class="navbar-brand"> <div class="columns">
<a class="logo-home-link navbar-item" routerLink="/"> <div class="column">
<img <nav class="navbar" role="navigation" aria-label="main navigation">
class="header-app-logo app-logo logo" <div class="navbar-brand">
*ngIf="appLogo" <a class="logo-home-link navbar-item" routerLink="/">
src="{{ appLogo }}" <img
alt="{{ appTitle }}" class="header-app-logo app-logo logo"
/> *ngIf="appLogo"
</a> src="{{ appLogo }}"
<a class="logo-home-link navbar-item" routerLink="/"> alt="{{ appTitle }}"
<span class="app-title"> />
{{ appTitle }} </a>
</span> <a class="logo-home-link navbar-item" routerLink="/">
</a> <span class="app-title">
</div> {{ appTitle }}
<div class="navbar-start"> </span>
<span class="navbar-item"> </a>
<a
*ngIf="environment.display_header_create_button"
class="button is-primary"
role="button"
routerLink="/administration"
routerLinkActive="is-active"
>
<i class="fa fa-plus-circle"></i>
<div class="is-hidden-touch">
{{ 'creation.init' | translate }}
</div> </div>
</a> <div class="navbar-start">
<a href="#" class="navbar-item is-visible-desktop"> <span class="navbar-item">
Explorer le libre <a
<i class="fa fa-chevron-down"></i> *ngIf="environment.display_header_create_button"
</a> class="button is-primary"
<a href="#" class="navbar-item is-visible-desktop"> role="button"
Des outils éthiques routerLink="/administration"
<i class="fa fa-chevron-down"></i> routerLinkActive="is-active"
</a> >
<a href="#" class="navbar-item is-visible-desktop"> <i class="fa fa-plus-circle"></i>
Changer le monde <div class="is-hidden-touch">
<i class="fa fa-chevron-down"></i> {{ 'creation.init' | translate }}
</a> </div>
<a href="#" class="navbar-item is-visible-desktop"> </a>
Entraide </span>
<i class="fa fa-chevron-down"></i> </div>
</a> <div class="navbar-end">
<span class="navbar-item is-visible-desktop"> <!-- navbar items -->
<app-language-selector></app-language-selector> <span class="navbar-item is-visible-desktop">
</span> <app-language-selector></app-language-selector>
</span> </span>
</div>
<!-- navbar items -->
<div class="mobile-menu" *ngIf="mobileMenuVisible">
<!-- menu mobile-->
<app-language-selector></app-language-selector>
</div>
</nav>
</div>
</div> </div>
<div class="navbar-end"> </div>
<!-- navbar items -->
<span class="navbar-item give-to-project">
<a href="https://soutenir.framasoft.org" class="button is-outlined">
Faire un don
</a>
</span>
</div>
<!-- navbar items -->
<div class="mobile-menu" *ngIf="mobileMenuVisible">
<!-- menu mobile-->
<app-language-selector></app-language-selector>
<!-- <app-navigation [appTitle]="appTitle" [appLogo]="appLogo"></app-navigation>-->
</div>
</nav>
<div <div
*ngIf="environment.showDemoWarning" *ngIf="environment.showDemoWarning"
class="demo demo-warning well debug has-text-white-bis has-background-warning-dark padded marged" class="demo demo-warning well debug has-text-white-bis has-background-warning-dark padded marged"

6
src/app/core/components/header/header.component.scss
View File

@ -5,11 +5,11 @@
line-height: 4rem; line-height: 4rem;
display: inline-block; display: inline-block;
} }
.navbar {
background: white;
}
.navbar-item { .navbar-item {
color: $white;
a { a {
color: $white;
&:hover { &:hover {
background: $primary_color; background: $primary_color;
color: $white; color: $white;

4
src/app/core/components/home/home.component.html
View File

@ -1,6 +1,6 @@
<section> <section>
<div class="landing-box"> <div class="landing-box">
<div class="landing contained-desktop content"> <div class="landing container content">
<div class="columns presentation"> <div class="columns presentation">
<div class="column"> <div class="column">
<h2 class="title is-2"> <h2 class="title is-2">
@ -11,7 +11,7 @@
</p> </p>
<div class="columns"> <div class="columns">
<div class="column"> <div class="column">
<a role="button" class="button is-fullwidth is-white" routerLink="administration"> <a role="button" class="button is-fullwidth is-primary" routerLink="administration">
{{ 'config.letsgo' | translate }} {{ 'config.letsgo' | translate }}
</a> </a>
</div> </div>

33
src/app/core/components/home/home.component.scss
View File

@ -2,39 +2,12 @@
:host { :host {
.landing-box { .landing-box {
background: $secondary_color;
padding: 70px 1em 6em; padding: 70px 1em 6em;
} color: $primary_color;
.title { .title {
color: $white; color: $primary_color !important;
margin-bottom: 1rem;
text-align: left;
}
.button {
color: $secondary_color !important;
background: $secondary_color;
text-align: center;
&.is-white {
background: $white;
}
&.is-secondary {
color: $white !important;
background: $secondary_color !important;
} }
} }
.subtitle {
text-align: left;
margin-top: 1rem;
min-height: 4em;
color: $white;
}
.poll-list {
margin: 2em 0;
}
a .fa { a .fa {
margin-right: 1ch; margin-right: 1ch;
} }

2
src/app/shared/components/selectors/language-selector/language-selector.component.scss
View File

@ -31,7 +31,7 @@
.lang-button { .lang-button {
color: $secondary_color; color: $secondary_color;
border: none; border: none;
padding: 0; padding: 0 1rem;
display: block; display: block;
line-height: $header-nav-height; line-height: $header-nav-height;
height: $header-nav-height; height: $header-nav-height;

2
src/app/shared/components/selectors/language-selector/language-selector.component.ts
View File

@ -15,7 +15,7 @@ export class LanguageSelectorComponent implements OnInit {
public availableLanguages: any = ['FR', 'EN', 'ES']; public availableLanguages: any = ['FR', 'EN', 'ES'];
language: string; language: string;
language_to_apply: string; language_to_apply: string;
display_lang_dialog: any = true; display_lang_dialog: boolean = false;
constructor( constructor(
private languageService: LanguageService, private languageService: LanguageService,

1
src/assets/i18n/en.json
View File

@ -33,6 +33,7 @@
"landing_title": "Organize events or collect the opinion of your relatives, simply, freely.", "landing_title": "Organize events or collect the opinion of your relatives, simply, freely.",
"landing_subtitle": "Thanks to {{AppTitle}} you can schedule, organize and quickly take decisions, easily and without registration.", "landing_subtitle": "Thanks to {{AppTitle}} you can schedule, organize and quickly take decisions, easily and without registration.",
"letsgo": "Create a new poll", "letsgo": "Create a new poll",
"discover": "Find an existing poll",
"description": "Shedule appointments with your friends or your family, or create a pool with text, pictures or links… A real survey!", "description": "Shedule appointments with your friends or your family, or create a pool with text, pictures or links… A real survey!",
"find_my_polls": "My polls", "find_my_polls": "My polls",
"find_helper": "I am looking for polls linked to my email", "find_helper": "I am looking for polls linked to my email",

2
src/assets/i18n/fr.json
View File

@ -33,7 +33,7 @@
"landing_title": "Organisez des évènements ou récoltez l’opinion de vos proches, simplement, librement.", "landing_title": "Organisez des évènements ou récoltez l’opinion de vos proches, simplement, librement.",
"landing_subtitle": "Grâce à {{AppTitle}} planifiez, organisez et prenez des décisions rapidement, simplement et sans inscription.", "landing_subtitle": "Grâce à {{AppTitle}} planifiez, organisez et prenez des décisions rapidement, simplement et sans inscription.",
"letsgo": "Créer un nouveau sondage", "letsgo": "Créer un nouveau sondage",
"discover": "Découvrir Framadate", "discover": "Accéder à un sondage existant",
"description": "Planifiez des rendez-vous avec vos amis ou votre famille ou créez un sondage avec du texte, des images ou des liens… un sondage quoi !", "description": "Planifiez des rendez-vous avec vos amis ou votre famille ou créez un sondage avec du texte, des images ou des liens… un sondage quoi !",
"find_my_polls": "Mes sondages", "find_my_polls": "Mes sondages",
"find_helper": "Je cherche d'autres sondages qui correspondent à mon mail", "find_helper": "Je cherche d'autres sondages qui correspondent à mon mail",

17
src/styles/partials/_navigation.scss
View File

@ -3,27 +3,14 @@ app-header {
color: $white; color: $white;
} }
.big-header { .big-header {
background: $secondary-color; border-bottom: solid 1px #ccc !important;
color: $white;
.container { .container {
background: $secondary-color;
color: $white;
box-shadow: none; box-shadow: none;
padding-bottom: 0;
} }
} }
// material override
.navbar {
margin-bottom: 0;
background: $secondary-color;
color: $white;
}
nav { nav {
background: $primary-color;
text-align: center;
border-bottom: 2px solid $primary-color;
a { a {
&::before { &::before {
display: inline-block; display: inline-block;

1
src/styles/themes/_base.scss
View File

@ -7,7 +7,6 @@
} }
.big-header { .big-header {
.container { .container {
padding-bottom: 5em;
.column:last-of-type { .column:last-of-type {
text-align: right; text-align: right;
} }