diff --git a/src/page-circle-profile.pug b/src/page-circle-profile.pug index 04bb600..f00c576 100644 --- a/src/page-circle-profile.pug +++ b/src/page-circle-profile.pug @@ -16,86 +16,84 @@ class-description='description' ) - div.content-box__info + sib-ac-checker.content-box__info(permission='acl:Read', bind-resources) + sib-ac-checker.circle-edit-button(permission='acl:Write', bind-resources) + sib-link(class="right-btn", next="circle-edit", bind-resources) Edit and add Members - sib-ac-checker(permission='acl:Read', bind-resources) - sib-ac-checker(permission='acl:Write', bind-resources) - sib-link(class="right-btn", next="circle-edit", bind-resources) Edit and add Members + sib-display.block( + bind-resources + fields='creationDateSet(title, creationDate)' - sib-display.block( + value-title='Creation date:' + + widget-creationDate='sib-display-date' + ) + + + h2(name="label-team") Members: + + //- TODO: sib-ac-checker unworking - https://git.happy-dev.fr/startinblox/framework/sib-core/issues/517 + //- sib-ac-checker(permission='acl:Write', bind-resources, nested-field='team') + sib-form.block.team-form( + bind-resources + nested-field='members' + fields='user' + range-user=`${endpoints.users}` + + class-user='team form-label is-dark' + label-user='' + widget-user='sib-form-auto-completion' + + submit-button='Add a member' + ) + + sib-display.block( + bind-resources + fields='team' + + multiple-team='' + widget-team='circle-team-template' + ) + + sib-ac-checker(permission='acl:Delete', bind-resources) + sib-delete( bind-resources - fields='creationDateSet(title, creationDate)' - - value-title='Creation date:' - - widget-creationDate='sib-display-date' + data-label='Delete Circle' + class='right-btn reversed-btn' ) - - h2(name="label-team") Members: - - //- TODO: sib-ac-checker unworking - https://git.happy-dev.fr/startinblox/framework/sib-core/issues/517 - //- sib-ac-checker(permission='acl:Write', bind-resources, nested-field='team') - sib-form.block.team-form( - bind-resources - nested-field='members' - fields='user' - range-user=`${endpoints.users}` - - class-user='team form-label is-dark' - label-user='' - widget-user='sib-form-auto-completion' - - submit-button='Add a member' - ) - - sib-display.block( - bind-resources - fields='team' - - multiple-team='' - widget-team='circle-team-template' - ) - - sib-ac-checker(permission='acl:Delete', bind-resources) - sib-delete( - bind-resources - data-label='Delete Circle' - class='right-btn reversed-btn' + sib-widget(name='join-leave-circle-button') + template + sib-ac-checker( + permission="acl:Delete" + data-src="${value['@id']}" ) - - sib-widget(name='join-leave-circle-button') - template - sib-ac-checker( - permission="acl:Delete" + sib-delete( data-src="${value['@id']}" + data-label='Leave circle' ) - sib-delete( - data-src="${value['@id']}" - data-label='Leave circle' - ) - sib-display( - bind-resources - fields='members' + sib-display( + bind-resources + fields='members' - multiple-members='' - widget-members='join-leave-circle-button' - ) + multiple-members='' + widget-members='join-leave-circle-button' + ) - sib-form.block.team-form( - bind-resources - nested-field='members' - fields='user' - label-user='' - range-user=`${endpoints.users}` - widget-user='sib-form-dropdown' + sib-form.block.team-form( + bind-resources + nested-field='members' + fields='user' + label-user='' + range-user=`${endpoints.users}` + widget-user='sib-form-dropdown' - set-user-id-select="user" + set-user-id-select="user" - submit-button='Join Circle' - ) + submit-button='Join Circle' + ) #circle-edit(hidden) - include page-circle-edit.pug \ No newline at end of file + include page-circle-edit.pug diff --git a/src/styles/base/form.scss b/src/styles/base/form.scss index 96a97b0..1163209 100644 --- a/src/styles/base/form.scss +++ b/src/styles/base/form.scss @@ -169,6 +169,7 @@ align-self: flex-end; margin-bottom: 0.6rem; margin-left: 4.2rem; + margin-top: 0; } } diff --git a/src/styles/base/main.scss b/src/styles/base/main.scss index 47b8d5c..25b26f2 100644 --- a/src/styles/base/main.scss +++ b/src/styles/base/main.scss @@ -151,7 +151,7 @@ sib-delete { } .content-box__header { - padding: 2.3rem 3rem; + padding: 1.9rem 3rem; div { color: $color-233-18-29; diff --git a/src/styles/components/sidebar.scss b/src/styles/components/sidebar.scss index cea2695..f9d2499 100644 --- a/src/styles/components/sidebar.scss +++ b/src/styles/components/sidebar.scss @@ -45,7 +45,7 @@ border-bottom: 1px solid $color-229-25-79; display: flex; margin: 0; - padding: 2.55rem 2.55rem; + padding: 2.15rem 2.55rem; position: relative; width: 12em; diff --git a/src/styles/layout/circle/circle-edit.scss b/src/styles/layout/circle/circle-edit.scss index f57816d..cd5bfc5 100644 --- a/src/styles/layout/circle/circle-edit.scss +++ b/src/styles/layout/circle/circle-edit.scss @@ -1,4 +1,5 @@ #circle-edit { + .table-header { background: $color-228-25-79; color: white; @@ -7,71 +8,71 @@ font-weight: 600; justify-content: space-around; text-align: center; - + >*{ border-right: 1px solid $color-228-25-79; flex: 1; padding: 1rem; width: 50%; } - + >*:last-of-type { border-left: 1px solid white; - + @media (max-width: 1220px) { display: none; } } } - + .table-body div team-template-edit { display: flex; justify-content: space-between; - + >* { border-bottom: 1px solid $color-228-25-79; flex: 1; width: 50%; } - + sib-display { border-left: 1px solid $color-228-25-79; border-right: 1px solid $color-228-25-79; padding: 0 2.2rem; } - + sib-ac-checker { align-items: center; border-right: 1px solid $color-228-25-79; display: flex; justify-content: flex-end; padding: 2.7rem 2.2rem; - + @media (max-width: 1220px) { display: none; } } } - + .member-select.color { - + .ss-main { color: $color-233-18-29; } } - + sib-multiple[widget='team-template-edit'] { - + label { display: none; } - + >div>team-template-edit>sib-display>div { display: grid; grid-column-gap: 1.6rem; grid-template-columns: 7vh auto; grid-template-rows: repeat(2, 5.2vh); - + >[name='account.picture'] { align-items: center; align-self: center; @@ -85,7 +86,7 @@ overflow: hidden; position: relative; width: 7vh; - + img { background-color: white; height: 100%; @@ -95,45 +96,45 @@ 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'] { font-weight: 600; margin-right: 1rem; } - + sib-multiple { display: flex; - + [name='groups'] { @extend %user-role; } } } - + >[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; - + &::before { color: $color-43-100-50; margin-right: 0.50rem; @@ -141,5 +142,5 @@ } } } - } + } } diff --git a/src/styles/layout/circle/circle-profile.scss b/src/styles/layout/circle/circle-profile.scss index b77392c..7d86fe9 100644 --- a/src/styles/layout/circle/circle-profile.scss +++ b/src/styles/layout/circle/circle-profile.scss @@ -8,11 +8,22 @@ .content-box__info { @extend %padding-block; + display: flex; + flex-direction: column; .backlink { text-align: right; display: block; } + + .circle-edit-button { + align-self: flex-end; + position: absolute; + + >sib-link { + background: $color-244-73-62; + } + } } .block {