diff --git a/_config.yml b/_config.yml index b712ee8..c8356d8 100644 --- a/_config.yml +++ b/_config.yml @@ -177,6 +177,7 @@ enable_navbar_social: false # enables displaying social links in the # navbar on the about page enable_project_categories: true # enables categorization of projects into # multiple categories +enable_medium_zoom: true # enables image zoom feature (as on medium.com) # ----------------------------------------------------------------------------- # Library versions @@ -209,3 +210,6 @@ mdb: popper: version: "2.4.4" integrity: "sha512-eUQ9hGdLjBjY3F41CScH3UX+4JDSI9zXeroz7hJ+RteoCaY+GP/LDoM8AO+Pt+DRFw3nXqsjh9Zsts8hnYv8/A==" +medium_zoom: + version: "1.0.6" + integrity: "sha256-EdPgYcPk/IIrw7FYeuJQexva49pVRZNmt3LculEr7zM=" diff --git a/_includes/head.html b/_includes/head.html index e4693df..7899067 100644 --- a/_includes/head.html +++ b/_includes/head.html @@ -32,7 +32,6 @@ {% endif %} - @@ -40,21 +39,20 @@ {% if site.enable_darkmode %} - - + {% endif %} {% if site.enable_google_analytics %} - - - + + gtag('config', '{{ site.google_analytics }}'); + {% endif %} {% if site.enable_panelbear_analytics %} diff --git a/_includes/scripts/misc.html b/_includes/scripts/misc.html index 08dece9..260ce1b 100644 --- a/_includes/scripts/misc.html +++ b/_includes/scripts/misc.html @@ -5,6 +5,11 @@ $(function () {$('[data-toggle="tooltip"]').tooltip()}) {% endif %} +{% if site.enable_medium_zoom %} + + + +{% endif %} diff --git a/_posts/2015-05-15-images.md b/_posts/2015-05-15-images.md index c1dd486..8668e0d 100644 --- a/_posts/2015-05-15-images.md +++ b/_posts/2015-05-15-images.md @@ -4,14 +4,12 @@ title: a post with images date: 2015-05-15 21:01:00 description: this is what included images could look like --- -Jean shorts raw denim Vice normcore, art party High Life PBR skateboard stumptown vinyl kitsch. Fingerstache four loko meh 8-bit, tousled banh mi tilde forage Schlitz dreamcatcher twee 3 wolf moon. Chambray asymmetrical paleo salvia, sartorial umami four loko master cleanse drinking vinegar brunch. +This is an example post with image galleries.
-
-
@@ -19,25 +17,30 @@ Jean shorts raw denim Vice normcore, art party High Life PBR skateboard stumptow
A simple, elegant caption looks good between image rows, after each row, or doesn't have to be there at all.
-
-
- -
-
- -
-
-Slow-carb four dollar toast Helvetica pop-up. Kale chips next level literally trust fund Pitchfork. Jean shorts Pinterest beard, farm-to-table irony craft beer swag tofu 8-bit Banksy. Quinoa forage fanny pack, pug hashtag Echo Park heirloom Schlitz tote bag artisan Neutra mumblecore 90's shabby chic raw denim. +Images can be made zoomable. +Simply add `data-zoomable` to `` tags that you want to make zoomable.
- +
- -
-
- +
+ +The rest of the images in this post are all zoomable, arranged into different mini-galleries. + +
+
+ +
+
+ +
+
+ +
+
+ diff --git a/_posts/2020-09-28-twitter.md b/_posts/2020-09-28-twitter.md index be9ea9d..edba12e 100644 --- a/_posts/2020-09-28-twitter.md +++ b/_posts/2020-09-28-twitter.md @@ -6,21 +6,13 @@ description: an example of a blog post with twitter --- A sample blog page that demonstrates the inclusion of Tweets/Timelines/etc. -
- # Tweet -An example of displaying a tweet : +An example of displaying a tweet: {% twitter https://twitter.com/rubygems/status/518821243320287232 %} -
-
-
-
+ # Timeline -An example of pulling from a timeline : +An example of pulling from a timeline: {% twitter https://twitter.com/jekyllrb maxwidth=500 limit=3 %} -
-
-
-
+ # Additional Details -For more details on using the plugin visit : https://github.com/red-data-tools/jekyll-jupyter-notebook \ No newline at end of file +For more details on using the plugin visit: [jekyll-twitter-plugin](https://github.com/rob-murray/jekyll-twitter-plugin){:target="\_blank"} diff --git a/_sass/_base.scss b/_sass/_base.scss index 2dd1dc7..c367438 100644 --- a/_sass/_base.scss +++ b/_sass/_base.scss @@ -8,6 +8,10 @@ p, h1, h2, h3, h4, h5, h6, em, div, span, strong { color: var(--global-text-color); } +article div { + margin-bottom: 1rem; +} + a, table.table a { color: var(--global-theme-color); &:hover { diff --git a/assets/js/zoom.js b/assets/js/zoom.js new file mode 100644 index 0000000..c499858 --- /dev/null +++ b/assets/js/zoom.js @@ -0,0 +1,8 @@ + +$(document).ready(function() { + mediumZoom('[data-zoomable]', { + margin: 100, + background: getComputedStyle(document.documentElement) + .getPropertyValue('--global-bg-color') + 'ee', + }) +});