From 6c8224c0f23534b3767a75f007cd3d2e722e186e Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Ga=C3=ABlle=20Morin?= Date: Thu, 2 Apr 2020 16:09:23 +0000 Subject: [PATCH] update: clear unused and fixes CSS --- src/dependencies.pug | 2 - src/header.pug | 2 +- src/page-circle.pug | 2 +- src/page-project.pug | 2 +- src/styles/base/form.scss | 48 ++--- src/styles/base/header.scss | 7 +- src/styles/base/main.scss | 58 +++--- src/styles/base/table.scss | 89 ++------ src/styles/base/user-thumb.scss | 108 ++++++++++ src/styles/components/_index.scss | 2 +- src/styles/components/howto.scss | 3 - src/styles/components/tags.scss | 3 +- src/styles/index.scss | 2 +- src/styles/layout/circle/_index.scss | 1 - src/styles/layout/circle/circle-profile.scss | 72 +------ src/styles/layout/circle/circle.scss | 191 ------------------ src/styles/layout/job-offers/job-offers.scss | 2 +- .../project-profile/project-profile.scss | 177 ---------------- .../layout/project-profile/project.scss | 8 - .../{project-profile => project}/_index.scss | 1 - .../layout/project/project-profile.scss | 115 +++++++++++ src/templates/hd-captain.pug | 8 +- src/templates/hd-circle-team.pug | 7 +- src/templates/hd-customer.pug | 2 +- src/templates/hd-project-team.pug | 9 +- src/views/admin/page-admin-circles-create.pug | 6 +- src/views/admin/page-admin-circles.pug | 10 +- .../admin/page-admin-projects-create.pug | 4 +- src/views/admin/page-admin-projects.pug | 10 +- src/views/admin/page-admin-users.pug | 2 +- src/views/circle/page-circle-edit.pug | 13 +- src/views/job-offer/page-job-offer-create.pug | 17 +- src/views/job-offer/page-job-offer-edit.pug | 2 +- src/views/project/page-project-edit.pug | 4 +- src/views/project/page-project-profile.pug | 2 +- 35 files changed, 358 insertions(+), 633 deletions(-) create mode 100644 src/styles/base/user-thumb.scss delete mode 100644 src/styles/layout/circle/circle.scss delete mode 100644 src/styles/layout/project-profile/project-profile.scss delete mode 100644 src/styles/layout/project-profile/project.scss rename src/styles/layout/{project-profile => project}/_index.scss (58%) create mode 100644 src/styles/layout/project/project-profile.scss diff --git a/src/dependencies.pug b/src/dependencies.pug index ec43d24..4f7189a 100644 --- a/src/dependencies.pug +++ b/src/dependencies.pug @@ -43,7 +43,5 @@ script(data-default-context, type="application/ld+json") | "account": "http://happy-dev.fr/owl/#account", | "jabberID": "foaf:jabberID", | "picture": "foaf:depiction", - | "firstName": "http://happy-dev.fr/owl/#first_name", - | "lastName": "http://happy-dev.fr/owl/#last_name", | "isAdmin": "http://happy-dev.fr/owl/#is_admin" | } diff --git a/src/header.pug b/src/header.pug index ef56755..83e9cfb 100644 --- a/src/header.pug +++ b/src/header.pug @@ -17,7 +17,7 @@ include templates/hd-user-avatar.pug details#user-controls.notLoggedIn summary(tabindex='0' role='button') sib-display#user-controls__profile( - fields='firstName, account.picture' + fields='first_name, account.picture' widget-account.picture='hd-user-avatar' bind-user ) diff --git a/src/page-circle.pug b/src/page-circle.pug index 9f84093..8aad774 100644 --- a/src/page-circle.pug +++ b/src/page-circle.pug @@ -10,7 +10,7 @@ class-description='h1-aside description' ) button.mobile-sidebar-button.jsMobileSidebarOpenButton.icon-arrow-left-circle MENU - div.content-box__info + div sib-ac-checker(permission='acl:Read', bind-resources) #circle-chat(hidden) include views/circle/page-circle-chat.pug diff --git a/src/page-project.pug b/src/page-project.pug index ffb9269..66fbfca 100644 --- a/src/page-project.pug +++ b/src/page-project.pug @@ -16,7 +16,7 @@ .mobile-sidebar-button.jsMobileSidebarOpenButton button.icon-arrow-left-circle span MENU - div.content-box__info + div sib-ac-checker(permission='acl:Read', bind-resources) #project-chat(hidden) include views/project/page-project-chat.pug diff --git a/src/styles/base/form.scss b/src/styles/base/form.scss index 388f197..6fc03d4 100644 --- a/src/styles/base/form.scss +++ b/src/styles/base/form.scss @@ -1,3 +1,18 @@ +#admin-circle-create, +#admin-project-create { + + input[type='submit'] { + @extend .button, + .text-bold, + .text-uppercase, + .reversed, + .button-dark, + .bordered; + margin-left: auto; + margin-top: 3.2rem; + } +} + .content-box { &.with-form { @@ -23,16 +38,6 @@ padding-bottom: 0.8rem; } - p.center { - margin: 0; - text-align: center; - } - - [name$='-text'] { - font-size: 1.5rem; - margin-bottom: 2rem; - } - [name^='block-'] { margin-bottom: 2.75rem; } @@ -153,20 +158,17 @@ margin-top: 2.7rem; } - .form-edit { + .form-edit>form { - >form { - - input[type='submit'] { - @extend .button, - .text-bold, - .text-uppercase, - .reversed, - .button-dark, - .bordered; - margin-left: auto; - margin-top: 3.2rem; - } + input[type='submit'] { + @extend .button, + .text-bold, + .text-uppercase, + .reversed, + .button-dark, + .bordered; + margin-left: auto; + margin-top: 3.2rem; } } diff --git a/src/styles/base/header.scss b/src/styles/base/header.scss index b330266..291b92e 100644 --- a/src/styles/base/header.scss +++ b/src/styles/base/header.scss @@ -65,6 +65,7 @@ details { margin-right: 2.5rem; + position: relative; @include breakpoint(sm) { margin-right: 0; @@ -82,7 +83,7 @@ } } - details { + .sib-notifications__container { position: relative; .sib-notifications__button { @@ -169,7 +170,7 @@ width: 45%; } - sib-display-value[name='firstName'] { + sib-display-value[name='first_name'] { @include icon('arrow-down'); align-items: center; display: flex; @@ -241,7 +242,7 @@ div { - sib-display-value[name='firstName'] { + sib-display-value[name='first_name'] { @include icon('close'); &::before { diff --git a/src/styles/base/main.scss b/src/styles/base/main.scss index 32b1174..5c06575 100644 --- a/src/styles/base/main.scss +++ b/src/styles/base/main.scss @@ -1,12 +1,3 @@ -$breakpoints: (phone: 480px, - tablet: 768px, - desktop: 1024px) !default; - -[hidden], -.hidden { - display: none !important; -} - * { outline: none; } @@ -95,6 +86,10 @@ nav { display: contents; } +[hidden], +.hidden { + display: none !important; +} img { max-height: 100%; @@ -121,12 +116,6 @@ h6 { }*/ } -.h2-like { - display: block; - margin: 14.94px 0; - width: 100%; -} - h1, .h1-like { color: $color-233-18-29; font-size: 2rem; @@ -143,6 +132,12 @@ h2, .h2-like { text-transform: uppercase; } +.h2-like { + display: block; + margin: 14.94px 0; + width: 100%; +} + h3 { color: $color-216-4-22; font-size: 1.7rem; @@ -164,21 +159,6 @@ h5 { padding: 3.2rem; } -#admin-circle-create, -#admin-project-create { - - input[type='submit'] { - @extend .button, - .text-bold, - .text-uppercase, - .reversed, - .button-dark, - .bordered; - margin-left: auto; - margin-top: 3.2rem; - } -} - .content-box { @include window-style-modal(); display: flex; @@ -199,6 +179,7 @@ h5 { } } +/* Header inside circle, project view */ .content-box__header { border-bottom: 1px solid $color-221-51-90; padding: 3rem; @@ -257,6 +238,12 @@ h5 { } } +.content-box__info { + @extend %padding-block; + display: flex; + flex-direction: column; +} + .modal { color: white; margin: 75px; @@ -280,11 +267,6 @@ h5 { } } -.drive { - width: 100%; - border: 0; -} - .backlink { @include icon('arrow-left-circle'); color: $color-233-18-29; @@ -297,6 +279,11 @@ h5 { margin-right: 1rem; text-decoration: none; } + + &.right { + display: block; + text-align: right; + } } .name { @@ -342,6 +329,7 @@ h5 { @import 'table'; @import 'header'; @import 'menu-left'; +@import 'user-thumb'; // Button global CSS sib-delete, diff --git a/src/styles/base/table.scss b/src/styles/base/table.scss index af42ed7..cb5e2a7 100644 --- a/src/styles/base/table.scss +++ b/src/styles/base/table.scss @@ -6,17 +6,6 @@ #admin-project-list, #admin-project-create { - .content-box__info { - @extend %padding-block; - display: flex; - flex-direction: column; - - .backlink { - text-align: right; - display: block; - } - } - .table { .table-header { @@ -85,83 +74,35 @@ padding-top: 2.5rem; } - .cell-with-id-card>div, - /* for the table in circle-edit */ - .cell-with-id-card>sib-display>div, - project-captain[name='user']>sib-display>div { - /* for the captain's cell in project-admin */ - display: grid; - grid-column-gap: 1.6rem; - grid-template-columns: 7vh auto; - grid-template-rows: repeat(2, 5.2vh); + .user-thumb>div /* for the table in circle-edit and captain's cell in project-admin */ { + @extend %user-thumb__grid; padding: 0 2.2rem; - >[name$='account.picture'] { - align-items: center; - align-self: center; - background-color: $color-213-20-91; - border-radius: 50%; - display: flex; - grid-column: 1 / span 1; - grid-row: 1 / span 2; - height: 7vh; - justify-content: center; - overflow: hidden; - position: relative; - width: 7vh; - - img { - background-color: white; - height: 100%; - left: 0; - object-fit: cover; - position: absolute; - top: 0; - width: 100%; - } - - object { - height: 45%; - width: 45%; - } + >.user-thumb__picture { + @extend %user-thumb__picture; } >[name='sup'] { - align-self: end; - display: flex; - grid-column: 2 / span 1; - grid-row: 1 / span 1; - margin-bottom: 0.50rem; + @extend %user-thumb__grid-sup; - [name$='name'] { - color: #7A7F85; - font-weight: 600; - margin-right: 1rem; + .user-thumb__name { + @extend %user-thumb__name; } - sib-multiple>div { - display: flex; - - [name='groups'] { - @extend %tag-role; - } + .user-thumb__groups { + @extend %user-thumb__groups; } } >[name='sub'] { - align-self: start; - grid-column: 2 / span 1; - grid-row: 2 / span 1; - margin-top: 0.50rem; + @extend %user-thumb__grid-inf; - >[name$='username']:not(:empty) { - align-items: center; - display: flex; + >.user-thumb__username:not(:empty) { + @extend %user-thumb__username; + } - &::before { - content: '@'; - - } + >.user-thumb__city:not(:empty) { + @extend %user-thumb__city; } } } diff --git a/src/styles/base/user-thumb.scss b/src/styles/base/user-thumb.scss new file mode 100644 index 0000000..db3902d --- /dev/null +++ b/src/styles/base/user-thumb.scss @@ -0,0 +1,108 @@ +%user-thumb__grid { + display: grid; + grid-column-gap: 1.6rem; + grid-template-columns: 7vh auto; + grid-template-rows: repeat(2, 5.2vh); +} + +%user-thumb__grid-sup { + align-items: center; + align-self: end; + display: flex; + grid-column: 2 / span 1; + grid-row: 1 / span 1; + margin-bottom: 0.50rem; +} + +%user-thumb__grid-inf { + align-self: start; + grid-column: 2 / span 1; + grid-row: 2 / span 1; + margin-top: 0.50rem; +} + +%user-thumb__picture { + align-items: center; + align-self: center; + background-color: $color-213-20-91; + border-radius: 50%; + display: flex; + grid-column: 1 / span 1; + grid-row: 1 / span 2; + height: 7vh; + justify-content: center; + overflow: hidden; + position: relative; + width: 7vh; + + img { + background-color: white; + height: 100%; + left: 0; + object-fit: cover; + position: absolute; + top: 0; + width: 100%; + } + + object { + height: 45%; + width: 45%; + } +} + +%user-thumb__name { + color: #7A7F85; + font-weight: 600; + margin-right: 1rem; +} + +%user-thumb__groups { + display: flex; + margin-bottom: 1px; + margin-left: 0.6rem; + + [name='groups'], + [name='user.groups'] { + @extend %tag-role; + } +} + +%user-thumb__admin { + @extend %tag-admin; +} + +%user-thumb__username { + align-items: center; + display: flex; + + &::before { + content: '@'; + } +} + +%user-thumb__city { + @include mdi('atom'); + align-items: center; + display: flex; + margin-right: 1.6rem; + + &::before { + color: $color-43-100-50; + margin-right: 0.50rem; + } +} + +%user-thumb__lead { + @include icon('eyeglass'); + align-items: center; + display: flex; + + &::before { + color: $color-43-100-50; + font-size: 1.9rem; + font-weight: bold; + margin-left: 0; + margin-right: 0.50rem; + } +} diff --git a/src/styles/components/_index.scss b/src/styles/components/_index.scss index eecf780..30de5d0 100644 --- a/src/styles/components/_index.scss +++ b/src/styles/components/_index.scss @@ -1,5 +1,5 @@ @import 'chat'; -@import 'comment.scss'; +@import 'comment'; @import 'filters'; @import 'howto'; @import 'sidebar'; diff --git a/src/styles/components/howto.scss b/src/styles/components/howto.scss index 391e9ba..12b29e5 100644 --- a/src/styles/components/howto.scss +++ b/src/styles/components/howto.scss @@ -12,6 +12,3 @@ flex-shrink: 0; } } - - - diff --git a/src/styles/components/tags.scss b/src/styles/components/tags.scss index f5435c2..80e0310 100644 --- a/src/styles/components/tags.scss +++ b/src/styles/components/tags.scss @@ -15,6 +15,5 @@ font-size: 1.4rem; font-weight: 400; margin-left: 0.6rem; - margin-top: -2px; - padding: 0.3rem 0.98rem; + padding: 0.35rem 0.98rem; } \ No newline at end of file diff --git a/src/styles/index.scss b/src/styles/index.scss index b2b17ba..912d488 100644 --- a/src/styles/index.scss +++ b/src/styles/index.scss @@ -18,7 +18,7 @@ div#viewport { @import 'components/index'; @import 'layout/members/index'; @import 'layout/job-offers/index'; - @import 'layout/project-profile/index'; + @import 'layout/project/index'; @import 'layout/circle/index'; @import 'layout/user/index'; @import 'layout/events/index'; diff --git a/src/styles/layout/circle/_index.scss b/src/styles/layout/circle/_index.scss index 940c5fc..3de89ec 100644 --- a/src/styles/layout/circle/_index.scss +++ b/src/styles/layout/circle/_index.scss @@ -1,3 +1,2 @@ -@import 'circle'; @import 'circle-profile'; @import 'circle-admin'; diff --git a/src/styles/layout/circle/circle-profile.scss b/src/styles/layout/circle/circle-profile.scss index 64dbf51..4afb54a 100644 --- a/src/styles/layout/circle/circle-profile.scss +++ b/src/styles/layout/circle/circle-profile.scss @@ -8,62 +8,22 @@ .block { /* peut-être à mettre dans main.scss */ - circle-team-template>sib-display>div { - display: grid; - grid-column-gap: 1.6rem; - grid-template-columns: 7vh auto; - grid-template-rows: repeat(2, 5.2vh); + .user-thumb>div { + @extend %user-thumb__grid; - >[name='account.picture'] { - align-items: center; - align-self: center; - background-color: $color-213-20-91; - border-radius: 50%; - display: flex; - grid-column: 1 / span 1; - grid-row: 1 / span 2; - height: 7vh; - justify-content: center; - overflow: hidden; - position: relative; - width: 7vh; - - img { - background-color: white; - height: 100%; - left: 0; - object-fit: cover; - position: absolute; - top: 0; - width: 100%; - } - - object { - height: 45%; - width: 45%; - } + >.user-thumb__picture { + @extend %user-thumb__picture; } >[name='sup'] { - align-items: center; - align-self: end; - display: flex; - grid-column: 2 / span 1; - grid-row: 1 / span 1; - margin-bottom: 0.50rem; + @extend %user-thumb__grid-sup; - .user-name { - font-weight: 600; + .user-thumb__name { + @extend %user-thumb__name; } .tag-group { - display: flex; - margin-bottom: 1px; - margin-left: 0.6rem; - - [name='groups'] { - @extend %tag-role; - } + @extend %user-thumb__groups; } .tag-admin:not(:empty) { @@ -72,20 +32,10 @@ } >[name='sub'] { - align-self: start; - grid-column: 2 / span 1; - grid-row: 2 / span 1; - margin-top: 0.50rem; + @extend %user-thumb__grid-inf; - >.city:not(:empty) { - @include mdi('atom'); - align-items: center; - display: flex; - - &::before { - color: $color-43-100-50; - margin-right: 0.50rem; - } + >.user-thumb__city:not(:empty) { + @extend %user-thumb__city; } } } diff --git a/src/styles/layout/circle/circle.scss b/src/styles/layout/circle/circle.scss deleted file mode 100644 index b6f7d2e..0000000 --- a/src/styles/layout/circle/circle.scss +++ /dev/null @@ -1,191 +0,0 @@ -#circle-information, -#circle-edit, -#admin-circle-list, -#admin-circle-create, -#admin-project-list, -#admin-project-create { - - .content-box__info { - @extend %padding-block; - display: flex; - flex-direction: column; - - .backlink { - text-align: right; - display: block; - } - } - - .table { - - .table-header { - display: flex; - flex: 1; - font-size: 1.6rem; - font-weight: 600; - justify-content: space-around; - text-align: center; - - &.grey-color { - background: $color-228-25-79; - color: white; - } - - >* { - border-right: 1px solid white; - flex: 1; - padding: 2.1rem 0; - text-align: center; - } - - >*:last-of-type { - border-right: 1px solid $color-228-25-79; - } - } - - .table-body { - - >div:first-of-type>sib-display>div, - team-template-edit[name='members'] { - display: flex; - border-left: 1px solid $color-228-25-79; - } - - .border { - border-bottom: 1px solid $color-228-25-79; - border-right: 1px solid $color-228-25-79; - } - - .cell { - text-align: center; - word-wrap: break-word; - } - - .w25 { - width: 25%; - } - - .w33 { - width: 33.3333%; - } - - .w50 { - width: 50%; - } - - .hashtag::before { - content: '#'; - } - } - - .cell-with-name { - color: $color-233-18-29; - font-weight: 600; - padding-top: 2.5rem; - } - - .cell-with-id-card>div, /* for the table in circle-edit */ - .cell-with-id-card>sib-display>div, - project-captain[name='user']>sib-display>div { /* for the captain's cell in project-admin */ - display: grid; - grid-column-gap: 1.6rem; - grid-template-columns: 7vh auto; - grid-template-rows: repeat(2, 5.2vh); - padding: 0 2.2rem; - - >[name$='account.picture'] { - align-items: center; - align-self: center; - background-color: $color-213-20-91; - border-radius: 50%; - display: flex; - grid-column: 1 / span 1; - grid-row: 1 / span 2; - height: 7vh; - justify-content: center; - overflow: hidden; - position: relative; - width: 7vh; - - img { - background-color: white; - height: 100%; - left: 0; - object-fit: cover; - position: absolute; - top: 0; - width: 100%; - } - - object { - height: 45%; - width: 45%; - } - } - - >[name='sup'] { - align-self: end; - display: flex; - grid-column: 2 / span 1; - grid-row: 1 / span 1; - margin-bottom: 0.50rem; - - [name$='name'] { - color: #7A7F85; - font-weight: 600; - margin-right: 1rem; - } - - sib-multiple>div { - display: flex; - - [name='groups'] { - @extend %tag-role; - } - } - } - - >[name='sub'] { - align-self: start; - grid-column: 2 / span 1; - grid-row: 2 / span 1; - margin-top: 0.50rem; - - >[name$='username']:not(:empty) { - align-items: center; - display: flex; - - &::before { - content: '@'; - - } - } - } - } - - .cell-with-buttons { - align-items: center; - display: flex; - justify-content: center; - - [name='button'] { - - input[type='submit'] { - @extend .button, - .text-bold, - .text-uppercase, - .reversed, - .button-blue, - .bordered, - .btn-margin-left; - } - } - } - - sib-ac-checker { - align-items: center; - display: flex; - justify-content: center; - } - } -} \ No newline at end of file diff --git a/src/styles/layout/job-offers/job-offers.scss b/src/styles/layout/job-offers/job-offers.scss index 172e863..64c41fe 100644 --- a/src/styles/layout/job-offers/job-offers.scss +++ b/src/styles/layout/job-offers/job-offers.scss @@ -75,7 +75,7 @@ sib-job-board { margin: 0.25em; } - [name='author.firstName'] { + [name='author.first_name'] { color: $color-0-0-29; font-weight: 600; } diff --git a/src/styles/layout/project-profile/project-profile.scss b/src/styles/layout/project-profile/project-profile.scss deleted file mode 100644 index f212645..0000000 --- a/src/styles/layout/project-profile/project-profile.scss +++ /dev/null @@ -1,177 +0,0 @@ -#project-profile { - - .button-question__position { - position: relative; - bottom: 5px; - } - - .button-question__color { - color: $color-216-4-22; - } - - .customer-box { - display: flex; - margin: 1.6rem 0; - - >* { - border: 1px solid $color-221-51-90; - flex: 0 1 50%; - padding: 1.7rem 2rem; - - &:first-child { - - li:last-child { - margin-top: 3rem; - - p { - margin-top: 0.8rem; - } - } - } - - &:last-child { - border-left: none; - - li { - margin-bottom: 1.5rem; - } - } - } - } - - .customer-logo { - box-sizing: border-box; - display: flex; - height: 8.5vh; - justify-content: flex-end; - margin-top: 20px; - text-align: end; - width: 15vw; - } - - hd-captain>sib-display>div, - hd-project-team>sib-display>div { /* Maybe move it in main.scss. /!\ some fields are different */ - display: grid; - grid-column-gap: 1.6rem; - grid-template-columns: 7vh auto; - grid-template-rows: repeat(2, 5.2vh); - - >[name='user.account.picture'], - >[name='account.picture'] { - align-items: center; - align-self: center; - background-color: $color-213-20-91; - border-radius: 50%; - display: flex; - grid-column: 1 / span 1; - grid-row: 1 / span 2; - height: 7vh; - justify-content: center; - overflow: hidden; - position: relative; - width: 7vh; - - img { - background-color: white; - height: 100%; - left: 0; - object-fit: cover; - position: absolute; - top: 0; - width: 100%; - } - - object { - height: 45%; - width: 45%; - } - } - - >[name='sup'] { - align-self: end; - display: flex; - grid-column: 2 / span 1; - grid-row: 1 / span 1; - margin-bottom: 0.50rem; - - .user-name { - font-weight: 600; - } - - sib-multiple { - display: flex; - margin-left: 1rem; - - [name='groups'], - [name='user.groups'] { - @extend %tag-role; - } - } - - .tag-admin:not(:empty) { - @extend %tag-admin; - } - } - - >[name='sub'] { - align-self: start; - grid-column: 2 / span 1; - grid-row: 2 / span 1; - margin-top: 0.50rem; - - >[name$='profile.city']:not(:empty) { - @include mdi('atom'); - align-items: center; - display: flex; - margin-right: 1.6rem; - - &::before { - color: $color-43-100-50; - margin-right: 0.50rem; - } - } - - >[name$='name']:not(:empty), - >[name='is_lead'] { - @include icon('eyeglass'); - align-items: center; - display: flex; - - &::before { - color: $color-43-100-50; - font-size: 1.9rem; - font-weight: bold; - margin-left: 0; - margin-right: 0.50rem; - } - } - } - } - - ul { - list-style: none; - padding-left: 0; - - li { - margin-bottom: 0.5em; - - span::before { - color: $color-43-100-50; - font-size: 2.2rem; - margin: 0 1rem 0 0; - } - - span { - font-weight: bold; - - &.link-color { - color: $color-244-73-62; - } - - &.norm-weight { - font-weight: normal; - } - } - } - } -} \ No newline at end of file diff --git a/src/styles/layout/project-profile/project.scss b/src/styles/layout/project-profile/project.scss deleted file mode 100644 index cd3c9d6..0000000 --- a/src/styles/layout/project-profile/project.scss +++ /dev/null @@ -1,8 +0,0 @@ -#project-profile { - - .content-box__info { - @extend %padding-block; - display: flex; - flex-direction: column; - } -} \ No newline at end of file diff --git a/src/styles/layout/project-profile/_index.scss b/src/styles/layout/project/_index.scss similarity index 58% rename from src/styles/layout/project-profile/_index.scss rename to src/styles/layout/project/_index.scss index 74f68a7..5a93164 100644 --- a/src/styles/layout/project-profile/_index.scss +++ b/src/styles/layout/project/_index.scss @@ -1,2 +1 @@ -@import 'project'; @import 'project-profile'; diff --git a/src/styles/layout/project/project-profile.scss b/src/styles/layout/project/project-profile.scss new file mode 100644 index 0000000..9e8cdd4 --- /dev/null +++ b/src/styles/layout/project/project-profile.scss @@ -0,0 +1,115 @@ +#project-profile { + + .button-question__position { + position: relative; + bottom: 5px; + } + + .button-question__color { + color: $color-216-4-22; + } + + .customer-box { + display: flex; + margin: 1.6rem 0; + + >* { + border: 1px solid $color-221-51-90; + flex: 0 1 50%; + padding: 1.7rem 2rem; + + &:first-child { + + li:last-child { + margin-top: 3rem; + + p { + margin-top: 0.8rem; + } + } + } + + &:last-child { + border-left: none; + + li { + margin-bottom: 1.5rem; + } + } + } + } + + .customer-logo { + box-sizing: border-box; + display: flex; + height: 8.5vh; + justify-content: flex-end; + margin-top: 20px; + text-align: end; + width: 15vw; + } + + .user-thumb>div { + /* Maybe move it in main.scss. /!\ some fields are different */ + @extend %user-thumb__grid; + + >.user-thumb__picture { + @extend %user-thumb__picture; + } + + >[name='sup'] { + @extend %user-thumb__grid-sup; + + .user-thumb__name { + @extend %user-thumb__name; + } + + sib-multiple { + @extend %user-thumb__groups; + } + + .tag-admin:not(:empty) { + @extend %tag-admin; + } + } + + >[name='sub'] { + @extend %user-thumb__grid-inf; + + >.user-thumb__city:not(:empty) { + @extend %user-thumb__city; + } + + >.user-thumb__lead:not(:empty) { + @extend %user-thumb__lead; + } + } + } + + ul { + list-style: none; + padding-left: 0; + + li { + margin-bottom: 0.5em; + + span::before { + color: $color-43-100-50; + font-size: 2.2rem; + margin: 0 1rem 0 0; + } + + span { + font-weight: bold; + + &.link-color { + color: $color-244-73-62; + } + + &.norm-weight { + font-weight: normal; + } + } + } + } +} \ No newline at end of file diff --git a/src/templates/hd-captain.pug b/src/templates/hd-captain.pug index 7119ea2..30a4108 100644 --- a/src/templates/hd-captain.pug +++ b/src/templates/hd-captain.pug @@ -2,12 +2,14 @@ include hd-user-avatar.pug sib-widget(name='hd-captain') template - sib-display( + sib-display.user-thumb( data-src="${await value}" fields='account.picture, sup(name), sub(profile.city, is_lead)' - class-name='user-name' - class-profile.city='city' + class-account.picture='user-thumb__picture' + class-name='user-thumb__name' + class-profile.city='user-thumb__city' + class-is_lead='user-thumb__lead' widget-account.picture='hd-user-avatar' widget-is_lead='hd-user-lead' diff --git a/src/templates/hd-circle-team.pug b/src/templates/hd-circle-team.pug index 846f6e9..24539a8 100644 --- a/src/templates/hd-circle-team.pug +++ b/src/templates/hd-circle-team.pug @@ -2,15 +2,16 @@ include hd-user-avatar.pug sib-widget(name='circle-team-template') template - sib-display( + sib-display.user-thumb( data-src='${await value.user}' fields='account.picture, sup(name, isadmin, groups), sub(profile.city)' value-isadmin='${await value.is_admin}' - class-name='user-name' + class-account.picture='user-thumb__picture' + class-name='user-thumb__name' class-isadmin='tag-admin' class-groups='tag-group' - class-profile.city='city' + class-profile.city='user-thumb__city' widget-account.picture='hd-user-avatar' widget-isadmin='hd-circle-user-admin' diff --git a/src/templates/hd-customer.pug b/src/templates/hd-customer.pug index 813aa81..04e891f 100644 --- a/src/templates/hd-customer.pug +++ b/src/templates/hd-customer.pug @@ -10,7 +10,7 @@ sib-widget(name='hd-customer') div h3 Contact: ul - li #[span(class='mdi-account-outline') ${await value.firstName} ${await value.lastName ? await value.lastName : ""}]${await value.role ? `, ${await value.role}` : ""} + li #[span(class='mdi-account-outline') ${await value.first_name} ${await value.last_name ? await value.last_name : ""}]${await value.role ? `, ${await value.role}` : ""} li span(class='link-color norm-weight mdi-email-outline') a(href='mailto:${await value.email}') ${await value.email} diff --git a/src/templates/hd-project-team.pug b/src/templates/hd-project-team.pug index ff0616f..25243f7 100644 --- a/src/templates/hd-project-team.pug +++ b/src/templates/hd-project-team.pug @@ -2,15 +2,18 @@ include hd-user-avatar.pug sib-widget(name='hd-project-team') template - sib-display( + sib-display.user-thumb( data-src='${await value}' fields='user.account.picture, sup(user.name, isadmin, user.groups), sub(user.profile.city, name)' value-isadmin='${await value.is_admin}' - class-user.name='user-name' + class-user.account.picture='user-thumb__picture' + + class-user.name='user-thumb__name' class-isadmin='tag-admin' class-user.groups='tag-group' - class-user.profile.city='city' + class-user.profile.city='user-thumb__city' + class-name='user-thumb__lead' widget-user.account.picture='hd-user-avatar' widget-isadmin='hd-project-user-admin' diff --git a/src/views/admin/page-admin-circles-create.pug b/src/views/admin/page-admin-circles-create.pug index 500b751..607bb7d 100644 --- a/src/views/admin/page-admin-circles-create.pug +++ b/src/views/admin/page-admin-circles-create.pug @@ -1,11 +1,9 @@ div.content-box__info - sib-link(class="backlink", next='admin-circle-list') Back + sib-link(class="backlink right", next='admin-circle-list') Back h1.centered New circle - p.center Here you can create a new circle according to your interests, what you want to share, etc. - - sib-form.block( + sib-form( data-src=`${endpoints.circles || endpoints.post.circles}` fields='name, description' diff --git a/src/views/admin/page-admin-circles.pug b/src/views/admin/page-admin-circles.pug index c4428bd..bed9375 100644 --- a/src/views/admin/page-admin-circles.pug +++ b/src/views/admin/page-admin-circles.pug @@ -4,8 +4,8 @@ sib-route(name='admin-circle-create') sib-route(name='circle-left') - div.content-box__header.with-description - h1.title-left.without-margin Administration + div.content-box__header + h1.without-margin Administration #circle-left(hidden) @@ -17,10 +17,14 @@ sib-widget(name='circle-owner') template - sib-display( + sib-display.user-thumb( data-src='${await value}' fields='account.picture, sup(name), sub(username)' + class-account.picture='user-thumb__picture' + class-name='user-thumb__name' + class-username='user-thumb__username' + widget-account.picture='hd-user-avatar' ) diff --git a/src/views/admin/page-admin-projects-create.pug b/src/views/admin/page-admin-projects-create.pug index 6875d11..71dc897 100644 --- a/src/views/admin/page-admin-projects-create.pug +++ b/src/views/admin/page-admin-projects-create.pug @@ -3,7 +3,7 @@ sib-widget(name='hd-template-project-title') p ${value} div.content-box__info - sib-link(class="backlink" next='admin-project-list') Back + sib-link(class="backlink right" next='admin-project-list') Back sib-widget(name="admin-project-add-user") template @@ -18,7 +18,7 @@ div.content-box__info h1.centered New project - sib-form.block( + sib-form( data-src=`${endpoints.projects || endpoints.post.projects}` fields='line-1(customer, name), line-3(project.description), fieldset-fee, line-4(businessProvider.name, businessProvider.fee), fieldset-captain, line-10(captain)' diff --git a/src/views/admin/page-admin-projects.pug b/src/views/admin/page-admin-projects.pug index d93aa33..51f4b08 100644 --- a/src/views/admin/page-admin-projects.pug +++ b/src/views/admin/page-admin-projects.pug @@ -4,8 +4,8 @@ sib-route(name='admin-project-create') sib-route(name='project-left') - div.content-box__header.with-description - h1.title-left.without-margin Administration + div.content-box__header + h1.without-margin Administration #project-left(hidden) include ../project/page-project-left.pug @@ -38,10 +38,14 @@ sib-widget(name='project-captain') template - sib-display( + sib-display.user-thumb( data-src='${await value}' fields='account.picture, sup(name), sub(username)' + class-account.picture='user-thumb__picture' + class-name='user-thumb__name' + class-username='user-thumb__username' + widget-account.picture='hd-user-avatar' ) diff --git a/src/views/admin/page-admin-users.pug b/src/views/admin/page-admin-users.pug index 031c358..b916ba1 100644 --- a/src/views/admin/page-admin-users.pug +++ b/src/views/admin/page-admin-users.pug @@ -8,7 +8,7 @@ #admin-users-list(hidden) div.content-box__info - sib-display.block( + sib-display( data-src=`${endpoints.users || endpoints.get.users}` fields="account.picture, name, username, email, groups" multiple-groups="" diff --git a/src/views/circle/page-circle-edit.pug b/src/views/circle/page-circle-edit.pug index f1ab588..84b46e9 100644 --- a/src/views/circle/page-circle-edit.pug +++ b/src/views/circle/page-circle-edit.pug @@ -7,11 +7,16 @@ div.content-box__info sib-widget(name='team-template-edit') template - sib-display( - class='w50 cell border cell-with-id-card' + sib-display.user-thumb( + class='w50 cell border cell-with-id-card user-thumb' data-src='${await value.user}' fields='account.picture, sup(name, groups), sub(profile.city)' + class-account.picture='user-thumb__picture' + class-name='user-thumb__name' + class-groups='user-thumb__groups' + class-profile.city='user-thumb__city' + widget-account.picture='hd-user-avatar' multiple-groups='' @@ -36,12 +41,12 @@ div.content-box__info data-src="${value['@id']}" ) - sib-link(class="backlink", bind-resources, next='circle-profile') Back + sib-link(class="backlink right", bind-resources, next='circle-profile') Back sib-ac-checker(permission='acl:Write', bind-resources) h1 Edit your circle - sib-form.block.form-edit( + sib-form.form-edit( bind-resources fields='block-circle__info(name, owner), description' diff --git a/src/views/job-offer/page-job-offer-create.pug b/src/views/job-offer/page-job-offer-create.pug index c015306..3164807 100644 --- a/src/views/job-offer/page-job-offer-create.pug +++ b/src/views/job-offer/page-job-offer-create.pug @@ -1,32 +1,19 @@ .content-box.with-padding.with-form h1 Post a new job offer - p.center This form allows you to share an offer to all members of the network. - - sib-widget(name='title-text') - template - p Be clear and specific with the name of your offer. You can indicate which skill is important, the start date or the name of the client. Ex: "Looking for a plumber for planet Mars ASAP". - - sib-widget(name='description-text') - template - p Be specific and exhaustive to avoid answering too many questions later. Indicate what is the best way to fill the offer, the prerequisites...' - sib-form.block( + sib-form( data-src=`${endpoints.joboffers || endpoints.post.joboffers}` range-skills=`${endpoints.skills || endpoints.get.skills}` - fields='title, title-text, description, description-text, skills, closingDate' + fields='title, description, skills, closingDate' class-title='field form-label is-light is-expanded' label-title='Title*' - widget-title-text='title-text' - class-description='field form-label is-light is-expanded' label-description='Description*' widget-description='sib-form-textarea' - widget-description-text='description-text' - class-skills='form-label is-dark' label-skills='The required skills for this mission:*' multiple-skills='sib-multiple-select' diff --git a/src/views/job-offer/page-job-offer-edit.pug b/src/views/job-offer/page-job-offer-edit.pug index e13fa5c..95e57b8 100644 --- a/src/views/job-offer/page-job-offer-edit.pug +++ b/src/views/job-offer/page-job-offer-edit.pug @@ -1,7 +1,7 @@ .content-box.with-padding.with-form h1 Edit your job offer - sib-form.block( + sib-form( bind-resources range-skills=`${endpoints.skills || endpoints.get.skills}` diff --git a/src/views/project/page-project-edit.pug b/src/views/project/page-project-edit.pug index 61e5aa2..b8ab17a 100644 --- a/src/views/project/page-project-edit.pug +++ b/src/views/project/page-project-edit.pug @@ -6,11 +6,11 @@ div.content-box__info template label ${label} - sib-link(class='backlink', bind-resources, next='project-profile') Back + sib-link(class='backlink right', bind-resources, next='project-profile') Back h1 Edit your project - sib-form.block.form-edit( + sib-form.form-edit( bind-resources fields='fieldset-info, block-project__info(customer, name, description), fieldset-fee, block-project__fee(businessProvider, businessProviderFee)' diff --git a/src/views/project/page-project-profile.pug b/src/views/project/page-project-profile.pug index 62ac1d6..720163f 100644 --- a/src/views/project/page-project-profile.pug +++ b/src/views/project/page-project-profile.pug @@ -55,7 +55,7 @@ sib-router(default-route='project-profile', hidden) h2 Customer informations: - sib-display.block( + sib-display( bind-resources fields='customer'