Initial port

[editorial.git] / assets / main / sass / components / _section.scss

diff --git a/assets/main/sass/components/_section.scss b/assets/main/sass/components/_section.scss
index 0f5d96d1bbc81c8ce07120655df5cc6481a5e565..5f26593d69a5134b245f125a05aedf83f362271d 100644 (file)
--- a/assets/main/sass/components/_section.scss
+++ b/assets/main/sass/components/_section.scss
@@ -1,5 +1,5 @@
 ///\r
-/// Massively by HTML5 UP\r
+/// Editorial by HTML5 UP\r
 /// html5up.net | @ajlkn\r
 /// Free for personal and commercial use under the CCA 3.0 license (html5up.net/license)\r
 ///\r
@@ -13,100 +13,27 @@
        }\r
 \r
        header {\r
-               cursor: default;\r
-\r
-               > .date {\r
-                       display: block;\r
-                       font-size: 0.8rem;\r
-                       height: 1;\r
-                       margin: 0 0 (_size(element-margin) * 0.5) 0;\r
-                       position: relative;\r
-               }\r
-\r
-               > p {\r
-                       font-style: italic;\r
-               }\r
-\r
-               > h1 + p {\r
-                       font-size: 1.1rem;\r
-                       margin-top: -0.5rem;\r
-                       line-height: 2;\r
-               }\r
-\r
-               > h2 + p {\r
-                       font-size: 1rem;\r
-                       margin-top: -0.75rem;\r
-               }\r
-\r
-               > h3 + p {\r
-                       font-size: 0.9rem;\r
-                       margin-top: -0.75rem;\r
-               }\r
-\r
-               > h4 + p {\r
-                       font-size: 0.8rem;\r
-                       margin-top: -0.75rem;\r
+               p {\r
+                       font-family: _font(family-heading);\r
+                       font-size: 1em;\r
+                       font-weight: _font(weight-heading-alt);\r
+                       letter-spacing: _font(kerning-heading);\r
+                       margin-top: -0.5em;\r
+                       text-transform: uppercase;\r
                }\r
 \r
                &.major {\r
-                       margin: 0 0 (_size(element-margin) * 2) 0;\r
-                       text-align: center;\r
-\r
                        > :last-child {\r
-                               margin-bottom: 0;\r
-                       }\r
-\r
-                       > p {\r
-                               margin-top: 0;\r
-                               text-align: center;\r
-                       }\r
-\r
-                       > .date {\r
-                               font-size: 1rem;\r
-                               margin: 0 0 (_size(element-margin) * 2) 0;\r
-\r
-                               &:before, &:after {\r
-                                       content: '';\r
-                                       display: block;\r
-                                       position: absolute;\r
-                                       top: 50%;\r
-                                       width: calc(50% - 6rem);\r
-                                       border-top: solid 2px;\r
-                               }\r
-\r
-                               &:before {\r
-                                       left: 0;\r
-                               }\r
-\r
-                               &:after {\r
-                                       right: 0;\r
-                               }\r
-                       }\r
-               }\r
-\r
-               @include breakpoint('<=medium') {\r
-                       br {\r
-                               display: none;\r
-                       }\r
-               }\r
-\r
-               @include breakpoint('<=small') {\r
-                       &.major {\r
+                               border-bottom: solid 3px _palette(accent);\r
+                               display: inline-block;\r
                                margin: 0 0 _size(element-margin) 0;\r
+                               padding: 0 0.75em 0.5em 0;\r
                        }\r
                }\r
-       }\r
 \r
-       @mixin color-section($p: null) {\r
-               header {\r
-                       &.major {\r
-                               .date {\r
-                                       &:before, &:after {\r
-                                               border-top-color: _palette($p, border);\r
-                                       }\r
-                               }\r
+               &.main {\r
+                       > :last-child {\r
+                               margin: 0 0 (_size(element-margin) * 0.5) 0;\r
                        }\r
                }\r
-       }\r
-\r
-       @include color-section;
\ No newline at end of file
+       }
\ No newline at end of file