File tree Expand file tree Collapse file tree 9 files changed +71
-36
lines changed Expand file tree Collapse file tree 9 files changed +71
-36
lines changed Original file line number Diff line number Diff line change
1
+ <div class =" c-hero" >
2
+ <h1 class =" c-hero__title" >{{ heroTitle }} </h1 >
3
+
4
+ <div class =" c-hero__footer" >
5
+ <pre ><code >npm create pattern-lab</code ></pre >
6
+ </div >
7
+ </div >
Original file line number Diff line number Diff line change 21
21
<!-- end l-grid__sidebar-->
22
22
23
23
<div class =" l-grid__main" >
24
- <main >
25
- <div class =" l-container" >
26
- <div
27
- class =" l-linelength-container"
28
- >
29
- {% block content %}
30
- {% endblock content %}
31
- </div >
32
- </div >
24
+ <main {% if pageType ==" Homepage" %}class =" c-main--flush" {% endif %} >
25
+ {% block content %}
26
+ {% endblock content %}
33
27
</main >
34
28
35
29
{% include " components/footer.njk" %}
Original file line number Diff line number Diff line change @@ -12,15 +12,17 @@ permalink: docs/{{ title | slug }}/
12
12
{% endset %}
13
13
14
14
{% block content %}
15
- <main id =" main-content" >
16
- <article >
17
- {% include " components/page-header.njk" %}
18
- <div class =" c-text-passage" >
19
- {{ content | safe }}
20
- </div >
21
-
22
- </article >
23
- </main >
15
+ <div class =" l-container" >
16
+ <div class =" l-linelength-container" >
17
+ <article >
18
+ {% include " components/page-header.njk" %}
19
+ <div class =" c-text-passage" >
20
+ {{ content | safe }}
21
+ </div >
22
+
23
+ </article >
24
+ </div >
25
+ </div >
24
26
{% endblock %}
25
27
26
28
{{ content | safe }}
Original file line number Diff line number Diff line change 2
2
{% set pageType = ' Homepage' %}
3
3
4
4
{# Intro content #}
5
- {% set introHeading = title %}
5
+ {% set heroTitle = title %}
6
6
7
7
{% block content %}
8
- < main id = " main-content " >
9
- {% include " components/page-header .njk" %}
8
+
9
+ {% include " components/hero .njk" %}
10
10
{{ content | safe }}
11
- </ main >
11
+
12
12
{% endblock %}
Original file line number Diff line number Diff line change 5
5
{% set introHeading = title %}
6
6
7
7
{% block content %}
8
- <main id =" main-content" >
9
- <article class =" [ post ] [ h-entry ]" >
10
- {% include " partials/components/intro.njk" %}
11
- <div class =" [ post__body ] [ inner-wrapper ] [ leading-loose pad-top-900 pad-bottom-900 text-500 ] [ sf-flow ] [ e-content ]" >
12
- {{ content | safe }}
8
+ <div class =" l-container" >
9
+ <div class =" l-linelength-container" >
10
+ <article class =" [ post ] [ h-entry ]" >
11
+ {% include " partials/components/intro.njk" %}
12
+ <div class =" [ post__body ] [ inner-wrapper ] [ leading-loose pad-top-900 pad-bottom-900 text-500 ] [ sf-flow ] [ e-content ]" >
13
+ {{ content | safe }}
14
+ </div >
15
+ </article >
16
+ </div >
13
17
</div >
14
- </article >
15
- </main >
18
+
16
19
{% endblock %}
17
20
18
21
{{ content | safe }}
Original file line number Diff line number Diff line change 13
13
{% endset %}
14
14
15
15
{% block content %}
16
- <main id =" main-content" >
16
+ <div class =" l-container" >
17
+ <div class =" l-linelength-container" >
17
18
<article class =" [ post ] [ h-entry ]" >
18
19
{% include " partials/components/intro.njk" %}
19
20
{% include " components/page-header.njk" %}
37
38
</footer >
38
39
{% endif %}
39
40
</article >
40
- </main >
41
+ </div >
42
+ </div >
41
43
{% endblock %}
42
44
43
45
{{ content | safe }}
Original file line number Diff line number Diff line change 6
6
* Main element
7
7
*/
8
8
main {
9
- display : block ;
10
- margin-top : 2rem ;
9
+ display : block ;
10
+ margin-top : 2rem ;
11
11
12
- @media all and (min-width : $bp-med ) {
13
- margin-top : 5rem ;
14
- }
12
+ @media all and (min-width : $bp-med ) {
13
+ margin-top : 5rem ;
14
+ }
15
+ }
16
+
17
+ .c-main--flush {
18
+ margin-top : 0 ;
19
+
20
+ @media all and (min-width : $bp-med ) {
21
+ margin-top : 0 ;
22
+ }
15
23
}
Original file line number Diff line number Diff line change
1
+ /* ------------------------------------*\
2
+ #HERO
3
+ \*------------------------------------*/
4
+
5
+ .c-hero {
6
+ padding : 2rem ;
7
+ background : orange ;
8
+ height : 50vh ;
9
+ position : relative ;
10
+ }
11
+
12
+ .c-hero__footer {
13
+ position : absolute ;
14
+ bottom : -55px ;
15
+ left : 50% ;
16
+ width : 320px ;
17
+ margin-left : -160px ;
18
+ }
Original file line number Diff line number Diff line change 45
45
@import ' components/footer-nav' ;
46
46
@import ' components/header' ;
47
47
@import ' components/heading-permalink' ;
48
+ @import ' components/hero' ;
48
49
@import ' components/logo' ;
49
50
@import ' components/icon' ;
50
51
@import ' components/page-header' ;
You can’t perform that action at this time.
0 commit comments