diff --git a/src/config.json b/src/config.json index 946ac58..de10592 100644 --- a/src/config.json +++ b/src/config.json @@ -1,8 +1,10 @@ { "dev": { "sdn": "http://127.0.0.1:8000", + //"sdn": "https://test-paris.happy-dev.fr", "cdn": "https://cdn.happy-dev.fr", "xmpp": "https://jabber.happy-dev.fr/http-bind/", + //"client_id": "833925" "client_id": "499509" }, "prod": { diff --git a/src/styles/filters.scss b/src/styles/filters.scss index 3ee535e..436f257 100644 --- a/src/styles/filters.scss +++ b/src/styles/filters.scss @@ -2,7 +2,8 @@ border-bottom: 1px solid $color-grey1; display: grid; grid-gap: 0px 15px; - grid-template-columns: 50% auto; + grid-template-columns: 50% 50%; + grid-template-rows: 3.5em 3.5em; padding-bottom: 3em; label { diff --git a/src/styles/members.scss b/src/styles/members.scss index 17b80a4..a5ce760 100644 --- a/src/styles/members.scss +++ b/src/styles/members.scss @@ -1,3 +1,149 @@ +#profiles-list { + @extend .grid-layer; + + & > sib-form { + grid-column-start: start; + grid-column-end: middle; + grid-row-start: start; + grid-row-end: middle; + } + + & > div { + background: violet; + grid-column-start: start; + grid-column-end: end; + margin-bottom: 1em; + /*grid-row-start: middle; + grid-row-end: end; + display: grid; + grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); + grid-gap: 1em;*/ + display: flex; + justify-content: space-between; + + &:first-of-type { + color: $color-black2; + font-weight: bold; + justify-content: center; + white-space: nowrap; + + &::before, &::after { + border-top: 1px solid $color-grey-light5; + content: ''; + position: relative; + top: 0.5em; + width: 40%; + } + + &::before { + right: 5.8%; + } + + &::after { + left: 5.8%; + } + } + + > sib-display { + cursor: pointer; + 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 sib-display-lookuplist { &[name$='skills'] { display: flex; @@ -27,165 +173,6 @@ } } -#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 { - background: violet; - grid-column-start: start; - grid-column-end: end; - margin-bottom: 1em; - /*grid-row-start: middle; - grid-row-end: end; - display: grid; - grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); - grid-gap: 1em;*/ - display: flex; - justify-content: space-between; - - &:first-of-type { - color: $color-black2; - font-weight: bold; - justify-content: center; - white-space: nowrap; - - &::before, &::after { - border-top: 1px solid $color-grey-light5; - content: ''; - position: relative; - top: 0.5em; - width: 40%; - } - &::before { - right: 5.8%; - } - - &::after { - left: 5.8%; - } - } - } -} - -#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();