### Description
This PR adds a Google Calendar integration feature as described in issue
#872. Users can embed their own calendar using an iframe configured via
`_config.yml`, and the calendar is toggleable through a responsive
button. This component is styled to visually blend into the theme and
supports responsive display across desktop and mobile.
### Changes
- Added `calendar.liquid` in `_includes`
- Modified `about.md` to include the toggleable calendar block
- Introduced `calendar` config section in `_config.yml`
- Appended calendar-related styles in `_sass/_base.scss`
### Configuration
To enable this feature, add the following to `_config.yml`:
```yaml
calendar:
enabled: true
calendar_id: your_calendar_id@group.calendar.google.com
timezone: UTC
style: "border:0; width:100%; height:600px;"
---------
Signed-off-by: George Araújo <george.gcac@gmail.com>
Co-authored-by: dodo <349507644@qq.com>
Co-authored-by: George <31376482+george-gca@users.noreply.github.com>
Co-authored-by: George Araújo <george.gcac@gmail.com>
This reverts PR #2962. The inline script here is exactly the same as the
`/assets/js/google-analytics-setup.js` sourced on the following line, so
Google Analytics is being triggered twice.
It seems that #2962 originally added this because liquid templating of
the setup script didn't work (#3095). However, this was then properly
fixed in #3117.
Implementation of Google tag ID to correctly getting tracked requires
further modification in addition to the one line script in the
`_includes/scripts.liquid` file as
```
<script async src="https://www.googletagmanager.com/gtag/js?id={{ site.google_analytics }}"></script>
<script>
window.dataLayer = window.dataLayer || [];
function gtag() {
dataLayer.push(arguments);
}
gtag('js', new Date());
gtag('config', '{{ site.google_analytics }}');
</script>
```
I have made the changes and tested it out on my personal webpage to
ensure the tracking in analytics dashboard.