From f23ea78cef6a7e5220d89d9f808f64d83feeb6b2 Mon Sep 17 00:00:00 2001
From: Christopher Charbonneau Wells <chris@chrxs.net>
Date: Sun, 22 Oct 2017 15:05:58 -0400
Subject: [PATCH] Linting fixes.

---
 babybuddy/static_src/scss/_global.scss        |   6 +-
 .../static_src/scss/themes/blueorange.scss    |  48 +++----
 core/static_src/scss/icons.scss               |  52 ++++----
 core/tests/tests_forms.py                     |   3 +-
 gulpfile.js/tasks/lint.js                     |   1 +
 reports/static_src/scss/timeline.scss         | 121 +++++++++---------
 reports/views.py                              |   4 +-
 7 files changed, 119 insertions(+), 116 deletions(-)

diff --git a/babybuddy/static_src/scss/_global.scss b/babybuddy/static_src/scss/_global.scss
index 14d341cb..bdf3e949 100644
--- a/babybuddy/static_src/scss/_global.scss
+++ b/babybuddy/static_src/scss/_global.scss
@@ -2,6 +2,6 @@
 
 // Temporary workaround. See: https://github.com/twbs/bootstrap/issues/23553
 .dropdown-menu-right {
-  right: 0;
-  left: auto; // Reset the default from `.dropdown-menu`
-  }
+    right: 0;
+    left: auto; // Reset the default from `.dropdown-menu`
+}
diff --git a/babybuddy/static_src/scss/themes/blueorange.scss b/babybuddy/static_src/scss/themes/blueorange.scss
index 2f892080..1db6cb41 100644
--- a/babybuddy/static_src/scss/themes/blueorange.scss
+++ b/babybuddy/static_src/scss/themes/blueorange.scss
@@ -16,14 +16,14 @@ $teal: #5abccc;
 $cyan: #15b2d3;
 
 $theme-colors: (
- primary: $blue,
- secondary: $orange,
- success: $green,
- info: $cyan,
- warning: $yellow,
- danger: $red,
- light: $gray-100,
- dark: $gray-800
+    primary: $blue,
+    secondary: $orange,
+    success: $green,
+    info: $cyan,
+    warning: $yellow,
+    danger: $red,
+    light: $gray-100,
+    dark: $gray-800
 );
 
 
@@ -39,7 +39,7 @@ $body-color: $gray-400;
 //
 // Style anchor elements.
 
-$link-color: theme-color("info");
+$link-color: theme-color('info');
 $link-hover-color: darken($link-color, 15%);
 
 
@@ -49,7 +49,7 @@ $link-hover-color: darken($link-color, 15%);
 
 $border-color: $gray-200;
 $component-active-color: $gray-400;
-$component-active-bg: theme-color("primary");
+$component-active-bg: theme-color('primary');
 
 
 // Fonts
@@ -58,7 +58,7 @@ $component-active-bg: theme-color("primary");
 
 $text-muted: $gray-600 !default;
 $blockquote-small-color: $gray-600 !default;
-$hr-border-color: rgba($black,.1) !default;
+$hr-border-color: rgba($black, .1) !default;
 $mark-bg: #fcf8e3 !default;
 
 
@@ -67,16 +67,16 @@ $mark-bg: #fcf8e3 !default;
 // Customizes the `.table` component with basic values, each used across all table variations.
 
 $table-border-color: $gray-800;
-$table-head-bg: theme-color("primary");
-$table-inverse-bg: theme-color("primary");
-$table-accent-bg: rgba(theme-color("primary"), .1);
+$table-head-bg: theme-color('primary');
+$table-inverse-bg: theme-color('primary');
+$table-accent-bg: rgba(theme-color('primary'), .1);
 
 // Forms
 
 $input-bg: $white;
 $input-disabled-bg: $gray-600;
 $input-color: $black;
-$input-border-color: rgba($gray-600,.15);
+$input-border-color: rgba($gray-600, .15);
 $input-group-addon-bg: $gray-500;
 
 
