remove site

This commit is contained in:
Trevi Awater
2026-03-30 21:32:34 +02:00
parent d4949c7503
commit 0585ce0837
12 changed files with 0 additions and 1508 deletions

BIN
.DS_Store vendored Normal file

Binary file not shown.

BIN
.github/.DS_Store vendored Normal file

Binary file not shown.

BIN
.github/workflows/.DS_Store vendored Normal file

Binary file not shown.

View File

@@ -1,89 +0,0 @@
# GitHub Actions Workflows
This directory contains automated workflows for the PocketGraph project.
## Workflows
### 🚀 Deploy GitHub Pages (`deploy-pages.yml`)
**Purpose**: Automatically deploys the static website to GitHub Pages
**Triggers**:
- Push to `main` branch (when files in `/docs` change)
- Manual trigger via Actions tab
**What it does**:
1. Checks out the repository
2. Configures GitHub Pages
3. Uploads the `/docs` folder as an artifact
4. Deploys to GitHub Pages
**Permissions Required**:
- `contents: read`
- `pages: write`
- `id-token: write`
**Environment**: Deploys to `github-pages` environment
---
### ✅ Validate Website (`validate-site.yml`)
**Purpose**: Validates HTML and checks for broken links
**Triggers**:
- Pull requests that modify files in `/docs`
- Push to `main` branch (when files in `/docs` change)
**What it does**:
1. Validates HTML5 compliance
2. Checks all links for broken URLs
3. Reports errors if validation fails
---
## Setup Instructions
### First Time Setup
1. **Enable GitHub Pages with Actions**:
- Go to repository **Settings****Pages**
- Under "Source", select **GitHub Actions**
- Save
2. **Verify Workflows**:
- Go to the **Actions** tab
- You should see the workflows listed
- They will run automatically on the next push to `main`
### Manual Deployment
You can manually trigger a deployment:
1. Go to **Actions** tab
2. Select "Deploy GitHub Pages" workflow
3. Click "Run workflow"
4. Select branch (usually `main`)
5. Click "Run workflow"
## Monitoring
- **Status Badges**: The main README includes a status badge showing deployment status
- **Action Logs**: Click on any workflow run in the Actions tab to see detailed logs
- **Deployment URL**: After successful deployment, the site is available at `https://kl0070.github.io/xamarin-neo4j/`
## Troubleshooting
**Deployment fails with permission error**:
- Ensure GitHub Pages is enabled in repository settings
- Check that Actions have the required permissions
**Validation fails**:
- Check the validation logs for specific HTML errors
- Fix broken links identified by the link checker
**Site not updating**:
- Check the Actions tab for failed deployments
- Ensure changes were pushed to the `main` branch
- Clear browser cache and wait a few minutes for GitHub's CDN to update

View File

@@ -1,53 +0,0 @@
name: Deploy GitHub Pages
on:
# Runs on pushes targeting the default branch
push:
branches: ["main"]
paths:
- "docs/**"
- ".github/workflows/deploy-pages.yml"
# 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: Setup Pages
uses: actions/configure-pages@v4
- name: Upload artifact
uses: actions/upload-pages-artifact@v3
with:
# Upload docs directory
path: "./docs"
# 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

View File

@@ -1,28 +0,0 @@
name: Validate Website
on:
pull_request:
paths:
- "docs/**"
push:
branches: ["main"]
paths:
- "docs/**"
jobs:
validate:
runs-on: ubuntu-latest
steps:
- name: Checkout
uses: actions/checkout@v4
- name: Validate HTML
uses: Cyb3r-Jak3/html5validator-action@v7.2.0
with:
root: docs/
- name: Check links
uses: lycheeverse/lychee-action@v1
with:
args: --verbose --no-progress 'docs/**/*.html'
fail: true

View File

View File

