Skip to content
This repository has been archived by the owner on Apr 4, 2023. It is now read-only.

Rework "Effective date" UI #506

Merged
merged 7 commits into from
Aug 30, 2017
Merged

Rework "Effective date" UI #506

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
7 commits
Select commit Hold shift + click to select a range
012af3c
Convert "Timeline" field into an Enum.
Aug 29, 2017
33ab88b
Remove unused SCSS file.
Aug 29, 2017
70640f6
Rewrite test file to py.test style.
Aug 29, 2017
dac8993
Add version span information to chrome.
Aug 29, 2017
c85e528
Tweak templates and styles around effective date.
Aug 29, 2017
a1f15d7
Swap "orange" for the "gold" of USWDS.
Aug 30, 2017
7c7f8ef
Bump to 8.3.0.
Aug 29, 2017
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
28 changes: 22 additions & 6 deletions regulations/generator/versions.py
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,4 +1,5 @@
from datetime import datetime
from enum import Enum

from regulations.generator import api_reader
from regulations.generator.layers.utils import convert_to_python
Expand All @@ -22,6 +23,21 @@ def fetch_regulations_and_future_versions():
return regulations_future


class Timeline(Enum):
past = "past"
present = "present"
future = "future"

def is_past(self):
return self == Timeline.past

def is_present(self):
return self == Timeline.present

def is_future(self):
return self == Timeline.future


def fetch_grouped_history(part):
client = api_reader.ApiReader()
versions = [
Expand All @@ -34,16 +50,16 @@ def fetch_grouped_history(part):
key=lambda v: v['by_date'])

today = datetime.today()
seen_current = False
seen_present = False

for version in versions:
if version['by_date'] > today:
version['timeline'] = 'future'
elif not seen_current:
seen_current = True
version['timeline'] = 'current'
version['timeline'] = Timeline.future
elif not seen_present:
seen_present = True
version['timeline'] = Timeline.present
else:
version['timeline'] = 'past'
version['timeline'] = Timeline.past

for notice in client.notices(part)['results']:
notice = convert_to_python(notice)
Expand Down
13 changes: 10 additions & 3 deletions regulations/static/regulations/css/scss/_base-variables.scss
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -36,9 +36,15 @@ $red_lightest: #E9A193;

$pink: #F9DEDE;

$orange: #FDB81E;
$orange_light: #FBCD92;
$orange_lightest: #FFECD1;
$gold: #FDB81E;
$gold_light: #F9C642;
$gold_lighter: #FAD980;
$gold_lightest: #FFF1D2;

// Deprecated. Will be removed in a future release
$orange: $gold;
$orange_light: $gold_light;
$orange_lightest: $gold_lightest;

// Element Variables
$text_area_border: rgba(0, 0, 0, 0.25);
Expand All @@ -57,6 +63,7 @@ $panel_text_color: $black; // Text color for table of contents
$text_highlight_color: $green_lightest; // Text highlight used for diffs
$success_color: $green_lightest; // Used as background for success messages
$notice_color: $blue_lightest; // Used as background for neutral notice messages
$alert_color: $gold_lightest; // Used as background for caution messages
$warning_color: $pink; // Used as background for warning messages
$definition_border_color: $gray_light; // Bottom border/underline for the defined terms.

Expand Down
6 changes: 6 additions & 0 deletions regulations/static/regulations/css/scss/_layout.scss
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -181,6 +181,12 @@ TOC Header Navigation
margin-right: 25%;
margin-left: 240px;
padding-left: 65px;

// We add a lot of text when looking at versions other than the current.
// Ensure adequate space between the wayfinding info and that text
.non-current & {
margin-right: 0;
}
}
}

Expand Down
12 changes: 0 additions & 12 deletions regulations/static/regulations/css/scss/_media-queries.scss
View file
Open in desktop

This file was deleted.

2 changes: 1 addition & 1 deletion regulations/static/regulations/css/scss/comment/_comment-confirm.scss
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -166,7 +166,7 @@ Contains styles for Comment confirmation success/fail/invalid pages.
padding-left: 0;

