Skip to content

Commit

Permalink
Adding a button menu, JS needed.
Browse files Browse the repository at this point in the history
  • Loading branch information
Caio Tarifa committed Oct 18, 2016
1 parent 96fc2d4 commit 828172f
Show file tree
Hide file tree
Showing 2 changed files with 39 additions and 17 deletions.
1 change: 0 additions & 1 deletion app/assets/stylesheets/formadmin/atoms/_menu-button.scss
Original file line number Diff line number Diff line change
Expand Up @@ -39,7 +39,6 @@
}
}


@at-root .opened-menu & {
i {
background-color: transparent;
Expand Down
55 changes: 39 additions & 16 deletions app/assets/stylesheets/formadmin/layouts/_header.scss
Original file line number Diff line number Diff line change
@@ -1,7 +1,8 @@
.header {
align-items: center;
background-color: rgba($primary-color, 0.95);
backdrop-filter: blur(3px);
display: table;
display: flex;
color: $white;
height: 50px;
position: fixed;
Expand All @@ -12,11 +13,9 @@
z-index: 10;

.site_title {
display: table-cell;
font-weight: bold;
margin: 0 20px 0 0;
padding: 0 30px;
vertical-align: middle;
}

#site_title_image {
Expand All @@ -25,9 +24,6 @@
}

.header-item {
display: table-cell;
vertical-align: middle;

&,
ul {
margin: 0;
Expand Down Expand Up @@ -145,7 +141,6 @@

#utility_nav {
color: $silver;
display: table-cell;
margin: 0;
padding: 0 20px 0 0;
text-align: right;
Expand All @@ -171,31 +166,59 @@

// Medias
@media #{$largest-phone-screen} {
.site_title {
padding: 0 15px;
}

#tabs,
#utility_nav {
display: none;
left: 0;
position: absolute;
right: 0;
top: 50px;
width: 100%;
}

.site_title {
padding: 0 15px;
}

.menu-button {
display: block;
position: relative;
right: -23px;
top: 13px;
margin-left: auto;
margin-right: 15px;
margin-top: -5px;
}

.opened-menu & {
@at-root .opened-menu & {
#tabs,
#utility_nav {
display: block;
}
}

// display: block;
// .site_title {
// padding: 0 15px;
// }
//
// #tabs,
// #utility_nav {
// display: none;
// left: 0;
// position: absolute;
// top: 50px;
// width: 100%;
// }
//
// .menu-button {
// float: left;
// margin-right: 15px;
// position: relative;
// top: 13px;
// }
//
// .opened-menu & {
// #tabs,
// #utility_nav {
// display: block;
// }
// }
}
}

0 comments on commit 828172f

Please sign in to comment.