diff --git a/src/arquivos/sass/partials/_header.scss b/src/arquivos/sass/partials/_header.scss
index dd4d6eb..411734b 100644
--- a/src/arquivos/sass/partials/_header.scss
+++ b/src/arquivos/sass/partials/_header.scss
@@ -2,6 +2,7 @@
/**-- Header ------------------------------********************/
/*-------------------------------------------------------------*/
.page-header{
+ position: relative;
padding: 28px 0;
background: $black-500;
diff --git a/src/arquivos/sass/partials/_menu.scss b/src/arquivos/sass/partials/_menu.scss
index db604e9..9b0c6ad 100644
--- a/src/arquivos/sass/partials/_menu.scss
+++ b/src/arquivos/sass/partials/_menu.scss
@@ -1,18 +1,121 @@
-/***************************************************************/
-/**-- Menu ------------------------------********************/
-/*-------------------------------------------------------------*/
-
.menu{
+ align-self: stretch;
&__button{
padding: 0;
border: 0;
outline: 0;
background: transparent;
+
@include mq(lg,min){
display: none;
}
}
.main-menu{
- display: none;
+ height: 100%;
+ &__departments{
+ display: flex;
+ height: 100%;
+ margin: 0;
+ }
+ &__department{
+ display: flex;
+ align-items: center;
+ margin-right: 40px;
+
+ @include mq(lg,min){
+
+ &:hover{
+ .main-menu__department-link{
+ text-decoration: underline;
+ font-weight: 700;
+ color: $blue-500;
+ }
+ .submenu{
+ opacity: 1;
+ pointer-events: all;
+ top: 100%;
+ }
+ }
+ }
+ }
+ &__department-link{
+ font-size: 12px;
+ line-height: 15px;
+ color:$white-500;
+
+ @include mq(lg,min){
+
+ &::after{
+ content: attr(title);
+ display: block;
+ height: 0;
+ overflow: hidden;
+ font-weight: bold;
+ visibility: hidden;
+ }
+ }
+ }
+ }
+ .submenu{
+ position: absolute;
+ top: calc(100% + 32px);
+ left: 0;
+ z-index: map-get($map:$z-index, $key: Level-4);
+ width: 100%;
+ padding: 30px 0 44px;
+ background: rgba($white-500, 0.95);
+ box-shadow: 0px 4px 4px rgba($black-500, 0.02);
+ opacity: 0;
+ pointer-events: none;
+ transition: all 0.2s ease-in-out;
+ &::before{
+ content: '';
+ position: absolute;
+ left: 0;
+ bottom:100%;
+ width: 100%;
+ height: 28px;
+ background: transparent;
+ }
+
+ &__title{
+ margin: 0 0 8px;
+ line-height: 24px;
+ font-size: 20px;
+ }
+
+ &__categorias-wrapper{
+ margin-bottom: 8px;
+ display: flex;
+ }
+
+ &__categorias{
+ margin-right: 30px;
+ }
+
+ &__categoria{
+ padding: 8px 0;
+ }
+ &__category-link{
+ line-height: 15px;
+ font-size: 12px;
+ color: $black-500;
+ transition: color .2s linear;
+ &:hover{
+ color: $blue-500
+ }
+ }
+ &__see-all{
+ display: flex;
+ align-items: center;
+ line-height: 15px;
+ font-weight: 700;
+ font-size: 12px;
+ line-height: 15px;
+ color: $black-500;
+ i{
+ margin-left: 9px;
+ }
+ }
}
}
diff --git a/src/arquivos/sass/utils/_normalize.scss b/src/arquivos/sass/utils/_normalize.scss
index 69d0d98..e61f344 100644
--- a/src/arquivos/sass/utils/_normalize.scss
+++ b/src/arquivos/sass/utils/_normalize.scss
@@ -23,7 +23,7 @@ html {
*/
body {
- color: #142032;
+ color: $black-500;
margin: 0;
}
diff --git a/src/arquivos/sprite/menu-arrow-icon.png b/src/arquivos/sprite/menu-arrow-icon.png
new file mode 100644
index 0000000..0843e37
Binary files /dev/null and b/src/arquivos/sprite/menu-arrow-icon.png differ
diff --git a/src/controles-customizados/menuprincipal.html b/src/controles-customizados/menuprincipal.html
new file mode 100644
index 0000000..8aabf6d
--- /dev/null
+++ b/src/controles-customizados/menuprincipal.html
@@ -0,0 +1,70 @@
+
diff --git a/src/template-pagina/Rallenson-home.html b/src/template-pagina/Rallenson-home.html
index 53037d5..d3c6486 100644
--- a/src/template-pagina/Rallenson-home.html
+++ b/src/template-pagina/Rallenson-home.html
@@ -23,9 +23,11 @@
diff --git a/src/template-pagina/sub-templates/Rallenson-header.html b/src/template-pagina/sub-templates/Rallenson-header.html
index d2b8ec0..919cfbb 100644
--- a/src/template-pagina/sub-templates/Rallenson-header.html
+++ b/src/template-pagina/sub-templates/Rallenson-header.html
@@ -6,9 +6,8 @@
-
+