blog.trnck.dev

sidebar blog permalink support

+61 -51
+1 -1
_config.yml
··· 18 18 path: "" # an empty string here means all files in the project 19 19 type: "posts" 20 20 values: 21 - layout: "stacked" 21 + layout: "sidebar" 22 22 is_post: true 23 23 24 24 topics:
+18 -6
_layouts/sidebar.html
··· 38 38 39 39 <div class="col-md-7 col-lg-8 col-xl-9 px-4 py-6 px-lg-7"> 40 40 <div class="mx-auto" style="max-width: 900px;"> 41 - <div class="{% if site.style == 'dark' %}text-white{% endif %} mb-6"> 42 - {{ content }} 41 + 42 + <div class="f4 {% if site.style == 'dark' %}text-white{% endif %} mb-6"> 43 + {% if page.is_post %} 44 + <div class="f4 {% if site.style == 'dark' %}text-white{% endif %}"> 45 + <p class="f5"><a href="/" class="d-flex flex-items-center {% if site.style == 'dark' %}text-white{% endif %}">{% octicon chevron-left height:16 class:"mr-2 v-align-middle" fill:{{ icon_color }} aria-label:Home %}Home</a></p> 46 + <h1 class="f00-light lh-condensed">{{ page.title }}</h1> 47 + <p class="mb-5">Published {{ page.date | date: "%b %d, %Y"}}</p> 48 + {{ content }} 49 + </div> 50 + {% else %} 51 + {{ content }} 52 + {% endif %} 43 53 </div> 44 54 45 - {% include projects.html %} 55 + {% unless page.is_post %} 56 + {% include projects.html %} 46 57 47 - {% include interests.html %} 58 + {% include interests.html %} 48 59 49 - {% unless post_size == 0 %} 50 - {% include thoughts.html %} 60 + {% unless post_size == 0 %} 61 + {% include thoughts.html %} 62 + {% endunless %} 51 63 {% endunless %} 52 64 </div> 53 65 </div>
+11 -11
_layouts/stacked.html
··· 33 33 </div> 34 34 {% endunless %} 35 35 36 - <div {% if site.style == 'dark' %}class="text-white"{% endif %}> 37 - {% if page.is_post %} 38 - <div class="container-md f4 text-left border rounded-2 bg-white p-3 p-sm-5 mt-6"> 39 - <p class="f5"><a href="/" class="d-flex flex-items-center">{% octicon chevron-left height:16 class:"mr-2 v-align-middle" fill:#0366d6 aria-label:Home %}Home</a></p> 40 - <h1 class="f00-light lh-condensed">{{ page.title }}</h1> 41 - <p class="{% if site.style == 'dark' %}text-white{% else %}text-gray{% endif %} mb-5">Published {{ page.date | date: "%b %d, %Y"}}</p> 42 - {{ content }} 43 - </div> 44 - {% else %} 36 + {% if page.is_post %} 37 + <div class="container-md f4 text-left border rounded-2 bg-white p-3 p-sm-5 mt-6"> 38 + <p class="f5"><a href="/" class="d-flex flex-items-center">{% octicon chevron-left height:16 class:"mr-2 v-align-middle" fill:#0366d6 aria-label:Home %}Home</a></p> 39 + <h1 class="f00-light lh-condensed">{{ page.title }}</h1> 40 + <p class="mb-5">Published {{ page.date | date: "%b %d, %Y"}}</p> 45 41 {{ content }} 46 - {% endif %} 47 - </div> 42 + </div> 43 + {% else %} 44 + <div {% if site.style == 'dark' %}class="text-white"{% endif %}> 45 + {{ content }} 46 + </div> 47 + {% endif %} 48 48 49 49 {% unless page.is_post %} 50 50 <div class="my-6">
+30 -32
_site/index.html
··· 14 14 <body class="bg-gray-light" > 15 15 16 16 17 - <div class="container-lg py-6 p-responsive text-center"> 18 - <img src="https://avatars3.githubusercontent.com/u/527589?v=4" class="circle mb-3" style="max-width: 150px;"> 19 - <h1 class=" mb-2 lh-condensed">Sophie Shepherd</h1> 20 - <p class="col-lg-8 mx-auto mb-3 f3 text-gray"> 21 - ✏ Design manager at @github 22 - </p> 23 - 17 + <div class="d-md-flex" style="height: 100vh"> 18 + <div class="flex-self-stretch border-bottom border-md-none border-md-right border-gray-light bg-white col-md-5 col-lg-4 col-xl-3 px-4 px-md-6 px-lg-7 py-6"> 19 + <img src="https://avatars3.githubusercontent.com/u/527589?v=4" class="circle mb-3" style="max-width: 150px;"> 20 + <h1 class=" mb-2 lh-condensed">Sophie Shepherd</h1> 21 + <p class="mb-3 f4 text-gray"> 22 + ✏ Design manager at @github 23 + </p> 24 24 <div class="f4 mb-6"> 25 25 26 - <div class="d-md-inline-block mr-3"> 27 - <svg height="20" class="octicon octicon-mark-github mr-1 v-align-middle" fill="#24292e" aria-label="GitHub" viewBox="0 0 16 16" version="1.1" width="20" role="img"><path fill-rule="evenodd" d="M8 0C3.58 0 0 3.58 0 8c0 3.54 2.29 6.53 5.47 7.59.4.07.55-.17.55-.38 0-.19-.01-.82-.01-1.49-2.01.37-2.53-.49-2.69-.94-.09-.23-.48-.94-.82-1.13-.28-.15-.68-.52-.01-.53.63-.01 1.08.58 1.23.82.72 1.21 1.87.87 2.33.66.07-.52.28-.87.51-1.07-1.78-.2-3.64-.89-3.64-3.95 0-.87.31-1.59.82-2.15-.08-.2-.36-1.02.08-2.12 0 0 .67-.21 2.2.82.64-.18 1.32-.27 2-.27.68 0 1.36.09 2 .27 1.53-1.04 2.2-.82 2.2-.82.44 1.1.16 1.92.08 2.12.51.56.82 1.27.82 2.15 0 3.07-1.87 3.75-3.65 3.95.29.25.54.73.54 1.48 0 1.07-.01 1.93-.01 2.2 0 .21.15.46.55.38A8.013 8.013 0 0 0 16 8c0-4.42-3.58-8-8-8z"/></svg> 26 + <div class="d-flex flex-items-center mb-3"> 27 + <svg height="20" class="octicon octicon-mark-github mr-2 v-align-middle" fill="#24292e" aria-label="GitHub" viewBox="0 0 16 16" version="1.1" width="20" role="img"><path fill-rule="evenodd" d="M8 0C3.58 0 0 3.58 0 8c0 3.54 2.29 6.53 5.47 7.59.4.07.55-.17.55-.38 0-.19-.01-.82-.01-1.49-2.01.37-2.53-.49-2.69-.94-.09-.23-.48-.94-.82-1.13-.28-.15-.68-.52-.01-.53.63-.01 1.08.58 1.23.82.72 1.21 1.87.87 2.33.66.07-.52.28-.87.51-1.07-1.78-.2-3.64-.89-3.64-3.95 0-.87.31-1.59.82-2.15-.08-.2-.36-1.02.08-2.12 0 0 .67-.21 2.2.82.64-.18 1.32-.27 2-.27.68 0 1.36.09 2 .27 1.53-1.04 2.2-.82 2.2-.82.44 1.1.16 1.92.08 2.12.51.56.82 1.27.82 2.15 0 3.07-1.87 3.75-3.65 3.95.29.25.54.73.54 1.48 0 1.07-.01 1.93-.01 2.2 0 .21.15.46.55.38A8.013 8.013 0 0 0 16 8c0-4.42-3.58-8-8-8z"/></svg> 28 28 <a href="https://github.com/sophshep" > 29 29 @sophshep 30 30 </a> ··· 32 32 33 33 34 34 35 - <div class="d-md-inline-block "> 36 - <svg height="20" class="octicon octicon-location mr-1 v-align-middle" fill="#24292e" aria-label="Location" viewBox="0 0 12 16" version="1.1" width="15" role="img"><path fill-rule="evenodd" d="M6 0C2.69 0 0 2.5 0 5.5 0 10.02 6 16 6 16s6-5.98 6-10.5C12 2.5 9.31 0 6 0zm0 14.55C4.14 12.52 1 8.44 1 5.5 1 3.02 3.25 1 6 1c1.34 0 2.61.48 3.56 1.36.92.86 1.44 1.97 1.44 3.14 0 2.94-3.14 7.02-5 9.05zM8 5.5c0 1.11-.89 2-2 2-1.11 0-2-.89-2-2 0-1.11.89-2 2-2 1.11 0 2 .89 2 2z"/></svg> 35 + <div class="d-flex flex-items-center mb-3"> 36 + <svg height="20" class="octicon octicon-location mr-2 v-align-middle" fill="#24292e" aria-label="Location" viewBox="0 0 12 16" version="1.1" width="15" role="img"><path fill-rule="evenodd" d="M6 0C2.69 0 0 2.5 0 5.5 0 10.02 6 16 6 16s6-5.98 6-10.5C12 2.5 9.31 0 6 0zm0 14.55C4.14 12.52 1 8.44 1 5.5 1 3.02 3.25 1 6 1c1.34 0 2.61.48 3.56 1.36.92.86 1.44 1.97 1.44 3.14 0 2.94-3.14 7.02-5 9.05zM8 5.5c0 1.11-.89 2-2 2-1.11 0-2-.89-2-2 0-1.11.89-2 2-2 1.11 0 2 .89 2 2z"/></svg> 37 37 Austin TX 38 38 </div> 39 39 40 + 40 41 </div> 41 - 42 + </div> 42 43 43 - <div > 44 - 45 - I have stuff to say here. 44 + <div class="col-md-7 col-lg-8 col-xl-9 px-4 py-6 px-lg-7"> 45 + <div class="mx-auto" style="max-width: 900px;"> 46 46 47 - 48 - </div> 47 + <div class="f4 mb-6"> 48 + 49 + I have stuff to say here. 49 50 50 - 51 - <div class="my-6"> 52 - <h2 >My Projects</h2> 51 + 52 + </div> 53 + 54 + 55 + <h2 >My Projects</h2> 53 56 <p class="f4 mb-4 text-gray">GitHub repositories that I've built.</p> 54 57 <div class="d-sm-flex flex-wrap gutter-condensed mb-4"> 55 58 ··· 167 170 168 171 </div> 169 172 170 - </div> 171 173 172 - <div class="my-6"> 173 - <h2 >My Interests</h2> 174 + <h2 >My Interests</h2> 174 175 <p class="f4 mb-4 text-gray">Topics that I want to learn more about.</p> 175 176 <div class="d-flex flex-wrap gutter-condensed mb-4"> 176 177 ··· 220 221 221 222 </div> 222 223 223 - </div> 224 224 225 - 226 - <div class="my-6"> 227 - <h2 >My Thoughts</h2> 225 + 226 + <h2 >My Thoughts</h2> 228 227 <p class="f4 mb-4 text-gray">Articles I've written.</p> 229 228 <div class="d-sm-flex flex-wrap gutter-condensed mb-4"> 230 229 ··· 244 243 245 244 </div> 246 245 247 - </div> 248 - 249 - 246 + 247 + 248 + </div> 249 + </div> 250 250 </div> 251 - 252 - 253 251 254 252 </body> 255 253 </html>
+1 -1
index.html
··· 1 1 --- 2 - layout: stacked 2 + layout: sidebar 3 3 --- 4 4 I have stuff to say here.