Add initial setup for Gallus_Pub_v1 with Astro

This commit includes a README detailing the Astro starter kit setup and an autogenerated package-lock.json. The setup uses the minimal Astro template, with dependencies like Astro 5.11.0 installed to kickstart the project.

.idea/.gitignore

@@ -0,0 +1,8 @@
+# Default ignored files
+/shelf/
+/workspace.xml
+# Editor-based HTTP Client requests
+/httpRequests/
+# Datasource local storage ignored files
+/dataSources/
+/dataSources.local.xml

.idea/Gallus_Pub.iml

@@ -0,0 +1,12 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<module type="WEB_MODULE" version="4">
+  <component name="NewModuleRootManager">
+    <content url="file://$MODULE_DIR$">
+      <excludeFolder url="file://$MODULE_DIR$/.tmp" />
+      <excludeFolder url="file://$MODULE_DIR$/temp" />
+      <excludeFolder url="file://$MODULE_DIR$/tmp" />
+    </content>
+    <orderEntry type="inheritedJdk" />
+    <orderEntry type="sourceFolder" forTests="false" />
+  </component>
+</module>

.idea/modules.xml

@@ -0,0 +1,8 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<project version="4">
+  <component name="ProjectModuleManager">
+    <modules>
+      <module fileurl="file://$PROJECT_DIR$/.idea/Gallus_Pub.iml" filepath="$PROJECT_DIR$/.idea/Gallus_Pub.iml" />
+    </modules>
+  </component>
+</project>

.idea/vcs.xml

@@ -0,0 +1,6 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<project version="4">
+  <component name="VcsDirectoryMappings">
+    <mapping directory="" vcs="Git" />
+  </component>
+</project>

Gallus_Pub/.gitignore

@@ -0,0 +1,37 @@
+# Learn more https://docs.github.com/en/get-started/getting-started-with-git/ignoring-files
+
+# dependencies
+node_modules/
+
+# Expo
+.expo/
+dist/
+web-build/
+expo-env.d.ts
+
+# Native
+.kotlin/
+*.orig.*
+*.jks
+*.p8
+*.p12
+*.key
+*.mobileprovision
+
+# Metro
+.metro-health-check*
+
+# debug
+npm-debug.*
+yarn-debug.*
+yarn-error.*
+
+# macOS
+.DS_Store
+*.pem
+
+# local env files
+.env*.local
+
+# typescript
+*.tsbuildinfo

Gallus_Pub/App.tsx

@@ -0,0 +1,28 @@
+import React from 'react';
+import { BrowserRouter, Routes, Route } from 'react-router-dom';
+import { View } from 'react-native';
+import LoginScreen from './src/pages/LoginPage';
+import AdminScreen from './src/pages/AdminPage';
+import HomeScreen from './src/pages/HomePage';
+import ProtectedRoute from './src/components/ProtectedRoute';
+import { AuthProvider } from './src/AuthContext';
+
+export default function App() {
+  return (
+    <AuthProvider>
+      <BrowserRouter>
+        <View style={{ flex: 1 }}>
+          <Routes>
+            <Route path="/" element={<HomeScreen />} />
+            <Route path="/admin/login" element={<LoginScreen />} />
+            <Route path="/admin" element={
+              <ProtectedRoute>
+                <AdminScreen />
+              </ProtectedRoute>
+            } />
+          </Routes>
+        </View>
+      </BrowserRouter>
+    </AuthProvider>
+  );
+}

Gallus_Pub/app.json

@@ -0,0 +1,29 @@
+{
+  "expo": {
+    "name": "Gallus_Pub",
+    "slug": "Gallus_Pub",
+    "version": "1.0.0",
+    "orientation": "portrait",
+    "icon": "./assets/icon.png",
+    "userInterfaceStyle": "light",
+    "newArchEnabled": true,
+    "splash": {
+      "image": "./assets/splash-icon.png",
+      "resizeMode": "contain",
+      "backgroundColor": "#ffffff"
+    },
+    "ios": {
+      "supportsTablet": true
+    },
+    "android": {
+      "adaptiveIcon": {
+        "foregroundImage": "./assets/adaptive-icon.png",
+        "backgroundColor": "#ffffff"
+      },
+      "edgeToEdgeEnabled": true
+    },
+    "web": {
+      "favicon": "./assets/favicon.png"
+    }
+  }
+}

Gallus_Pub/index.ts

@@ -0,0 +1,8 @@
+import { registerRootComponent } from 'expo';
+
+import App from './App';
+
+// registerRootComponent calls AppRegistry.registerComponent('main', () => App);
+// It also ensures that whether you load the app in Expo Go or in a native build,
+// the environment is set up appropriately
+registerRootComponent(App);

