diff --git a/app/Resources/public/css/base.css b/app/Resources/public/css/base.css
index 9266a085f8..be0969bb07 100644
--- a/app/Resources/public/css/base.css
+++ b/app/Resources/public/css/base.css
@@ -5296,13 +5296,20 @@ div#chat-remote-video video {
#registration #status .radio{
display: inline-block;
+ position: relative;
}
#registration #status .radio label p{
text-align: center;
padding-top: 5px;
padding-bottom: 5px;
}
-input[name='status'] {
+#registration .progress{
+ width: 100%;
+ margin-top: 5px;
+ margin-bottom: 5px;
+ height: 10px;
+}
+#registration input[name='status'] {
position: relative !important;
margin-left: 0 !important;
-webkit-appearance: none;
@@ -5313,41 +5320,53 @@ input[name='status'] {
outline: none;
cursor: pointer;
}
-input[value='5']:after {
- display: inline-block;
+#registration input[value='5']:after {
+ position: relative;
+ top: 0;
+ display: block;
content: ' ';
background: url(../../main/img/icons/svg/coursestudent_na.svg);
width: 132px;
height: 132px;
- border-radius: 5px;
+ border-radius: 0;
-webkit-transition: color 1s, -webkit-box-shadow 1s;
transition: color 1s, -webkit-box-shadow 1s;
transition: box-shadow 1s, color 1s;
transition: box-shadow 1s, color 1s, -webkit-box-shadow 1s;
+ border: 4px solid #FFFFFF;
}
-input[value='5']:checked:after {
+#registration input[value='5']:checked:after {
-webkit-box-shadow: 2px 2px 14px rgba(0, 0, 0, 0.4);
box-shadow: 2px 2px 10px rgba(0, 0, 0, 0.2);
background: url(../../main/img/icons/svg/coursestudent.svg);
- border: 4px solid #E4CE80;
+ border-color: #E4CE80;
+ transition: all 250ms ease;
+ will-change: transition;
+ top: 5px;
}
-input[value='1']:after {
- display: inline-block;
+#registration input[value='1']:after {
+ position: relative;
+ top: 0;
+ display: block;
content: ' ';
background: url(../../main/img/icons/svg/coursemanager_na.svg);
width: 132px;
height: 132px;
- border-radius: 10px;
+ border-radius: 0;
-webkit-transition: color 1s, -webkit-box-shadow 1s;
transition: color 1s, -webkit-box-shadow 1s;
transition: box-shadow 1s, color 1s;
transition: box-shadow 1s, color 1s, -webkit-box-shadow 1s;
+ border: 4px solid #FFFFFF;
}
-input[value='1']:checked:after {
+#registration input[value='1']:checked:after {
-webkit-box-shadow: 2px 2px 14px rgba(0, 0, 0, 0.4);
box-shadow: 2px 2px 10px rgba(0, 0, 0, 0.2);
background: url(../../main/img/icons/svg/coursemanager.svg);
- border: 4px solid #5DA200;
+ border-color: #76CDE4;
+ transition: all 250ms ease;
+ will-change: transition;
+ top: 5px;
}
diff --git a/main/img/icons/svg/coursemanager.svg b/main/img/icons/svg/coursemanager.svg
new file mode 100644
index 0000000000..8d39430479
--- /dev/null
+++ b/main/img/icons/svg/coursemanager.svg
@@ -0,0 +1,390 @@
+
+
+
+
diff --git a/main/img/icons/svg/coursemanager_na.svg b/main/img/icons/svg/coursemanager_na.svg
new file mode 100644
index 0000000000..8ebbde6bf7
--- /dev/null
+++ b/main/img/icons/svg/coursemanager_na.svg
@@ -0,0 +1,385 @@
+
+
+
+
diff --git a/main/img/icons/svg/coursestudent.svg b/main/img/icons/svg/coursestudent.svg
new file mode 100644
index 0000000000..fcfea91164
--- /dev/null
+++ b/main/img/icons/svg/coursestudent.svg
@@ -0,0 +1,391 @@
+
+
+
+
diff --git a/main/img/icons/svg/coursestudent_na.svg b/main/img/icons/svg/coursestudent_na.svg
new file mode 100644
index 0000000000..fc2ef01f51
--- /dev/null
+++ b/main/img/icons/svg/coursestudent_na.svg
@@ -0,0 +1,383 @@
+
+
+
+