feature: admin of a circle displayed
- CSS added - architecture reworked - new field 'is-admin' used - members field used instead of team field.
This commit is contained in:
		
				
					committed by
					
						
						gaelle morin
					
				
			
			
				
	
			
			
			
						parent
						
							92840cf8ff
						
					
				
				
					commit
					65c6b77fbc
				
			@ -25,10 +25,10 @@ sib-router(default-route='circle-profile', hidden)
 | 
			
		||||
 | 
			
		||||
    sib-display.block(
 | 
			
		||||
      bind-resources
 | 
			
		||||
      fields='team'
 | 
			
		||||
      fields='members'
 | 
			
		||||
 | 
			
		||||
      multiple-team=''
 | 
			
		||||
      widget-team='circle-team-template'
 | 
			
		||||
      multiple-members=''
 | 
			
		||||
      widget-members='circle-team-template'
 | 
			
		||||
    )
 | 
			
		||||
 | 
			
		||||
    div.box-button
 | 
			
		||||
 | 
			
		||||
@ -4,4 +4,4 @@
 | 
			
		||||
@import 'howto';
 | 
			
		||||
@import 'sidebar';
 | 
			
		||||
@import 'skills';
 | 
			
		||||
@import 'user-role';
 | 
			
		||||
@import 'tags';
 | 
			
		||||
							
								
								
									
										19
									
								
								src/styles/components/tags.scss
									
									
									
									
									
										Normal file
									
								
							
							
						
						
									
										19
									
								
								src/styles/components/tags.scss
									
									
									
									
									
										Normal file
									
								
							@ -0,0 +1,19 @@
 | 
			
		||||
%tag-role {
 | 
			
		||||
  border: 1px solid $color-45-95-54;
 | 
			
		||||
  border-radius: 3px;
 | 
			
		||||
  color: $color-210-4-50;
 | 
			
		||||
  font-size: 1.4rem;
 | 
			
		||||
  font-weight: 400;
 | 
			
		||||
  margin-right: 0.6rem;
 | 
			
		||||
  padding: 0.2rem 0.98rem;
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
%tag-admin {
 | 
			
		||||
  border: 1px solid $color-244-73-62;
 | 
			
		||||
  border-radius: 3px;
 | 
			
		||||
  color: $color-244-73-62;
 | 
			
		||||
  font-size: 1.4rem;
 | 
			
		||||
  font-weight: 400;
 | 
			
		||||
  margin-left: 0.6rem;
 | 
			
		||||
  padding: 0.3rem 0.98rem;
 | 
			
		||||
}
 | 
			
		||||
@ -1,9 +0,0 @@
 | 
			
		||||
%user-role {
 | 
			
		||||
    border: 1px solid $color-45-95-54;
 | 
			
		||||
    border-radius: 3px;
 | 
			
		||||
    color: $color-210-4-50;
 | 
			
		||||
    font-size: 1.4rem;
 | 
			
		||||
    font-weight: 400;
 | 
			
		||||
    margin-right: 0.4rem;
 | 
			
		||||
    padding: 0.2rem 0.98rem;
 | 
			
		||||
  }
 | 
			
		||||
@ -133,7 +133,7 @@
 | 
			
		||||
          display: flex;
 | 
			
		||||
 | 
			
		||||
          [name='groups'] {
 | 
			
		||||
            @extend %user-role;
 | 
			
		||||
            @extend %tag-role;
 | 
			
		||||
          }
 | 
			
		||||
        }
 | 
			
		||||
      }
 | 
			
		||||
 | 
			
		||||
