Skip to content

Commit 232b376

Browse files
committed
add essential branding and footer copy
1 parent aeefe31 commit 232b376

File tree

12 files changed

+257
-40
lines changed

12 files changed

+257
-40
lines changed

package-lock.json

Lines changed: 6 additions & 0 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

package.json

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -51,6 +51,7 @@
5151
"stylelint": "~13.3",
5252
"stylelint-config-standard": "~20.0",
5353
"through2": "~3.0",
54+
"typeface-comfortaa": "^0.0.54",
5455
"typeface-roboto": "0.0.75",
5556
"typeface-roboto-mono": "0.0.75",
5657
"vinyl-buffer": "~1.0",

src/css/footer.css

Lines changed: 95 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,15 +1,107 @@
11
footer.footer {
22
background-color: var(--footer-background);
33
color: var(--footer-font-color);
4-
font-size: calc(15 / var(--rem-base) * 1rem);
4+
font-size: calc(14 / var(--rem-base) * 1rem);
55
line-height: var(--footer-line-height);
6-
padding: 1.5rem;
6+
padding: 2rem 1rem;
7+
display: flex;
8+
flex-direction: column;
79
}
810

911
.footer p {
10-
margin: 0.5rem 0;
12+
margin: 0;
1113
}
1214

1315
.footer a {
16+
color: inherit;
17+
text-decoration: none;
18+
}
19+
20+
.footer a:hover {
1421
color: var(--footer-link-font-color);
1522
}
23+
24+
.footer p + p {
25+
margin-top: 1em;
26+
}
27+
28+
.footer-main {
29+
display: flex;
30+
flex-direction: column;
31+
align-items: center;
32+
}
33+
34+
.footer-brand {
35+
display: flex;
36+
align-items: center;
37+
margin: 0;
38+
}
39+
40+
.footer-brand .logo {
41+
display: flex;
42+
}
43+
44+
.footer-brand a {
45+
color: var(--footer-link-font-color);
46+
}
47+
48+
.footer-brand figcaption {
49+
color: var(--footer-link-font-color);
50+
font-family: "Comfortaa", sans-serif;
51+
font-size: 1.9rem;
52+
line-height: 1;
53+
position: relative;
54+
top: 0.0625em;
55+
}
56+
57+
.footer-brand .logo + figcaption {
58+
margin-left: 0.5em;
59+
}
60+
61+
.footer-brand img {
62+
height: 45px;
63+
}
64+
65+
.footer-brand-links {
66+
list-style: none;
67+
display: flex;
68+
margin: 2rem 0 0;
69+
padding: 0;
70+
font-size: 0.9rem;
71+
}
72+
73+
.footer-brand-links li + li::before {
74+
content: '|';
75+
padding: 0 0.5em;
76+
}
77+
78+
.footer-legal {
79+
margin-top: 1.5rem;
80+
}
81+
82+
.footer-legal,
83+
.footer-thanks {
84+
text-align: center;
85+
}
86+
87+
@media screen and (min-width: 1024px) {
88+
footer.footer {
89+
flex-direction: row;
90+
}
91+
92+
.footer-legal {
93+
margin-top: 0;
94+
padding: 0 1.5rem;
95+
text-align: left;
96+
width: 40%;
97+
}
98+
99+
.footer-main,
100+
.footer-thanks {
101+
width: 30%;
102+
}
103+
104+
.footer-thanks {
105+
text-align: right;
106+
}
107+
}

src/css/header.css

Lines changed: 27 additions & 18 deletions
Original file line numberDiff line numberDiff line change
@@ -22,28 +22,42 @@ body {
2222
text-decoration: none;
2323
}
2424