Gallus_Pub/package.json

@@ -0,0 +1,27 @@
+{
+  "name": "gallus_pub",
+  "version": "1.0.0",
+  "main": "index.ts",
+  "scripts": {
+    "start": "expo start",
+    "android": "expo start --android",
+    "ios": "expo start --ios",
+    "web": "expo start --web"
+  },
+  "dependencies": {
+    "@expo/metro-runtime": "~5.0.4",
+    "expo": "~53.0.9",
+    "expo-status-bar": "~2.2.3",
+    "react": "19.0.0",
+    "react-native": "0.79.2",
+    "react-native-web": "^0.20.0",
+    "react-router-dom": "^7.6.0",
+    "react-dom": "19.0.0"
+  },
+  "devDependencies": {
+    "@babel/core": "^7.25.2",
+    "@types/react": "~19.0.10",
+    "typescript": "~5.8.3"
+  },
+  "private": true
+}

Gallus_Pub/src/AuthContext.tsx

@@ -0,0 +1,44 @@
+import React, { createContext, useState, useContext, ReactNode } from 'react';
+
+type AuthContextType = {
+  isAdmin: boolean;
+  login: (username: string, password: string) => Promise<void>;
+  logout: () => void;
+};
+
+const AuthContext = createContext<AuthContextType | null>(null);
+
+export const AuthProvider = ({ children }: { children: ReactNode }) => {
+  const [isAdmin, setIsAdmin] = useState(false);
+
+  const login = async (username: string, password: string) => {
+    // Hier würden Sie normalerweise API-Anfragen machen, um die Anmeldedaten zu überprüfen
+    // Einfache Validierung für das Beispiel:
+    if (username === 'admin' && password === 'password') {
+      setIsAdmin(true);
+      // In einer echten Anwendung würden Sie hier einen Token im localStorage speichern
+      localStorage.setItem('isAdmin', 'true');
+      return;
+    }
+    throw new Error('Falsche Anmeldedaten');
+  };
+
+  const logout = () => {
+    setIsAdmin(false);
+    localStorage.removeItem('isAdmin');
+  };
+
+  return (
+    <AuthContext.Provider value={{ isAdmin, login, logout }}>
+      {children}
+    </AuthContext.Provider>
+  );
+};
+
+export const useAuth = () => {
+  const context = useContext(AuthContext);
+  if (!context) {
+    throw new Error('useAuth muss innerhalb eines AuthProviders verwendet werden');
+  }
+  return context;
+};

Gallus_Pub/src/components/ProtectedRoute.tsx

@@ -0,0 +1,20 @@
+import React from 'react';
+import { Navigate } from 'react-router-dom';
+import { useAuth } from '../AuthContext';
+
+type ProtectedRouteProps = {
+  children: React.ReactNode;
+};
+
+const ProtectedRoute: React.FC<ProtectedRouteProps> = ({ children }) => {
+  const { isAdmin } = useAuth();
+  
+  if (!isAdmin) {
+    // Wenn nicht angemeldet, zur Login-Seite umleiten
+    return <Navigate to="/admin/login" replace />;
+  }
+
+  return <>{children}</>;
+};
+
+export default ProtectedRoute;

Gallus_Pub/src/pages/AdminPage.tsx

@@ -0,0 +1,35 @@
+import React from 'react';
+import { useAuth } from '../AuthContext';
+
+const AdminPage: React.FC = () => {
+  const { logout } = useAuth();
+
+  return (
+    <div style={styles.container}>
+      <h1>Admin</h1>
+      <p>Willkommen im Admin-Bereich! Hier können Sie Ihr Gallus Pub verwalten.</p>
+      <button onClick={logout} style={styles.button}>Abmelden</button>
+    </div>
+  );
+};
+
+const styles = {
+  container: {
+    maxWidth: '800px',
+    margin: '50px auto',
+    padding: '20px',
+    boxShadow: '0 0 10px rgba(0,0,0,0.1)',
+    borderRadius: '5px',
+  },
+  button: {
+    padding: '10px',
+    backgroundColor: '#f44336',
+    color: 'white',
+    border: 'none',
+    borderRadius: '3px',
+    cursor: 'pointer',
+    marginTop: '20px',
+  }
+};
+
+export default AdminPage;

Gallus_Pub/src/pages/HomePage.tsx