&:before {
border-color: transparent $orange_light;
border-color: transparent $gold_light;
border-radius: 3px;
border-style: solid;
border-width: 8px 0 8px 13px;
Expand Down
6 changes: 3 additions & 3 deletions regulations/static/regulations/css/scss/module/_sxs.scss
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -45,8 +45,8 @@ SxS header
top: 60px;
width: 100%;
height: 2.125em;
background-color: $orange_lightest;
border-bottom: 1px solid $orange;
background-color: $gold_lightest;
border-bottom: 1px solid $gold;
z-index: 100;

h2 {
Expand Down Expand Up @@ -83,7 +83,7 @@ Back link
height: 34px;
line-height: 34px; /* match height of the .sxs-header - 1px */
vertical-align: top;
border-bottom: 1px solid $orange;
border-bottom: 1px solid $gold;

.cf-icon-left {
font-size: 0.75em;
Expand Down
22 changes: 19 additions & 3 deletions regulations/static/regulations/css/scss/partials/_header.scss
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -107,7 +107,7 @@
position: fixed;
top: $mainhead_height;
min-width: 100%;
background: $panel_background_color;
background-color: $panel_background_color;
color: $black;
Copy link

Choose a reason for hiding this comment

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

The font color should be $atf_sub_head_background, what was the background color. I think that is declared here but not sure.

Copy link
Member Author

@cmc333333 cmc333333 Aug 30, 2017 •
edited
Loading

Choose a reason for hiding this comment

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

That'll be an ATF-specific override. The default sub-head is black(ish) on gray, as in the screenshots.

line-height: 35px;
height: 2.125em;
Expand All @@ -117,6 +117,23 @@
.main {
border-right: 1px solid $panel_border_color;
}

&.non-current {
background-color: $alert_color;

.effective-date:before {
font-family: 'CFPB Minicons';
content: '\e637'; // A clock
font-style: normal;
font-weight: normal;
}
}

.return-to-current {
@include sans-font-regular;
text-decoration: underline;
color: $black;
}
}

#content-header {
Expand Down Expand Up @@ -163,7 +180,6 @@

.effective-date {
float: right;
margin-right: 45px;
}
}
}
Expand Down Expand Up @@ -204,7 +220,7 @@ mid-sized (tablet) screens
*/

@media only screen and (min-width: 480px) and (max-width: 880px) {
.subpart {
.subpart, .non-current .return-to-current {
font-size: 0;
}

Expand Down
27 changes: 24 additions & 3 deletions regulations/templates/regulations/chrome.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -32,7 +32,12 @@ <h2>Please note that the eRegulations tool does not support Internet Explorer ve
<header id="site-header" class="reg-header chrome-header" role="banner">
{% include "regulations/main-header.html" %}

<div class="sub-head {% block sub-head-class %}{% endblock %}">
<div class="sub-head
{% block sub-head-class %}
{% if not version_span.timeline.is_present %}
non-current
{% endif %}
{% endblock %}">
{% block sub-head-skip-nav %}
<a href="#content-wrapper" class="hidden-text">Skip to main content</a> <!-- skip to content link for screen readers-->
{% endblock %}
Expand Down Expand Up @@ -90,7 +95,23 @@ <h2>Please note that the eRegulations tool does not support Internet Explorer ve
{% endblock %}
</div>
{% block header-secondary %}
<span class="effective-date"><strong>Effective Date:</strong> {{ meta.effective_date|date:"n/j/Y" }}</span>
<span class="effective-date">
Effective
{% if version_span.timeline.is_past %}
{{ version_span.start|date:"n/j/Y" }}
to {{ version_span.end|date:"n/j/Y" }}.
{% elif version_span.timeline.is_present %}
{{ version_span.start|date:"n/j/Y" }} to present.
{% else %}
{{ version_span.start|date:"n/j/Y" }}.
{% endif %}

{% if not version_span.timeline.is_present %}
<a class="return-to-current"
href="{% url 'redirect_by_current_date' label_id %}"
>View current</a>
{% endif %}
</span>
{% endblock %}
</div>
{% endblock %}
Expand Down Expand Up @@ -132,7 +153,7 @@ <h2 class="toc-type">Regulation Timeline</h2>
{% for version in history %}
<li class="{% if version.version == active_version %}current {% endif %}status-list" data-base-version="{{version.version}}">
<a href="{% url version_switch_view label_id version.version %}" class="version-link" data-version="{{ version.version }}" id="link-{{ version.version }}">
{% if version.timeline == 'current' %}
{% if version.timeline.is_present %}
<h3>Current Law</h3>
{% endif %}
<span class="version-date">{{ version.by_date|date:"n/j/Y" }}</span>
Expand Down
2 changes: 1 addition & 1 deletion regulations/templates/regulations/diff-chrome.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -71,7 +71,7 @@ <h2 class="toc-type">Regulation versions</h2>
(Right)
{% endif %}-->
<a href="{% url 'chrome_section_view' label_id version.version %}" class="version-link" data-version="{{ version.version }}">
{% if version.timeline == 'current' %}
{% if version.timeline.is_present %}
<h3>Current Law</h3>
{% endif %}
<span class="version-date">{{ version.by_date|date:"n/j/Y" }}</span>
Expand Down
6 changes: 3 additions & 3 deletions regulations/tests/generator_versions_tests.py
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -35,9 +35,9 @@ def test_fetch_grouped_history(self, reader):
self.assertEqual(3, len(history))
v1, v2, v3 = history

self.assertEqual('future', v1['timeline'])
self.assertEqual('current', v2['timeline'])
self.assertEqual('past', v3['timeline'])
self.assertEqual(versions.Timeline.future, v1['timeline'])
self.assertEqual(versions.Timeline.present, v2['timeline'])
self.assertEqual(versions.Timeline.past, v3['timeline'])

self.assertEqual(versions.convert_to_python([n6, n5, n4]),
v1['notices'])
Expand Down
Loading