diff --git a/Makefile b/Makefile
index d7a8fb3..6bbdda3 100644
--- a/Makefile
+++ b/Makefile
@@ -14,7 +14,7 @@ install: node_modules copy_lib copy_samples submodules
submodules:
git submodule init
- git submodule update
+ git submodule update --recursive --remote
build: $(DIST_DIR)/index.html $(DIST_DIR)/styles/index.css $(SCRIPT_DEST)
diff --git a/src/dependencies.pug b/src/dependencies.pug
index 93a27b5..711b96b 100644
--- a/src/dependencies.pug
+++ b/src/dependencies.pug
@@ -5,7 +5,7 @@ script(src="/lib/webcomponentsjs/webcomponents-loader.js")
script(src="/lib/oidc-client.js")
script(
- src="/lib/sib-oidc/sib-oidc.js"
+ src="https://cdn.happy-dev.fr/sib-oidc/sib-oidc.js"
data-authority=`${sdn}/openid/`,
data-client_id=`${client_id}`,
data-response_type='id_token token',
@@ -29,11 +29,11 @@ link(href="https://fonts.googleapis.com/css?family=Open+Sans:300,300i,400,400i,6
// Web components
//- 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-core/sib-display.html')
+ link(rel='import', href='/lib/sib-router/sib-router.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")
- link(rel='import', href="https://cdn.happy-dev.fr/sib-router/sib-router.html")
+link(rel='import', href="https://cdn.happy-dev.fr/sib-core/sib-display.html")
+link(rel='import', href="https://cdn.happy-dev.fr/sib-router/sib-router.html")
link(rel='import', href="https://cdn.happy-dev.fr/sib-chat/sib-chat.html")
diff --git a/src/header.pug b/src/header.pug
index a20b981..7301712 100644
--- a/src/header.pug
+++ b/src/header.pug
@@ -15,8 +15,9 @@ details
#notifications
include page-notifications.pug
-#profile
- img(src="/images/user.jpg")
- span
- | Profile
- span.icon-arrow-down
+sib-display#profile(
+ data-fields='first_name,profile.picture',
+ widget-profile.picture='sib-display-img',
+ bind-user
+ )
+
diff --git a/src/menu.pug b/src/menu.pug
index 25b7d14..d89e4d7 100644
--- a/src/menu.pug
+++ b/src/menu.pug
@@ -17,7 +17,7 @@ nav#navbar
div.menu-wrapper
div.menu
div.menu-chevron
- div.menu-icon.icon-arrow-down
+ div.menu-icon.icon-arrow-up
div.menu-label Projects
div.menu-icon.icon-folder-alt
sib-route(hidden,name='project', id-prefix=`${sdn}/projects/`)
@@ -31,7 +31,7 @@ nav#navbar
div.menu-wrapper
div.menu
div.menu-chevron
- div.menu-icon.icon-arrow-down
+ div.menu-icon.icon-arrow-up
div.menu-label Groups
div.menu-icon.icon-globe
sib-route(hidden, name='group', id-prefix=`${sdn}/channels/`)
@@ -45,7 +45,7 @@ nav#navbar
div.menu-wrapper
div.menu
div.menu-chevron
- div.menu-icon.icon-arrow-down
+ div.menu-icon.icon-arrow-up
div.menu-label Chat
div.menu-icon.icon-envelope-letter
sib-route(hidden, name='member-chat', id-prefix=`${sdn}/members/`)
diff --git a/src/menu.pug.orig b/src/menu.pug.orig
deleted file mode 100644
index 08c515e..0000000
--- a/src/menu.pug.orig
+++ /dev/null
@@ -1,63 +0,0 @@
-nav#navbar
- sib-router#navbar-router(default-route='members')
- sib-route.menu(name='members')
- div.menu-notification
- div 1
- div.menu-label Members
- div.menu-icon.icon-people
- sib-route.menu(hidden, name='member', id-prefix=`${sdn}/members/`)
- div.divider
- sib-route.menu(name='job-offers')
- div.menu-notification
- div 2
- div.menu-label Job offers
- div.menu-icon.icon-briefcase
- sib-route(hidden, name='job-offer-create')
- div.divider
- div.menu-wrapper
- div.menu
- div.menu-chevron
- div.menu-icon.icon-arrow-down
- div.menu-label Projects
- div.menu-icon.icon-folder-alt
- sib-route(hidden,name='project', id-prefix=`${sdn}/projects/`)
- div.sub-menu
- sib-display(
- data-src=`${sdn}/projects/`,
- data-fields='name',
- next='project'
- )
- div.divider
- div.menu-wrapper
- div.menu
- div.menu-chevron
- div.menu-icon.icon-arrow-down
- div.menu-label Groups
- div.menu-icon.icon-globe
- sib-route(hidden, name='group', id-prefix=`${sdn}/channels/`)
- div.sub-menu
- sib-display(
- data-src=`${sdn}/channels/`,
- data-fields='name',
- next='group'
- )
- div.divider
- div.menu-wrapper
- div.menu
- div.menu-chevron
- div.menu-icon.icon-arrow-down
- div.menu-label Chat
- div.menu-icon.icon-envelope-letter
- sib-route(hidden, name='chat', id-prefix=`${sdn}/users/`)
- div.sub-menu
- sib-display(
-<<<<<<< HEAD
- data-src=`${sdn}/members/`,
- data-fields='pseudo',
-=======
- data-src=`${sdn}/users/`,
- data-fields='username',
->>>>>>> 627b84b... wip
- next='chat'
- )
- div.divider
diff --git a/src/page-group-profile.pug b/src/page-group-profile.pug
index 0ecb4dc..fcf3b47 100644
--- a/src/page-group-profile.pug
+++ b/src/page-group-profile.pug
@@ -8,8 +8,8 @@
sib-display(
id-suffix='members',
data-fields='user-thumb',
- set-user-thumb='member.avatar, first_name, last_name',
- widget-member.avatar='sib-display-img',
+ set-user-thumb='profile.picture, first_name, last_name',
+ widget-profile.picture='sib-display-img',
bind-resources
)
@@ -28,7 +28,7 @@
sib-display(
data-fields='title, label-description, description, client',
- set-title='number, client.name, name',
+ set-title='phone, client.name, name',
set-client='label-client, client.name, client.logo, client.address',
value-label-description="Description:"
value-label-client="Client:"
diff --git a/src/page-job-offer-create.pug b/src/page-job-offer-create.pug
index aa6e77c..14dd881 100644
--- a/src/page-job-offer-create.pug
+++ b/src/page-job-offer-create.pug
@@ -4,7 +4,7 @@ div
.form-view
sib-form.block(
data-src=`${sdn}/job-offers/`,
- data-fields="author, description, skills",
+ data-fields="description, skills",
widget-author='sib-form-dropdown',
- widget-skills='sib-form-multiple-dropdown',
+ range-skills= `${sdn}/skills/`,
)
diff --git a/src/page-job-offers.pug b/src/page-job-offers.pug
index b08d423..c380d33 100644
--- a/src/page-job-offers.pug
+++ b/src/page-job-offers.pug
@@ -1,26 +1,27 @@
div.grid-layer
div.grid-layer-main.containerV
- h1 New offers
+ h2 New offers
span Here you can find and post offers
sib-display#offers-list(
data-src=`${sdn}/job-offers/`,
data-fields='date, user-thumb, title, description, skills',
widget-skills='sib-display-lookuplist',
- set-user-thumb='author.member.avatar, author.first_name, author.last_name'
- widget-author.member.avatar='sib-display-img',
+ set-user-thumb='author.profile.picture, author.first_name, author.last_name',
+ widget-author.profile.picture='sib-display-img',
set-date='closingDate, creationDate',
+ set-creation='creationDate',
widget-closingDate='hdapp-closing-date',
set-content='title, description',
- search-fields='content,skills,open'
- search-range-skills=`${sdn}/skills/`,
+ search-fields='content,skills,open',
+ search-range-skills=`${sdn}/skills/`
)
div.grid-layer-links.containerV
sib-link(next="job-offer-create").containerH.containerCenter.action-link
- div.containerV.fix.icon-plus
- div.containerV.fix Post a new offer
+ div.icon-plus
+ div Post a new offer
sib-link().containerH.containerCenter.how-link
- div.containerV.fix.icon-idea
- div.containerV.grow How To find a new offer
+ div.icon-idea
+ div.grow How To find a new offer?
sib-link().containerH.containerCenter.how-link
- div.containerV.fix.icon-idea
- div.containerV.grow How to set notification ?
+ div.icon-idea
+ div.grow How to set notification?
diff --git a/src/page-member-edit.pug b/src/page-member-edit.pug
index 4a5a2c5..6fbc111 100644
--- a/src/page-member-edit.pug
+++ b/src/page-member-edit.pug
@@ -1,14 +1,6 @@
.form-view
- label.d-none(for='avatar-input')
- img#avatar-preview(src='', style='width: 100%;')
- input#avatar-input.d-none(
- type='file',
- accept='image/*',
- name='avatar',
- value='',
- )
sib-form.block(
- data-fields='user, avatar, bio, cell, jabberID, number, pseudo, skills, website',
+ data-fields='user, picture, bio, cell, jabberID, phone, pseudo, skills, website',
widget-user='hdapp-usereditinfo',
range-cell=`${sdn}/cells/`, widget-skills='sib-form-multiple-dropdown',
range-skills=`${sdn}/skills/`,
diff --git a/src/page-member-profile.pug b/src/page-member-profile.pug
index 04d14ba..48a856c 100644
--- a/src/page-member-profile.pug
+++ b/src/page-member-profile.pug
@@ -1,22 +1,21 @@
template#chat-link
sib-link(next="member-chat") ${value}
sib-display#member-info(
- data-fields='available, header, name, pseudonym, infos, skills',
- set-header='avatar',
- set-infos='cell, roles,send, user.email, number, foaf:homepage',
+ data-fields='available, header, name, pseudonym, infos, user.skills',
+ set-header='picture',
+ set-infos='city, country, user.roles, user.email, send, phone, foaf:homepage, ',
set-name='user.first_name, user.last_name',
set-pseudonym='before-pseudo, pseudo',
value-before-pseudo='@',
value-send='SEND A MESSAGE',
template-send='chat-link',
widget-available='hdapp-available',
- widget-avatar='sib-display-img',
+ widget-picture='sib-display-img',
widget-user='hdapp-userinfo',
- widget-cell='hdapp-usercell',
- widget-number='sib-display-tel',
+ widget-phone='sib-display-tel',
widget-foaf:homepage='hdapp-hyperlink',
widget-user.email='sib-display-mailto',
- widget-roles='sib-display-lookuplist',
- widget-skills='sib-display-lookuplist',
+ widget-user.roles='sib-display-lookuplist',
+ widget-user.skills='sib-display-lookuplist',
bind-resources
)
diff --git a/src/page-members.pug b/src/page-members.pug
index 2bc6877..53c7277 100644
--- a/src/page-members.pug
+++ b/src/page-members.pug
@@ -7,8 +7,8 @@ div.grid-layer
h1 Members
sib-display#profiles-list(
data-src=`${sdn}/members/`,
- data-fields='header, infos, group, role, more',
- set-header='avatar, user, pseudonym, bio, send',
+ data-fields='header, infos, groups, role, more',
+ set-header='picture, user, pseudonym, bio, send, city, country',
set-infos='cell, roles, user.email, foaf:homepage, skills',
set-pseudonym='before-pseudo,pseudo'
search-label-skills='competences',
@@ -20,10 +20,9 @@ div.grid-layer
template-more='hdapp-link-more',
value-send='SEND A MESSAGE',
template-send='chat-link',
- widget-avatar='sib-display-img',
+ widget-picture='sib-display-img',
widget-user='hdapp-userinfo',
widget-foaf:hompage='hdapp-hyperlink',
- widget-cell='hdapp-usercell',
widget-roles='sib-display-lookuplist',
widget-skills='sib-display-lookuplist',
set-name='pseudo,user.first_name,user.last_name',
diff --git a/src/page-notifications.pug b/src/page-notifications.pug
index eb38c1f..68b15af 100644
--- a/src/page-notifications.pug
+++ b/src/page-notifications.pug
@@ -2,6 +2,6 @@ div.frame
h1 Notifications
sib-display(
- data-src=`${sdn}/notifications/`
+ bind-user
data-fields='summary'
)
\ No newline at end of file
diff --git a/src/page-project-create.pug b/src/page-project-create.pug
index 11d7b45..1e235d6 100644
--- a/src/page-project-create.pug
+++ b/src/page-project-create.pug
@@ -2,7 +2,7 @@ h1 New project
.form-view
sib-form.block(
data-src=`${sdn}/projects/`,
- range-client=`${sdn}/clients/`,
+ range-customer=`${sdn}/customers/`,
widget-team='sib-form-multiple-dropdown',
range-team=`${sdn}/members/`
)
diff --git a/src/page-project-edit.pug b/src/page-project-edit.pug
index 534754f..859cea0 100644
--- a/src/page-project-edit.pug
+++ b/src/page-project-edit.pug
@@ -2,9 +2,9 @@ h1 Edit project
//- sib-display(data-fields="name" bind-resources)]
.form-view
sib-form(
- range-client=`${sdn}/clients/`,
+ range-customer=`${sdn}/customers/`,
range-team=`${sdn}/members/`,
- data-fields=`name, number, client, description, team, jabberRoom, foaf:jabberID`,
+ data-fields=`name, phone, customer, description, team, jabberRoom, foaf:jabberID`,
widget-jabberRoom='sib-form-checkbox',
widget-description='sib-form-textarea',
widget-team='hdapp-link-more',
diff --git a/src/page-project-profile.pug b/src/page-project-profile.pug
index 4d12e61..c7cc89b 100644
--- a/src/page-project-profile.pug
+++ b/src/page-project-profile.pug
@@ -1,5 +1,5 @@
.frame
- template#client-template
+ template#customer-template
div#clientBox
div
h2 Client :
@@ -13,13 +13,13 @@
h2 Contact :
sib-display(
- data-fields='title, client.logo, label-description, description, client',
- set-title='const-title1,number,client.name,const-title2, name',
- widget-client.logo='sib-display-img',
- template-client='client-template',
+ data-fields='title, customer.logo, label-description, description, customer',
+ set-title='const-title1,phone, customer.name,const-title2, name',
+ widget-customer.logo='sib-display-img',
+ template-customer='customer-template',
widget-team='sib-display-lookuplist',
value-label-description="Description:",
- value-label-client="Client:",
+ value-label-customer="Client:",
value-const-title1="N°:",
value-const-title2="-",
bind-resources,
@@ -29,10 +29,10 @@
div.containerH
sib-display.members-list-condensed(
id-suffix='team',
- data-fields='member.avatar, member.user, member.roles',
- widget-member.avatar='sib-display-img',
- widget-member.user='hdapp-userinfo',
- widget-member.roles='sib-display-lookuplist',
- next='member',
+ data-fields='profile.picture, profile.user, groups',
+ widget-profile.picture='sib-display-img',
+ widget-profile.user='hdapp-userinfo',
+ widget-groups='sib-display-lookuplist',
+ next='profile',
bind-resources,
)
diff --git a/src/page-projects.pug b/src/page-projects.pug
index 7563087..4490ae2 100644
--- a/src/page-projects.pug
+++ b/src/page-projects.pug
@@ -3,8 +3,8 @@ div
h1 Projects
sib-display(
data-src=`${sdn}/projects/`,
- data-fields='number, client, name',
- widget-client='hdapp-client',
- search-fields='number, name',
+ data-fields='phone, customer, name',
+ widget-customer='hdapp-client',
+ search-fields='phone, name',
next='project'
)
diff --git a/src/scripts/hd-widgets.js b/src/scripts/hd-widgets.js
index b8fa942..ccc8377 100644
--- a/src/scripts/hd-widgets.js
+++ b/src/scripts/hd-widgets.js
@@ -27,32 +27,6 @@ document.addEventListener('WebComponentsReady', function(event) {
}
customElements.define('hdapp-userinfo', HDAppUserInfo);
- class HDAppCell extends SIBDisplayLookupList {
- get parentElement() {
- return 'div';
- }
- getTemplate(value, index) {
- var city, country;
-
- if (typeof value == 'object')
- if (Object.keys(value).length > 1) {
- city = value.city;
- country = value.country;
- } else {
- store.get(value).then(resource => {
- this.value.push(resource);
- this.render();
- });
- if (Array.isArray(this.value))
- this.value.splice(this.value.indexOf(value), 1);
- else this.value = [];
- return '';
- }
- return `${city} - ${country}`;
- }
- }
- customElements.define('hdapp-usercell', HDAppCell);
-
class HDAppMail extends SIBWidget {
get template() {
return `SEND A MESSAGE
`;
diff --git a/src/styles/content.scss b/src/styles/content.scss
index 10d941f..f78d466 100644
--- a/src/styles/content.scss
+++ b/src/styles/content.scss
@@ -7,28 +7,6 @@
// //float: right;
// }
-#offers-list {
- > div {
- > sib-display {
- display: block;
- margin: 1em 0;
- @extend %frame;
- padding: 2em;
- /*&:nth-child(odd) {
- background-color: $color-grey-light;
- }*/
- sib-display-div[name='title'] {
- display: block;
- @extend h2;
- }
-
- label {
- display: none;
- }
- }
- }
-}
-
[name='user-thumb'] {
display: flex;
align-items: center;
@@ -304,41 +282,6 @@ hdapp-available {
}
}
-#offers-list {
- @extend .grid-layer;
- > sib-form {
- grid-column-start: start;
- grid-column-end: middle;
- grid-row-start: start;
- grid-row-end: middle;
- }
- > div {
- grid-column-start: start;
- grid-column-end: end;
- grid-row-start: middle;
- grid-row-end: end;
- }
-}
-#offers-list > sib-form > form {
- display: grid;
- grid-template-columns: 50% 50%;
- grid-template-rows: 3.5em 3.5em;
-
- label {
- flex-basis: 5em;
- flex-shrink: 0;
- }
-
- input, select {
- flex-grow: 1;
- min-width: 0;
- }
-
- input[type="submit"] {
- display: none;
- }
-}
-
#member-profile,
#profiles-list {
ul {
@@ -465,57 +408,6 @@ hdapp-available {
}
}
-.right-link {
- padding: 0.5em;
- margin-bottom: 1em;
- margin-left: 1em;
- flex-basis: content;
- border-radius: 2em;
-
- div[class*="icon-"] {
- margin-right: 1em;
- }
-}
-
-.how-link {
- @extend .right-link;
- background-color: $color-white;
- color: $color-black;
- flex-wrap: nowrap;
- .icon-idea {
- background-color: $color-yellow-light;
- border-radius: 100%;
- flex-shrink: 0;
- flex-grow: 0;
- justify-content: center;
- align-items: center;
- display: flex;
- flex-direction: column;
- width: 1.8em;
- height: 1.8em;
- //margin-right: 1em;
- }
-}
-
-.action-link {
- @extend .right-link;
- background-color: $color-yellow;
- color: $color-white;
- font-weight: bold;
- text-transform: uppercase;
-
- .icon-plus {
- flex-shrink: 0;
- flex-grow: 0;
- justify-content: center;
- align-items: center;
- display: flex;
-
- &:before {
- //font-size: 1.3em;
- }
- }
-}
/*
label {
@extend h2;
@@ -524,3 +416,4 @@ label {
}
}
*/
+
diff --git a/src/styles/filters.scss b/src/styles/filters.scss
new file mode 100644
index 0000000..099bdaf
--- /dev/null
+++ b/src/styles/filters.scss
@@ -0,0 +1,47 @@
+#offers-list > sib-form > form {
+ border-bottom: 1px solid $color-grey1;
+ display: grid;
+ grid-gap: 0px 30px;
+ grid-template-columns: 33% auto;
+ padding-bottom: 3em;
+
+ label {
+ display: block;
+ }
+
+ input, select {
+ border-style: none;
+ box-shadow: 0 0 5px 0 rgba(133, 140, 148, 0.09);
+ margin-top: 1em;
+ }
+
+ input[type="submit"] {
+ display: none;
+ }
+
+ select {
+ background: white;
+ box-sizing: border-box;
+ display: inline-block;
+ padding: 0.5em 12.5em 0.5em 1em;
+
+ background-image:
+ linear-gradient(45deg, transparent 50%, $color-grey 50%),
+ linear-gradient(135deg, $color-grey 50%, transparent 50%),
+ linear-gradient(to right, white, white);
+ background-position:
+ calc(100% - 20px) calc(1em + 2px),
+ calc(100% - 15px) calc(1em + 2px),
+ calc(100% - 2.5em) 0.5em;
+ background-repeat: no-repeat;
+ background-size:
+ 5px 6px,
+ 5px 6px,
+ 1px 1.5em;
+ }
+
+ sib-form-label-text {
+ display: flex;
+ flex-direction: column;
+ }
+}
diff --git a/src/styles/form.scss b/src/styles/form.scss
index cee8deb..93297b5 100644
--- a/src/styles/form.scss
+++ b/src/styles/form.scss
@@ -13,9 +13,9 @@
padding: 1em;
}
sib-display sib-form form {
- margin: -0.5em;
+ //margin: -0.5em;
> * {
- margin: 0.5em;
+ margin-top: 0.5em;
}
}
sib-form.block {
@@ -64,11 +64,12 @@ sib-form.block {
}
}
+//fix: style à mignrer dans filter.scss ? => A voir si ces styles sont utilisés ailleurs que pour les filtres.
sib-form {
// text like
textarea,
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;
+ padding: 0.7em;
border: none;
@extend %shadow;
}
@@ -105,14 +106,3 @@ sib-form {
}
}
}
-
-sib-form-label-text,sib-form-dropdown{
- display: flex;
- flex-wrap: nowrap;
-}
-
-select{
- background-color: $color-white;
- border-style: none;
- box-shadow: 0px 0px 4px rgba(0, 0, 0, 0.15)
-}
diff --git a/src/styles/header.scss b/src/styles/header.scss
index a150cec..fbd0f0c 100644
--- a/src/styles/header.scss
+++ b/src/styles/header.scss
@@ -13,6 +13,7 @@
flex-shrink: 0;
align-items: center;
padding: 1em 0.4em;
+ position: relative;
> * {
padding: 0 1.8rem;
diff --git a/src/styles/index.scss b/src/styles/index.scss
index 457c9b4..ecd5f85 100644
--- a/src/styles/index.scss
+++ b/src/styles/index.scss
@@ -8,6 +8,9 @@
@import 'main';
@import 'form';
@import 'content';
+@import 'filters';
+@import 'right-panel';
+@import 'job-offers';
// @import 'members';
@import 'header';
diff --git a/src/styles/job-offers.scss b/src/styles/job-offers.scss
new file mode 100644
index 0000000..e084221
--- /dev/null
+++ b/src/styles/job-offers.scss
@@ -0,0 +1,57 @@
+#offers-list {
+ @extend .grid-layer;
+ > sib-form {
+ grid-column-start: start;
+ grid-column-end: middle;
+ grid-row-start: start;
+ grid-row-end: middle;
+ }
+
+ > div {
+ grid-column-start: start;
+ grid-column-end: end;
+ grid-row-start: middle;
+ grid-row-end: end;
+
+ &:first-of-type {
+ margin-top: 3em;
+ }
+
+ > sib-display {
+ @extend %frame;
+ display: block;
+ margin: 1em 0;
+ padding: 2em;
+ /*&:nth-child(odd) {
+ background-color: $color-grey-light;
+ }*/
+ sib-display-div[name='title'] {
+ @extend h2;
+ display: block;
+ }
+
+ label {
+ display: none;
+ }
+ }
+ }
+}
+
+[name='user-thumb'] {
+ align-items: center;
+ color: $color-black-light;
+ display: flex;
+ font-weight: 600;
+ margin: -0.25em;
+
+ > * {
+ margin: 0.25em;
+ }
+
+ sib-display-img {
+ border-radius: 100%;
+ height: 2.5em;
+ overflow: hidden;
+ width: 2.5em;
+ }
+}
\ No newline at end of file
diff --git a/src/styles/main.scss b/src/styles/main.scss
index 7153236..742aa64 100644
--- a/src/styles/main.scss
+++ b/src/styles/main.scss
@@ -48,8 +48,7 @@ h1 {
font-size: 1.24em;
}
-h2 {
- font-size: 1.04em;
+h2 { font-size: 20px;
}
h3 {
@@ -68,77 +67,6 @@ h4 {
@extend %frame;
padding: 1em;
}
-/*
-#header {
- background-color: $color-white;
- color: $color-black;
- //position: relative;
- //@include border-shadow(bottom);
- box-shadow: 0 0 4px rgba(0, 0, 0, 0.15);
- border: solid $color-white;
- border-width: 1px 0;
- display: flex;
- //flex-grow: 0;
- //flex-basis : 150px;
- flex-shrink: 0;
- align-items: center;
- padding: 1em 0;
-
- > * {
- padding: 0 1rem;
- }
-}
-
-#button-toggle {
- @include icon('menu');
- display: none;
- color: $color-black;
- font-size: 2em;
- padding: 0.72em;
- cursor: pointer;
-}
-
-#logo {
- flex: 1 1 0;
-}
-
-#notifications-button {
- @include icon(bell);
- font-size: 2em;
- cursor: pointer;
- list-style-type: none;
-}
-
-#notifications {
- position: absolute;
- right: 0;
- bottom: 0;
- height: 0;
- left: 0;
- z-index: 1;
-
- > div {
- position: absolute;
- top: 0;
- right: 0;
- }
-}
-
-#profile {
- > * {
- vertical-align: middle;
- }
-
- img {
- margin-right: 0.5em;
- width: 48px;
- height: 48px;
- object-fit: cover;
- object-position: center;
- border-radius: 100%;
- }
-}
-*/
.menu-notification {
//flex-basis: 3em;
@@ -347,16 +275,17 @@ sib-trigger.back {
.grid-layer{
display: grid;
- grid-template-columns: [start]auto[middle]20em[end];
- grid-template-rows: [start]10em[middle]auto[end];
+ font-size: 16px;
+ grid-template-columns: [start]auto[middle]25%[end];
+ grid-template-rows: [start]13em[middle]auto[end];
}
-.grid-layer-main{
+.grid-layer-main {
grid-column-start: start;
grid-column-end: end;
grid-row-start: start;
grid-row-end: end;
}
-.grid-layer-links{
+.grid-layer-links {
grid-column-start: middle;
grid-column-end: end;
grid-row-start: start;
diff --git a/src/styles/right-panel.scss b/src/styles/right-panel.scss
new file mode 100644
index 0000000..fd97352
--- /dev/null
+++ b/src/styles/right-panel.scss
@@ -0,0 +1,49 @@
+.right-link {
+ padding: 0.5em;
+ margin-bottom: 1em;
+ margin-left: 5em;
+ flex-basis: auto;
+ border-radius: 2em;
+
+ div[class*="icon-"] {
+ align-items: center;
+ display: flex;
+ flex-grow: 0;
+ flex-shrink: 0;
+ }
+}
+
+.how-link {
+ @extend .right-link;
+ background-color: $color-white;
+ color: $color-black;
+ flex-wrap: nowrap;
+ .icon-idea {
+ background-color: $color-yellow-light;
+ border-radius: 100%;
+ justify-content: center;
+ margin-right: 0.7em;
+ //flex-direction: column;
+ width: 1.8em;
+ height: 1.8em;
+ //margin-right: 1em;
+ }
+}
+
+.action-link {
+ @extend .right-link;
+ background-color: $color-yellow;
+ color: $color-white;
+ font-weight: bold;
+ text-transform: uppercase;
+
+ .icon-plus {
+ font-size: 20px;
+ justify-content: center;
+ margin: 0.3em 0.3em 0.3em 0;
+
+ &:before {
+ //font-size: 1.3em;
+ }
+ }
+}
\ No newline at end of file
diff --git a/src/styles/variables.scss b/src/styles/variables.scss
index 17a486d..bd4a04a 100644
--- a/src/styles/variables.scss
+++ b/src/styles/variables.scss
@@ -1,6 +1,8 @@
// colors
$color-white: #fff;
$color-black: #36383b;
+$color-black-light: #4a4a4a;
+$color-grey1: #d7dbe0;
$color-grey: #898f95;
$color-grey-mid: #abaaba;
$color-grey-light4: #b4b9c0;
diff --git a/www/lib/sib-router b/www/lib/sib-router
index 2d78d30..5be7c64 160000
--- a/www/lib/sib-router
+++ b/www/lib/sib-router
@@ -1 +1 @@
-Subproject commit 2d78d30a691f937a5b2cd64cdc40d1fba8a75835
+Subproject commit 5be7c64588b25ba63394f99f03ff19ee6e0c6644