This commit is contained in:
Clément 2018-10-05 11:55:29 +02:00
parent 51ccde0c0e
commit 3fa8602e2c
17 changed files with 408 additions and 11 deletions

3
src/config.pug Normal file
View File

@ -0,0 +1,3 @@
//- var sdn = process.env.SDN || 'http://127.0.0.1:8000'
- var sdn = process.env.SDN || 'https://test-paris.happy-dev.fr'
- var cdn = process.env.CDN || 'https://cdn.happy-dev.fr'

17
src/header.pug Normal file
View File

@ -0,0 +1,17 @@
#button-toggle
#logo
img(src="/images/logo.png" width=111 height=32)
#search-bar
div
input#search-input(type='search')
i#search-icon.icon-magnifier(aria-hidden='true')
i#close-search-icon.icon-close(aria-hidden='true')
#notification
#profile
img(src="/images/user.png" width=43 height=43)
span
| Sophie
span.icon-arrow-down

2
src/page-group-chat.pug Normal file
View File

@ -0,0 +1,2 @@
#group-chat.chat-view(bind-resources)
sib-chat(data-authentication='login', data-auto-login='true', data-bosh-service-url='https://jabber.happy-dev.fr/http-bind/', data-debug='false', data-locales-url='en', bind-resources)

View File

@ -0,0 +1,7 @@
#group-create
sib-form(
data-src=`${sdn}/channels/`,
range-owner=`${sdn}/members/`,
widget-members='sib-form-multiple-dropdown',
range-members=`${sdn}/members/`
)

7
src/page-group-edit.pug Normal file
View File

@ -0,0 +1,7 @@
#group-edit
sib-form(
range-owner=`${sdn}/members/`,
widget-members='sib-form-multiple-dropdown',
range-members=`${sdn}/members/`,
bind-resources
)

View File

@ -0,0 +1,36 @@
script.
document.addEventListener('WebComponentsReady', function(event) {
class HDAppMember extends SIBWidget {
get template() {
return `
<div name="${this.name}">
<img src="${this.value.avatar}"/>
</div>
`;
}
render() {
store.get(this.value).then( (value) => {
this._value = value;
this.innerHTML = this.template;
});
}
}
customElements.define("hdapp-member", HDAppMember);
});
#group-profile
sib-display(
data-fields='name, description, owner',
widget-owner='hdapp-member',
bind-resources
)
h2.section.skills Participants
sib-display(
id-suffix='members',
data-fields='avatar, user',
widget-avatar='sib-display-img',
widget-user='hdapp-userinfo',
bind-resources
)

18
src/page-group.pug Normal file
View File

@ -0,0 +1,18 @@
sib-router#group-router(default-route='group-chat')
sib-route(name='group-chat')
div Chat
sib-route(name='group-profile')
div Info
sib-route(name='group-edit')
div Éditer
sib-route(name='group-create')
div Nouveau
#network-views-container
#group-chat
include page-group-chat.pug
#group-profile
include page-group-profile.pug
#group-edit
include page-group-edit.pug
#group-create
include page-group-create.pug

7
src/page-groups.pug Normal file
View File

@ -0,0 +1,7 @@
#groups
sib-display#groups-list(
data-src=`${sdn}/channels/`,
data-fields='name, description',
search-fields='name, description',
next='group'
)

View File

@ -15,4 +15,3 @@ sib-router#member-router(default-route='member-chat')
include page-member-profile.pug include page-member-profile.pug
#member-edit #member-edit
include page-member-edit.pug include page-member-edit.pug
mucreokyordoriptyis7

View File

@ -1,7 +1,6 @@
// job offers // job offers
#offers-list { #offers-list {
> div { > div {
display: none;
> sib-display { > sib-display {
display: block; display: block;
margin: 1em 0; margin: 1em 0;
@ -11,13 +10,42 @@
&:nth-child(odd) { &:nth-child(odd) {
background-color: $color-white; background-color: $color-white;
} }
sib-display-div[name=title]{ sib-display-div[name='title'] {
display: block; display: block;
@extend h1; @extend h2;
background-color: red; }
label {
display: none;
}
hdapp-author {
ul {
@include list-reset();
} }
} }
} }
}
}
// skills
sib-display-lookuplist[name='skills'] {
ul,
li {
display: block;
margin: 0;
padding: 0;
list-style: none;
}
ul {
display: flex;
flex-wrap: wrap;
margin: 0 -0.25em;
}
li {
padding: 0.5em 1em;
border: 1px solid;
border-radius: 0.25em;
margin: 0.25em;
}
} }
// chat // chat
@ -32,7 +60,6 @@
} }
} }
.members-list-condensed { .members-list-condensed {
display: block; display: block;
img { img {
@ -53,10 +80,9 @@
} }
} }
// member-profile && member // member-profile && member
sib-display#member-info, sib-display#member-info,
#profiles-list>div>sib-display{ #profiles-list > div > sib-display {
display: block; display: block;
position: relative; position: relative;
background-color: $color-white; background-color: $color-white;
@ -92,4 +118,3 @@ sib-display#member-info,
grid-gap: 1em; grid-gap: 1em;
} }
} }

