Skip to content

Commit f708ad1

Browse files
committed
Fix sidebar author's profile, remove pic when website sidebar is pushed to the top
1 parent b3c594e commit f708ad1

File tree

4 files changed

+98
-258
lines changed

4 files changed

+98
-258
lines changed

_includes/author-profile.html

Lines changed: 33 additions & 258 deletions
Original file line numberDiff line numberDiff line change
@@ -3,24 +3,31 @@
33

44
<div itemscope itemtype="https://schema.org/Person" class="h-card">
55

6-
<div class="author-avatar">
7-
{% if author.avatar %}
8-
<img loading="{{ loading }}" src="{{ author.avatar | relative_url }}" alt="An image of {{ author.name }}">
9-
{% else %}
10-
<img loading="{{ loading }}" src="{{ site.author.avatar | relative_url }}" alt="An image of {{ author.name }}">
11-
{% endif %}
6+
7+
{% if author.avatar %}
8+
<div class="author-avatar-v2">
9+
<img loading="{{ loading }}" src="{{ author.avatar | relative_url }}" alt="An image of {{ author.name }}"
10+
class="u-photo" itemprop="image">
11+
</div>
12+
13+
{% else %}
14+
<div class="author-avatar-v2">
15+
<img loading="{{ loading }}" src="{{ site.author.avatar | relative_url }}" alt="An image of {{ author.name }}"
16+
class="u-photo" itemprop="image">
1217
</div>
18+
{% endif %}
1319

14-
<div class="author-info">
1520

16-
<b class="author-name">
21+
<div class="author__content">
22+
23+
<h3 class="author-name">
1724
{% if author.links %}
1825
<a href="{{ author.links[0].url }}" aria-label="Access the primary external link of this author">{{
1926
author.name }}</a>
2027
{% else %}
2128
{{ author.name }}
2229
{% endif %}
23-
</b>
30+
</h3>
2431

2532
{% if author.bio %}
2633
<div class="author-bio">
@@ -30,267 +37,35 @@
3037

3138
{% if author.note %}
3239
<div class="author-note">
33-
{{ author.note }}
40+
{{ author.note | markdownify }}
3441
</div>
3542
{% endif %}
3643

37-
</div>
38-
39-
<div class="author__urls-wrapper">
40-
<button class="btn btn--inverse">{{ site.data.ui-text[site.locale].follow_label | remove: ":" | default:
41-
"Follow" }}</button>
44+
<div class="author__urls-wrapper">
45+
<button class="btn btn--inverse">{{ site.data.ui-text[site.locale].follow_label | remove: ":" | default:
46+
"Follow" }}</button>
4247

43-
<ul class="author__urls">
48+
<ul class="author__urls">
4449

45-
{% if author.location %}
46-
<li itemprop="homeLocation" itemscope itemtype="https://schema.org/Place">
47-
<i class="fas fa-fw fa-map-marker-alt" aria-hidden="true"></i> <span itemprop="name"
48-
class="p-locality">{{ author.location }}</span>
49-
</li>
50-
{% endif %}
50+
{% if author.links %}
5151

