created burger menu and added responsive styles for navbar, optimized element positions in header
diff --git a/dev/scss/media.scss b/dev/scss/media.scss
index d7875f8..dcf78dd 100644
--- a/dev/scss/media.scss
+++ b/dev/scss/media.scss
@@ -21,16 +21,82 @@
}
header {
+ padding-top: 2rem;
padding-right: 8px;
}
header form {
+ margin: 1.5rem 1rem;
padding-left: 0;
- padding-top: 33px;
+ // padding-top: 33px;
+ }
+
+ .navbar {
+ *:not(:first-child) {
+ display: none;
+ }
+
+ .burger-icon {
+ display: block !important;
+ padding: .6rem .9rem;
+ font-size: 1.5rem;
+ color: $nearly-white;
+ }
+
+ &.show .burger-icon {
+ position: absolute;
+ top: 0;
+ right: 0;
+ background-color: $middle-green;
+ }
+
+ &.show * {
+ display: block;
+ }
+
+ &-group {
+ margin-top: 3rem;
+ width: 100%;
+ display: block;
+ position: fixed;
+ top: 0;
+ left: 0;
+ background-color: $middle-green;
+
+ fieldset.fieldset-login {
+ width: 100%;
+
+ form.login {
+ align-items: normal !important;
+ flex-direction: column;
+ gap: 6px;
+
+ input[type=text],
+ input[type=password] {
+ @include input-field;
+ margin-right: 0 !important;
+ }
+
+ button.btn-login {
+ width: 100% !important;
+ align-self: center;
+ }
+ }
+ }
+ }
+
+ @media (hover: none) and (pointer: coarse) {
+ .dropdown {
+ margin-right: 0 !important;
+
+ &-content {
+ display: block !important;
+ }
+ }
+ }
}
.vc {
-
font-size: 9pt;
.builder {
.doc {
@@ -58,6 +124,11 @@
}
z-index: 110;
position: absolute !important;
+ top: 50%;
+ transform: translateY(-50%);
+ -o-transform: translateY(-50%);;
+ -moz-transform: translateY(-50%);
+ -webkit-transform: translateY(-50%);
}
#searchbar {
@@ -81,6 +152,7 @@
}
main {
+ padding: 1rem;
margin-left: $standard-margin;
margin-right: $standard-margin;
}
@@ -173,6 +245,7 @@
width: 100%;
top: 0;
border-width: 0;
+
fieldset input {
font-size: 9pt;
}