diff --git a/_config.yml b/_config.yml index 42e7f64..d9684ed 100644 --- a/_config.yml +++ b/_config.yml @@ -105,6 +105,7 @@ facebook_id: # your facebook id youtube_id: # your youtube channel id (youtube.com/@) discord_id: # your discord id (18-digit unique numerical identifier) zotero_username: # your zotero username +wechat_qr: # filename of your wechat qr-code saved as an image (e.g., wechat-qr.png if saved to assets/img/wechat-qr.png) contact_note: > You can even add a little note about which of these is the best way to reach you. @@ -425,4 +426,4 @@ jsonresume: - skills - languages - interests - - references \ No newline at end of file + - references diff --git a/_includes/scripts/wechatModal.html b/_includes/scripts/wechatModal.html new file mode 100644 index 0000000..23d81d1 --- /dev/null +++ b/_includes/scripts/wechatModal.html @@ -0,0 +1,20 @@ +{% if site.wechat_qr %} + + + + + +{% endif %} \ No newline at end of file diff --git a/_includes/social.html b/_includes/social.html index e6aa719..9131de6 100644 --- a/_includes/social.html +++ b/_includes/social.html @@ -109,3 +109,10 @@ {%- if site.rss_icon -%} {% endif %} + {%- if site.wechat_qr -%} + +
+ WeChat QR +
+ {% include scripts/wechatModal.html %} + {% endif %} diff --git a/_layouts/default.html b/_layouts/default.html index 252a05d..38aca32 100644 --- a/_layouts/default.html +++ b/_layouts/default.html @@ -58,5 +58,6 @@ {% include scripts/mathjax.html %} {% include scripts/analytics.html %} {% include scripts/progressBar.html %} + {% include scripts/wechatModal.html %} diff --git a/_sass/_base.scss b/_sass/_base.scss index 0e7f0fc..bbc216f 100644 --- a/_sass/_base.scss +++ b/_sass/_base.scss @@ -326,6 +326,36 @@ blockquote { } } +.wechat-modal { + display: none; + position: fixed; + z-index: 1; + padding-top: 100px; + left: 0; + top: 0; + width: 100%; + height: 100%; + overflow: auto; + background-color: rgb(0,0,0); + background-color: rgba(0,0,0,0.8); +} + +.wechat-modal > img { + display: block; + position: relative; + top: 50%; + left: 50%; + width: 33%; + max-width: 400px; + transform: translate(-50%, -50%); +} + +@media only screen and (max-width: 400px){ + .wechat-modal > img { + width: 100%; + } +} + // Footer footer.fixed-bottom {