52-
{% if author.links %}
53-
<li>
5452
{% for link in author.links %}
5553
{% include infer-icon.html link=link %}
5654
{% if icon %}
57-
<a href="{{ link.url }}" class="author-button">
58-
<i class="{{ icon }} author-button" aria-label="Access author's external link for {{ icon }}">
59-
</i>
60-
{{ link.label }}
61-
</a>
55+
<li class="author-links-horizontal">
56+
<a href="{{ link.url }}" class="author-button">
57+
<i class="{{ icon }} author-button" aria-label="Access author's external link for {{ icon }}">
58+
</i>
59+
</a>
60+
</li>
61+
6262
{% endif %}
6363
{% endfor %}
64-
</li>
65-
{% endif %}
66-
67-
{% if author.uri %}
68-
<li>
69-
<a href="{{ author.uri }}" itemprop="url" rel="me">
70-
<i class="fas fa-fw fa-link" aria-hidden="true"></i><span class="label">{{
71-
site.data.ui-text[site.locale].website_label | default: "Website" }}</span>
72-
</a>
73-
</li>
74-
{% endif %}
75-
76-
{% if author.email %}
77-
<li>
78-
<a href="mailto:{{ author.email }}" rel="me" class="u-email">
79-
<meta itemprop="email" content="{{ author.email }}" />
80-
<i class="fas fa-fw fa-envelope-square" aria-hidden="true"></i><span class="label">{{
81-
site.data.ui-text[site.locale].email_label | default: "Email" }}</span>
82-
</a>
83-
</li>
84-
{% endif %}
85-
86-
{% if author.keybase %}
87-
<li>
88-
<a href="https://keybase.io/{{ author.keybase }}" itemprop="sameAs"
89-
rel="nofollow noopener noreferrer me">
90-
<i class="fab fa-fw fa-keybase" aria-hidden="true"></i><span class="label">Keybase</span>
91-
</a>
92-
</li>
93-
{% endif %}
94-
95-
{% if author.twitter %}
96-
<li>
97-
<a href="https://twitter.com/{{ author.twitter }}" itemprop="sameAs"
98-
rel="nofollow noopener noreferrer me">
99-
<i class="fab fa-fw fa-twitter-square" aria-hidden="true"></i><span class="label">Twitter</span>
100-
</a>
101-
</li>
102-
{% endif %}
103-
104-
{% if author.facebook %}
105-
<li>
106-
<a href="https://www.facebook.com/{{ author.facebook }}" itemprop="sameAs"
107-
rel="nofollow noopener noreferrer me">
108-
<i class="fab fa-fw fa-facebook-square" aria-hidden="true"></i><span class="label">Facebook</span>
109-
</a>
110-
</li>
111-
{% endif %}
112-
113-
{% if author.linkedin %}
114-
<li>
115-
<a href="https://www.linkedin.com/in/{{ author.linkedin }}" itemprop="sameAs"
116-
rel="nofollow noopener noreferrer me">
117-
<i class="fab fa-fw fa-linkedin" aria-hidden="true"></i><span class="label">LinkedIn</span>
118-
</a>
119-
</li>
120-
{% endif %}
121-
122-
{% if author.xing %}
123-
<li>
124-
<a href="https://www.xing.com/profile/{{ author.xing }}" itemprop="sameAs"
125-
rel="nofollow noopener noreferrer me">
126-
<i class="fab fa-fw fa-xing-square" aria-hidden="true"></i><span class="label">XING</span>
127-
</a>
128-
</li>
129-
{% endif %}
130-
131-
{% if author.instagram %}
132-
<li>
133-
<a href="https://instagram.com/{{ author.instagram }}" itemprop="sameAs"
134-
rel="nofollow noopener noreferrer me">
135-
<i class="fab fa-fw fa-instagram" aria-hidden="true"></i><span class="label">Instagram</span>
136-
</a>
137-
</li>
138-
{% endif %}
139-
140-
{% if author.tumblr %}
141-
<li>
142-
<a href="https://{{ author.tumblr }}.tumblr.com" itemprop="sameAs"
143-
rel="nofollow noopener noreferrer me">
144-
<i class="fab fa-fw fa-tumblr-square" aria-hidden="true"></i><span class="label">Tumblr</span>
145-
</a>
146-
</li>
147-
{% endif %}
148-
149-
{% if author.bitbucket %}
150-
<li>
151-
<a href="https://bitbucket.org/{{ author.bitbucket }}" itemprop="sameAs"
152-
rel="nofollow noopener noreferrer me">
153-
<i class="fab fa-fw fa-bitbucket" aria-hidden="true"></i><span class="label">Bitbucket</span>
154-
</a>
155-
</li>
156-
{% endif %}
157-
158-
{% if author.github %}
159-
<li>
160-
<a href="https://github.com/{{ author.github }}" itemprop="sameAs"
161-
rel="nofollow noopener noreferrer me">
162-
<i class="fab fa-fw fa-github" aria-hidden="true"></i><span class="label">GitHub</span>
163-
</a>
164-
</li>
165-
{% endif %}
166-
167-
{% if author.gitlab %}
168-
<li>
169-
<a href="https://gitlab.com/{{ author.gitlab }}" itemprop="sameAs"
170-
rel="nofollow noopener noreferrer me">
171-
<i class="fab fa-fw fa-gitlab" aria-hidden="true"></i><span class="label">GitLab</span>
172-
</a>
173-
</li>
174-
{% endif %}
175-
176-
{% if author.stackoverflow %}
177-
<li>
178-
<a href="https://stackoverflow.com/users/{{ author.stackoverflow }}" itemprop="sameAs"
179-
rel="nofollow noopener noreferrer me">
180-
<i class="fab fa-fw fa-stack-overflow" aria-hidden="true"></i><span class="label">Stack
181-
Overflow</span>
182-
</a>
183-
</li>
184-
{% endif %}
185-
186-
{% if author.lastfm %}
187-
<li>
188-
<a href="https://last.fm/user/{{ author.lastfm }}" itemprop="sameAs"
189-
rel="nofollow noopener noreferrer me">
190-
<i class="fab fa-fw fa-lastfm-square" aria-hidden="true"></i><span class="label">Last.fm</span>
191-
</a>
192-
</li>
193-
{% endif %}
194-
195-
{% if author.dribbble %}
196-
<li>
197-
<a href="https://dribbble.com/{{ author.dribbble }}" itemprop="sameAs"
198-
rel="nofollow noopener noreferrer me">
199-
<i class="fab fa-fw fa-dribbble" aria-hidden="true"></i><span class="label">Dribbble</span>
200-
</a>
201-
</li>
202-
{% endif %}
203-
204-
{% if author.pinterest %}
205-
<li>
206-
<a href="https://www.pinterest.com/{{ author.pinterest }}" itemprop="sameAs"
207-
rel="nofollow noopener noreferrer me">
208-
<i class="fab fa-fw fa-pinterest" aria-hidden="true"></i><span class="label">Pinterest</span>
209-
</a>
210-
</li>
211-
{% endif %}
212-
213-
{% if author.foursquare %}
214-
<li>
215-
<a href="https://foursquare.com/{{ author.foursquare }}" itemprop="sameAs"
216-
rel="nofollow noopener noreferrer me">
217-
<i class="fab fa-fw fa-foursquare" aria-hidden="true"></i><span class="label">Foursquare</span>
218-
</a>
219-
</li>
220-
{% endif %}
221-
222-
{% if author.steam %}
223-
<li>
224-
<a href="https://steamcommunity.com/id/{{ author.steam }}" itemprop="sameAs"
225-
rel="nofollow noopener noreferrer me">
226-
<i class="fab fa-fw fa-steam" aria-hidden="true"></i><span class="label">Steam</span>
227-
</a>
228-
</li>
229-
{% endif %}
230-
231-
{% if author.youtube %}
232-
{% if author.youtube contains "://" %}
233-
<li>
234-
<a href="{{ author.youtube }}" itemprop="sameAs" rel="nofollow noopener noreferrer me">
235-
<i class="fab fa-fw fa-youtube" aria-hidden="true"></i><span class="label">YouTube</span>
236-
</a>
237-
</li>
238-
{% elsif author.youtube %}
239-
<li>
240-
<a href="https://www.youtube.com/user/{{ author.youtube }}" itemprop="sameAs"
241-
rel="nofollow noopener noreferrer me">
242-
<i class="fab fa-fw fa-youtube" aria-hidden="true"></i><span class="label">YouTube</span>
243-
</a>
244-
</li>
245-
{% endif %}
246-
{% endif %}
247-
248-
{% if author.soundcloud %}
249-
<li>
250-
<a href="https://soundcloud.com/{{ author.soundcloud }}" itemprop="sameAs"
251-
rel="nofollow noopener noreferrer me">
252-
<i class="fab fa-fw fa-soundcloud" aria-hidden="true"></i><span class="label">SoundCloud</span>
253-
</a>
254-
</li>
255-
{% endif %}
256-
257-
{% if author.weibo %}
258-
<li>
259-
<a href="https://www.weibo.com/{{ author.weibo }}" itemprop="sameAs"
260-
rel="nofollow noopener noreferrer me">
261-
<i class="fab fa-fw fa-weibo" aria-hidden="true"></i><span class="label">Weibo</span>
262-
</a>
263-
</li>
264-
{% endif %}
265-
266-
{% if author.flickr %}
267-
<li>
268-
<a href="https://www.flickr.com/{{ author.flickr }}" itemprop="sameAs"
269-
rel="nofollow noopener noreferrer me">
270-
<i class="fab fa-fw fa-flickr" aria-hidden="true"></i><span class="label">Flickr</span>
271-
</a>
272-
</li>
273-
{% endif %}
274-
275-
{% if author.codepen %}
276-
<li>
277-
<a href="https://codepen.io/{{ author.codepen }}" itemprop="sameAs"
278-
rel="nofollow noopener noreferrer me">
279-
<i class="fab fa-fw fa-codepen" aria-hidden="true"></i><span class="label">CodePen</span>
280-
</a>
281-
</li>
282-
{% endif %}
64+
{% endif %}
28365