@@ -0,0 +1,23 @@
+import React from 'react';
+import { View, Text, StyleSheet } from 'react-native';
+
+export default function HomeScreen() {
+  return (
+    <View style={styles.container}>
+      <Text style={styles.title}>Willkommen bei Gallus Pub</Text>
+    </View>
+  );
+}
+
+const styles = StyleSheet.create({
+  container: {
+    flex: 1,
+    justifyContent: 'center',
+    alignItems: 'center',
+    padding: 20,
+  },
+  title: {
+    fontSize: 24,
+    fontWeight: 'bold',
+  },
+});

Gallus_Pub/src/pages/LoginPage.tsx

@@ -0,0 +1,93 @@
+import React, { useState } from 'react';
+import { useNavigate } from 'react-router-dom';
+import { useAuth } from '../AuthContext';
+
+const LoginPage: React.FC = () => {
+  const [username, setUsername] = useState('');
+  const [password, setPassword] = useState('');
+  const [error, setError] = useState('');
+  const { login } = useAuth();
+  const navigate = useNavigate();
+
+  const handleSubmit = async (e: React.FormEvent) => {
+    e.preventDefault();
+    setError('');
+    
+    try {
+      await login(username, password);
+      navigate('/admin');
+    } catch (err) {
+      setError('Anmeldung fehlgeschlagen. Bitte überprüfen Sie Ihre Anmeldedaten.');
+    }
+  };
+
+  return (
+    <div style={styles.container}>
+      <h2>Admin-Login</h2>
+      {error && <p style={styles.error}>{error}</p>}
+      <form onSubmit={handleSubmit} style={styles.form}>
+        <div style={styles.inputGroup}>
+          <label htmlFor="username">Benutzername:</label>
+          <input
+            type="text"
+            id="username"
+            value={username}
+            onChange={(e) => setUsername(e.target.value)}
+            style={styles.input}
+            required
+          />
+        </div>
+        <div style={styles.inputGroup}>
+          <label htmlFor="password">Passwort:</label>
+          <input
+            type="password"
+            id="password"
+            value={password}
+            onChange={(e) => setPassword(e.target.value)}
+            style={styles.input}
+            required
+          />
+        </div>
+        <button type="submit" style={styles.button}>Anmelden</button>
+      </form>
+    </div>
+  );
+};
+
+const styles = {
+  container: {
+    maxWidth: '400px',
+    margin: '100px auto',
+    padding: '20px',
+    boxShadow: '0 0 10px rgba(0,0,0,0.1)',
+    borderRadius: '5px',
+  },
+  form: {
+    display: 'flex',
+    flexDirection: 'column' as 'column',
+  },
+  inputGroup: {
+    marginBottom: '15px',
+  },
+  input: {
+    width: '100%',
+    padding: '10px',
+    borderRadius: '3px',
+    border: '1px solid #ddd',
+    marginTop: '5px',
+  },
+  button: {
+    padding: '10px',
+    backgroundColor: '#4CAF50',
+    color: 'white',
+    border: 'none',
+    borderRadius: '3px',
+    cursor: 'pointer',
+  },
+  error: {
+    color: 'red',
+    marginBottom: '15px',
+  }
+};
+
+export default LoginPage;

Gallus_Pub/tsconfig.json

@@ -0,0 +1,6 @@
+{
+  "extends": "expo/tsconfig.base",
+  "compilerOptions": {
+    "strict": true
+  }
+}

Gallus_Pub_v1/.gitignore

@@ -0,0 +1,24 @@
+# build output
+dist/
+# generated types
+.astro/
+
+# dependencies
+node_modules/
+
+# logs
+npm-debug.log*
+yarn-debug.log*
+yarn-error.log*
+pnpm-debug.log*
+
+
+# environment variables
+.env
+.env.production
+
+# macOS-specific files
+.DS_Store
+
+# jetbrains setting folder
+.idea/

Gallus_Pub_v1/.vscode/extensions.json

@@ -0,0 +1,4 @@
+{
+  "recommendations": ["astro-build.astro-vscode"],
+  "unwantedRecommendations": []
+}

Gallus_Pub_v1/.vscode/launch.json

@@ -0,0 +1,11 @@
+{
+  "version": "0.2.0",
+  "configurations": [
+    {
+      "command": "./node_modules/.bin/astro dev",
+      "name": "Development server",
+      "request": "launch",
+      "type": "node-terminal"
+    }
+  ]
+}

Gallus_Pub_v1/README.md

