Skip to content

Commit 7729d83

Browse files
alexchormanalexchorman
committed
Add hero section
1 parent 6eb7db3 commit 7729d83

File tree

11 files changed

+233
-55
lines changed

11 files changed

+233
-55
lines changed

‎_theme/breadcrumb.html‎

Lines changed: 32 additions & 27 deletions
Original file line numberDiff line numberDiff line change
@@ -1,27 +1,32 @@
1-
<div class="related d-flex justify-content-between bg-light flex-wrap" role="navigation" aria-label="related navigation">
2-
<ol class="breadcrumb">
3-
<li class="breadcrumb-item"><a href="{{ pathto(master_doc) }}">{{ shorttitle|e }}</a></li>
4-
{%- for parent in parents %}
5-
<li class="breadcrumb-item"><a href="{{ parent.link|e }}"
6-
{% if loop.last %}
7-
{{ accesskey("U") }}
8-
class="active"
9-
{% endif %}>{{ parent.title }}</a></li>
10-
{%- endfor %}
11-
<li class="breadcrumb-item active">{{ title }}</li>
12-
</ol>
13-
<div>
14-
<div class="btn-group btn-group-sm" role="group" aria-label="Basic example">
15-
{%- if prev %}
16-
<a href="{{ prev.link|e }}" title="{{ _('Previous Chapter: ') + prev.title|striptags }}" class="btn btn-primary" role="botton" {{ accesskey("P") }}>
17-
{{ "&laquo;"|safe }} {{ prev.title|striptags|truncate(length=16, killwords=True) }}
18-
</a>
19-
{%- endif %}
20-
{%- if next %}
21-
<a href="{{ next.link|e }}" title="{{ _('Next Chapter: ') + next.title|striptags }}" class="btn btn-primary" role="botton" {{ accesskey("N") }}>
22-
{{ next.title|striptags|truncate(length=16, killwords=True) }} {{ "&raquo;"|safe }}
23-
</a>
24-
{%- endif %}
25-
</div>
26-
</div>
27-
</div>
1+
<div class="breadcrumbs-section" role="navigation" aria-label="related navigation">
2+
<div class="content-container">
3+
<div class="d-flex justify-content-between">
4+
<ol class="breadcrumb">
5+
<li class="breadcrumb-item">
6+
<a href="{{ pathto(master_doc) }}">{{ shorttitle|e }}</a>
7+
</li>
8+
{%- for parent in parents %}
9+
<li class="breadcrumb-item">
10+
<a href="{{ parent.link|e }}" {% if loop.last %} {{ accesskey("U") }} class="active" {% endif %}>{{ parent.title }}</a>
11+
</li>
12+
{%- endfor %}
13+
<li class="breadcrumb-item active">{{ title }}</li>
14+
</ol>
15+
16+
<div class="btn-group btn-group-sm" role="group" aria-label="Basic example">
17+
{%- if prev %}
18+
<a href="{{ prev.link|e }}" title="{{ _('Previous Chapter: ') + prev.title|striptags }}" class="btn btn-primary"
19+
role="botton" {{ accesskey("P") }}>
20+
{{ "&laquo;"|safe }} {{ prev.title|striptags|truncate(length=16, killwords=True) }}
21+
</a>
22+
{%- endif %}
23+
{%- if next %}
24+
<a href="{{ next.link|e }}" title="{{ _('Next Chapter: ') + next.title|striptags }}" class="btn btn-primary"
25+
role="botton" {{ accesskey("N") }}>
26+
{{ next.title|striptags|truncate(length=16, killwords=True) }} {{ "&raquo;"|safe }}
27+
</a>
28+
{%- endif %}
29+
</div>
30+
</div>
31+
</div>
32+
</div>

‎_theme/hero.html‎

Lines changed: 32 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,32 @@
1+
<div class="hero">
2+
<div class="content-container">
3+
<p class="hero-small-title">Welcome</p>
4+
<h1 class="main-title">Information you need to understand Bitcoin and start building Bitcoin-based applications.</h1>
5+
<ul class="hero-list">
6+
<li class="hero-item">
7+
<a href="#" class="hero-link">
8+
Developer Guides
9+
<span>Learn more</span>
10+
</a>
11+
</li>
12+
<li class="hero-item">
13+
<a href="#" class="hero-link">
14+
Reference
15+
<span>Learn more</span>
16+
</a>
17+
</li>
18+
<li class="hero-item">
19+
<a href="#" class="hero-link">
20+
Examples
21+
<span>Learn more</span>
22+
</a>
23+
</li>
24+
<li class="hero-item">
25+
<a href="#" class="hero-link">
26+
Glossary
27+
<span>Learn more</span>
28+
</a>
29+
</li>
30+
</ul>
31+
</div>
32+
</div>

‎_theme/layout.html‎

Lines changed: 9 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -78,14 +78,21 @@
7878
{% include "navbar.html" %}
7979
{% endmacro %}
8080

81+
{% macro hero() %}
82+
{% include "hero.html" %}
83+
{% endmacro %}
84+
8185
{% macro breadcrumb() %}
82-
{% include "breadcrumb.html" %}
86+
{% include "breadcrumb.html" %}
8387
{% endmacro %}
8488

8589
{%- block relbar1 %}{% endblock %}
8690
{%- block relbar2 %}{% endblock %}
8791

88-
{%- block header %}{{ navBar() }}{%- endblock %}
92+
{%- block header %}
93+
{{ navBar() }}
94+
{{ hero() }}
95+
{%- endblock %}
8996

9097

9198
{%- block footer %}