284-
{% if author.vine %}
285-
<li>
286-
<a href="https://vine.co/u/{{ author.vine }}" itemprop="sameAs" rel="nofollow noopener noreferrer me">
287-
<i class="fab fa-fw fa-vine" aria-hidden="true"></i><span class="label">{{
288-
site.data.ui-text[site.locale].email_label | default: "Email" }}</span>
289-
</a>
290-
</li>
291-
{% endif %}
66+
{% include author-profile-custom-links.html %}
67+
</ul>
68+
</div>
29269

293-
{% include author-profile-custom-links.html %}
294-
</ul>
29570
</div>
29671
</div>

_includes/infer-icon.html

Lines changed: 40 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -12,6 +12,46 @@
1212
{% assign icon = 'fas fa-link' %}
1313
{% elsif link.label == "Scholar" %}
1414
{% assign icon = 'fas fa-graduation-cap' %}
15+
{% elsif link.label == "Keybase" %}
16+
{% assign icon = 'fab fa-fw fa-keybase' %}
17+
{% elsif link.label == "Facebook" %}
18+
{% assign icon = 'fab fa-fw fa-facebook-square' %}
19+
{% elsif link.label == "Xing" %}
20+
{% assign icon = 'fab fa-fw fa-xing-square' %}
21+
{% elsif link.label == "Instagram" %}
22+
{% assign icon = 'fab fa-fw fa-instagram' %}
23+
{% elsif link.label == "Tumblr" %}
24+
{% assign icon = 'fab fa-fw fa-tumblr-square' %}
25+
{% elsif link.label == "Email" %}
26+
{% assign icon = 'fas fa-fw fa-envelope-square' %}
27+
{% elsif link.label == "Bitbucket" %}
28+
{% assign icon = 'fab fa-fw fa-bitbucket' %}
29+
{% elsif link.label == "Gitlab" %}
30+
{% assign icon = 'fab fa-fw fa-gitlab' %}
31+
{% elsif link.label == "Stackoverflow" %}
32+
{% assign icon = 'fab fa-fw fa-stack-overflow' %}
33+
{% elsif link.label == "Lastfm" %}
34+
{% assign icon = 'fab fa-fw fa-lastfm-square' %}
35+
{% elsif link.label == "Dribbble" %}
36+
{% assign icon = 'fab fa-fw fa-dribbble' %}
37+
{% elsif link.label == "Pinterest" %}
38+
{% assign icon = 'fab fa-fw fa-pinterest' %}
39+
{% elsif link.label == "Foursquare" %}
40+
{% assign icon = 'fab fa-fw fa-foursquare' %}
41+
{% elsif link.label == "Steam" %}
42+
{% assign icon = 'fab fa-fw fa-steam' %}
43+
{% elsif link.label == "YouTube" %}
44+
{% assign icon = 'fab fa-fw fa-youtube' %}
45+
{% elsif link.label == "Soundcloud" %}
46+
{% assign icon = 'fab fa-fw fa-soundcloud' %}
47+
{% elsif link.label == "Weibo" %}
48+
{% assign icon = 'fab fa-fw fa-weibo' %}
49+
{% elsif link.label == "Flickr" %}
50+
{% assign icon = 'fab fa-fw fa-flickr' %}
51+
{% elsif link.label == "Codepen" %}
52+
{% assign icon = 'fab fa-fw fa-codepen' %}
53+
{% elsif link.label == "Vine" %}
54+
{% assign icon = 'fab fa-fw fa-vine' %}
1555
{% else %}
1656
{% assign icon = 'fas fa-link' %}
1757
{% endif %}

_sass/custom/authors.scss

Lines changed: 4 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -2,4 +2,8 @@
22
margin-right: .2em;
33
font-size: x-large;
44
color: $primary-color
5+
}
6+
7+
.author-links-horizontal {
8+
display: inline-flex;
59
}

0 commit comments

Comments
 (0)