Moved forward on member page
This commit is contained in:
parent
b0b24baa20
commit
e0ff0d1792
|
@ -1 +1 @@
|
||||||
Subproject commit f5abe21e988caffd13d547438ec6c62bbb1a9340
|
Subproject commit 45b3c7097a270319df06cf008a4413be461f6af0
|
|
@ -1,21 +1,34 @@
|
||||||
<div id="member" style="display: none">
|
<div id="member" class="view-with-vertical-menu" style="display: none">
|
||||||
|
<ldp-router id="member-page-router" class="vertical-menu border-left" default-route="member-chat">
|
||||||
|
<ldp-route name="member-chat">
|
||||||
|
<i class="fa fa-comment-o" aria-hidden="true"></i>
|
||||||
|
</ldp-route>
|
||||||
|
<ldp-route name="member-profile">
|
||||||
|
<i class="fa fa-user" aria-hidden="true"></i>
|
||||||
|
</ldp-route>
|
||||||
|
</ldp-router>
|
||||||
|
|
||||||
<hd-chat-window
|
<hd-chat-window
|
||||||
|
id="member-chat"
|
||||||
data-authentication="anonymous"
|
data-authentication="anonymous"
|
||||||
data-auto-login="true"
|
data-auto-login="true"
|
||||||
data-bosh-service-url="https://conversejs.org/http-bind/"
|
data-bosh-service-url="https://conversejs.org/http-bind/"
|
||||||
data-debug="true"
|
data-debug="false"
|
||||||
data-jid="nomnom.im"
|
data-jid="nomnom.im"
|
||||||
data-locales-url="http://hd-app.local/dist/lib/xmpp-chat-component/node_modules/converse.js/locale/{{{locale}}}/LC_MESSAGES/converse.json",
|
data-locales-url="http://hd-app.local/dist/lib/xmpp-chat-component/node_modules/converse.js/locale/{{{locale}}}/LC_MESSAGES/converse.json",
|
||||||
data-room-jid="anonymous@conference.nomnom.im">
|
data-room-jid="anonymous@conference.nomnom.im">
|
||||||
</hd-chat-window>
|
</hd-chat-window>
|
||||||
|
|
||||||
<ldp-display
|
<ldp-display
|
||||||
id="profile"
|
id="member-profile"
|
||||||
set-name="firstname, name-separator, lastname"
|
set-name="firstname, name-separator, lastname"
|
||||||
value-name-separator=" "
|
value-name-separator=" "
|
||||||
set-location="city, city-separator, country"
|
set-location="city, city-separator, country"
|
||||||
value-city-separator=", "
|
value-city-separator=", "
|
||||||
data-fields="avatar, name, location"
|
data-fields="avatar, name, location, email, number"
|
||||||
widget-avatar="ldp-display-img"
|
widget-avatar="ldp-display-img"
|
||||||
|
widget-email="ldp-display-mailto"
|
||||||
|
widget-number="ldp-display-tel"
|
||||||
bind-resources
|
bind-resources
|
||||||
></ldp-display>
|
></ldp-display>
|
||||||
</div>
|
</div>
|
||||||
|
|
|
@ -1,6 +1,6 @@
|
||||||
<div id="members" class="view" style="display: none">
|
<div id="members" class="view" style="display: none">
|
||||||
<ldp-display
|
<ldp-display
|
||||||
id="profilesList"
|
id="profiles-list"
|
||||||
data-src="http://localhost:8000/members/"
|
data-src="http://localhost:8000/members/"
|
||||||
set-name="firstname, name-separator, lastname"
|
set-name="firstname, name-separator, lastname"
|
||||||
value-name-separator=" "
|
value-name-separator=" "
|
||||||
|
|
|
@ -1,9 +1,9 @@
|
||||||
<nav class="navbar bg-white fixed-top border-bottom pb-0 d-md-flex" id="navbar">
|
<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>
|
<div id="menu-title" class="col-4 col-md-2 pb-2">HAPPY APP</div>
|
||||||
|
|
||||||
<ldp-router id="navbar-router" class="navbar-nav d-flex flex-row justify-content-between align-self-end col-8 col-md-10" root="ldp-root" default-route="members">
|
<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="home">
|
<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-home" aria-hidden="true"></i>
|
<i class="fa fa-search" aria-hidden="true"></i>
|
||||||
<span class="d-none d-md-inline"> Home</span>
|
<span class="d-none d-md-inline"> Home</span>
|
||||||
</ldp-route>
|
</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">
|
<ldp-route class="nav-item pl-4 pr-4 pb-2 active align-self-stretch w-25 text-center text-md-left" name="members">
|
||||||
|
|
|
@ -0,0 +1,58 @@
|
||||||
|
#member-chat {
|
||||||
|
#conversejs {
|
||||||
|
margin: none;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
#profiles-list,
|
||||||
|
#member-profile {
|
||||||
|
img {
|
||||||
|
display: block;
|
||||||
|
}
|
||||||
|
|
||||||
|
&, img {
|
||||||
|
width: 100%;
|
||||||
|
max-width: 320px;
|
||||||
|
min-width: 100%;
|
||||||
|
}
|
||||||
|
|
||||||
|
div[name="name"] {
|
||||||
|
padding-top: 10px;
|
||||||
|
font-weight: bold;
|
||||||
|
font-size: 18px;
|
||||||
|
}
|
||||||
|
|
||||||
|
div[name="name"],
|
||||||
|
div[name="location"] {
|
||||||
|
display: flex;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
#member-profile {
|
||||||
|
ldp-display-mailto,
|
||||||
|
ldp-display-tel {
|
||||||
|
display: block;
|
||||||
|
}
|
||||||
|
|
||||||
|
a[name="email"],
|
||||||
|
a[name="number"] {
|
||||||
|
&::before {
|
||||||
|
font-family: FontAwesome;
|
||||||
|
padding-right: 4px;
|
||||||
|
color: black;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
a[name="email"] {
|
||||||
|
&::before {
|
||||||
|
content: "\f0e0";
|
||||||
|
}
|
||||||
|
}
|
||||||
|
a[name="number"] {
|
||||||
|
&::before {
|
||||||
|
content: "\f10b";
|
||||||
|
font-size: 22px;
|
||||||
|
padding-left: 3px;
|
||||||
|
padding-right: 7px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
|
@ -1,19 +1,6 @@
|
||||||
#profilesList {
|
#profiles-list {
|
||||||
ldp-display {
|
ldp-form {
|
||||||
img {
|
background-color: #F3F3F3;
|
||||||
display: block;
|
|
||||||
}
|
|
||||||
|
|
||||||
&, img {
|
|
||||||
width: 100%;
|
|
||||||
max-width: 320px;
|
|
||||||
min-width: 100%;
|
|
||||||
}
|
|
||||||
|
|
||||||
div[name="name"],
|
|
||||||
div[name="location"] {
|
|
||||||
display: flex;
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
|
@ -4,7 +4,7 @@
|
||||||
#menu-title {
|
#menu-title {
|
||||||
font-family: bebas;
|
font-family: bebas;
|
||||||
color: $hd-color;
|
color: $hd-color;
|
||||||
font-size: 17px;
|
font-size: $menu-font-size;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
|
@ -19,9 +19,38 @@
|
||||||
text-decoration: underline;
|
text-decoration: underline;
|
||||||
}
|
}
|
||||||
ldp-route[active] {
|
ldp-route[active] {
|
||||||
font-weight: bold;
|
|
||||||
border-bottom: 2px solid $hd-color;
|
border-bottom: 2px solid $hd-color;
|
||||||
color: $hd-color;
|
color: $hd-color;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.vertical-menu {
|
||||||
|
position: fixed;
|
||||||
|
z-index: 9998;
|
||||||
|
top: 0px;
|
||||||
|
bottom: 0px;
|
||||||
|
right: 0px;
|
||||||
|
margin: auto;
|
||||||
|
background-color: white;
|
||||||
|
width: $vertical-menu-width;
|
||||||
|
padding-top: $menu-height;
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
color: $twitter-color;
|
||||||
|
font-size: $menu-font-size;
|
||||||
|
|
||||||
|
ldp-route {
|
||||||
|
text-align: center;
|
||||||
|
padding: 6px 0px;
|
||||||
|
|
||||||
|
&[active] {
|
||||||
|
border-left: 2px solid $hd-color;
|
||||||
|
color: $hd-color;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.view-with-vertical-menu {
|
||||||
|
padding-right: $vertical-menu-width;
|
||||||
|
}
|
||||||
|
|
|
@ -1,4 +1,6 @@
|
||||||
$hd-color: rgb(253, 200, 21);
|
$hd-color: rgb(253, 200, 21);
|
||||||
$twitter-color: #1DA1F2;
|
$twitter-color: #1DA1F2;
|
||||||
|
|
||||||
$menu-height : 50px;
|
$menu-height: 50px;
|
||||||
|
$menu-font-size: 17px;
|
||||||
|
$vertical-menu-width: 50px;
|
||||||
|
|
|
@ -4,6 +4,7 @@
|
||||||
@import "home";
|
@import "home";
|
||||||
@import "menu";
|
@import "menu";
|
||||||
@import "members";
|
@import "members";
|
||||||
|
@import "member";
|
||||||
@import "groupsList";
|
@import "groupsList";
|
||||||
@import "project";
|
@import "project";
|
||||||
@import "projectsList";
|
@import "projectsList";
|
||||||
|
|
Loading…
Reference in New Issue