update: frameworkisation of user-thumb

This commit is contained in:
gaelle morin 2020-05-13 12:11:05 +02:00
parent cf30a0e363
commit 6fefd17c9b
No known key found for this signature in database
GPG Key ID: 028426702B95CF9C
8 changed files with 31 additions and 105 deletions

View File

@ -112,36 +112,6 @@
justify-content: center;
}
.user-thumb>div /* for the table in circle-edit and captain's cell in project-admin */,
[name='user-thumb'] {
@extend %user-thumb__grid;
padding: 0 2.2rem;
>.user-thumb__picture {
@extend %user-thumb__picture;
}
>[name='sup'] {
@extend %user-thumb__grid-sup;
.user-thumb__name {
@extend %user-thumb__name;
}
}
>[name='sub'] {
@extend %user-thumb__grid-inf;
>.user-thumb__username:not(:empty) {
@extend %user-thumb__username;
}
>.user-thumb__city:not(:empty) {
@extend %user-thumb__city;
}
}
}
sib-ac-checker {
align-items: center;
display: flex;

View File

@ -21,7 +21,8 @@
margin-top: 0.50rem;
}
%user-thumb__picture {
.user-thumb__picture {
align-items: center;
align-self: center;
background-color: var(--color-avatar-background);
@ -51,17 +52,17 @@
}
}
%user-thumb__name {
.user-thumb__name {
color: var(--color-user-thumb-name);
font-weight: 600;
margin-right: 1rem;
}
%user-thumb__admin {
.user-thumb__admin:not(:empty) {
@extend %tag-admin;
}
%user-thumb__username {
.user-thumb__username {
align-items: center;
display: flex;
@ -70,7 +71,7 @@
}
}
%user-thumb__city {
.user-thumb__city:not(:empty) {
@include mdi('atom');
align-items: center;
display: flex;
@ -82,7 +83,7 @@
}
}
%user-thumb__lead {
.user-thumb__lead:not(:empty) {
@include icon('eyeglass');
align-items: center;
display: flex;
@ -95,3 +96,23 @@
margin-right: 0.50rem;
}
}
/* Apply the grid to all user-thumbs */
.user-thumb>div,
[name='user-thumb'] {
@extend %user-thumb__grid;
>[name='sup'] {
@extend %user-thumb__grid-sup;
}
>[name='sub'] {
@extend %user-thumb__grid-inf;
}
}
/* Add extra spaces to user-thumbs that are inside a table */
.user-thumb.is-spaced>div,
[name='user-thumb'] {
padding: 0 2.2rem;
}

View File

@ -4,36 +4,4 @@
display: flex;
justify-content: flex-end;
}
.block {
/* peut-être à mettre dans main.scss */
.user-thumb>div {
@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;
}
.tag-admin:not(:empty) {
@extend %tag-admin;
}
}
>[name='sub'] {
@extend %user-thumb__grid-inf;
>.user-thumb__city:not(:empty) {
@extend %user-thumb__city;
}
}
}
}
}

View File

@ -49,39 +49,6 @@
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;
}
.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;

View File

@ -9,7 +9,7 @@ sib-widget(name='hubl-circle-team-template')
class-account.picture='user-thumb__picture'
class-name='user-thumb__name'
class-isadmin='tag-admin'
class-isadmin='user-thumb__admin'
class-profile.city='user-thumb__city'
widget-account.picture='hubl-user-avatar'

View File

@ -10,7 +10,7 @@ sib-widget(name='hubl-project-team')
class-user.account.picture='user-thumb__picture'
class-user.name='user-thumb__name'
class-isadmin='tag-admin'
class-isadmin='user-thumb__admin'
class-user.profile.city='user-thumb__city'
class-name='user-thumb__lead'

View File

@ -14,7 +14,7 @@
sib-widget(name='hubl-circle-owner')
template
sib-display.user-thumb(
sib-display.user-thumb.is-spaced(
data-src='${await value}'
fields='account.picture, sup(name), sub(username)'

View File

@ -38,7 +38,7 @@
sib-widget(name='hubl-project-captain')
template
sib-display.user-thumb(
sib-display.user-thumb.is-spaced(
data-src='${await value}'
fields='account.picture, sup(name), sub(username)'