updated styles of the cookbook #12
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| # Sample workflow for building and deploying a Jekyll site to GitHub Pages | |
| name: Deploy Jekyll with GitHub Pages dependencies preinstalled | |
| on: | |
| # Runs on pushes targeting the default branch | |
| push: | |
| branches: ["main"] | |
| # Allows you to run this workflow manually from the Actions tab | |
| workflow_dispatch: | |
| # Sets permissions of the GITHUB_TOKEN to allow deployment to GitHub Pages | |
| permissions: | |
| contents: read | |
| pages: write | |
| id-token: write | |
| # Allow only one concurrent deployment, skipping runs queued between the run in-progress and latest queued. | |
| # However, do NOT cancel in-progress runs as we want to allow these production deployments to complete. | |
| concurrency: | |
| group: "pages" | |
| cancel-in-progress: false | |
| jobs: | |
| # Build job | |
| build: | |
| runs-on: ubuntu-latest | |
| steps: | |
| - name: Checkout | |
| uses: actions/checkout@v4 | |
| - name: Set up Python | |
| uses: actions/setup-python@v4 | |
| with: | |
| python-version: '3.x' | |
| - name: Install dependencies | |
| run: | | |
| python -m pip install --upgrade pip | |
| pip install markdown jinja2 | |
| - name: Convert Markdown to HTML | |
| run: | | |
| python <<EOF | |
| import markdown | |
| from jinja2 import Template | |
| import re | |
| # Read markdown file | |
| markdown_file_path = './Docs/MetaX_Cookbook.md' | |
| with open(markdown_file_path, 'r', encoding='utf-8') as file: | |
| markdown_content = file.read() | |
| # Remove # Contents and [TOC] | |
| markdown_content = markdown_content.replace('# Contents', '').replace('[TOC]', '') | |
| # Extract headings and generate table of contents | |
| headings = re.findall(r'^(#+) (.+)', markdown_content, re.MULTILINE) | |
| toc_items = [] | |
| for heading in headings: | |
| level = len(heading[0]) | |
| title = heading[1] | |
| anchor = re.sub(r'\W+', '-', title.lower()).strip('-') | |
| toc_items.append((level, title, anchor)) | |
| # Convert markdown to HTML | |
| html_content = markdown.markdown(markdown_content, extensions=['tables', 'toc']) | |
| # Add Bootstrap classes to tables and images | |
| html_content = re.sub(r'<img (.*?)>', r'<div style="text-align: center;"><img \1 class="img-fluid" style="max-width: 60%; min-width: 300px; height: auto; display: inline-block;"></div>', html_content) | |
| html_content = re.sub(r'<table>', r'<table class="table table-striped table-bordered">', html_content) | |
| # Jinja2 template for HTML output | |
| template = Template(''' | |
| <!DOCTYPE html> | |
| <html lang="en"> | |
| <head> | |
| <meta charset="UTF-8"> | |
| <meta name="viewport" content="width=device-width, initial-scale=1.0"> | |
| <title>MetaX</title> | |
| <link href="https://stackpath.bootstrapcdn.com/bootswatch/4.5.2/flatly/bootstrap.min.css" rel="stylesheet"> | |
| <style> | |
| body { | |
| display: flex; | |
| font-family: Arial, sans-serif; | |
| background-color: #f8f9fa; | |
| } | |
| nav { | |
| width: 250px; | |
| padding: 20px; | |
| background-color: #2c3e50; | |
| border-right: 1px solid #dee2e6; | |
| position: fixed; | |
| height: 100%; | |
| overflow-y: auto; | |
| } | |
| nav h2 { | |
| color: #ecf0f1; | |
| } | |
| nav a { | |
| display: block; | |
| padding: 8px 16px; | |
| color: #ecf0f1; | |
| text-decoration: none; | |
| } | |
| nav a:hover { | |
| background-color: #34495e; | |
| color: #ffffff; | |
| } | |
| main { | |
| flex: 1; | |
| padding: 20px; | |
| margin-left: 250px; | |
| overflow-y: auto; | |
| } | |
| h1, h2, h3, h4, h5, h6 { | |
| color: #2c3e50; | |
| } | |
| table { | |
| width: 100%; | |
| margin-bottom: 1rem; | |
| color: #212529; | |
| border-collapse: collapse; | |
| } | |
| table th, | |
| table td { | |
| padding: 0.75rem; | |
| vertical-align: top; | |
| border-top: 1px solid #dee2e6; | |
| } | |
| table thead th { | |
| vertical-align: bottom; | |
| border-bottom: 2px solid #dee2e6; | |
| } | |
| table tbody + tbody { | |
| border-top: 2px solid #dee2e6; | |
| } | |
| table .table { | |
| background-color: #fff; | |
| } | |
| </style> | |
| </head> | |
| <body> | |
| <nav> | |
| <h2>MetaX</h2> | |
| <ul class="nav flex-column"> | |
| {% for level, title, anchor in toc_items %} | |
| <li class="nav-item" style="margin-left: {{ (level - 1) * 20 }}px;"> | |
| <a class="nav-link" href="#{{ anchor }}">{{ title }}</a> | |
| </li> | |
| {% endfor %} | |
| </ul> | |
| </nav> | |
| <main> | |
| {{ content }} | |
| </main> | |
| <script src="https://code.jquery.com/jquery-3.5.1.slim.min.js"></script> | |
| <script src="https://cdn.jsdelivr.net/npm/@popperjs/core@2.9.2/dist/umd/popper.min.js"></script> | |
| <script src="https://stackpath.bootstrapcdn.com/bootstrap/4.5.2/js/bootstrap.min.js"></script> | |
| </body> | |
| </html> | |
| ''') | |
| # Render the template with the content and TOC items | |
| html_output = template.render(content=html_content, toc_items=toc_items) | |
| # Write the HTML output to a file | |
| output_file_path = './Docs/index.html' | |
| with open(output_file_path, 'w', encoding='utf-8') as file: | |
| file.write(html_output) | |
| print("HTML file has been generated successfully.") | |
| EOF | |
| - name: Setup Pages | |
| uses: actions/configure-pages@v5 | |
| - name: Build with Jekyll | |
| uses: actions/jekyll-build-pages@v1 | |
| with: | |
| source: ./Docs/ | |
| destination: ./_site | |
| - name: Upload artifact | |
| uses: actions/upload-pages-artifact@v3 | |
| # Deployment job | |
| deploy: | |
| environment: | |
| name: github-pages | |
| url: ${{ steps.deployment.outputs.page_url }} | |
| runs-on: ubuntu-latest | |
| needs: build | |
| steps: | |
| - name: Deploy to GitHub Pages | |
| id: deployment | |
| uses: actions/deploy-pages@v4 |