@@ -0,0 +1,47 @@
+# Astro Starter Kit: Minimal
+
+```sh
+npm create astro@latest -- --template minimal
+```
+
+[![Open in StackBlitz](https://developer.stackblitz.com/img/open_in_stackblitz.svg)](https://stackblitz.com/github/withastro/astro/tree/latest/examples/minimal)
+[![Open with CodeSandbox](https://assets.codesandbox.io/github/button-edit-lime.svg)](https://codesandbox.io/p/sandbox/github/withastro/astro/tree/latest/examples/minimal)
+[![Open in GitHub Codespaces](https://github.com/codespaces/badge.svg)](https://codespaces.new/withastro/astro?devcontainer_path=.devcontainer/minimal/devcontainer.json)
+
+> 🧑‍🚀 **Seasoned astronaut?** Delete this file. Have fun!
+
+## 🚀 Project Structure
+
+Inside of your Astro project, you'll see the following folders and files:
+
+```text
+/
+├── public/
+├── src/
+│   └── pages/
+│       └── index.astro
+└── package.json
+```
+
+Astro looks for `.astro` or `.md` files in the `src/pages/` directory. Each page is exposed as a route based on its file name.
+
+There's nothing special about `src/components/`, but that's where we like to put any Astro/React/Vue/Svelte/Preact components.
+
+Any static assets, like images, can be placed in the `public/` directory.
+
+## 🧞 Commands
+
+All commands are run from the root of the project, from a terminal:
+
+| Command                   | Action                                           |
+| :------------------------ | :----------------------------------------------- |
+| `npm install`             | Installs dependencies                            |
+| `npm run dev`             | Starts local dev server at `localhost:4321`      |
+| `npm run build`           | Build your production site to `./dist/`          |
+| `npm run preview`         | Preview your build locally, before deploying     |
+| `npm run astro ...`       | Run CLI commands like `astro add`, `astro check` |
+| `npm run astro -- --help` | Get help using the Astro CLI                     |
+
+## 👀 Want to learn more?
+
+Feel free to check [our documentation](https://docs.astro.build) or jump into our [Discord server](https://astro.build/chat).

Gallus_Pub_v1/astro.config.mjs

@@ -0,0 +1,5 @@
+// @ts-check
+import { defineConfig } from 'astro/config';
+
+// https://astro.build/config
+export default defineConfig({});

Gallus_Pub_v1/package.json

@@ -0,0 +1,14 @@
+{
+  "name": "gallus-pub-v1",
+  "type": "module",
+  "version": "0.0.1",
+  "scripts": {
+    "dev": "astro dev",
+    "build": "astro build",
+    "preview": "astro preview",
+    "astro": "astro"
+  },
+  "dependencies": {
+    "astro": "^5.11.0"
+  }
+}

Gallus_Pub_v1/public/favicon.svg

@@ -0,0 +1,9 @@
+<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 128 128">
+    <path d="M50.4 78.5a75.1 75.1 0 0 0-28.5 6.9l24.2-65.7c.7-2 1.9-3.2 3.4-3.2h29c1.5 0 2.7 1.2 3.4 3.2l24.2 65.7s-11.6-7-28.5-7L67 45.5c-.4-1.7-1.6-2.8-2.9-2.8-1.3 0-2.5 1.1-2.9 2.7L50.4 78.5Zm-1.1 28.2Zm-4.2-20.2c-2 6.6-.6 15.8 4.2 20.2a17.5 17.5 0 0 1 .2-.7 5.5 5.5 0 0 1 5.7-4.5c2.8.1 4.3 1.5 4.7 4.7.2 1.1.2 2.3.2 3.5v.4c0 2.7.7 5.2 2.2 7.4a13 13 0 0 0 5.7 4.9v-.3l-.2-.3c-1.8-5.6-.5-9.5 4.4-12.8l1.5-1a73 73 0 0 0 3.2-2.2 16 16 0 0 0 6.8-11.4c.3-2 .1-4-.6-6l-.8.6-1.6 1a37 37 0 0 1-22.4 2.7c-5-.7-9.7-2-13.2-6.2Z" />
+    <style>
+        path { fill: #000; }
+        @media (prefers-color-scheme: dark) {
+            path { fill: #FFF; }
+        }
+    </style>
+</svg>

Gallus_Pub_v1/src/components/Footer.astro

@@ -0,0 +1,17 @@
+---
+
+---
+<!-- components/Footer.astro -->
+<footer>
+    <p>&copy; 2024 Meine Webseite. Alle Rechte vorbehalten.</p>
+</footer>
+
+<style>
+  footer {
+    background-color: #333;
+    color: #fff;
+    text-align: center;
+    padding: 1rem;
+    margin-top: auto;
+  }
+</style>

Gallus_Pub_v1/src/components/Header.astro

@@ -0,0 +1,71 @@
+<!-- components/Header.astro -->
+<header>
+	<div class="header-container">
+		<div class="logo-container">
+			<a href="/">
+				<img src="/images/Logo.png" alt="Logo" class="logo">
+			</a>
+		</div>
+		<nav>
+			<ul>
+				<li><a href="/">Startseite</a></li>
+				<li><a href="/contact">Kontakt</a></li>
+				<li><a href="/about">About</a></li>
+			</ul>
+		</nav>
+	</div>
+</header>
+
+<style>
+	header {
+		background-color: #3C2A26;
+		color: #ffffff;
+		padding: 1rem;
+		position: fixed;
+		top: 0;
+		left: 0;
+		right: 0;
+		z-index: 100;
+		box-shadow: 0 2px 5px rgba(0,0,0,0.1);
+	}
+	
+	.header-container {
+		display: flex;
+		justify-content: space-between;
+		align-items: center;
+		max-width: 1200px;
+		margin: 0 auto;
+		width: 100%;
+	}
+	
+	nav ul {
+		display: flex;
+		list-style: none;
+		gap: 1.5rem;
+	}
+	
+	nav a {
+		color: #fff;
+		text-decoration: none;
+		font-weight: bold;
+	}
+	
+	nav a:hover {
+		color: #ddd;
+	}
+	
+	.logo-container {
+		display: flex;
+		align-items: center;
+	}
+	
+	.logo {
+		height: 40px;
+		width: auto;
+		transition: transform 0.3s ease;
+	}
+	
+	.logo:hover {
+		transform: scale(1.05);
+	}
+</style>

Gallus_Pub_v1/src/pages/index.astro

@@ -0,0 +1,32 @@
+---
+import Header from '../components/Header.astro';
+import Footer from '../components/Footer.astro';
+import '../../styles/index.css'
+---
+
+<html lang="de">
+<body>
+<Header />
+
+<main>
+	<h1>Willkommen auf meiner Webseite</h1>
+	<p>Dies ist der Hauptinhalt der Seite.</p>
+
+	<div class="content-container">
+		<h2>Abschnitt mit besserem Kontrast</h2>
+		<p>Dieser Text ist durch den halbtransparenten Hintergrund besser lesbar.</p>
+	</div>
+
+	<div style="height: 100vh; margin: 2rem 0;">
+		<h2>Abschnitt 1</h2>
+		<p>Inhalt zum Scrollen...</p>
+	</div>
+
+	<div class="content-container">
+		<h2>Abschnitt 2</h2>
+		<p>Mehr Inhalt zum Scrollen...</p>
+	</div>
+</main>
+<Footer />
+</body>
+</html>

Gallus_Pub_v1/styles/index.css

@@ -0,0 +1,92 @@
+* {
+    margin: 0;
+    padding: 0;
+    box-sizing: border-box;
+}
+
+body {
+    font-family: Arial, sans-serif;
+    line-height: 1.6;
+    display: flex;
+    flex-direction: column;
+    min-height: 100vh;
+}
+
+header {
+    background-color: #333;
+    color: #fff;
+    padding: 1rem;
+    position: fixed;
+    top: 0;
+    left: 0;
+    right: 0;
+    z-index: 100;
+    box-shadow: 0 2px 5px rgba(0,0,0,0.1);
+}
+
+.header-container {
+    display: flex;
+    justify-content: space-between;
+    align-items: center;
+    max-width: 1200px;
+    margin: 0 auto;
+    width: 100%;
+}
+
+nav ul {
+    display: flex;
+    list-style: none;
+    gap: 1.5rem;
+}
+
+nav a {
+    color: #fff;
+    text-decoration: none;
+    font-weight: bold;
+}
+
+nav a:hover {
+    color: #ddd;
+}
+
+.logo-container {
+    display: flex;
+    align-items: center;
+}
+
+.logo {
+    height: 40px;
+    width: auto;
+    transition: transform 0.3s ease;
+}
+
+.logo:hover {
+    transform: scale(1.05);
+}
+
+main {
+    flex: 1;
+    padding: 6rem 1rem 2rem;
+    background-image: url('../public/images/background.png');
+    background-size: cover;
+    background-position: center;
+    background-repeat: no-repeat;
+    background-attachment: fixed;
+    color: #fff;
+}
+
+.content-container {
+    background-color: rgba(255, 255, 255, 0.8);
+    padding: 2rem;
+    border-radius: 8px;
+    margin: 2rem 0;
+    color: #333;
+}
+
+footer {
+    background-color: #333;
+    color: #fff;
+    text-align: center;
+    padding: 1rem;
+    margin-top: auto;
+}

Gallus_Pub_v1/tsconfig.json

@@ -0,0 +1,5 @@
+{
+  "extends": "astro/tsconfigs/strict",
+  "include": [".astro/types.d.ts", "**/*"],
+  "exclude": ["dist"]
+}