diff --git a/src/app/features/administration/stepper/stepper.component.scss b/src/app/features/administration/stepper/stepper.component.scss
index 45bf18e1..b8cb7d68 100644
--- a/src/app/features/administration/stepper/stepper.component.scss
+++ b/src/app/features/administration/stepper/stepper.component.scss
@@ -54,19 +54,20 @@
.cancel-button {
margin-top: 0;
- line-height: 60px;
- height: 60px;
+ line-height: $header-nav-inner-height;
+ height: $header-nav-inner-height;
display: inline-block;
+ padding-left: 1em;
&:hover {
- background: $font_color;
+ color: $font_color;
}
}
.step-info {
padding: 9px 10px;
background: $white;
- height: 60px;
+ height: $header-nav-inner-height;
i {
margin-left: 1ch;
}
diff --git a/src/index.html b/src/index.html
index ccb70099..8e4a546e 100644
--- a/src/index.html
+++ b/src/index.html
@@ -1,5 +1,5 @@
-
+
diff --git a/src/styles/dev-utilities/_debug.scss b/src/styles/dev-utilities/_debug.scss
index 3692190e..dea350a8 100644
--- a/src/styles/dev-utilities/_debug.scss
+++ b/src/styles/dev-utilities/_debug.scss
@@ -52,3 +52,21 @@ input {
}
}
}
+
+.ng-pristine,
+.ng-dirty {
+ //border-left: #ccc 3px solid;
+ //padding-left: 1em;
+}
+
+.ng-touched.ng-invalid {
+ //border-left: $danger 3px solid;
+ //padding-left: 1em;
+}
+
+.theme-dark-crystal {
+ .ng-touched.ng-valid {
+ //border-left: $success 3px solid;
+ //padding-left: 1em;
+ }
+}
diff --git a/src/styles/dev-utilities/_helpers.scss b/src/styles/dev-utilities/_helpers.scss
index 94642a88..1db3a5d1 100644
--- a/src/styles/dev-utilities/_helpers.scss
+++ b/src/styles/dev-utilities/_helpers.scss
@@ -45,6 +45,7 @@
}
.fixed-box {
+ box-sizing: border-box;
position: fixed;
top: 0;
left: 0;
diff --git a/src/styles/libraries/_overrides.scss b/src/styles/libraries/_overrides.scss
index a55dcb72..dd7545ee 100644
--- a/src/styles/libraries/_overrides.scss
+++ b/src/styles/libraries/_overrides.scss
@@ -20,7 +20,6 @@ $input-shadow: none;
width: 80%;
}
-html.has-navbar-fixed-top,
-body.has-navbar-fixed-top {
- padding-top: 68px;
+html {
+ padding-top: $header-nav-height;
}
diff --git a/src/styles/partials/_forms.scss b/src/styles/partials/_forms.scss
index c9a9c07f..a2251af3 100644
--- a/src/styles/partials/_forms.scss
+++ b/src/styles/partials/_forms.scss
@@ -19,22 +19,12 @@ app-step-one,
app-step-two,
app-step-three,
app-step-four,
+app-step-five,
app-step-six,
app-step-seven {
display: block;
}
-app-step-five {
- app-stepper {
- padding: 2em 2.5em;
- display: block;
- }
-
- .container {
- padding: 2em;
- }
-}
-
input,
select,
textarea {
@@ -219,7 +209,7 @@ mat-checkbox {
width: 500px;
max-width: 100%;
border: solid 1px #ccc;
- min-height: 60px;
+ min-height: $header-nav-inner-height;
display: block;
background: white;
border-radius: 4px;
@@ -272,27 +262,7 @@ mat-checkbox {
transition: transform 250ms cubic-bezier(0, 0, 0.2, 1);
}
-.ng-pristine,
-.ng-dirty {
- //border-left: #ccc 3px solid;
- //padding-left: 1em;
-}
-
-.ng-touched.ng-invalid {
- //border-left: $danger 3px solid;
- //padding-left: 1em;
-}
-
-.theme-dark-crystal {
- .ng-touched.ng-valid {
- //border-left: $success 3px solid;
- //padding-left: 1em;
- }
-}
-
.bar-nav-admin {
- //position:fixed;
- //bottom: 0;
background: #ccc;
display: block;
width: 100%;
@@ -302,14 +272,14 @@ mat-checkbox {
.advanced-config {
.work-in-progress {
background: $primary-light;
- padding: 0.25em;
- border-left: 1px solid $warning-dark;
color: $warning-dark;
}
}
.step {
- padding: 1rem 1rem;
+ padding: 2rem 1rem;
+
+ box-sizing: border-box;
.title {
color: $d-primary-intense;
margin-bottom: 36px;
diff --git a/src/styles/partials/_navigation.scss b/src/styles/partials/_navigation.scss
index 9cf0d4be..45c97e30 100644
--- a/src/styles/partials/_navigation.scss
+++ b/src/styles/partials/_navigation.scss
@@ -109,20 +109,18 @@ a span.ui-steps-number {
.bottom-step-buttons {
box-shadow: 0px -2px 4px rgba(0, 0, 0, 0.05);
+ box-sizing: border-box;
bottom: 0;
- left: 0;
z-index: 10;
height: auto;
background: $white;
-
- padding: 8px 16px;
- position: fixed !important;
- width: 100vw;
+ width: 100%;
position: fixed;
right: 0;
.button {
display: inline-block;
+ margin: 8px 16px;
}
.button {
&.is-secondary {
diff --git a/src/styles/partials/global.scss b/src/styles/partials/global.scss
index 491bc7a5..b067d8d1 100644
--- a/src/styles/partials/global.scss
+++ b/src/styles/partials/global.scss
@@ -41,7 +41,8 @@ main {
.columns {
&.half-columns {
- max-width: 100%;
+ width: 100%;
+ max-width: 100vw;
margin: 0 auto;
padding: 0;
diff --git a/src/styles/variables.scss b/src/styles/variables.scss
index 2e6dfada..c0c5f296 100644
--- a/src/styles/variables.scss
+++ b/src/styles/variables.scss
@@ -70,3 +70,5 @@ $title_font: 'helvetica', 'proza_libre', 'Arial', 'DejaVu Sans Mono';
// sizes and breakpoints
$main-column-width: 400px;
$mobile-size: 400px;
+$header-nav-height: 68px;
+$header-nav-inner-height: 60px;