‎_theme/static/css/main.css‎

Lines changed: 122 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,122 @@
1+
.content-container {
2+
max-width: 1170px;
3+
margin: 0 auto;
4+
padding: 0 30px;
5+
}
6+
7+
/* Hero */
8+
.hero {
9+
margin-top: 54px;
10+
padding: 64px 0 60px;
11+
background: #13161F;
12+
}
13+
.hero-small-title {
14+
font-size: 26px;
15+
line-height: 65px;
16+
color: #FF7E00;
17+
}
18+
.main-title {
19+
max-width: 754px;
20+
font-size: 50px;
21+
line-height: 65px;
22+
color: #FFFFFF;
23+
}
24+
.hero-list {
25+
display: flex;
26+
justify-content: space-between;
27+
margin: 60px 0 0;
28+
padding: 0;
29+
list-style: none;
30+
}
31+
.hero-item {
32+
width: 20%;
33+
}
34+
.hero-item + .hero-item {
35+
margin-left: 3%;
36+
}
37+
.hero-link {
38+
position: relative;
39+
display: block;
40+
padding: 100px 20px 38px;
41+
background: #090C14;
42+
border-radius: 1px;
43+
font-size: 22px;
44+
line-height: 42px;
45+
text-align: center;
46+
color: #FFFFFF;
47+
}
48+
.hero-link span {
49+
display: block;
50+
font-size: 16px;
51+
line-height: 24px;
52+
color: #9D9D9D;
53+
}
54+
.hero-link:hover {
55+
text-decoration: none;
56+
}
57+
.hero-link::before {
58+
content: '';
59+
position: absolute;
60+
top: 47px;
61+
left: 50%;
62+
transform: translateX(-50%);
63+
}
64+
.hero-item:nth-child(1) .hero-link::before {
65+
width: 43px;
66+
height: 34px;
67+
background: url('../img/notebook.svg') center no-repeat;
68+
background-size: contain;
69+
}
70+
.hero-item:nth-child(2) .hero-link::before {
71+
width: 46px;
72+
height: 40px;
73+
background: url('../img/search.svg') center no-repeat;
74+
background-size: contain;
75+
}
76+
.hero-item:nth-child(3) .hero-link::before {
77+
width: 36px;
78+
height: 42px;
79+
background: url('../img/docs.svg') center no-repeat;
80+
background-size: contain;
81+
}
82+
.hero-item:nth-child(4) .hero-link::before {
83+
width: 36px;
84+
height: 43px;
85+
background: url('../img/dictionary.svg') center no-repeat;
86+
background-size: contain;
87+
}
88+
89+
/* Breadcrumbs */
90+
.breadcrumbs-section {
91+
padding: 18px 0;
92+
background: #000;
93+
}
94+
.breadcrumb {
95+
align-items: center;
96+
padding: 0;
97+
margin: 0;
98+
background: none;
99+
}
100+
.breadcrumb-item {
101+
font-size: 16px;
102+
line-height: 30px;
103+
}
104+
.breadcrumb-item a {
105+
color: #3490E6;
106+
text-decoration: underline;
107+
}
108+
.breadcrumb-item.active {
109+
color: #fff;
110+
}
111+
.breadcrumb-item + .breadcrumb-item::before {
112+
content: '>';
113+
color: #727272;
114+
}
115+
.btn-group .btn {
116+
background: #F7931A;
117+
border-color: #F7931A;
118+
}
119+
.btn-group .btn:hover {
120+
background: #F7931A;
121+
border-color: #F7931A;
122+
}

‎_theme/static/img/dictionary.svg‎

Lines changed: 7 additions & 0 deletions
Loading

‎_theme/static/img/docs.svg‎

Lines changed: 11 additions & 0 deletions
Loading

‎_theme/static/img/notebook.svg‎

Lines changed: 11 additions & 0 deletions
Loading

‎_theme/static/img/search.svg‎

Lines changed: 5 additions & 0 deletions
Loading

‎_theme/static/sphinxbootstrap4.css_t‎

Lines changed: 1 addition & 25 deletions
Original file line numberDiff line numberDiff line change
@@ -716,32 +716,8 @@ Breadcrumb styles
716716

717717
.related {
718718
{% if theme_navbar_style != "full" %}
719-
margin-top: 54px;
719+
margin-top: 54px;
720720
{% endif %}
721-
padding: 0 1rem .75rem 1rem;
722-
margin-bottom: 1rem;
723-
font-size: 100%!important;
724-
}
725-
726-
.breadcrumb {
727-
padding: calc(.75rem + 6px) 0px 0px 0px;
728-
margin: 0px;
729-
background-color: inherit;
730-
}
731-
732-
.related .btn-group{ /* set padding-top because of flex-wrap */
733-
padding-top: .75rem;
734-
}
735-
736-
.btn-group .btn {
737-
background: #F7931A;
738-
barder: F7931A;
739-
border-color: #F7931A;
740-
}
741-
.btn-group .btn:hover {
742-
background: #F7931A;
743-
barder: F7931A;
744-
border-color: #F7931A;
745721
}
746722

747723
.black {

‎_theme/static/sphinxbootstrap4.js_t‎

Lines changed: 0 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -40,7 +40,6 @@ $(function() {
4040
$(".document").addClass("col-md-12")
4141
.children(".documentwrapper").addClass("container");
4242
{% endif %}
43-
$(".related").addClass("col-md-12");
4443
$(".footer").addClass("col-md-12");
4544

4645
{% if theme_navbar_show_pages %}

0 commit comments

Comments
 (0)