@@ -1,88 +0,0 @@
# PocketGraph Website
This is the GitHub Pages website for PocketGraph - a Neo4j mobile client for iOS.
## Setup GitHub Pages
### Automatic Deployment (Recommended)
This repository includes GitHub Actions for automatic deployment! 🚀
1. Go to your repository **Settings** on GitHub
2. Navigate to **Pages** in the left sidebar
3. Under "Source", select **GitHub Actions**
4. That's it! The site will automatically deploy on every push to main
Your website will be available at: `https://kl0070.github.io/xamarin-neo4j/`
### Manual Setup (Alternative)
If you prefer manual deployment:
1. Go to your repository settings on GitHub
2. Navigate to **Pages** in the left sidebar
3. Under "Source", select the branch (usually `main`)
4. Set the folder to `/docs`
5. Click **Save**
## GitHub Actions Workflows
This project includes two workflows:
- **Deploy GitHub Pages** (`.github/workflows/deploy-pages.yml`)
- Automatically deploys the site when changes are pushed to `/docs`
- Can be manually triggered from the Actions tab
- **Validate Website** (`.github/workflows/validate-site.yml`)
- Validates HTML structure
- Checks for broken links
- Runs on pull requests and pushes
## Local Development
To preview the website locally:
1. Open `index.html` in your browser directly, or
2. Use a simple HTTP server:
```bash
# Using Python 3
cd docs
python3 -m http.server 8000
# Using Node.js (if you have http-server installed)
cd docs
npx http-server
```
Then open `http://localhost:8000` in your browser.
## Files
- `index.html` - Main landing page
- `css/style.css` - Stylesheet
- `images/` - Logo and graphics
- `logo.png` - PocketGraph logo
- `resoftware.png` - Re: Software logo
## Features
The website includes:
- 📱 Responsive design (mobile, tablet, desktop)
- 🎨 Beautiful gradient UI with iPhone mockups
- ⚡ Fast loading, pure HTML/CSS (no build step required)
- 🔗 Direct App Store download link
- 📊 Feature showcase with interactive cards
- 🖼️ Multiple iPhone mockups showing app screens
## Customization
To customize the website:
- **Colors**: Edit CSS variables in `css/style.css` (`:root` section)
- **Content**: Edit text directly in `index.html`
- **Images**: Replace files in `images/` folder
Enjoy!

View File

