diff --git a/frontend/src/app/features/work-packages/components/back-routing/back-button.component.sass b/frontend/src/app/features/work-packages/components/back-routing/back-button.component.sass index ef1c39bc0a09..1ff3ecbb8bc6 100644 --- a/frontend/src/app/features/work-packages/components/back-routing/back-button.component.sass +++ b/frontend/src/app/features/work-packages/components/back-routing/back-button.component.sass @@ -3,7 +3,7 @@ .op-back-button padding: 0 line-height: 32px - margin: 0 1rem 0 0 + margin: 0 width: 75px height: 34px diff --git a/frontend/src/app/features/work-packages/components/wp-breadcrumb/wp-breadcrumb.sass b/frontend/src/app/features/work-packages/components/wp-breadcrumb/wp-breadcrumb.sass index 0e401ce51caa..165bd14d049f 100644 --- a/frontend/src/app/features/work-packages/components/wp-breadcrumb/wp-breadcrumb.sass +++ b/frontend/src/app/features/work-packages/components/wp-breadcrumb/wp-breadcrumb.sass @@ -2,6 +2,7 @@ .op-wp-breadcrumb @include global-breadcrumb-styles + margin: 0 height: initial &--ellipsed @@ -11,9 +12,6 @@ &--active-parent-select width: 500px - @media screen and (max-width: $breakpoint-xl) - margin-top: 0 - ul.op-breadcrumb li wp-breadcrumb-parent white-space: initial diff --git a/frontend/src/app/features/work-packages/routing/wp-full-view/wp-full-view.html b/frontend/src/app/features/work-packages/routing/wp-full-view/wp-full-view.html index 28d4a51e810a..da5a80a1405c 100644 --- a/frontend/src/app/features/work-packages/routing/wp-full-view/wp-full-view.html +++ b/frontend/src/app/features/work-packages/routing/wp-full-view/wp-full-view.html @@ -2,23 +2,24 @@ [resource]="workPackage" *ngIf="workPackage" class="work-packages--show-view"> - - -
-
-
+
+ - - + + -
- -
+
+
-
    + +
    • .toolbar-container - margin: 10px 0 5px 0 - .work-packages--subject-type-row display: flex position: relative @@ -206,11 +157,9 @@ .work-packages--type-selector:not(.wp-new-top-row--element) .inline-edit--display-field padding-right: 5px !important - - // Remove left padding from type - .inline-edit--display-field + // Remove left padding from type padding-left: 0 !important - @media only screen and (min-width: 679px) + @media only screen and (min-width: $breakpoint-sm) .inline-edit--container.-active width: 130px diff --git a/frontend/src/global_styles/layout/work_packages/_mobile.sass b/frontend/src/global_styles/layout/work_packages/_mobile.sass index a5b40113b620..dc577480301c 100644 --- a/frontend/src/global_styles/layout/work_packages/_mobile.sass +++ b/frontend/src/global_styles/layout/work_packages/_mobile.sass @@ -33,14 +33,11 @@ #main #content-wrapper - padding: 15px &.nomenus top: 0 - padding: 0 width: 100% margin-left: 0 - .work-packages--show-view ul#toolbar-items li .wp-create-button .dropdown left: 0 !important @@ -102,22 +99,16 @@ padding: 8px 0 !important font-size: 1rem - @media screen and (max-width: $breakpoint-sm) .router--work-packages-full-view #content position: relative - .work-packages--show-view - padding: 40px 0 0 0 - #toolbar-items - position: absolute - top: 0 - right: 0 - justify-content: flex-end - - .toolbar-item - flex-grow: 0 + .wp-show--header-container + grid-template-columns: auto 1fr + grid-template-rows: auto auto 1fr + grid-template-areas: "backButton toolbar" "breadcrumb breadcrumb" "subject subject" + grid-row-gap: 0.5rem .work-packages-full-view--split-container border-top: none @@ -129,9 +120,8 @@ .router--work-packages-partitioned-split-view // Ensure the WP cards can span the complete width on mobile - #content-wrapper + #content padding: 15px 0 !important .toolbar-container margin-left: 15px - padding-left: 0px !important diff --git a/frontend/src/global_styles/layout/work_packages/_print.sass b/frontend/src/global_styles/layout/work_packages/_print.sass index a2a122690845..f7eb0f6459bf 100644 --- a/frontend/src/global_styles/layout/work_packages/_print.sass +++ b/frontend/src/global_styles/layout/work_packages/_print.sass @@ -97,9 +97,6 @@ // ------------------Only WP full screen view ------------------ .router--work-packages-full-view - // Since there is no toolbar and WP-back button the header can span 100% - .wp-show--header-container - flex-basis: 100% .work-packages-full-view--split-right overflow: visible flex-basis: initial !important