Added the dashboard page

This commit is contained in:
Alexandre Bourlier 2018-04-22 08:47:18 +02:00
parent e0ff0d1792
commit ed189a8129
6 changed files with 62 additions and 36 deletions

View File

@ -33,6 +33,7 @@
<?php require_once('src/html/menu.html'); ?>
<main id="mainContainer" class="container-fluid">
<?php require_once('src/html/dashboard.html'); ?>
<?php require_once('src/html/members.html'); ?>
<?php require_once('src/html/member.html'); ?>
<?php require_once('src/html/projects.html'); ?>

8
src/html/dashboard.html Normal file
View File

@ -0,0 +1,8 @@
<div id="dashboard" style="display: none">
<form>
<div class="form-group">
<input type="text" class="form-control form-control-sm" id="search-input" placeholder="Recherche" aria-describedby="search-help" autofocus />
<small id="search-help" class="form-text text-muted">* parmi les membres, les projets et les groupes de discussion</small>
</div>
</form>
</div>

View File

@ -1,30 +1,32 @@
<nav class="navbar bg-white fixed-top border-bottom pb-0 d-md-flex" id="navbar">
<div id="menu-title" class="col-4 col-md-2 pb-2">HAPPY APP</div>
<!--<ldp-router>-->
<!--<ldp-route id="menu-title" class=" pb-2" name="dashboard">HAPPY APP</ldp-route>-->
<!--</ldp-router>-->
<ldp-router id="navbar-router" class="navbar-nav d-flex flex-row justify-content-between align-self-end col-8 col-md-10" default-route="members">
<ldp-route class="nav-item pl-4 pr-4 pb-2 align-self-stretch w-25 text-center text-md-left" name="search">
<i class="fa fa-search" aria-hidden="true"></i>
<span class="d-none d-md-inline"> Home</span>
<ldp-router id="navbar-router" class="navbar-nav" default-route="members">
<ldp-route id="menu-title" class="col-4 col-md-2 nav-item" name="dashboard">
HAPPY DEV
</ldp-route>
<ldp-route class="nav-item pl-4 pr-4 pb-2 active align-self-stretch w-25 text-center text-md-left" name="members">
<i class="fa fa-users" aria-hidden="true"></i>
<span class="d-none d-md-inline"> Membres</span>
</ldp-route>
<ldp-route class="nav-item d-none" name="member" id-prefix="http://localhost:8000/members/">
Membre
</ldp-route>
<ldp-route class="nav-item pl-4 pr-4 pb-2 align-self-stretch w-25 text-center text-md-left" name="projects">
<i class="fa fa-tasks" aria-hidden="true"></i>
<span class="d-none d-md-inline"> Projets</span>
</ldp-route>
<ldp-route class="nav-item d-none" name="project" id-prefix="http://localhost:8000/projects/">
Projet
</ldp-route>
<ldp-route class="nav-item pl-4 pr-4 pb-2 align-self-stretch w-25 text-center text-md-left" name="groups">
<i class="fa fa-comments" aria-hidden="true"></i>
<span class="d-none d-md-inline"> Groupes</span>
</ldp-route>
<!--<ldp-route class="nav-item" name="calendar">Agenda</ldp-route>-->
<!--<ldp-route class="nav-item" name="drive">Drive</ldp-route>-->
<div id="menu-items" class="col-8 col-md-10">
<ldp-route class="nav-item pl-4 pr-4 pb-2 active align-self-stretch text-center text-md-left" name="members">
<i class="fa fa-users" aria-hidden="true"></i>
<span class="d-none d-md-inline"> Membres</span>
</ldp-route>
<ldp-route class="nav-item d-none" name="member" id-prefix="http://localhost:8000/members/">
Membre
</ldp-route>
<ldp-route class="nav-item pl-4 pr-4 pb-2 align-self-stretch text-center text-md-left" name="projects">
<i class="fa fa-tasks" aria-hidden="true"></i>
<span class="d-none d-md-inline"> Projets</span>
</ldp-route>
<ldp-route class="nav-item d-none" name="project" id-prefix="http://localhost:8000/projects/">
Projet
</ldp-route>
<ldp-route class="nav-item pl-4 pr-4 pb-2 align-self-stretch text-center text-md-left" name="groups">
<i class="fa fa-comments" aria-hidden="true"></i>
<span class="d-none d-md-inline"> Groupes</span>
</ldp-route>
</div>
</ldp-router>
</nav>

6
src/scss/_dashboard.scss Normal file
View File

@ -0,0 +1,6 @@
#dashboard {
#search-help {
font-style: italic;
padding-left: 5px;
}
}

View File

@ -1,23 +1,31 @@
#navbar {
z-index: 9999;
#menu-title {
font-family: bebas;
color: $hd-color;
font-size: $menu-font-size;
}
#navbar-router {
color: $twitter-color;
width: 100%;
display: flex;
justify-content: space-between;
flex-direction: row;
color: $twitter-color;
#menu-title {
font-family: bebas;
color: $hd-color;
font-size: $menu-font-size;
text-align: center;
}
#menu-items {
display: flex;
justify-content: space-between;
}
ldp-route {
cursor: pointer;
font-size: 18px;
}
ldp-route:hover {
text-decoration: underline;
}
#menu-title[active],
ldp-route[active] {
border-bottom: 2px solid $hd-color;
color: $hd-color;

View File

@ -8,3 +8,4 @@
@import "groupsList";
@import "project";
@import "projectsList";
@import "dashboard";