@ -15,87 +15,84 @@
 | 
			
		||||
      }
 | 
			
		||||
    }
 | 
			
		||||
 | 
			
		||||
    >div { /* peut-être à mettre dans main.scss */
 | 
			
		||||
      
 | 
			
		||||
      >sib-multiple {
 | 
			
		||||
     /* peut-être à mettre dans main.scss */
 | 
			
		||||
 | 
			
		||||
        label {
 | 
			
		||||
          display: none;
 | 
			
		||||
    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);
 | 
			
		||||
 | 
			
		||||
      >[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%;
 | 
			
		||||
        }
 | 
			
		||||
 | 
			
		||||
        >div>circle-team-template[name='team']>sib-display>div {
 | 
			
		||||
          display: grid;
 | 
			
		||||
          grid-column-gap: 1.6rem;
 | 
			
		||||
          grid-template-columns: 7vh auto;
 | 
			
		||||
          grid-template-rows: repeat(2, 5.2vh);
 | 
			
		||||
        object {
 | 
			
		||||
          height: 45%;
 | 
			
		||||
          width: 45%;
 | 
			
		||||
        }
 | 
			
		||||
      }
 | 
			
		||||
 | 
			
		||||
          >[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;
 | 
			
		||||
      >[name='sup'] {
 | 
			
		||||
        align-items: center;
 | 
			
		||||
        align-self: end;
 | 
			
		||||
        display: flex;
 | 
			
		||||
        grid-column: 2 / span 1;
 | 
			
		||||
        grid-row: 1 / span 1;
 | 
			
		||||
        margin-bottom: 0.50rem;
 | 
			
		||||
 | 
			
		||||
            img {
 | 
			
		||||
              background-color: white;
 | 
			
		||||
              height: 100%;
 | 
			
		||||
              left: 0;
 | 
			
		||||
              object-fit: cover;
 | 
			
		||||
              position: absolute;
 | 
			
		||||
              top: 0;
 | 
			
		||||
              width: 100%;
 | 
			
		||||
            }
 | 
			
		||||
        .user-name {
 | 
			
		||||
          font-weight: 600;
 | 
			
		||||
        }
 | 
			
		||||
 | 
			
		||||
            object {
 | 
			
		||||
              height: 45%;
 | 
			
		||||
              width: 45%;
 | 
			
		||||
            }
 | 
			
		||||
        .tag-group {
 | 
			
		||||
          display: flex;
 | 
			
		||||
          margin-left: 0.6rem;
 | 
			
		||||
 | 
			
		||||
          [name='user.groups'] {
 | 
			
		||||
            @extend %tag-role;
 | 
			
		||||
          }
 | 
			
		||||
        }
 | 
			
		||||
 | 
			
		||||
          >[name='sup'] {
 | 
			
		||||
            align-self: end;
 | 
			
		||||
            display: flex;
 | 
			
		||||
            grid-column: 2 / span 1;
 | 
			
		||||
            grid-row: 1 / span 1;
 | 
			
		||||
            margin-bottom: 0.50rem;
 | 
			
		||||
        .tag-admin:not(:empty) {
 | 
			
		||||
          @extend %tag-admin;
 | 
			
		||||
        }
 | 
			
		||||
      }
 | 
			
		||||
 | 
			
		||||
            [name='name'] {
 | 
			
		||||
              font-weight: 600;
 | 
			
		||||
            }
 | 
			
		||||
      >[name='sub'] {
 | 
			
		||||
        align-self: start;
 | 
			
		||||
        grid-column: 2 / span 1;
 | 
			
		||||
        grid-row: 2 / span 1;
 | 
			
		||||
        margin-top: 0.50rem;
 | 
			
		||||
 | 
			
		||||
            sib-multiple {
 | 
			
		||||
              display: flex;
 | 
			
		||||
              margin-left: 1rem;
 | 
			
		||||
        >.city:not(:empty) {
 | 
			
		||||
          @include mdi('atom');
 | 
			
		||||
          align-items: center;
 | 
			
		||||
          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;
 | 
			
		||||
              }
 | 
			
		||||
            }
 | 
			
		||||
          &::before {
 | 
			
		||||
            color: $color-43-100-50;
 | 
			
		||||
            margin-right: 0.50rem;
 | 
			
		||||
          }
 | 
			
		||||
        }
 | 
			
		||||
      }
 | 
			
		||||
 | 
			
		||||
@ -135,7 +135,7 @@
 | 
			
		||||
          display: flex;
 | 
			
		||||
 | 
			
		||||
          [name='groups'] {
 | 
			
		||||
            @extend %user-role;
 | 
			
		||||
            @extend %tag-role;
 | 
			
		||||
          }
 | 
			
		||||
        }
 | 
			
		||||
      }
 | 
			
		||||
 | 
			
		||||
@ -88,7 +88,7 @@ sib-job-board {
 | 
			
		||||
              }
 | 
			
		||||
 | 
			
		||||
              >* {
 | 
			
		||||
                @extend %user-role;
 | 
			
		||||
                @extend %tag-role;
 | 
			
		||||
              }
 | 
			
		||||
            }
 | 
			
		||||
 | 
			
		||||
 | 
			
		||||
