Merge branch 'master' of git.happy-dev.fr:startinblox/applications/sib-app
This commit is contained in:
simon louvet
commit
9cd4048f90
2
Makefile
2
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)
|
||||
|
||||
|
||||
@ -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,9 +29,9 @@ 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-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")
|
||||
|
||||
@ -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
|
||||
)
|
||||
|
||||
|
||||
@ -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/`)
|
||||
|
||||
@ -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
|
||||
@ -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:"
|
||||
|
||||
@ -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/`,
|
||||
)
|
||||
|
||||
@ -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?
|
||||
|
||||
@ -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/`,
|
||||
|
||||
@ -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
|
||||
)
|
||||
|
||||
@ -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',
|
||||
|
||||
@ -2,6 +2,6 @@ div.frame
|
||||
h1 Notifications
|
||||
|
||||
sib-display(
|
||||
data-src=`${sdn}/notifications/`
|
||||
bind-user
|
||||
data-fields='summary'
|
||||
)
|
||||
@ -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/`
|
||||
)
|
||||
|
||||
@ -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',
|
||||
|
||||
@ -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,
|
||||
)
|
||||
|
||||
@ -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'
|
||||
)
|
||||
|
||||
@ -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 `<span>${city} - ${country}</span>`;
|
||||
}
|
||||
}
|
||||
customElements.define('hdapp-usercell', HDAppCell);
|
||||
|
||||
class HDAppMail extends SIBWidget {
|
||||
get template() {
|
||||
return `<a href="mailto:${this.value}"><div class="icon-envelope"></div><div>SEND A MESSAGE</div></a>`;
|
||||
|
||||
@ -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 {
|
||||
}
|
||||
}
|
||||
*/
|
||||
|
||||
|
||||
47
src/styles/filters.scss
Normal file
47
src/styles/filters.scss
Normal file
@ -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;
|
||||
}
|
||||
}
|
||||
@ -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)
|
||||
}
|
||||
|
||||
@ -13,6 +13,7 @@
|
||||
flex-shrink: 0;
|
||||
align-items: center;
|
||||
padding: 1em 0.4em;
|
||||
position: relative;
|
||||
|
||||
> * {
|
||||
padding: 0 1.8rem;
|
||||
|
||||
@ -8,6 +8,9 @@
|
||||
@import 'main';
|
||||
@import 'form';
|
||||
@import 'content';
|
||||
@import 'filters';
|
||||
@import 'right-panel';
|
||||
@import 'job-offers';
|
||||
|
||||
// @import 'members';
|
||||
@import 'header';
|
||||
|
||||
57
src/styles/job-offers.scss
Normal file
57
src/styles/job-offers.scss
Normal file
@ -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;
|
||||
}
|
||||
}
|
||||
@ -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,8 +275,9 @@ 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-column-start: start;
|
||||
|
||||
49
src/styles/right-panel.scss
Normal file
49
src/styles/right-panel.scss
Normal file
@ -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;
|
||||
}
|
||||
}
|
||||
}
|
||||
@ -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;
|
||||
|
||||
@ -1 +1 @@
|
||||
Subproject commit 2d78d30a691f937a5b2cd64cdc40d1fba8a75835
|
||||
Subproject commit 5be7c64588b25ba63394f99f03ff19ee6e0c6644
|
||||
Loading…
Reference in New Issue
Block a user