@@ -88,7 +88,7 @@ $dropdown-bg: $gray-700;
 $dropdown-divider-bg: $gray-800;
 $dropdown-link-color: $body-color;
 $dropdown-link-hover-color: darken($body-color, 5%);
-$dropdown-link-hover-bg: theme-color("primary");
+$dropdown-link-hover-bg: theme-color('primary');
 $dropdown-link-active-color: $component-active-color;
 $dropdown-link-active-bg: $component-active-bg;
 $dropdown-header-color: darken($body-color, 25%);
@@ -97,16 +97,16 @@ $dropdown-header-color: darken($body-color, 25%);
 // Pagination
 
 $pagination-color: $link-color;
-$pagination-bg: theme-color("dark");
-$pagination-border-color: lighten(theme-color("dark"), 5%);
+$pagination-bg: theme-color('dark');
+$pagination-border-color: lighten(theme-color('dark'), 5%);
 
 $pagination-hover-color: $link-hover-color;
 $pagination-hover-bg: $gray-900;
 $pagination-hover-border-color: $gray-800;
 
 $pagination-active-color: $body-color;
-$pagination-active-bg: theme-color("primary");
-$pagination-active-border-color: theme-color("primary");
+$pagination-active-bg: theme-color('primary');
+$pagination-active-border-color: theme-color('primary');
 
 $pagination-disabled-color: $gray-600;
 $pagination-disabled-bg: $pagination-bg;
@@ -115,13 +115,13 @@ $pagination-disabled-border-color: $pagination-border-color;
 
 // Jumbotron
 
-$jumbotron-bg: theme-color("dark");
+$jumbotron-bg: theme-color('dark');
 
 
 // Cards
 
-$card-bg: theme-color("dark");
-$card-cap-bg: rgba(theme-color("light"), .05);
+$card-bg: theme-color('dark');
+$card-cap-bg: rgba(theme-color('light'), .05);
 
 
 // Progress bars
@@ -131,7 +131,7 @@ $progress-bg: $gray-600;
 
 // List group
 
-$list-group-bg: theme-color("dark");
+$list-group-bg: theme-color('dark');
 $list-group-hover-bg: darken($list-group-bg, 5%);
 $list-group-active-color: $component-active-color !default;
 $list-group-active-bg: $component-active-bg !default;
diff --git a/core/static_src/scss/icons.scss b/core/static_src/scss/icons.scss
index 97d75925..56fe89c4 100644
--- a/core/static_src/scss/icons.scss
+++ b/core/static_src/scss/icons.scss
@@ -1,101 +1,101 @@
 @import '../../../node_modules/font-awesome/scss/font-awesome';
 
 .icon {
-    @extend .fa
+    @extend .fa;
 }
 
 .icon-2x {
-    @extend .fa-2x
+    @extend .fa-2x;
 }
 
 .icon-add {
-    @extend .fa-plus
+    @extend .fa-plus;
 }
 
 .icon-chevron-left {
-    @extend .fa-chevron-left
+    @extend .fa-chevron-left;
 }
 
 .icon-chevron-right {
-    @extend .fa-chevron-right
+    @extend .fa-chevron-right;
 }
 
 .icon-child {
-    @extend .fa-child
+    @extend .fa-child;
 }
 
 .icon-dashboard {
-    @extend .fa-tachometer
+    @extend .fa-tachometer;
 }
 
 .icon-delete {
-    @extend .fa-trash-o
+    @extend .fa-trash-o;
 }
 
 .icon-diaperchange {
-    @extend .fa-trash
+    @extend .fa-trash;
 }
 
 .icon-envelope {
-    @extend .fa-envelope
+    @extend .fa-envelope;
 }
 
 .icon-false {
-    @extend .fa-times-circle-o
+    @extend .fa-times-circle-o;
 }
 
 .icon-feeding {
-    @extend .fa-spoon
+    @extend .fa-spoon;
 }
 
 .icon-graph {
-    @extend .fa-bar-chart-o
+    @extend .fa-bar-chart-o;
 }
 
 .icon-list {
-    @extend .fa-list
+    @extend .fa-list;
 }
 
 .icon-lock {
-    @extend .fa-lock
+    @extend .fa-lock;
 }
 
 .icon-note {
-    @extend .fa-sticky-note
+    @extend .fa-sticky-note;
 }
 
 .icon-refresh {
-    @extend .fa-refresh
+    @extend .fa-refresh;
 }
 
 .icon-sad {
-    @extend .fa-frown-o
+    @extend .fa-frown-o;
 }
 
 .icon-sleep {
-    @extend .fa-bed
+    @extend .fa-bed;
 }
 
 .icon-stop {
-    @extend .fa-stop
+    @extend .fa-stop;
 }
 
 .icon-timer {
-    @extend .fa-clock-o
+    @extend .fa-clock-o;
 }
 
 .icon-true {
-    @extend .fa-check-circle-o
+    @extend .fa-check-circle-o;
 }
 
 .icon-tummytime {
-    @extend .fa-smile-o
+    @extend .fa-smile-o;
 }
 
 .icon-update {
-    @extend .fa-pencil
+    @extend .fa-pencil;
 }
 
 .icon-user {
-    @extend .fa-user
-}
\ No newline at end of file
+    @extend .fa-user;
+}
diff --git a/core/tests/tests_forms.py b/core/tests/tests_forms.py
index a91ccd7a..7976d112 100644
--- a/core/tests/tests_forms.py
+++ b/core/tests/tests_forms.py
@@ -103,7 +103,8 @@ class FormsTestCase(TestCase):
 
         timer = models.Timer.objects.create(user=self.user)
         timer.save()