@ -32,7 +32,7 @@
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
member-info-groups {
 | 
			
		||||
  @extend %user-role;
 | 
			
		||||
  @extend %tag-role;
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
#members-list {
 | 
			
		||||
 | 
			
		||||
@ -117,11 +117,6 @@
 | 
			
		||||
        @include mdi('atom');
 | 
			
		||||
        align-items: center;
 | 
			
		||||
        display: flex;
 | 
			
		||||
 | 
			
		||||
        &::before {
 | 
			
		||||
          color: $color-43-100-50;
 | 
			
		||||
          margin-right: 0.50rem;
 | 
			
		||||
        }
 | 
			
		||||
      }
 | 
			
		||||
    }
 | 
			
		||||
  }
 | 
			
		||||
 | 
			
		||||
@ -35,7 +35,7 @@
 | 
			
		||||
          padding-left: 1.4rem;
 | 
			
		||||
 | 
			
		||||
          groups-name {
 | 
			
		||||
            @extend %user-role;
 | 
			
		||||
            @extend %tag-role;
 | 
			
		||||
          }
 | 
			
		||||
        }
 | 
			
		||||
      }
 | 
			
		||||
 | 
			
		||||
@ -3,14 +3,23 @@ include hd-user-avatar.pug
 | 
			
		||||
sib-widget(name='circle-team-template')
 | 
			
		||||
  template
 | 
			
		||||
    sib-display(
 | 
			
		||||
      data-src="${await value}"
 | 
			
		||||
      fields='account.picture, sup(name, groups), sub(profile.city)'
 | 
			
		||||
      data-src='${await value}'
 | 
			
		||||
      fields='account.picture, sup(user.name, is_admin, user.groups), sub(user.profile.city)'
 | 
			
		||||
 | 
			
		||||
      class-user.name='user-name'
 | 
			
		||||
      class-is_admin='tag-admin'
 | 
			
		||||
      class-user.groups='tag-group'
 | 
			
		||||
      class-user.profile.city='city'
 | 
			
		||||
 | 
			
		||||
      widget-account.picture='hd-user-avatar'
 | 
			
		||||
      widget-groups='hd-user-groups'
 | 
			
		||||
      widget-is_admin='hd-user-admin'
 | 
			
		||||
      widget-user.groups='hd-user-groups'
 | 
			
		||||
 | 
			
		||||
      multiple-groups=''
 | 
			
		||||
      multiple-user.groups=''
 | 
			
		||||
    )
 | 
			
		||||
 | 
			
		||||
sib-widget(name='hd-user-admin')
 | 
			
		||||
  template ${await value ? "Administrator" : ""}
 | 
			
		||||
 | 
			
		||||
sib-widget(name='hd-user-groups')
 | 
			
		||||
  template ${await value.name}
 | 
			
		||||
 | 
			
		||||
		Reference in New Issue
	
	Block a user