This will make the navigation bar, found at the top of the app, larger. Adjustments are also made to account for the new size, such as shifting down the page content and event feed. Menu icon, User Image, and Login icon are also increased in size. Adjustments to optimize the view on some devices is also accounted for - Please test before finalizing.
Code:
/* Increase Nav Bar */
.navbar .sidebar-item .nav-avatar {
width: 50px;
border-radius: 0px;
margin-right: 15%;
}
.navbar {
height: 70px;
}
.navbar .button-event-feed {
font-size: 2em;
margin-top: 5px;
}
.navbar .event-feed-item .truncate-text{
margin-right: 5%;
margin-left: 5%;
}
.navbar .nav-button-menu {
font-size: 2em;
height: 100px;
margin-top: 10px;
padding-left: 20%;
}
.navbar .icon-menu {
padding-left: 8px;
border-bottom: 100px;
}
.content-body {
padding-top: 20px;
}
.event-feed-content {
padding-top: 20px;
}
.event-feed-content:before {
padding-top: 20px;
}
.outer-container .carousel-index--beta {
padding: 25px 0 0;
}
.navbar .nav-button-sidebar {
font-size: 2em;
margin-top: 5%;
}
@media only screen and (max-width: 500px) {
.navbar .nav-button-sidebar {
font-size: 2em;
margin-top: 10px;
margin-right: 20%;
}
.navbar .nav-button-sidebar .ng-scope {
margin-left: -30%;
}
Comments
Article is closed for comments.