diff --git a/src/styles/base/header.scss b/src/styles/base/header.scss
index 360531f..2a0792b 100644
--- a/src/styles/base/header.scss
+++ b/src/styles/base/header.scss
@@ -112,7 +112,7 @@
user-select: none;
summary {
- padding: 16px;
+ padding: 18px;
cursor: pointer;
&:focus {
background-color: $color-233-18-29;
@@ -129,14 +129,29 @@
> * {
vertical-align: middle;
}
-
- img {
- border-radius: 100%;
+
+ hd-user-avatar {
+ align-items: center;
+ background-color: $color-213-20-91;
+ border-radius: 50%;
+ display: flex;
height: 4.8rem;
+ justify-content: center;
margin-right: 2rem;
+ overflow: hidden;
+ width: 4.8rem;
+ }
+
+ img {
+ height: 100%;
object-fit: cover;
object-position: center;
- width: 4.8rem;
+ width: 100%;
+ }
+
+ object {
+ height: 45%;
+ width: 45%;
}
sib-display-value[name='first_name'] {
@@ -218,5 +233,5 @@
}
}
}
-
-}
\ No newline at end of file
+}
+
diff --git a/src/styles/layout/job-offers/job-offers.scss b/src/styles/layout/job-offers/job-offers.scss
index f43e627..1b45f5e 100644
--- a/src/styles/layout/job-offers/job-offers.scss
+++ b/src/styles/layout/job-offers/job-offers.scss
@@ -70,7 +70,7 @@ sib-job-board {
display: flex;
margin: -0.25em;
- >* {
+ >*:not(sib-action) {
margin: 0.25em;
}
@@ -92,21 +92,27 @@ sib-job-board {
}
author-avatar {
- background-color: $color-0-0-100;
+ align-items: center;
+ background-color: $color-213-20-91;
border-radius: 50%;
+ display: flex;
height: 4.25rem;
+ justify-content: center;
+ margin-right: 2rem;
overflow: hidden;
- position: relative;
width: 4.25rem;
-
+
img {
height: 100%;
- left: 0;
object-fit: cover;
- position: absolute;
- top: 0;
+ object-position: center;
width: 100%;
}
+
+ object {
+ height: 45%;
+ width: 45%;
+ }
}
}
@@ -186,3 +192,14 @@ sib-job-board {
}
}
}
+
+sib-action[name='edit'] {
+ margin-left: auto;
+ color: $color-215-6-63;
+
+ &>sib-link {
+ @include icon('pencil');
+ font-size: 2rem;
+ }
+}
+
diff --git a/src/styles/layout/members/member-profile.scss b/src/styles/layout/members/member-profile.scss
index 1911aa9..0fa709a 100644
--- a/src/styles/layout/members/member-profile.scss
+++ b/src/styles/layout/members/member-profile.scss
@@ -22,8 +22,29 @@
div[name='member-img'] {
grid-area: avatar;
- overflow: hidden;
- position: relative;
+
+ member-picture {
+ align-items: center;
+ background-color: $color-213-20-91;
+ border-radius: 50%;
+ display: flex;
+ height: 28vh;
+ justify-content: center;
+ overflow: hidden;
+ width: 28vh;
+
+ img {
+ height: 255px;
+ object-fit: cover;
+ object-position: center;
+ width: 255px;
+ }
+
+ object {
+ height: 45%;
+ width: 45%;
+ }
+ }
img {
border-radius: 50%;
diff --git a/src/styles/layout/members/members.scss b/src/styles/layout/members/members.scss
index 4af55b7..e60df83 100644
--- a/src/styles/layout/members/members.scss
+++ b/src/styles/layout/members/members.scss
@@ -159,22 +159,27 @@ member-info-groups {
}
member-picture {
- background-color: $color-0-0-100;
+ align-items: center;
+ background-color: $color-213-20-91;
border-radius: 50%;
+ display: flex;
height: 28vh;
+ justify-content: center;
margin: 1.7rem auto;
overflow: hidden;
- position: relative;
width: 28vh;
img {
height: 100%;
- left: 0;
object-fit: cover;
- position: absolute;
- top: 0;
+ object-position: center;
width: 100%;
}
+
+ object {
+ height: 45%;
+ width: 45%;
+ }
}
[name='name'] {
diff --git a/src/templates/hd-user-avatar.pug b/src/templates/hd-user-avatar.pug
index 86a0d4c..1624767 100644
--- a/src/templates/hd-user-avatar.pug
+++ b/src/templates/hd-user-avatar.pug
@@ -1,3 +1,2 @@
sib-widget(name='hd-user-avatar')
- template
- img(name="${name}",src="\${value || '/images/alien.jpg'}",style="max-width:100%; max-height: 100%;")
\ No newline at end of file
+ template ${value ? `
` : ``}
diff --git a/www/images/alien.jpg b/www/images/alien.jpg
deleted file mode 100644
index c6277a1..0000000
Binary files a/www/images/alien.jpg and /dev/null differ
diff --git a/www/images/alien.svg b/www/images/alien.svg
new file mode 100644
index 0000000..0037c26
--- /dev/null
+++ b/www/images/alien.svg
@@ -0,0 +1,20 @@
+