diff --git a/_config.yml b/_config.yml index 60b2b85..610c62f 100644 --- a/_config.yml +++ b/_config.yml @@ -134,6 +134,9 @@ plugins: - jekyll-twitter-plugin - jemoji +# Extras +github: [metadata] + # ----------------------------------------------------------------------------- # Jekyll Scholar # ----------------------------------------------------------------------------- @@ -169,7 +172,7 @@ enable_mansory: true enable_math: true enable_tooltips: false enable_darkmode: true -show_social_icons: false +enable_navbar_social: false # ----------------------------------------------------------------------------- # Library versions diff --git a/_includes/header.html b/_includes/header.html index f169efc..0712951 100644 --- a/_includes/header.html +++ b/_includes/header.html @@ -7,9 +7,9 @@ {% if site.title == "blank" %}{{ site.first_name }} {{ site.middle_name }} {{ site.last_name }}{% else %}{{ site.title }}{% endif %} - {% elsif site.show_social_icons %} + {% elsif site.enable_navbar_social %} -
+
{% include social.html %}
{% endif %} diff --git a/_includes/social.html b/_includes/social.html index d440b69..4d967a7 100644 --- a/_includes/social.html +++ b/_includes/social.html @@ -1,18 +1,16 @@ - - {% if site.email %}{% endif %} - {% if site.orcid_id %}{% endif %} - {% if site.scholar_userid %}{% endif %} - {% if site.publons_id %}{% endif %} - {% if site.research_gate_profile %}{% endif %} - {% if site.github_username %}{% endif %} - {% if site.linkedin_username %}{% endif %} - {% if site.twitter_username %}{% endif %} - {% if site.medium_username %}{% endif %} - {% if site.quora_username %}{% endif %} - {% if site.blogger_url %}{% endif %} - {% if site.work_url %}{% endif %} - {% if site.wikidata_id %}{% endif %} - {% if site.strava_userid %}{% endif %} - {% if site.keybase_username %}{% endif %} - {% if site.gitlab_username %}{% endif %} - +{% if site.email %}{% endif %} +{% if site.orcid_id %}{% endif %} +{% if site.scholar_userid %}{% endif %} +{% if site.publons_id %}{% endif %} +{% if site.research_gate_profile %}{% endif %} +{% if site.github_username %}{% endif %} +{% if site.linkedin_username %}{% endif %} +{% if site.twitter_username %}{% endif %} +{% if site.medium_username %}{% endif %} +{% if site.quora_username %}{% endif %} +{% if site.blogger_url %}{% endif %} +{% if site.work_url %}{% endif %} +{% if site.wikidata_id %}{% endif %} +{% if site.strava_userid %}{% endif %} +{% if site.keybase_username %}{% endif %} +{% if site.gitlab_username %}{% endif %} diff --git a/_layouts/about.html b/_layouts/about.html index 6f33cfd..bb3b6b1 100644 --- a/_layouts/about.html +++ b/_layouts/about.html @@ -39,7 +39,9 @@ layout: default {% if page.social %}
- {% include social.html %} +
+ {% include social.html %} +
{{ site.contact_note }}
{% endif %} diff --git a/_posts/2018-12-22-distill.md b/_posts/2018-12-22-distill.md index 7041f32..d368f04 100644 --- a/_posts/2018-12-22-distill.md +++ b/_posts/2018-12-22-distill.md @@ -40,6 +40,11 @@ _styles: > --- +**NOTE:** +Citations, footnotes, and code blocks do not display correctly in the dark mode since distill does not support the dark mode by default. +If you are interested in correctly adding dark mode support for distill, please open [a discussion](https://github.com/alshedivat/al-folio/discussions) and let us know. + + ## Equations This theme supports rendering beautiful math in inline and display modes using [MathJax 3](https://www.mathjax.org/){:target="\_blank"} engine. @@ -92,6 +97,16 @@ For larger blocks of code, add a `block` attribute: } +**Note:** `` blocks do not look well in the dark mode. +You can always use the default code-highlight using the `highlight` liquid tag: + +{% highlight javascript %} +var x = 25; +function(x) { + return x * x; +} +{% endhighlight %} + *** ## Layouts diff --git a/_sass/_base.scss b/_sass/_base.scss index eed4dcf..ade1d28 100644 --- a/_sass/_base.scss +++ b/_sass/_base.scss @@ -35,6 +35,10 @@ a, table.table a { text-align: center; } +// Citation +.citation, .citation-number { + color: var(--global-theme-color); +} // Profile @@ -81,11 +85,10 @@ a, table.table a { .navbar { box-shadow: none; border-bottom: 1px solid $grey-color-light; - opacity: 0.95; background-color: var(--global-bg-color); + opacity: 0.95; } .navbar.navbar-light { - // Remove link decoration a { &:hover { text-decoration: none; @@ -108,11 +111,19 @@ a, table.table a { color: var(--global-hover-color); } } - .contact-icon { - font-size: 2rem; + .navbar-brand.social { + padding-bottom: 0; + padding-top: 0; + font-size: 1.7rem; a { + i::before { + color: var(--global-text-color); + -webkit-transition: all 0.2s ease-in-out; + } &:hover { - color: var(--global-hover-color); + i::before { + color: var(--global-theme-color); + } } } } @@ -123,7 +134,7 @@ a, table.table a { display: block; width: 22px; height: 2px; - background-color: var(--global-icon-color); + background-color: var(--global-text-color); border-radius: 1px; margin-bottom: 4px; transition: all 0.2s; @@ -169,12 +180,17 @@ a, table.table a { .social { text-align: center; - .contact-icon { + .contact-icons { font-size: 4rem; a { - color: var(--global-icon-color); + i::before { + color: var(--global-text-color); + -webkit-transition: all 0.2s ease-in-out; + } &:hover { - color: var(--global-theme-color); + i::before { + color: var(--global-theme-color); + } } } } @@ -196,7 +212,7 @@ footer.fixed-bottom { a { color: var(--global-footer-link-color); &:hover { - color: pink; + color: var(--global-theme-color); text-decoration: none; } } @@ -233,7 +249,7 @@ footer.sticky-bottom { padding-top: 2rem; padding-bottom: 2rem; .post-meta { - color: $grey-color; + color: var(--global-text-color-light); font-size: 0.875rem; margin-bottom: 0; } @@ -289,8 +305,13 @@ footer.sticky-bottom { } } } - .card img { - width: 100%; + .card { + img { + width: 100%; + } + .card-title { + color: $black-color; + } } } @@ -417,9 +438,30 @@ footer.sticky-bottom { } // Rouge Color Customization +figure.highlight { + margin: 0 0 1rem; +} + +pre { + color: var(--global-theme-color); + background-color: var(--global-code-bg-color); + border-radius: 6px; + padding: 6px 12px; + pre, code { + background-color: transparent; + border-radius: 0; + padding: 0; + } +} + code { color: var(--global-theme-color); + background-color: var(--global-code-bg-color); + border-radius: 3px; + padding: 3px 3px; } + + // Transitioning Themes html.transition, html.transition *, diff --git a/_sass/_distill.scss b/_sass/_distill.scss new file mode 100644 index 0000000..d902106 --- /dev/null +++ b/_sass/_distill.scss @@ -0,0 +1,45 @@ +/******************************************************************************* + * Style overrides for distill blog posts. + ******************************************************************************/ + +d-byline { + border-top-color: $grey-color-light !important; +} + +d-byline h3 { + color: var(--global-text-color) !important; +} + +d-byline a, d-article d-byline a { + color: var(--global-text-color) !important; + &:hover { + color: var(--global-hover-color) !important; + } +} + +d-article { + border-top-color: #e8e8e8 !important; + a, p, h1, h2, h3, h4, h5, h6 { + color: var(--global-text-color) !important; + } + a, h1, h2, hr { + border-bottom-color: $grey-color-light !important; + } + a:hover { + border-bottom-color: var(--global-hover-color) !important; + } +} + +d-appendix { + border-top-color: $grey-color-light !important; + color: var(--global-distill-app-color) !important; + h3, li, span { + color: var(--global-distill-app-color) !important; + } + a, a.footnote-backlink { + color: var(--global-distill-app-color) !important; + &:hover { + color: var(--global-hover-color) !important; + } + } +} diff --git a/_sass/_themes.scss b/_sass/_themes.scss index 8c9bf65..4b480d6 100644 --- a/_sass/_themes.scss +++ b/_sass/_themes.scss @@ -4,13 +4,15 @@ :root { --global-bg-color: #{$white-color}; + --global-code-bg-color: #{$code-bg-color-light}; --global-text-color: #{$black-color}; + --global-text-color-light: #{$grey-color}; --global-theme-color: #{$purple-color}; - --global-hover-color: #{$light-purple-color}; + --global-hover-color: #{$purple-color}; --global-footer-bg-color: #{$grey-color-dark}; --global-footer-text-color: #{$grey-color-light}; --global-footer-link-color: #{$white-color}; - --global-icon-color: #{$grey-color-dark}; + --global-distill-app-color: #{$grey-color}; .fa-sun { display : none; @@ -24,13 +26,15 @@ html[data-theme='dark'] { --global-bg-color: #{$grey-color-dark}; + --global-code-bg-color: #{$code-bg-color-dark}; --global-text-color: #{$grey-color-light}; + --global-text-color-light: #{$grey-color-light}; --global-theme-color: #{$cyan-color}; - --global-hover-color: #{$light-cyan-color}; + --global-hover-color: #{$cyan-color}; --global-footer-bg-color: #{$grey-color-light}; --global-footer-text-color: #{$grey-color-dark}; --global-footer-link-color: #{$black-color}; - --global-icon-color: navajowhite; + --global-distill-app-color: #{$grey-color-light}; .fa-sun { padding-left: 10px; diff --git a/_sass/_variables.scss b/_sass/_variables.scss index a6c3725..2a2cd7f 100644 --- a/_sass/_variables.scss +++ b/_sass/_variables.scss @@ -4,7 +4,6 @@ ******************************************************************************/ - // Colors $red-color: #FF3636 !default; $red-color-dark: #B71C1C !default; @@ -30,3 +29,10 @@ $grey-color-dark: darken($grey-color, 25%); $white-color: #ffffff !default; $black-color: #000000 !default; + + +// Theme colors + +$code-bg-color-light: rgba($purple-color, 0.05); +$code-bg-color-dark: #2c3237 !default; + diff --git a/assets/bibliography/2018-12-22-distill.bib b/assets/bibliography/2018-12-22-distill.bib index 5ca3565..2b06f3c 100644 --- a/assets/bibliography/2018-12-22-distill.bib +++ b/assets/bibliography/2018-12-22-distill.bib @@ -1,7 +1,7 @@ @article{gregor2015draw, title={DRAW: A recurrent neural network for image generation}, author={Gregor, Karol and Danihelka, Ivo and Graves, Alex and Rezende, Danilo Jimenez and Wierstra, Daan}, - journal={arXivreprint arXiv:1502.04623}, + journal={arXiv preprint, arXiv:1502.04623}, year={2015}, url={https://arxiv.org/pdf/1502.04623.pdf} } diff --git a/assets/css/main.scss b/assets/css/main.scss index 934b6d3..18b3b18 100644 --- a/assets/css/main.scss +++ b/assets/css/main.scss @@ -10,5 +10,6 @@ $max-content-width: {{site.max_width}}; "variables", "themes", "layout", - "base" + "base", + "distill" ;