25-
.navbar-brand .navbar-item:first-child,
26-
.navbar-brand .navbar-item:first-child a {
27-
color: var(--navbar-font-color);
28-
font-size: calc(22 / var(--rem-base) * 1rem);
25+
.navbar-brand {
26+
display: flex;
27+
height: var(--navbar-height);
28+
padding: 0;
2929
}
3030

31-
.navbar-brand .separator {
32-
padding: 0 0.375rem;
31+
.navbar-brand img {
32+
height: calc(0.6 * var(--navbar-height));
33+
}
34+
35+
.navbar-brand .navbar-item {
36+
padding: 0;
37+
margin-left: 1rem;
3338
}
3439

3540
@media screen and (min-width: 1024px) {
41+
.navbar-brand {
42+
flex: none;
43+
}
44+
45+
.navbar-start > .navbar-item,
46+
.navbar-start .navbar-link,
3647
.navbar-end > .navbar-item,
3748
.navbar-end .navbar-link {
3849
color: var(--navbar-font-color);
3950
}
4051

52+
.navbar-start > a.navbar-item:hover,
53+
.navbar-start .navbar-link:hover,
4154
.navbar-end > a.navbar-item:hover,
4255
.navbar-end .navbar-link:hover {
4356
background: var(--navbar_hover-background);
4457
color: var(--navbar-font-color);
4558
}
4659

60+
.navbar-start .navbar-link::after,
4761
.navbar-end .navbar-link::after {
4862
border-color: var(--navbar-font-color);
4963
}
@@ -54,13 +68,6 @@ body {
5468
}
5569
}
5670

57-
.navbar-brand {
58-
align-items: stretch;
59-
display: flex;
60-
flex-shrink: 0;
61-
height: var(--navbar-height);
62-
}
63-
6471
.navbar-burger {
6572
color: var(--navbar-font-color);
6673
background: none;
@@ -184,6 +191,7 @@ body {
184191
@media screen and (min-width: 1024px) {
185192
.navbar,
186193
.navbar-menu,
194+
.navbar-start,
187195
.navbar-end {
188196
align-items: stretch;
189197
display: flex;
@@ -226,6 +234,11 @@ body {
226234
flex-grow: 1;
227235
}
228236

237+
.navbar-start {
238+
justify-content: flex-start;
239+
margin-right: auto;
240+
}
241+
229242
.navbar-end {
230243
justify-content: flex-end;
231244
margin-left: auto;
@@ -244,18 +257,14 @@ body {
244257
}
245258

246259
.navbar-dropdown .navbar-item {
247-
padding: 0.5rem 1rem;
260+
padding: 0.5rem 2rem 0.5rem 1rem;
248261
white-space: nowrap;
249262
}
250263

251264
.navbar-dropdown .navbar-item:last-child {
252265
border-radius: inherit;
253266
}
254267

255-
.navbar-dropdown a.navbar-item {
256-
padding-right: 3rem;
257-
}
258-
259268
.navbar-dropdown.is-right {
260269
left: auto;
261270
right: 0;

src/css/site.css

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,6 @@
11
@import "typeface-roboto.css";
22
@import "typeface-roboto-mono.css";
3+
@import "typeface-comfortaa.css";
34
@import "vars.css";
45
@import "base.css";
56
@import "body.css";

src/css/typeface-comfortaa.css

Lines changed: 10 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,10 @@
1+
@font-face {
2+
font-family: "Comfortaa";
3+
font-style: normal;
4+
font-weight: 400;
5+
src:
6+
local("Comfortaa Regular"),
7+
local("Comfortaa-Regular"),
8+
url(~typeface-comfortaa/files/comfortaa-latin-400.woff2) format("woff2"),
9+
url(~typeface-comfortaa/files/comfortaa-latin-400.woff) format("woff");
10+
}

src/css/vars.css

Lines changed: 7 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -7,6 +7,7 @@
77
--color-smoke-70: #f0f0f0;
88
--color-smoke-90: #e1e1e1;
99
--color-gray-10: #c1c1c1;
10+
--color-gray-15: #bababa;
1011
--color-gray-30: #8e8e8e;
1112
--color-gray-50: #808080;
1213
--color-gray-70: #5d5d5d;
@@ -22,7 +23,7 @@
2223
--body-font-size--desktop: 1.125em; /* 18px */
2324
--body-font-size--print: 0.9375em; /* 15px */
2425
--body-line-height: 1.15;
25-
--body-font-color: var(--color-jet-70);
26+
--body-font-color: var(--color-jet-80);
2627
--body-font-family: "Roboto", sans-serif;
2728
--body-font-weight-bold: 500;
2829
--monospace-font-family: "Roboto Mono", monospace;
@@ -85,8 +86,8 @@
8586
--heading-font-weight: normal;
8687
--alt-heading-font-weight: var(--body-font-weight-bold);
8788
--section-divider-color: var(--panel-border-color);
88-
--link-font-color: #1565c0;
89-
--link_hover-font-color: #104d92;
89+
--link-font-color: #e40046;
90+
--link_hover-font-color: #b60038;
9091
--link_unresolved-font-color: var(--important-color);
9192
--abstract-background: var(--color-smoke-70);
9293
--abstract-font-color: var(--color-jet-20);
@@ -112,9 +113,9 @@
112113
--table-border-color: var(--panel-border-color);
113114
/* footer */
114115
--footer-line-height: var(--doc-line-height);
115-
--footer-background: var(--color-smoke-90);
116-
--footer-font-color: var(--color-gray-70);
117-
--footer-link-font-color: var(--color-jet-80);
116+
--footer-background: var(--color-jet-80);
117+
--footer-font-color: var(--color-gray-15);
118+
--footer-link-font-color: var(--color-white);
118119
/* dimensions and positioning */
119120
--navbar-height: calc(63 / var(--rem-base) * 1rem);
120121
--toolbar-height: calc(45 / var(--rem-base) * 1rem);

src/img/favicon.ico

162 KB
Binary file not shown.

src/img/logo.svg

Lines changed: 49 additions & 0 deletions
Loading

src/partials/footer-content.hbs

Lines changed: 24 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,26 @@
11
<footer class="footer">
2-
<p>This page was built using the Antora default UI.</p>
3-
<p>The source code for this UI is licensed under the terms of the MPL-2.0 license.</p>
2+
<div class="footer-main">
3+
<figure class="footer-brand">
4+
<a class="logo" href="https://asciidoctor.org"><img src="{{uiRootPath}}/img/logo.svg" alt="Asciidoctor"></a>
5+
<figcaption class="footer-brand-name"><a href="https://asciidoctor.org">Asciidoctor</a></figcaption>
6+
</figure>
7+
<ul class="footer-brand-links">
8+
<li><a href="https://asciidoctor.org" target="_blank" rel="noopener">Home</a></li>
9+
<li><a href="{{{or site.url (or siteRootUrl siteRootPath)}}}">Docs</a></li>
10+
<li><a href="https://github.com/asciidoctor" target="_blank" rel="noopener">Source</a></li>
11+
<li><a href="http://discuss.asciidoctor.org" target="_blank" rel="noopener">Discuss</a></li>
12+
</ul>
13+
</div>
14+
<div class="footer-legal">
15+
<p>Except where noted, the content on this site is licensed under the Creative Commons Attribution 4.0 International (CC-BY 4.0) license.</p>
16+
<p>The UI for this site is based on the default Antora UI and is thus licensed under the terms of the MPL-2.0 license.</p>
17+
<p>Authored in AsciiDoc // Produced by Asciidoctor and Antora.</p>
18+
</div>
19+
<div class="footer-thanks">
20+
<p>Thanks to our <a href="https://asciidoctor.org/supporters/" target="_blank" rel="noopener">backers</a> and <a href="https://asciidoctor.org/contributors/" target="_blank" rel="noopener">contributors</a> for helping to make this project possible.</p>
21+
<p>
22+
Special thanks to:
23+
<a href="https://opendevise.com" title="OpenDevise" target="_blank" rel="noopener"><img src="https://secure.gravatar.com/avatar/823717a797dbd78ceff7b26aa397f383.png?size=50" alt="OpenDevise Logo" style="margin-left: 5px" width="25"></a>
24+
</p>
25+
</div>
426
</footer>

0 commit comments

Comments
 (0)