Skip to content
This repository has been archived by the owner on Dec 8, 2017. It is now read-only.

Mobile Nav Update #375

Merged
merged 3 commits into from
Jun 10, 2016
Merged

Mobile Nav Update #375

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
3 commits
Select commit Hold shift + click to select a range
1f5f325
mobile nav
xtine Jun 9, 2016
eef8f22
fix heading order
xtine Jun 10, 2016
46896d7
fix regular screen size reg list items
xtine Jun 10, 2016
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
33 changes: 31 additions & 2 deletions notice_and_comment/static/regulations/css/less/module/header-custom.less
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -47,6 +47,21 @@ Site Title
}
}

// mobile nav list items
.app-nav-list {
display: none;

li {
margin: 0 10px;
padding: 10px 0;

&:last-child {
margin: 0;
padding: 10px;
}
}
}
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Curious: why doesn't/shouldn't this logic live in -site?

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I'm not sure how it would affect regular eregs.


.app-nav-list-text {
font-size: 0.8em;
}
Expand All @@ -55,6 +70,11 @@ Site Title
Big Screens
*/
@media only screen and ( min-width: 880px ) {

.app-nav-list.open {
display: block;
}

.app-nav-list-item {
.logo {
margin: 8px 0 0 8px;
Expand All @@ -78,7 +98,16 @@ Smaller Screens
top: 56px;
}

.app-nav-list-text {
display: none;
.app-nav-list-item {
padding: 20px 15px;

a {
color: @dark_field;
padding: 0;
}

&:last-child {
border-bottom: 2px solid @dark_gray;
}
}
}
3 changes: 3 additions & 0 deletions notice_and_comment/static/regulations/css/less/module/nc-homepage-custom.less
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -5,6 +5,9 @@
*/

.nc-homepage-header {
height: auto;
position: relative;

.main-head {
.font-regular;
position: relative;
Expand Down
7 changes: 4 additions & 3 deletions notice_and_comment/templates/regulations/main-header.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -15,9 +15,10 @@ <h2 class="reg-title"><a href="{% url 'regulation_landing_view' reg_part %}">{{
<span class="icon-text">Mobile navigation</span>
</a>
<ul class="app-nav-list">
<li class="app-nav-list-item"><span class="app-nav-list-text">Partnership between</span></li>
<li class="app-nav-list-item org-title">{% include "regulations/org-title.html" %}</li>
<li class="app-nav-list-item logo-list-item">{% include "regulations/logo.html" %}</li>
<li class="app-nav-list-item"><span class="app-nav-list-text">Partnership between:</span></li>
<li class="app-nav-list-item"><span class="app-nav-list-text"><a href="http://www.epa.gov">epa.gov <span class="cf-icon cf-icon-external-link"></span></a></span></li>
<li class="app-nav-list-item"><span class="app-nav-list-text"><a href="http://18f.gsa.gov">18f.gsa.gov <span class="cf-icon cf-icon-external-link"></span></a></span></li>
<li class="app-nav-list-item"><span class="app-nav-list-text"><a href="http://www.gsa.gov">gsa.gov <span class="cf-icon cf-icon-external-link"></span></a></span></li>
</ul>
</nav>
</div>
4 changes: 2 additions & 2 deletions notice_and_comment/templates/regulations/nc-homepage.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -9,7 +9,7 @@

<div id="content-body">

<header id="site-header" class="nc-homepage-header" role="banner">
<header id="site-header" class="reg-header nc-homepage-header" role="banner">
{% include "regulations/main-header.html" %}
</header>

Expand Down Expand Up @@ -193,7 +193,7 @@ <h2>About this tool</h2>
</div>

<div class="feedback">
<h4>We want to hear from you!</h4>
<h3>We want to hear from you!</h3>
<p>To give feedback on this tool, <a href="https://github.com/eregs/notice-and-comment/issues/new" target="_blank">open a new issue in this repository <span class="cf-icon cf-icon-external-link"></span></a> (requires a free login).
</div>

Expand Down
1 change: 0 additions & 1 deletion notice_and_comment/templates/regulations/org-title.html
View file
Open in desktop

This file was deleted.