diff --git a/src/dependencies.pug b/src/dependencies.pug index 7791200c2f8fdf16ae3526b0d1eaa2af60a2885c..27d28aeb2ea84792f9d6f5fa5523cb32fd43c4a1 100644 --- a/src/dependencies.pug +++ b/src/dependencies.pug @@ -3,7 +3,7 @@ script(src="/lib/webcomponentsjs/webcomponents-loader.js") //- script(src="lib/html-imports.js") -script(src='/lib/sib-chat/3rdparty/sib-oidc-client.js') +//- script(src='/lib/sib-chat/3rdparty/sib-oidc-client.js') script(src="/scripts/index.js") // Stylesheets @@ -20,7 +20,7 @@ link(href="https://fonts.googleapis.com/css?family=Open+Sans:300,300i,400,400i,6 //- local link(rel='import', href='/lib/sib-core/sib-display.html') link(rel='import', href='/lib/sib-router/sib-router.html') -link(rel='import', href='/lib/sib-chat/sib-chat.html') +//- link(rel='import', href='/lib/sib-chat/sib-chat.html') //- cdn link(rel='import', href="https://cdn.happy-dev.fr/sib-core/sib-display.html") diff --git a/src/menu.pug b/src/menu.pug index 6989aa912f302ae765918d94de75ae617f786d7e..7a4c898b1ba5cdfac78553b6d9d2e39c93503e05 100644 --- a/src/menu.pug +++ b/src/menu.pug @@ -4,12 +4,12 @@ div div(hidden) div#menu-items sib-route(name='members') - div.icon-people Membres + div.icon-people Members sib-route(hidden, name='member', id-prefix=`${sdn}/members/`) sib-route(name='job-offers') div.icon-briefcase Job offers div - div.icon-folder-alt Projets + div.icon-folder-alt Projects sib-display( data-src=`${sdn}/projects/`, data-fields='name', diff --git a/src/page-group-edit.pug b/src/page-group-edit.pug index 452d565792320e40383cae9cb5ba831f5621864c..b575a69ae403ebc3d1ba7fb482bc2da178dc577e 100644 --- a/src/page-group-edit.pug +++ b/src/page-group-edit.pug @@ -1,5 +1,5 @@ #group-edit - sib-form( + sib-form.block( range-owner=`${sdn}/members/`, widget-members='sib-form-multiple-dropdown', range-members=`${sdn}/members/`, diff --git a/src/page-member-edit.pug b/src/page-member-edit.pug index 78986578e07658cfa4cba49df457b60fbbc266a4..1d4ecc86dae61a6198635f1c00e6661327af0699 100644 --- a/src/page-member-edit.pug +++ b/src/page-member-edit.pug @@ -18,7 +18,7 @@ label.d-none(for='avatar-input') img#avatar-preview(src='', style='width: 100%;') input#avatar-input.d-none(accept='image/*', name='avatar', value='', type='file') -sib-form.edit-form( +sib-form.edit-form.block( data-fields='user, avatar, bio, cell, jabberID, number, pseudo, skills, website', widget-user='hdapp-usereditinfo', range-cell=`${sdn}/cells/`, widget-skills='sib-form-multiple-dropdown', diff --git a/src/page-project-edit.pug b/src/page-project-edit.pug index df14b243b88e6c9b84ac459c6b914faea34dfb83..325ad0bf84155e141ae1350a3739a73ec180d024 100644 --- a/src/page-project-edit.pug +++ b/src/page-project-edit.pug @@ -1,5 +1,5 @@ #project-edit - sib-form( + sib-form.block( range-client=`${sdn}/clients/`, widget-team='sib-form-multiple-dropdown', range-team=`${sdn}/members/`, diff --git a/src/styles/content.scss b/src/styles/content.scss index 1d14b1aa428b1ae1b9f9470f3ff607be4ba2791f..54e84f78dd87bdc6cbeb0cafac92661450108efb 100644 --- a/src/styles/content.scss +++ b/src/styles/content.scss @@ -118,3 +118,11 @@ sib-display#member-info, grid-gap: 1em; } } + + +// projects +#project-profile { + [name="title"]{ + + } +} \ No newline at end of file diff --git a/src/styles/form.scss b/src/styles/form.scss index 99ea8cbdc4fe4d864ab6284f070c01699d6058f4..a8beda0d3f250196674cd1c949ab778cb3e527e7 100644 --- a/src/styles/form.scss +++ b/src/styles/form.scss @@ -1,6 +1,8 @@ //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.block>form>*{ + display: block; +} sib-form{ form{ margin: -.5em; diff --git a/src/styles/icons.scss b/src/styles/icons.scss index 48ea2c543c956489dbe60411782866e34f2856e2..ac9c733ac222e66c458a3a46e191adf3bc8a2c28 100644 --- a/src/styles/icons.scss +++ b/src/styles/icons.scss @@ -250,6 +250,7 @@ $icons: ( social-steam: '\e620', ); + @each $name, $code in $icons { .icon-#{$name} { &:before { diff --git a/src/styles/main.scss b/src/styles/main.scss index cbb7313e0e9cd8caf4cc9f12f9c6ec1921b27c0c..5b420b8fcc843fe6f26ee227d947e85ba893c7f7 100644 --- a/src/styles/main.scss +++ b/src/styles/main.scss @@ -99,7 +99,7 @@ h3 { flex: 1 1 0px; } -.limiter{ +.limiter { display: block; max-width: 650px; } @@ -110,21 +110,37 @@ h3 { flex-direction: row-reverse; align-items: flex-start; > sib-router { + font-family: monospace; + color: $color-black; display: block; - background-color: #ccc; + background-color: $color-grey-light2; sib-route { display: block; + cursor: pointer; > div { position: relative; - padding: 1em 2em; - border-bottom: 1px solid #888; + padding: 1.5em 3em; + border-bottom: 1px solid $color-grey; + } + &:hover { + background-color: $color-grey; } &[active] { font-weight: bold; + background-color: $color-black; + color: $color-yellow; > div:before { - content: '<'; - position: absolute; + opacity: 1; transform: translateX(-150%); + transition: 0.3s cubic-bezier(0.175, 0.885, 0.32, 1.275); + } + } + > div { + @include icon(arrow-left); + &:before { + position: absolute; + transform: translateX(-50%); + opacity: 0; } } } @@ -170,6 +186,11 @@ h3 { } } +sib-route, +sib-trigger { + cursor: pointer; +} + sib-trigger.back { display: block; @include icon('arrow-left'); diff --git a/src/styles/variables.scss b/src/styles/variables.scss index 2e7a115930cc75eb70b77dd315f6c6cae444a4cc..27002aa66be064d72e9b0edba813637350267ed9 100644 --- a/src/styles/variables.scss +++ b/src/styles/variables.scss @@ -2,6 +2,7 @@ $color-white: #fff; $color-black: #36383b; $color-grey: #898f95; +$color-grey-light2: #d8d8d8; $color-grey-light: #f0f3f6; $color-yellow: #ffb700; @@ -11,6 +12,11 @@ $color-yellow-light: #ffd759; box-shadow: 0px 0px 4px rgba(0, 0, 0, 0.15); } +%cadre { + @extend %shadow; + background-color: $color-white; +} + $breakpoints: ( phone: 480px, tablet: 768px, diff --git a/www/lib/sib-chat b/www/lib/sib-chat index 24192a89c1bc19f7faa06546ba1b798ad717e04b..ef607e3aecf6f7091b2fee1fd327e181b376b24d 160000 --- a/www/lib/sib-chat +++ b/www/lib/sib-chat @@ -1 +1 @@ -Subproject commit 24192a89c1bc19f7faa06546ba1b798ad717e04b +Subproject commit ef607e3aecf6f7091b2fee1fd327e181b376b24d diff --git a/www/test.html b/www/test.html new file mode 100644 index 0000000000000000000000000000000000000000..a7a88ea2ddd58d2d0507d55b78058d419cd83a99 --- /dev/null +++ b/www/test.html @@ -0,0 +1,40 @@ +<!DOCTYPE html> +<html lang="en"> + <head> + <meta charset="UTF-8"/> + <title>[test] HD App</title> + <meta name="viewport" content="width=device-width, initial-scale=1.0"/> + <meta http-equiv="X-UA-Compatible" content="ie=edge"/> + <!-- Scripts--> + <script src="https://cdnjs.cloudflare.com/ajax/libs/webcomponentsjs/1.2.7/webcomponents-loader.js" integrity="sha256-fz7VMnmo2h7TlM7CBea8/vpbWpdQnbp20TnwmRwi/KU=" crossorigin="anonymous"></script> + <!-- Web components--> + <link rel="import" href="https://cdn.happy-dev.fr/sib-core/sib-display.html"/> + + <style> + body.debug *:not(script):not(button){ + display: block; + padding: 3px; + margin: 3px; + border: 1px solid #f006; + } + </style> + </head> + <body> + <button onclick="document.body.classList.toggle('debug')">debug</button> + <div id="job-offers"> + <h1>Job offers</h1> + <sib-display id="offers-list" + data-src="https://test-paris.happy-dev.fr/job-offers/" + data-fields="title, description, skills" + widget-skills="sib-display-lookuplist" + ></sib-display> + </div> + <div id="members"> + <h1>Members</h1> + <sib-display id="profiles-list" + data-src="https://test-paris.happy-dev.fr/members/" + data-fields="pseudo, bio" + ></sib-display> + </div> + </body> +</html> \ No newline at end of file