diff --git a/package.json b/package.json
index a0c175d..cc80597 100644
--- a/package.json
+++ b/package.json
@@ -14,6 +14,7 @@
},
"dependencies": {
"bootstrap": "^4.0.0",
+ "cropper": "^4.0.0",
"font-awesome": "^4.7.0",
"jquery": "^3.3.1"
}
diff --git a/src/html/dependencies-dev.php b/src/html/dependencies-dev.php
index 88c48cc..2534619 100644
--- a/src/html/dependencies-dev.php
+++ b/src/html/dependencies-dev.php
@@ -1,11 +1,13 @@
+
+
diff --git a/src/html/dependencies-prod.php b/src/html/dependencies-prod.php
index adfcc21..f21882e 100644
--- a/src/html/dependencies-prod.php
+++ b/src/html/dependencies-prod.php
@@ -1,16 +1,18 @@
-
-
-
-
+
+
+
+
+
-
-
-
-
-
-
+
+
+
+
+
+
+
-
-
-
-
+
+
+
+
diff --git a/src/html/edit-profile.html b/src/html/edit-profile.html
index c48991c..cbde15f 100644
--- a/src/html/edit-profile.html
+++ b/src/html/edit-profile.html
@@ -1,8 +1,106 @@
-
-
+
+
+
+
+
+
+
+
`;
+
+
+
+
+
+
+
+
+
+
+
+
+
+
diff --git a/src/html/menu.html b/src/html/menu.html
index 9822e37..2598d69 100644
--- a/src/html/menu.html
+++ b/src/html/menu.html
@@ -10,9 +10,8 @@
Membres
-
- Membre
-
+
+
diff --git a/src/js/hd-app.js b/src/js/hd-app.js
index 7e1b390..a1b0571 100644
--- a/src/js/hd-app.js
+++ b/src/js/hd-app.js
@@ -15,6 +15,7 @@ document.addEventListener("DOMContentLoaded", function(event) {
openSearchBar();
}
+ // Escape key
else if (e.keyCode == 27 && navBar.classList.contains("search-mode")) {
closeSearchBar();
}
diff --git a/src/scss/_edit-profile.scss b/src/scss/_edit-profile.scss
new file mode 100644
index 0000000..4c01e67
--- /dev/null
+++ b/src/scss/_edit-profile.scss
@@ -0,0 +1,39 @@
+#crop-modal {
+ position: absolute;
+ z-index: 1111;
+ top: $menu-height;
+ bottom: 0px;
+ left: 0px;
+ right: 0px;
+ background-color: black;
+ display: none;
+
+ &.cropping-mode {
+ display: block;
+ }
+
+ .crop-wrapper {
+ img {
+ width: 100%;
+ }
+ }
+
+ .control-bar {
+ display: flex;
+ justify-content: space-between;
+ color: white;
+ font-size: 30px;
+
+ button {
+ text-transform: uppercase;
+ color: white;
+ font-size: 18px;
+ font-weight: bold;
+ }
+
+ i {
+ padding-top: 4px;
+ }
+ }
+}
+
diff --git a/src/scss/_forms.scss b/src/scss/_forms.scss
index a0f6eb4..5ae2f5e 100644
--- a/src/scss/_forms.scss
+++ b/src/scss/_forms.scss
@@ -54,3 +54,23 @@ ldp-display {
}
}
}
+
+ldp-form.edit-form {
+ ldp-form-text {
+ @extend %form-group;
+
+ label {
+ text-transform: capitalize;
+ }
+
+ input {
+ @extend %form-control;
+ @extend %form-control-sm;
+ }
+ }
+
+ input[type="submit"] {
+ @extend %btn;
+ @extend %btn-primary;
+ }
+}
diff --git a/src/scss/_mixins.scss b/src/scss/_mixins.scss
index 5a0da00..2142554 100644
--- a/src/scss/_mixins.scss
+++ b/src/scss/_mixins.scss
@@ -33,6 +33,11 @@
background-color: transparent;
}
+%form-group {
+ display: block;
+ margin-bottom: 1rem;
+}
+
%form-control {
display: block;
width: 100%;
diff --git a/src/scss/_variables.scss b/src/scss/_variables.scss
index ae35db0..4b07813 100644
--- a/src/scss/_variables.scss
+++ b/src/scss/_variables.scss
@@ -2,7 +2,7 @@ $hd-color: rgb(253, 200, 21);
$hd-color-faded: rgba(253, 200, 21, 0.8);
$twitter-color: grey;
-$menu-height: 46px;
+$menu-height: 43px;
$menu-font-size: 16px;
$vertical-menu-width: 50px;
$sm-with: 576px;
diff --git a/src/scss/main.scss b/src/scss/main.scss
index cd2f418..8bd5639 100644
--- a/src/scss/main.scss
+++ b/src/scss/main.scss
@@ -11,6 +11,7 @@
@import "dashboard";
@import "members";
@import "member";
+@import "edit-profile";
@import "projects";
@import "project";
@import "channels";