Syntax Highlighting Test

This is a test page to verify that syntax highlighting is working correctly.

Python Code Example

def binary_search(arr, target):
    left = 0
    right = len(arr) - 1
    
    while left <= right:
        mid = (left + right) // 2
        
        if arr[mid] == target:
            return mid
        elif arr[mid] < target:
            left = mid + 1
        else:
            right = mid - 1
    
    return -1

# Example usage
numbers = [1, 3, 5, 7, 9, 11, 13, 15]
result = binary_search(numbers, 7)
print(f"Found at index: {result}")

JavaScript Code Example

function quickSort(arr) {
    if (arr.length <= 1) {
        return arr;
    }
    
    const pivot = arr[Math.floor(arr.length / 2)];
    const left = arr.filter(x => x < pivot);
    const middle = arr.filter(x => x === pivot);
    const right = arr.filter(x => x > pivot);
    
    return [...quickSort(left), ...middle, ...quickSort(right)];
}

// Test the function
const unsorted = [3, 6, 8, 10, 1, 2, 1];
const sorted = quickSort(unsorted);
console.log('Sorted array:', sorted);

Java Code Example

public class BubbleSort {
    public static void bubbleSort(int[] arr) {
        int n = arr.length;
        for (int i = 0; i < n - 1; i++) {
            for (int j = 0; j < n - i - 1; j++) {
                if (arr[j] > arr[j + 1]) {
                    // Swap arr[j] and arr[j+1]
                    int temp = arr[j];
                    arr[j] = arr[j + 1];
                    arr[j + 1] = temp;
                }
            }
        }
    }
    
    public static void main(String[] args) {
        int[] arr = {64, 34, 25, 12, 22, 11, 90};
        bubbleSort(arr);
        System.out.println("Sorted array:");
        for (int value : arr) {
            System.out.print(value + " ");
        }
    }
}

CSS Example

.code-block {
    background: #0d1117;
    border: 1px solid #30363d;
    border-radius: 6px;
    padding: 1rem;
    margin: 1rem 0;
    overflow-x: auto;
}

.code-block pre {
    margin: 0;
    font-family: 'SF Mono', Monaco, 'Cascadia Code', 'Roboto Mono', monospace;
    font-size: 14px;
    line-height: 1.45;
}

.code-block code {
    color: #e1e4e8;
    background: transparent;
}

C++ Example

#include <iostream>
#include <vector>
using namespace std;

void merge(vector<int>& arr, int left, int mid, int right) {
    int n1 = mid - left + 1;
    int n2 = right - mid;
    
    vector<int> L(n1), R(n2);
    
    for (int i = 0; i < n1; i++)
        L[i] = arr[left + i];
    for (int j = 0; j < n2; j++)
        R[j] = arr[mid + 1 + j];
    
    int i = 0, j = 0, k = left;
    
    while (i < n1 && j < n2) {
        if (L[i] <= R[j]) {
            arr[k] = L[i];
            i++;
        } else {
            arr[k] = R[j];
            j++;
        }
        k++;
    }
}

int main() {
    vector<int> arr = {12, 11, 13, 5, 6, 7};
    cout << "Given array: ";
    for (int x : arr) cout << x << " ";
    cout << endl;
    
    return 0;
}

Inline Code Example

You can also use inline code like const x = 42 or let result = calculate() within sentences.

Testing Colors

Here are some syntax elements that should be colored:

• Keywords: if, else, while, for, function, class
• Strings: "Hello, World!", 'Single quotes'
• Numbers: 42, 3.14, 0xFF
• Comments: // This is a comment, /* Multi-line comment */
• Functions: console.log(), print(), System.out.println()

Summary

If the syntax highlighting is working correctly, you should see:

• Dark background for code blocks
• Colored syntax (keywords in red/orange, strings in blue, etc.)
• Proper monospace font
• Good readability with proper contrast

The code blocks should look professional and be easy to read!