From 4d388ecf9edbb52afd823476db5a0dfc7bff1837 Mon Sep 17 00:00:00 2001 From: Mike-FreeAI <145850829+Mike-FreeAI@users.noreply.github.com> Date: Mon, 8 Jul 2024 10:30:42 +0100 Subject: [PATCH] Add dark mode and publish to GitHub Pages using GitHub Actions --- .github/workflows/publish.yml | 33 +++++++++++++++++++++++ README.md | 8 ++++++ _config.yml | 8 ++++++ _layouts/default.html | 51 +++++++++++++++++++++++++++++++++++ 4 files changed, 100 insertions(+) create mode 100644 .github/workflows/publish.yml diff --git a/.github/workflows/publish.yml b/.github/workflows/publish.yml new file mode 100644 index 0000000..d14fbff --- /dev/null +++ b/.github/workflows/publish.yml @@ -0,0 +1,33 @@ +name: Publish to GitHub Pages + +on: + push: + branches: + - main + +jobs: + build: + runs-on: ubuntu-latest + + steps: + - name: Checkout repository + uses: actions/checkout@v2 + + - name: Set up Ruby + uses: actions/setup-ruby@v1 + with: + ruby-version: '2.7' + + - name: Install dependencies + run: | + gem install bundler + bundle install + + - name: Build site + run: bundle exec jekyll build + + - name: Deploy to GitHub Pages + uses: peaceiris/actions-gh-pages@v3 + with: + github_token: ${{ secrets.GITHUB_TOKEN }} + publish_dir: ./_site diff --git a/README.md b/README.md index 3a0463d..1d59908 100644 --- a/README.md +++ b/README.md @@ -94,6 +94,14 @@ The _unofficial_ ChatGPT desktop application provides a convenient way to access --- +## Dark Mode Implementation + +We have implemented a dark mode for this repository to enhance your reading experience. The dark mode is implemented using CSS variables and a toggle button. You can switch between light and dark modes by clicking the toggle button. + +## GitHub Pages Deployment using GitHub Actions + +We have set up a GitHub Actions workflow to automatically publish this repository to GitHub Pages. This workflow ensures that the latest changes are always available on the GitHub Pages site. You can find the workflow configuration in the `.github/workflows/publish.yml` file. + # Prompts ## ChatGPT SEO prompts diff --git a/_config.yml b/_config.yml index 37c2dff..f2f07ea 100644 --- a/_config.yml +++ b/_config.yml @@ -1,2 +1,10 @@ name: Awesome ChatGPT Prompts title: null + +# Dark mode configuration +dark_mode: true + +# GitHub Pages configuration +github_pages: + url: "https://.github.io/" + branch: "gh-pages" diff --git a/_layouts/default.html b/_layouts/default.html index 4e224cf..e361a00 100644 --- a/_layouts/default.html +++ b/_layouts/default.html @@ -7,10 +7,45 @@ {% seo %} + {% include head-custom.html %} +
{% if site.title and site.title != page.title %}

{{ site.title }}

@@ -47,6 +82,22 @@ }, false); x.previousElementSibling.previousElementSibling.prepend(button); }); + + function toggleDarkMode() { + const body = document.body; + body.classList.toggle('dark-mode'); + const isDarkMode = body.classList.contains('dark-mode'); + localStorage.setItem('dark-mode', isDarkMode); + document.querySelector('.dark-mode-toggle').textContent = isDarkMode ? '🌙' : '🌞'; + } + + document.addEventListener('DOMContentLoaded', () => { + const isDarkMode = localStorage.getItem('dark-mode') === 'true'; + if (isDarkMode) { + document.body.classList.add('dark-mode'); + document.querySelector('.dark-mode-toggle').textContent = '🌙'; + } + });