diff --git a/lib/app/js/controllers/sections.js b/lib/app/js/controllers/sections.js index fa9f868f..30c717f0 100644 --- a/lib/app/js/controllers/sections.js +++ b/lib/app/js/controllers/sections.js @@ -42,18 +42,22 @@ angular.module('sgApp') } } - $scope.getActive = function(section) { + $scope.isEmptyMainSection = function(section) { + return section.reference.indexOf('.') === -1 && !section.wrappedMarkup && (!section.modifiers || section.modifiers.length === 0); + }; + + $scope.isActive = function(section) { return section.reference == $rootScope.currentReference.section.reference ? 'active' : ''; - } + }; $scope.filterSection = function(section) { if ($scope.currentSection === 'all') return true; var re = new RegExp('(^' + $scope.currentSection + '$)|(^' + $scope.currentSection + '\\.)'); return re.test(section.reference); - } + }; $scope.getCommonClass = function() { return Styleguide.config.data.commonClass; - } + }; }); diff --git a/lib/app/sass/app.scss b/lib/app/sass/app.scss index 337697ed..286417ba 100644 --- a/lib/app/sass/app.scss +++ b/lib/app/sass/app.scss @@ -707,6 +707,31 @@ $mobile: new-breakpoint(max-width 480px); } } +.sg.section.main { + .section-header { + background-color: transparent; + + h1 { + padding-top: 0; + font-size: 2.369em; + color: #333; + } + + i.fa { + display: none; + } + } + + .reference-number { + display: none; + } + + .sg.section-partial, .sg.section-partial:last-child { + padding-top: 0; + padding-bottom: 0; + border: none; + } +} // Sections blocks // @@ -837,24 +862,6 @@ $mobile: new-breakpoint(max-width 480px); border-right: $default-action-color 2px solid; } -.sg.section.main { - &:nth-child(n+2) { - margin-top: 3em; - } -} - -.sg.section.sub, -.sg.section.sub-sub, -.sg.section.sub-sub-sub { - margin: 0 auto 1em auto; - - > .body { - > p { - margin-bottom: 1.3em; - } - } -} - .sg.label { @include default-font; position: absolute; diff --git a/lib/app/views/partials/section.html b/lib/app/views/partials/section.html index f56a0d2c..665ca6bc 100644 --- a/lib/app/views/partials/section.html +++ b/lib/app/views/partials/section.html @@ -1,5 +1,5 @@
+ ng-class="{active: isActive(section), main: isEmptyMainSection(section)}">

{{ section.reference }} {{ section.header }}