Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

Issue335 #338

Merged
merged 7 commits into from
Dec 13, 2019
Merged

Issue335 #338

Show file tree
Hide file tree
Changes from 1 commit
Commits
Show all changes
7 commits
Select commit Hold shift + click to select a range
39bef6b
restructure nav, some fixes for small screens (fix #335)
jakosch Dec 3, 2019
342cac2
fixes for brand on small screens, earlier nav breakpoint
jakosch Dec 8, 2019
3d1e976
order:1 for side-col, order:2 for main-col on small screens
jakosch Dec 8, 2019
9dfb0ac
Merge branch 'develop' into issue335
peterstadler Dec 10, 2019
55ac83b
update expected results
peterstadler Dec 10, 2019
26dcf17
include breakpoints last
jakosch Dec 13, 2019
d79053b
padding + margins in header links
jakosch Dec 13, 2019
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
Next Next commit
restructure nav, some fixes for small screens (fix #335)
  • Loading branch information
@jakosch
jakosch committed Dec 8, 2019
commit 39bef6b58217d7848ea3f8e2afdd532d7c698d9f
19 changes: 8 additions & 11 deletions resources/sass/layout/_breakpoints.scss
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -52,25 +52,22 @@

.navbar-nav ul.dropdown-menu li
{
border: none;
border: none;
box-shadow: none!important;
border-left: none!important;
}


ul.dropdown-menu li a
{
background-color: $gray-lighter;
padding: 15px 35px!important;

}

.divider
{
width: 100%!important;
margin: 0px;
padding: 0px;

height:10px;
background-color: $primary;

#navbarCollapse {
.divider {
display: none;
}
}

.resp-tabs-container .resp-tab-content-active
Expand Down
5 changes: 4 additions & 1 deletion resources/sass/layout/_header.scss
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -12,7 +12,6 @@
{
margin-top: 20px;
margin-bottom: 0px;
border-bottom: 4px solid $gray-lightest;
}

#navbarCollapse .navbar-nav {
Expand Down Expand Up @@ -88,6 +87,10 @@
color:$gray-dark;
}

#content {
border-top: 4px solid $gray-lightest;
}

/* hover open for larger screens */
@include media-breakpoint-up(md) {
.nav-item.dropdown:hover>.dropdown-menu {
Expand Down
2 changes: 1 addition & 1 deletion resources/sass/main.scss
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -70,8 +70,8 @@
@import "components/ajax";
@import "components/collapse";
@import "layout/grid";
@import "layout/breakpoints";
@import "layout/header";
@import "layout/breakpoints";
@import "layout/footer";
@import "layout/sidebar";
@import "pages/person";
Expand Down
28 changes: 13 additions & 15 deletions templates/page.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -48,21 +48,18 @@

</head>
<body>
<div class="container">
<nav class="navbar navbar-light navbar-default navbar-expand-md">
<div class="container">
<div class="row flex-grow-1 flex-row-reverse">
<!-- Brand and toggle get grouped for better mobile display -->
<div class="navbar-header"> <!-- old class: navbar-right -->
<button type="button" data-target="#navbarCollapse" data-toggle="collapse" class="navbar-toggler">
<span class="navbar-toggler-icon"/>
</button>
<a href="$link/index" class="nav-link navbar-brand"> <!-- old class: navbar-right -->
<img src="$resources/img/logo_weber.png" class="brand" alt="navbar-background-image"/>
</a>
</div>
<!-- Brand and toggle get grouped for better mobile display -->
<button type="button" data-target="#navbarCollapse" data-toggle="collapse" class="navbar-toggler">
<span class="navbar-toggler-icon"/>
</button>
<a href="$link/index" class="nav-link navbar-brand order-3">
<img src="$resources/img/logo_weber.png" class="brand" alt="navbar-background-image"/>
</a>

<!-- Collection of nav links and other content for toggling -->
<div id="navbarCollapse" class="navbar-collapse collapse">
<!-- old classes: collapse navbar-collapse navbar-left col-md-9 -->
<ul class="nav navbar-nav" data-template="app:active-nav">
<li class="nav-item" data-template="app:set-active-nav">
<a class="nav-link" href="$link/index">Home</a>
Expand Down Expand Up @@ -171,9 +168,10 @@
<li class="nav-item" data-template="app:set-active-lang">En</li>
</ul>
</div>
</div>
</div>


</nav>
</div>
<div id="content">
<!-- content gets filled by templating module-->
</div>
Expand Down Expand Up @@ -309,4 +307,4 @@ <h3 class="item-title">
</div>

</body>
</html>
</html>