35
src/styles/form.scss Normal file
View File

@ -0,0 +1,35 @@
//button, checkbox, color, date, datetime-local, email, file, hidden, image, month, number, password, radio, range, reset, search, submit, tel, text, time, url, week, datetime
sib-form{
form{
margin: -.5em;
>*{
margin: .5em;
}
}
// text like
input:not([type=button]):not([type=checkbox]):not([type=color]):not([type=file]):not([type=hidden]):not([type=image]):not([type=radio]):not([type=range]):not([type=reset]):not([type=submit]){
padding: 0.5em;
border: none;
@extend %shadow;
}
// button like
button,
input[type=button],
input[type=color],
input[type=file],
input[type=reset],
input[type=submit]{
padding: 0.5em 1em;
border: none;
background-color: $color-yellow;
border-radius: 100em;
}
input[type="reset"]{
display: none;
}
}

View File

@ -9,6 +9,6 @@
@import 'form'; @import 'form';
@import 'content'; @import 'content';
@import 'members'; // @import 'members';
@import 'menu'; @import 'menu';

222
src/styles/members.scss Normal file
View File

@ -0,0 +1,222 @@
// members
%img-circle {
$width: 55%;
display: block;
position: relative;
width: $width;
padding-bottom: $width;
height: 0;
margin: 2em auto;
img {
display: block;
position: absolute;
width: 100%;
height: 100%;
border-radius: 100%;
object-fit: cover;
object-position: center;
}
}
%member {
sib-display-img {
@extend %img-circle;
}
display: block;
position: relative;
background-color: $color-white;
@extend %shadow;
padding: 0.5em;
cursor: pointer;
&::before,
&::after {
position: absolute;
top: 0;
right: 0;
bottom: 0;
left: 0;
transform: scale3d(0, 0, 1);
transition: transform 0.3s ease-out 0s;
background: #eac1;
content: '';
pointer-events: none;
}
&::before {
transform-origin: left top;
}
&::after {
transform-origin: right bottom;
background: #ace1;
}
&:hover,
&:focus {
&::before,
&::after {
transform: scale3d(1, 1, 1);
}
}
}
#profiles-list {
display: block;
div[name='header'] {
border-top: 2em solid $color-grey-light;
border-bottom: 1px solid $color-grey-light;
padding-bottom: 1em;
margin: -0.5em;
padding: 0.5em;
margin-bottom: 1em;
text-align: center;
}
> div {
display: grid;
margin-top: 1em;
grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
grid-gap: 1em;
label {
display: none;
}
> sib-display {
@extend %member;
}
}
hdapp-userinfo {
display: block;
color: $color-black;
font-size: 1.1em;
margin: 0.5em;
ul,
li {
display: block;
margin: 0;
padding: 0;
list-style: none;
}
}
div[name='pseudonym'] {
font-size: 0.8em;
div {
display: inline;
}
}
}
// member
%detail-section {
font-weight: bold;
font-size: 18px;
}
#member-chat {
#conversejs {
margin: none;
}
}
#member-info {
background-color: $color-white;
padding: 1em;
@extend %shadow;
}
#profiles-list,
#member-info {
img {
display: block;
}
img {
width: 100%;
}
div[name='name'] {
@extend %detail-section;
padding-top: 10px;
}
div[name='name'],
div[name='location'] {
display: flex;
}
}
#member-detail {
#member-info {
sib-display-mailto,
sib-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;
}
}
}
.section {
position: relative;
h2 {
@extend %detail-section;
margin-top: 40px;
}
}
#member-skills {
display: flex;
flex-wrap: wrap;
sib-display {
display: block;
background-color: $color-black;
color: $color-white;
border-radius: 100px;
padding: 3px 10px;
margin-bottom: 5px;
margin-right: 5px;
}
}
}
@include media('width>phone') {
#member-detail {
#member-info {
sib-display-img {
display: block;
float: right;
width: 300px;
}
}
}
}
#member-info {
@extend %member;
}

8
www/.htaccess Normal file
View File

@ -0,0 +1,8 @@
<IfModule mod_rewrite.c>
RewriteEngine On
RewriteBase /
RewriteRule \. - [L]
RewriteCond %{REQUEST_FILENAME} !-f
RewriteCond %{REQUEST_FILENAME} !-d
RewriteRule . /index.html [L]
</IfModule>

BIN
www/images/logo.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 3.9 KiB

BIN
www/images/user.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 8.0 KiB

View File

@ -0,0 +1,11 @@
{
"authority": "https://test-paris.happy-dev.fr/openid/",
"client_id": "125356",
"redirect_uri": "https://staging-app.happy-dev.fr",
"response_type": "id_token token",
"scope": "openid profile email",
"automaticSilentRenew": true,
"silent_redirect_uri": "https://staging-app.happy-dev.fr",
"loadUserInfo": true
}