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 @@ + + + + + + + + + + image/svg+xml + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + 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 @@ + + + + + + + + + + image/svg+xml + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + 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 @@ + + + + + + + + + + image/svg+xml + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + 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 @@ + + + + + + + + + + image/svg+xml + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +