all profiles styles migrated in the new file

This commit is contained in:
Gaelle Morin 2018-12-17 16:51:38 +01:00
parent 5e05843c81
commit 34ff21a8e2
2 changed files with 169 additions and 48 deletions

View File

@ -27,7 +27,6 @@
// skills // skills
#member-profile sib-display-lookuplist, #member-profile sib-display-lookuplist,
#profiles-list sib-display-lookuplist,
sib-display-lookuplist { sib-display-lookuplist {
&[name$='skills'] { &[name$='skills'] {
display: flex; display: flex;
@ -124,11 +123,6 @@ sib-display-lookuplist {
// } // }
} }
#profiles-list > div > sib-display {
cursor: pointer;
}
#profiles-list > div > sib-display,
sib-display#member-info { sib-display#member-info {
display: flex; display: flex;
flex-direction: column; flex-direction: column;
@ -228,48 +222,7 @@ hdapp-available {
} }
} }
#profiles-list { #member-profile {
@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;
display: grid;
margin-top: 1em;
grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
grid-gap: 1em;
}
}
#profiles-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 { ul {
@include list-reset(); @include list-reset();
} }

View File

@ -0,0 +1,168 @@
#profiles-list sib-display-lookuplist {
&[name$='skills'] {
display: flex;
li,
ul {
margin: 0;
padding: 0;
list-style: none;
}
ul {
display: flex;
flex-wrap: wrap;
margin: 1em -0.25em;
}
li {
padding: 0.3em 1.2em;
border: 1px solid;
border-radius: 2em;
margin: 0.25em;
background-color: $color-yellow;
color: $color-white;
font-weight: bold;
}
}
}
#profiles-list > div > sib-display {
cursor: pointer;
}
#profiles-list > div > sib-display {
display: flex;
flex-direction: column;
position: relative;
@extend %frame;
padding: 1em;
label {
display: none;
}
div[name='header'] {
border-bottom: 1px solid $color-grey-light;
padding-bottom: 1em;
padding: 0.5em;
margin-bottom: 1em;
display: flex;
flex-direction: column;
>*{
display: flex;
justify-content: center;
flex-basis: content;
}
sib-display-img {
flex-basis:150px;
img {
border-radius: 100%;
width:150px;
}
}
}
hdapp-userinfo {
@extend h1;
}
[name=infos] {
margin: 2em 0;
> * {
// display: block;
margin: 0.5em 0;
}
}
ul[name$='roles'] * {
@include icon('user');
}
ul[name$='cell'] * {
@include icon('location-pin');
}
[name$='user'] {
margin-bottom: 0em;
}
sib-display-div[name$='bio'] {
margin-top: 1em;
flex-basis : 5em;
}
a[href^='mailto'] {
display: flex;
border-radius: 25px;
border-style: solid;
border-color: $color-blue-light;
color: $color-blue-light;
margin: 1em;
padding: 1em;
text-decoration:none;
}
sib-display-tel {
display: block;
@include icon('phone');
}
hdapp-hyperlink {
display: block;
@include icon('link');
}
sib-display-div[name$='foaf:homepage'] * {
@include icon('link');
}
sib-display-div[name$='more']{
display: flex;
flex-direction: row-reverse;
}
}
#profiles-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;
display: grid;
margin-top: 1em;
grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
grid-gap: 1em;
}
}
#profiles-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;
}
}
#profiles-list {
ul {
@include list-reset();
}
}