@@ -1,863 +0,0 @@
/* Reset and Base Styles */
* {
margin: 0;
padding: 0;
box-sizing: border-box;
}
:root {
--primary: #667eea;
--primary-dark: #5568d3;
--secondary: #764ba2;
--accent: #f093fb;
--text-primary: #1a202c;
--text-secondary: #4a5568;
--text-light: #718096;
--bg-white: #ffffff;
--bg-gray: #f7fafc;
--bg-dark: #1a202c;
--border: #e2e8f0;
--success: #48bb78;
--pink: #e53e8b;
}
html {
scroll-behavior: smooth;
}
body {
font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
color: var(--text-primary);
line-height: 1.6;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
}
.container {
max-width: 1200px;
margin: 0 auto;
padding: 0 20px;
}
/* Navigation */
.navbar {
position: fixed;
top: 0;
left: 0;
right: 0;
background: rgba(255, 255, 255, 0.95);
backdrop-filter: blur(10px);
border-bottom: 1px solid var(--border);
z-index: 1000;
padding: 1rem 0;
}
.nav-content {
display: flex;
justify-content: space-between;
align-items: center;
}
.logo {
display: flex;
align-items: center;
gap: 12px;
font-size: 1.5rem;
font-weight: 700;
color: var(--text-primary);
}
.logo-img {
width: 40px;
height: 40px;
object-fit: contain;
}
.nav-links {
display: flex;
align-items: center;
gap: 2rem;
}
.nav-link {
color: var(--text-secondary);
text-decoration: none;
font-weight: 500;
transition: color 0.3s ease;
}
.nav-link:hover {
color: var(--primary);
}
.btn-download-small {
background: linear-gradient(135deg, var(--primary), var(--secondary));
color: white;
padding: 0.5rem 1.5rem;
border-radius: 8px;
text-decoration: none;
font-weight: 600;
transition: transform 0.3s ease, box-shadow 0.3s ease;
}
.btn-download-small:hover {
transform: translateY(-2px);
box-shadow: 0 10px 25px rgba(102, 126, 234, 0.3);
}
/* Hero Section */
.hero {
padding: 120px 0 80px;
background: linear-gradient(135deg, #f5f7fa 0%, #c3cfe2 100%);
overflow: hidden;
}
.hero-content {
display: grid;
grid-template-columns: 1fr 1fr;
gap: 60px;
align-items: center;
}
.hero-title {
font-size: 3.5rem;
font-weight: 800;
line-height: 1.2;
margin-bottom: 1.5rem;
color: var(--text-primary);
}
.gradient-text {
background: linear-gradient(135deg, var(--primary), var(--secondary));
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
background-clip: text;
}
.hero-description {
font-size: 1.25rem;
color: var(--text-secondary);
margin-bottom: 2rem;
line-height: 1.7;
}
.hero-buttons {
display: flex;
gap: 1rem;
margin-bottom: 3rem;
flex-wrap: wrap;
}
.btn-primary {
display: inline-flex;
align-items: center;
gap: 10px;
background: linear-gradient(135deg, var(--primary), var(--secondary));
color: white;
padding: 1rem 2rem;
border-radius: 12px;
text-decoration: none;
font-weight: 600;
font-size: 1rem;
transition: transform 0.3s ease, box-shadow 0.3s ease;
box-shadow: 0 10px 30px rgba(102, 126, 234, 0.3);
}
.btn-primary:hover {
transform: translateY(-3px);
box-shadow: 0 15px 40px rgba(102, 126, 234, 0.4);
}
.btn-primary.btn-large {
padding: 1.25rem 2.5rem;
font-size: 1.1rem;
}
.btn-secondary {
display: inline-flex;
align-items: center;
gap: 10px;
background: white;
color: var(--text-primary);
padding: 1rem 2rem;
border-radius: 12px;
text-decoration: none;
font-weight: 600;
border: 2px solid var(--border);
transition: all 0.3s ease;
}
.btn-secondary:hover {
border-color: var(--primary);
color: var(--primary);
transform: translateY(-3px);
box-shadow: 0 10px 30px rgba(0, 0, 0, 0.1);
}
.apple-icon,
.github-icon {
width: 20px;
height: 20px;
}
.stats {
display: flex;
gap: 3rem;
}
.stat-item {
text-align: left;
}
.stat-number {
font-size: 1.75rem;
font-weight: 700;
color: var(--primary);
}
.stat-label {
font-size: 0.875rem;
color: var(--text-light);
text-transform: uppercase;
letter-spacing: 0.5px;
}
/* iPhone Mockup */
.hero-mockup {
position: relative;
display: flex;
justify-content: center;
align-items: center;
height: 600px;
}
.iphone-mockup {
position: relative;
z-index: 2;
}
.iphone-mockup.iphone-offset {
position: absolute;
right: -50px;
top: 80px;
z-index: 1;
opacity: 0.7;
}
.iphone-frame {
width: 280px;
height: 570px;
background: linear-gradient(145deg, #1a1a1a, #2d2d2d);
border-radius: 40px;
padding: 12px;
box-shadow:
0 30px 60px rgba(0, 0, 0, 0.3),
inset 0 0 0 1px rgba(255, 255, 255, 0.1);
position: relative;
}
.iphone-notch {
position: absolute;
top: 12px;
left: 50%;
transform: translateX(-50%);
width: 120px;
height: 25px;
background: #1a1a1a;
border-radius: 0 0 15px 15px;
z-index: 10;
}
.iphone-screen {
width: 100%;
height: 100%;
background: white;
border-radius: 32px;
overflow: hidden;
position: relative;
}
.mockup-content {
padding: 20px 15px;
height: 100%;
display: flex;
flex-direction: column;
}
.status-bar {
display: flex;
justify-content: space-between;
align-items: center;
font-size: 11px;
font-weight: 600;
margin-bottom: 15px;
padding: 0 10px;
}
.screen-header {
margin-bottom: 20px;
}
.screen-header h2 {
font-size: 28px;
font-weight: 700;
}
/* Connection List Mockup */
.connection-list {
display: flex;
flex-direction: column;
gap: 12px;
}
.connection-item {
background: #f7fafc;
padding: 12px;
border-radius: 12px;
display: flex;
align-items: center;
gap: 12px;
border: 2px solid transparent;
transition: all 0.3s ease;
}
.connection-item.active {
background: #edf2f7;
border-color: var(--primary);
}
.connection-icon {
font-size: 24px;
}
.connection-info {
flex: 1;
}
.connection-name {
font-weight: 600;
font-size: 14px;
margin-bottom: 2px;
}
.connection-url {
font-size: 11px;
color: var(--text-light);
font-family: 'Monaco', monospace;
}
.connection-status {
width: 10px;
height: 10px;
border-radius: 50%;
background: #cbd5e0;
}
.connection-status.connected {
background: var(--success);
box-shadow: 0 0 0 3px rgba(72, 187, 120, 0.2);
}
/* Query Editor Mockup */
.query-editor {
background: #1a202c;
padding: 15px;
border-radius: 8px;
font-family: 'Monaco', 'Courier New', monospace;
font-size: 12px;
margin-bottom: 15px;
}
.code-line {
color: #e2e8f0;
line-height: 1.8;
}
.keyword {
color: #667eea;
font-weight: 600;
}
.number {
color: #48bb78;
}
.query-results {
flex: 1;
display: flex;
flex-direction: column;
gap: 8px;
}
.result-row {
background: #f7fafc;
padding: 10px;
border-radius: 8px;
display: flex;
align-items: center;
gap: 10px;
font-size: 12px;
}
.node {
background: var(--primary);
color: white;
padding: 4px 10px;
border-radius: 12px;
font-size: 10px;
font-weight: 600;
}
/* Features Section */
.features {
padding: 100px 0;
background: white;
}
.section-header {
text-align: center;
margin-bottom: 60px;
}
.section-title {
font-size: 2.5rem;
font-weight: 800;
margin-bottom: 1rem;
}
.section-subtitle {
font-size: 1.25rem;
color: var(--text-secondary);
}
.features-grid {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
gap: 30px;
}
.feature-card {
background: var(--bg-gray);
padding: 40px 30px;
border-radius: 20px;
transition: transform 0.3s ease, box-shadow 0.3s ease;
border: 1px solid var(--border);
}
.feature-card:hover {
transform: translateY(-5px);
box-shadow: 0 20px 40px rgba(0, 0, 0, 0.1);
}
.feature-icon {
font-size: 3rem;
margin-bottom: 20px;
}
.feature-title {
font-size: 1.5rem;
font-weight: 700;
margin-bottom: 15px;
}
.feature-description {
color: var(--text-secondary);
line-height: 1.7;
}
/* Screenshots Section */
.screenshots {
padding: 100px 0;
background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
color: white;
}
.screenshots .section-title,
.screenshots .section-subtitle {
color: white;
}
.screenshot-showcase {
display: flex;
justify-content: center;
gap: 40px;
flex-wrap: wrap;
}
.showcase-item {
text-align: center;
}
.showcase-item h4 {
margin-top: 20px;
font-size: 1.1rem;
font-weight: 600;
}
.iphone-mini {
width: 200px;
}
.iphone-frame-mini {
background: linear-gradient(145deg, #1a1a1a, #2d2d2d);
border-radius: 30px;
padding: 10px;
box-shadow: 0 20px 40px rgba(0, 0, 0, 0.3);
}
.iphone-screen-mini {
width: 100%;
height: 380px;
background: white;
border-radius: 24px;
overflow: hidden;
position: relative;
padding: 15px;
}
/* Graph View */
.graph-view {
background: #1a202c;
}
.graph-nodes {
position: relative;
width: 100%;
height: 100%;
}
.graph-node {
position: absolute;
width: 40px;
height: 40px;
background: linear-gradient(135deg, var(--primary), var(--secondary));
border-radius: 50%;
box-shadow: 0 5px 15px rgba(102, 126, 234, 0.3);
}
.graph-edges {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
}
/* Table View */
.table-view {
padding: 10px;
}
.table-header {
display: grid;
grid-template-columns: 1fr 1fr;
background: var(--primary);
color: white;
padding: 10px;
border-radius: 8px 8px 0 0;
font-weight: 600;
font-size: 12px;
}
.table-row {
display: grid;
grid-template-columns: 1fr 1fr;
padding: 10px;
border-bottom: 1px solid var(--border);
font-size: 12px;
}
.table-cell {
padding: 5px;
}
/* Settings View */
.settings-view {
padding: 10px;
}
.settings-group {
background: white;
border-radius: 12px;
overflow: hidden;
}
.settings-item {
display: flex;
align-items: center;
gap: 12px;
padding: 15px;
border-bottom: 1px solid var(--border);
font-size: 14px;
}
.settings-item:last-child {
border-bottom: none;
}
.settings-item span:first-child {
font-size: 20px;
}
.settings-item span:nth-child(2) {
flex: 1;
}
.toggle {
width: 40px;
height: 24px;
background: #cbd5e0;
border-radius: 12px;
position: relative;
transition: background 0.3s ease;
}
.toggle::after {
content: '';
position: absolute;
width: 20px;
height: 20px;
background: white;
border-radius: 50%;
top: 2px;
left: 2px;
transition: transform 0.3s ease;
}
.toggle.on {
background: var(--primary);
}
.toggle.on::after {
transform: translateX(16px);
}
.arrow {
color: var(--text-light);
font-size: 20px;
}
/* CTA Section */
.cta {
padding: 100px 0;
background: linear-gradient(135deg, #f5f7fa 0%, #c3cfe2 100%);
text-align: center;
}
.cta-content {
max-width: 700px;
margin: 0 auto;
}
.cta-title {
font-size: 3rem;
font-weight: 800;
margin-bottom: 1.5rem;
}
.cta-description {
font-size: 1.25rem;
color: var(--text-secondary);
margin-bottom: 2.5rem;
}
.cta-note {
margin-top: 1.5rem;
color: var(--text-light);
font-size: 0.875rem;
}
/* About Section */
.about {
padding: 100px 0;
background: white;
}
.about-content {
display: grid;
grid-template-columns: 1.5fr 1fr;
gap: 60px;
align-items: start;
}
.about-text p {
font-size: 1.125rem;
color: var(--text-secondary);
line-height: 1.8;
margin-bottom: 1.5rem;
}
.about-logo {
margin-top: 2rem;
}
.resoftware-logo {
max-width: 250px;
height: auto;
}
.tech-stack h3 {
font-size: 1.5rem;
margin-bottom: 1.5rem;
}
.tech-tags {
display: flex;
flex-wrap: wrap;
gap: 10px;
}
.tech-tag {
background: linear-gradient(135deg, var(--primary), var(--secondary));
color: white;
padding: 8px 16px;
border-radius: 20px;
font-size: 0.875rem;
font-weight: 600;
}
/* Footer */
.footer {
background: var(--bg-dark);
color: white;
padding: 60px 0 30px;
}
.footer-content {
display: flex;
flex-direction: column;
align-items: center;
gap: 30px;
text-align: center;
}
.footer-logo {
display: flex;
align-items: center;
gap: 12px;
font-size: 1.5rem;
font-weight: 700;
}
.footer-logo-img {
width: 40px;
height: 40px;
object-fit: contain;
}
.footer-links {
display: flex;
gap: 30px;
}
.footer-link {
color: rgba(255, 255, 255, 0.8);
text-decoration: none;
transition: color 0.3s ease;
}
.footer-link:hover {
color: white;
}
.footer-note {
color: rgba(255, 255, 255, 0.6);
font-size: 0.875rem;
}
.footer-note p {
margin: 5px 0;
}
/* Responsive Design */
@media (max-width: 968px) {
.hero-content {
grid-template-columns: 1fr;
text-align: center;
}
.hero-title {
font-size: 2.5rem;
}
.hero-mockup {
justify-content: center;
height: 500px;
}
.iphone-mockup.iphone-offset {
display: none;
}
.hero-buttons {
justify-content: center;
}
.stats {
justify-content: center;
}
.about-content {
grid-template-columns: 1fr;
}
.nav-links {
gap: 1rem;
}
.nav-link {
display: none;
}
}
@media (max-width: 640px) {
.hero-title {
font-size: 2rem;
}
.hero-description {
font-size: 1rem;
}
.section-title {
font-size: 2rem;
}
.cta-title {
font-size: 2rem;
}
.features-grid {
grid-template-columns: 1fr;
}
.screenshot-showcase {
flex-direction: column;
align-items: center;
}
.hero-buttons {
flex-direction: column;
width: 100%;
}
.btn-primary,
.btn-secondary {
width: 100%;
justify-content: center;
}
.stats {
gap: 1.5rem;
}
.iphone-frame {
width: 240px;
height: 490px;
}
.hero-mockup {
height: 450px;
}
}

Binary file not shown.

Before

Width:  |  Height:  |  Size: 14 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 63 KiB

View File

@@ -1,387 +0,0 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta name="description" content="PocketGraph - Your powerful Neo4j graph database client for iOS and iPad">
<meta name="keywords" content="Neo4j, iOS, iPad, graph database, Cypher, mobile app">
<meta name="author" content="Re: Software B.V.">
<!-- Open Graph / Social Media -->
<meta property="og:type" content="website">
<meta property="og:title" content="PocketGraph - Neo4j Mobile Client">
<meta property="og:description" content="Connect to your Neo4j instance via the lightning fast Bolt protocol. Visualize your nodes and relationships on the go.">
<title>PocketGraph - Neo4j Mobile Client for iOS</title>
<link rel="stylesheet" href="css/style.css">
<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700;800&display=swap" rel="stylesheet">
</head>
<body>
<!-- Navigation -->
<nav class="navbar">
<div class="container">
<div class="nav-content">
<div class="logo">
<img src="images/logo.png" alt="PocketGraph Logo" class="logo-img">
<span class="logo-text">PocketGraph</span>
</div>
<div class="nav-links">
<a href="#features" class="nav-link">Features</a>
<a href="#about" class="nav-link">About</a>
<a href="https://apps.apple.com/nl/app/pocketgraph/id1604368926" class="btn-download-small">Download</a>
</div>
</div>
</div>
</nav>
<!-- Hero Section -->
<section class="hero">
<div class="container">
<div class="hero-content">
<div class="hero-text">
<h1 class="hero-title">
Your Neo4j Database,
<span class="gradient-text">Anywhere</span>
</h1>
<p class="hero-description">
Connect to your Neo4j instance via the lightning-fast Bolt protocol.
Visualize graphs, execute queries, and manage your data—all from your iPhone or iPad.
</p>
<div class="hero-buttons">
<a href="https://apps.apple.com/nl/app/pocketgraph/id1604368926" class="btn-primary">
<svg class="apple-icon" viewBox="0 0 24 24" fill="currentColor">
<path d="M17.05 20.28c-.98.95-2.05.88-3.08.4-1.09-.5-2.08-.48-3.24 0-1.44.62-2.2.44-3.06-.4C2.79 15.25 3.51 7.59 9.05 7.31c1.35.07 2.29.74 3.08.8 1.18-.24 2.31-.93 3.57-.84 1.51.12 2.65.72 3.4 1.8-3.12 1.87-2.38 5.98.48 7.13-.57 1.5-1.31 2.99-2.54 4.09l.01-.01zM12.03 7.25c-.15-2.23 1.66-4.07 3.74-4.25.29 2.58-2.34 4.5-3.74 4.25z"/>
</svg>
Download on the App Store
</a>
<a href="https://github.com/kl0070/xamarin-neo4j" class="btn-secondary">
<svg class="github-icon" viewBox="0 0 24 24" fill="currentColor">
<path d="M12 2C6.477 2 2 6.477 2 12c0 4.42 2.865 8.17 6.839 9.49.5.092.682-.217.682-.482 0-.237-.008-.866-.013-1.7-2.782.603-3.369-1.34-3.369-1.34-.454-1.156-1.11-1.463-1.11-1.463-.908-.62.069-.608.069-.608 1.003.07 1.531 1.03 1.531 1.03.892 1.529 2.341 1.087 2.91.831.092-.646.35-1.086.636-1.336-2.22-.253-4.555-1.11-4.555-4.943 0-1.091.39-1.984 1.029-2.683-.103-.253-.446-1.27.098-2.647 0 0 .84-.269 2.75 1.025A9.578 9.578 0 0112 6.836c.85.004 1.705.114 2.504.336 1.909-1.294 2.747-1.025 2.747-1.025.546 1.377.203 2.394.1 2.647.64.699 1.028 1.592 1.028 2.683 0 3.842-2.339 4.687-4.566 4.935.359.309.678.919.678 1.852 0 1.336-.012 2.415-.012 2.743 0 .267.18.578.688.48C19.138 20.167 22 16.418 22 12c0-5.523-4.477-10-10-10z"/>
</svg>
View on GitHub
</a>
</div>
<div class="stats">
<div class="stat-item">
<div class="stat-number">14.2+</div>
<div class="stat-label">iOS Version</div>
</div>
<div class="stat-item">
<div class="stat-number">SSL</div>
<div class="stat-label">Encrypted</div>
</div>
<div class="stat-item">
<div class="stat-number">Bolt</div>
<div class="stat-label">Protocol</div>
</div>
</div>
</div>
<div class="hero-mockup">
<div class="iphone-mockup">
<div class="iphone-frame">
<div class="iphone-notch"></div>
<div class="iphone-screen">
<div class="mockup-content connections">
<div class="status-bar">
<span>9:41</span>
<div class="status-icons"></div>
</div>
<div class="screen-header">
<h2>Connections</h2>
</div>
<div class="connection-list">
<div class="connection-item active">
<div class="connection-icon">🔗</div>
<div class="connection-info">
<div class="connection-name">Production DB</div>
<div class="connection-url">bolt://prod.neo4j.io:7687</div>
</div>
<div class="connection-status connected"></div>
</div>
<div class="connection-item">
<div class="connection-icon">🔗</div>
<div class="connection-info">
<div class="connection-name">Development</div>
<div class="connection-url">bolt://dev.local:7687</div>
</div>
</div>
<div class="connection-item">
<div class="connection-icon">🔗</div>
<div class="connection-info">
<div class="connection-name">Test Instance</div>
<div class="connection-url">bolt://test.neo4j.io:7687</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="iphone-mockup iphone-offset">
<div class="iphone-frame">
<div class="iphone-notch"></div>
<div class="iphone-screen">
<div class="mockup-content query">
<div class="status-bar">
<span>9:41</span>
<div class="status-icons"></div>
</div>
<div class="screen-header">
<h2>Query Editor</h2>
</div>
<div class="query-editor">
<div class="code-line">
<span class="keyword">MATCH</span> (n:Person)
</div>
<div class="code-line">
<span class="keyword">WHERE</span> n.age > <span class="number">25</span>
</div>
<div class="code-line">
<span class="keyword">RETURN</span> n
</div>
</div>
<div class="query-results">
<div class="result-row">
<div class="node">Person</div>
<span>Alice, 28</span>
</div>
<div class="result-row">
<div class="node">Person</div>
<span>Bob, 32</span>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</section>
<!-- Features Section -->
<section id="features" class="features">
<div class="container">
<div class="section-header">
<h2 class="section-title">Powerful Features</h2>
<p class="section-subtitle">Everything you need to manage Neo4j databases on your mobile device</p>
</div>
<div class="features-grid">
<div class="feature-card">
<div class="feature-icon">🔐</div>
<h3 class="feature-title">Secure Connections</h3>
<p class="feature-description">
Connect via the lightning-fast Bolt protocol with SSL/TLS encryption.
Manage multiple connections and switch between databases effortlessly.
</p>
</div>
<div class="feature-card">
<div class="feature-icon">📊</div>
<h3 class="feature-title">Interactive Visualization</h3>
<p class="feature-description">
View your graph data in stunning interactive visualizations.
Explore nodes and relationships with intuitive touch gestures.
</p>
</div>
<div class="feature-card">
<div class="feature-icon">✍️</div>
<h3 class="feature-title">Advanced Query Editor</h3>
<p class="feature-description">
Write Cypher queries with syntax highlighting. Save and organize your queries
for quick access. View results in graph or table format.
</p>
</div>
<div class="feature-card">
<div class="feature-icon">🎨</div>
<h3 class="feature-title">Beautiful Interface</h3>
<p class="feature-description">
Modern, intuitive design with light and dark themes.
Optimized for both iPhone and iPad with responsive layouts.
</p>
</div>
<div class="feature-card">
<div class="feature-icon">📱</div>
<h3 class="feature-title">Universal App</h3>
<p class="feature-description">
Works seamlessly across iPhone, iPad, Apple Silicon Mac, and Apple Vision Pro.
One app for all your devices.
</p>
</div>
<div class="feature-card">
<div class="feature-icon">🔒</div>
<h3 class="feature-title">Privacy First</h3>
<p class="feature-description">
No data collection. All connections and queries are stored locally on your device.
Your data stays yours.
</p>
</div>
</div>
</div>
</section>
<!-- Screenshots Section -->
<section class="screenshots">
<div class="container">
<div class="section-header">
<h2 class="section-title">See It In Action</h2>
<p class="section-subtitle">Manage your Neo4j databases with an elegant, powerful interface</p>
</div>
<div class="screenshot-showcase">
<div class="showcase-item">
<div class="iphone-mini">
<div class="iphone-frame-mini">
<div class="iphone-screen-mini graph-view">
<div class="graph-nodes">
<div class="graph-node" style="top: 20%; left: 30%;"></div>
<div class="graph-node" style="top: 50%; left: 20%;"></div>
<div class="graph-node" style="top: 60%; left: 50%;"></div>
<div class="graph-node" style="top: 30%; left: 70%;"></div>
<svg class="graph-edges">
<line x1="30%" y1="20%" x2="20%" y2="50%" stroke="#667eea" stroke-width="2"/>
<line x1="30%" y1="20%" x2="70%" y2="30%" stroke="#667eea" stroke-width="2"/>
<line x1="20%" y1="50%" x2="50%" y2="60%" stroke="#667eea" stroke-width="2"/>
<line x1="50%" y1="60%" x2="70%" y2="30%" stroke="#667eea" stroke-width="2"/>
</svg>
</div>
</div>
</div>
</div>
<h4>Graph Visualization</h4>
</div>
<div class="showcase-item">
<div class="iphone-mini">
<div class="iphone-frame-mini">
<div class="iphone-screen-mini table-view">
<div class="table-header">
<div class="table-cell">Name</div>
<div class="table-cell">Type</div>
</div>
<div class="table-row">
<div class="table-cell">Alice</div>
<div class="table-cell">Person</div>
</div>
<div class="table-row">
<div class="table-cell">Bob</div>
<div class="table-cell">Person</div>
</div>
<div class="table-row">
<div class="table-cell">Carol</div>
<div class="table-cell">Person</div>
</div>
</div>
</div>
</div>
<h4>Table View</h4>
</div>
<div class="showcase-item">
<div class="iphone-mini">
<div class="iphone-frame-mini">
<div class="iphone-screen-mini settings-view">
<div class="settings-group">
<div class="settings-item">
<span>🌙</span>
<span>Dark Mode</span>
<div class="toggle on"></div>
</div>
<div class="settings-item">
<span>🔔</span>
<span>Notifications</span>
<div class="toggle"></div>
</div>
<div class="settings-item">
<span>⚙️</span>
<span>Advanced</span>
<span class="arrow"></span>
</div>
</div>
</div>
</div>
</div>
<h4>Settings</h4>
</div>
</div>
</div>
</section>
<!-- CTA Section -->
<section class="cta">
<div class="container">
<div class="cta-content">
<h2 class="cta-title">Ready to Get Started?</h2>
<p class="cta-description">
Download PocketGraph today and take your Neo4j databases with you wherever you go.
</p>
<a href="https://apps.apple.com/nl/app/pocketgraph/id1604368926" class="btn-primary btn-large">
<svg class="apple-icon" viewBox="0 0 24 24" fill="currentColor">
<path d="M17.05 20.28c-.98.95-2.05.88-3.08.4-1.09-.5-2.08-.48-3.24 0-1.44.62-2.2.44-3.06-.4C2.79 15.25 3.51 7.59 9.05 7.31c1.35.07 2.29.74 3.08.8 1.18-.24 2.31-.93 3.57-.84 1.51.12 2.65.72 3.4 1.8-3.12 1.87-2.38 5.98.48 7.13-.57 1.5-1.31 2.99-2.54 4.09l.01-.01zM12.03 7.25c-.15-2.23 1.66-4.07 3.74-4.25.29 2.58-2.34 4.5-3.74 4.25z"/>
</svg>
Download on the App Store
</a>
<p class="cta-note">Requires iOS 14.2 or later • Universal App</p>
</div>
</div>
</section>
<!-- About Section -->
<section id="about" class="about">
<div class="container">
<div class="about-content">
<div class="about-text">
<h2 class="section-title">About PocketGraph</h2>
<p>
PocketGraph is developed by <strong>Re: Software B.V.</strong>, a software company
dedicated to creating professional mobile applications for developers and data professionals.
</p>
<p>
Built with Xamarin.Forms and optimized for iOS, PocketGraph brings the power of
Neo4j graph databases to your mobile device with an intuitive, native interface.
</p>
<div class="about-logo">
<img src="images/resoftware.png" alt="Re: Software" class="resoftware-logo">
</div>
</div>
<div class="tech-stack">
<h3>Built With</h3>
<div class="tech-tags">
<span class="tech-tag">Xamarin.Forms</span>
<span class="tech-tag">C#</span>
<span class="tech-tag">Neo4j Bolt Protocol</span>
<span class="tech-tag">XAML</span>
<span class="tech-tag">Neovis.js</span>
<span class="tech-tag">iOS SDK</span>
</div>
</div>
</div>
</div>
</section>
<!-- Footer -->
<footer class="footer">
<div class="container">
<div class="footer-content">
<div class="footer-logo">
<img src="images/logo.png" alt="PocketGraph Logo" class="footer-logo-img">
<span class="footer-logo-text">PocketGraph</span>
</div>
<div class="footer-links">
<a href="https://apps.apple.com/nl/app/pocketgraph/id1604368926" class="footer-link">App Store</a>
<a href="https://github.com/kl0070/xamarin-neo4j" class="footer-link">GitHub</a>
<a href="mailto:info@resoftware.nl" class="footer-link">Support</a>
</div>
<div class="footer-note">
<p>
Neo4j® and Cypher® are registered trademarks of Neo4j, Inc.
</p>
<p>
© 2024 Re: Software B.V. All rights reserved.
</p>
</div>
</div>
</div>
</footer>
</body>
</html>