diff --git a/dmp-frontend/src/app/app.component.html b/dmp-frontend/src/app/app.component.html
index f36df178a..57546e87d 100644
--- a/dmp-frontend/src/app/app.component.html
+++ b/dmp-frontend/src/app/app.component.html
@@ -1,14 +1,13 @@
-
@@ -82,9 +102,7 @@
-
-
-
+
diff --git a/dmp-frontend/src/app/app.module.ts b/dmp-frontend/src/app/app.module.ts
index aaa4628f6..8008a69d5 100644
--- a/dmp-frontend/src/app/app.module.ts
+++ b/dmp-frontend/src/app/app.module.ts
@@ -66,7 +66,7 @@ import { NguiAutoCompleteModule } from '@ngui/auto-complete';
import { HTTP_INTERCEPTORS } from '@angular/common/http';
-import { BreadcrumbModule,PanelModule, MenuItem } from 'primeng/primeng';
+import { BreadcrumbModule, PanelModule } from 'primeng/primeng';
import { CommonModule } from '@angular/common';
@@ -95,6 +95,8 @@ import { DmpDetailedComponent } from './viewers/dmp-detailed/dmp-detailed.compon
import { ProjectDetailedComponent } from './viewers/project-detailed/project-detailed.component';
import {ProgressBarModule} from 'primeng/primeng';
+import {StepsModule,MenuItem} from 'primeng/primeng';
+import {SidebarModule as NgSidebarModule} from 'primeng/primeng';
@NgModule({
declarations: [
@@ -151,8 +153,9 @@ import {ProgressBarModule} from 'primeng/primeng';
ProgressBarModule,
PanelModule,
BrowserAnimationsModule,
- SidebarModule.forRoot()
-
+ SidebarModule.forRoot(),
+ StepsModule,
+ NgSidebarModule
],
providers: [{
provide: HTTP_INTERCEPTORS,
diff --git a/dmp-frontend/src/app/form/dynamic-form.component.css b/dmp-frontend/src/app/form/dynamic-form.component.css
index 80406e064..263b37ebf 100644
--- a/dmp-frontend/src/app/form/dynamic-form.component.css
+++ b/dmp-frontend/src/app/form/dynamic-form.component.css
@@ -1,111 +1,30 @@
-.hide{
- display:none;
+.full-width {
+ width: 100%;
}
-.show {
- display:block;
+.ui-steps .ui-steps-item {
+ width: 25%;
}
-.btncustom{
- background-color:#337ab7;
- color:white;
- margin-top:15px;
+.ui-steps.steps-custom {
+ margin-bottom: 30px;
+}
+
+.ui-steps.steps-custom .ui-steps-item .ui-menuitem-link {
+ height: 10px;
+ padding: 0 1em;
+}
+
+.ui-steps.steps-custom .ui-steps-item .ui-steps-number {
+ background-color: #0081c2;
+ color: #FFFFFF;
+ display: inline-block;
+ width: 36px;
+ border-radius: 50%;
+ margin-top: -14px;
+ margin-bottom: 10px;
}
-.parent-div {
- height: calc(100vh - 60px - 32px); /* is height_of(window) - heigh_of(app-header-bar) - height_of(breadcrumb) */
- width:100%;
-}
-
-
-
-.child-div-left{
-
- -webkit-box-shadow: 0px 0px 9px 2px rgba(0,0,0,0.75);
- -moz-box-shadow: 0px 0px 9px 2px rgba(0,0,0,0.75);
- box-shadow: 0px 0px 9px 2px rgba(0,0,0,0.75);
-
- padding:0px;
- height: 100%;
- -webkit-transition: width 0.5s; /* For Safari 3.1 to 6.0 */
- transition: width 0.5s;
-
-}
-
-
-.collapsed-div-caret{
- position: absolute;
- width: 120px;
- left: 98%;
- top: 103px;
- transform: translate(-50%, -50%);
- z-index: 9999;
- font-size: 1.3em;
- cursor: pointer;
-}
-
-.child-div-caret{
- position: absolute;
- left: 120%;
- top: 50%;
- transform: translate(-50%, -50%);
- z-index: 9999;
- font-size: 1.3em;
- cursor: pointer;
-}
-
-
-.child-div-right {
- overflow-y: scroll;
-
- height: calc(100% - 44px);
-
- -webkit-transition: 0.5s; /* For Safari 3.1 to 6.0 */
- transition: width 0.5s;
-
-}
-
-.shrink-width{
- width: 0px;
- /*visibility:hidden;*/
-}
-
-
-
-.form-body-container{
- padding-bottom: 10px;
- height: calc(100vh - 85px - 32px - 138px); /* is height_of(window) - heigh_of(app-header-bar) - height_of(breadcrumb) - height_of(form-footer-bar) */
- overflow-y:scroll;
-}
-
-.form-footer-seperator{
-
- border-style: solid;
- border-width: 1px;
- border-color: rgb(112, 112, 112);
-
- /*
- -webkit-box-shadow: 0px 0px 11px 1px rgba(0,0,0,0.75);
- -moz-box-shadow: 0px 0px 11px 1px rgba(0,0,0,0.75);
- box-shadow: 0px 0px 11px 1px rgba(0,0,0,0.75);
- */
-
- /*border-width: thin;*/
- width:100%;
-}
-
-.form-footer-container {
-
- /*
- -webkit-box-shadow: 0px -3px 5px 0px rgba(128,128,128,1);
- -moz-box-shadow: 0px -3px 5px 0px rgba(128,128,128,1);
- box-shadow: 0px -3px 5px 0px rgba(128,128,128,1);
- */
-
- height: 138px;
-}
-
-.progress{
- margin-top: 8px;
- margin-bottom: 0px;
+.ui-steps.steps-custom .ui-steps-item .ui-steps-title {
+ color: #555555;
}
\ No newline at end of file
diff --git a/dmp-frontend/src/app/form/dynamic-form.component.html b/dmp-frontend/src/app/form/dynamic-form.component.html
index 1a8da42f0..a18af6b7e 100644
--- a/dmp-frontend/src/app/form/dynamic-form.component.html
+++ b/dmp-frontend/src/app/form/dynamic-form.component.html
@@ -1,111 +1,119 @@
-
-
-
+
-->
\ No newline at end of file