-        page = self.c.post('/tummy-time/add/?timer={}'.format(timer.id), params)
+        page = self.c.post(
+            '/tummy-time/add/?timer={}'.format(timer.id), params)
         self.assertEqual(page.status_code, 302)
 
         entry = models.TummyTime.objects.first()
diff --git a/gulpfile.js/tasks/lint.js b/gulpfile.js/tasks/lint.js
index 585a50aa..bd396c7d 100644
--- a/gulpfile.js/tasks/lint.js
+++ b/gulpfile.js/tasks/lint.js
@@ -32,6 +32,7 @@ gulp.task('lint:styles', function(cb) {
                 'indentation': [ 1, { 'size': 4 } ],
                 'no-ids': 0,
                 'no-vendor-prefixes': 2,
+                'placeholder-in-extend': 0,
                 'property-sort-order': 0
             }
         }),
diff --git a/reports/static_src/scss/timeline.scss b/reports/static_src/scss/timeline.scss
index 605a77c1..feac627e 100644
--- a/reports/static_src/scss/timeline.scss
+++ b/reports/static_src/scss/timeline.scss
@@ -1,14 +1,16 @@
-/* Adapted for Bootstrap 4 from https://www.bootply.com/SzXin8KDZJ. */
+// Adapted for Bootstrap 4 from https://www.bootply.com/SzXin8KDZJ.
+$card-shadow: rgba(0, 0, 0, .175);
+
 .timeline {
     list-style: none;
-    padding: 10px 0 10px;
+    padding: 10px 0;
     position: relative;
 
-    &:before {
+    &::before {
         top: 0;
         bottom: 0;
         position: absolute;
-        content: " ";
+        content: ' ';
         width: 3px;
         background-color: theme-color('primary');
         left: 50%;
@@ -20,13 +22,13 @@
         margin-bottom: 10px;
         position: relative;
 
-        &:before {
-            content: " ";
+        &::before {
+            content: ' ';
             display: table;
         }
 
-        &:after {
-            content: " ";
+        &::after {
+            content: ' ';
             display: table;
             clear: both;
         }
@@ -35,9 +37,9 @@
             width: 47%;
             float: left;
             position: relative;
-            box-shadow: 0 1px 6px rgba(0, 0, 0, 0.175);
+            box-shadow: 0 1px 6px $card-shadow;
 
-            &:before {
+            &::before {
                 position: absolute;
                 top: 26px;
                 right: -15px;
@@ -46,10 +48,10 @@
                 border-left: 15px solid theme-color('dark');
                 border-right: 0 solid theme-color('dark');
                 border-bottom: 15px solid transparent;
-                content: " ";
+                content: ' ';
             }
 
-            &:after {
+            &::after {
                 position: absolute;
                 top: 27px;
                 right: -14px;
@@ -58,7 +60,7 @@
                 border-left: 14px solid theme-color('dark');
                 border-right: 0 solid theme-color('dark');
                 border-bottom: 14px solid transparent;
-                content: " ";
+                content: ' ';
             }
         }
 
@@ -66,14 +68,14 @@
             .card {
                 float: right;
 
-                &:before {
+                &::before {
                     border-left-width: 0;
                     border-right-width: 15px;
                     left: -15px;
                     right: auto;
                 }
 
-                &:after {
+                &::after {
                     border-left-width: 0;
                     border-right-width: 14px;
                     left: -14px;
@@ -83,7 +85,7 @@
         }
 
         .timeline-badge {
-            color: #fff;
+            color: $white;
             width: 50px;
             height: 50px;
             line-height: 50px;
@@ -96,58 +98,57 @@
             background-color: theme-color('dark');
             z-index: 100;
             border-radius: 50%;
-        }
 
-        .timeline-badge.arrow {
-            color: #fff;
-            width: 50px;
-            height: 50px;
-            line-height: 50px;
-            font-size: 1.4em;
-            text-align: center;
-            position: absolute;
-            top: 26px;
-            left: 50%;
-            margin-left: -25px;
-            background-color: theme-color('dark');
-            z-index: 100;
-            border-radius: 50%;
+            .arrow {
+                color: $white;
+                width: 50px;
+                height: 50px;
+                line-height: 50px;
+                font-size: 1.4em;
+                text-align: center;
+                position: absolute;
+                top: 26px;
+                left: 50%;
+                margin-left: -25px;
+                background-color: theme-color('dark');
+                z-index: 100;
+                border-radius: 50%;
+            }
         }
     }
 }
 
 @media (max-width: 767px) {
-    ul.timeline:before {
-        left: 40px;
-    }
+    .timeline {
+        &::before {
+            left: 40px;
+        }
 
-    ul.timeline > li > .card {
-        width: calc(100% - 90px);
-        width: -moz-calc(100% - 90px);
-        width: -webkit-calc(100% - 90px);
-    }
+        li {
+            .card {
+                float: right;
+                width: calc(100% - 90px);
 
-    ul.timeline > li > .timeline-badge {
-        left: 15px;
-        margin-left: 0;
-        top: 16px;
-    }
+                &::before {
+                    border-left-width: 0;
+                    border-right-width: 15px;
+                    left: -15px;
+                    right: auto;
+                }
 
-    ul.timeline > li > .card {
-        float: right;
-    }
+                &::after {
+                    border-left-width: 0;
+                    border-right-width: 14px;
+                    left: -14px;
+                    right: auto;
+                }
+            }
 
-    ul.timeline > li > .card:before {
-        border-left-width: 0;
-        border-right-width: 15px;
-        left: -15px;
-        right: auto;
+            .timeline-badge {
+                left: 15px;
+                margin-left: 0;
+                top: 16px;
+            }
+        }
     }
-
-    ul.timeline > li > .card:after {
-        border-left-width: 0;
-        border-right-width: 14px;
-        left: -14px;
-        right: auto;
-    }
-}
\ No newline at end of file
+}
diff --git a/reports/views.py b/reports/views.py
index 5cb72989..761e6c2b 100644
--- a/reports/views.py
+++ b/reports/views.py
@@ -18,8 +18,8 @@ class DiaperChangeLifetimesChildReport(PermissionRequiredMixin, DetailView):
     template_name = 'reports/diaperchange_lifetimes.html'
 
     def get_context_data(self, **kwargs):
-        context = super(DiaperChangeLifetimesChildReport, self).get_context_data(
-            **kwargs)
+        context = super(
+            DiaperChangeLifetimesChildReport, self).get_context_data(**kwargs)
         child = context['object']
         context['html'], context['javascript'] = diaperchange_lifetimes(child)
         return context