commit d9b478505d5048ec26a1d1b2817dc3c5c68454b1
Author: root <root@hub.scroll.pub>
Date: 2024-12-27 10:10:03 +0000
Subject: Initial commit
diff --git a/body.html b/body.html
new file mode 100644
index 0000000..277cc49
--- /dev/null
+++ b/body.html
@@ -0,0 +1,66 @@
+<header>
+ <nav>
+ <div class="logo">Computational Physics</div>
+ <div class="nav-toggle" aria-label="Toggle navigation menu">
+ <span></span><span></span><span></span>
+ </div>
+ <ul class="nav-links">
+ <li><a href="#home">Home</a></li>
+ <li><a href="#team">Team</a></li>
+ <li><a href="#projects">Projects</a></li>
+ <li><a href="#collaborate">Work with Us</a></li>
+ </ul>
+ </nav>
+</header>
+
+<main>
+ <section id="home" class="hero">
+ <div class="container">
+ <h1>Advancing Scientific Computing</h1>
+ <p>We specialize in designing and optimizing massively parallel code for heterogeneous systems at CINECA</p>
+ </div>
+ </section>
+
+ <section id="team" class="team">
+ <div class="container">
+ <h2>Our Team</h2>
+ <div class="team-grid" id="teamGrid">
+ <!-- Team members will be dynamically inserted by JavaScript -->
+ </div>
+ </div>
+ </section>
+
+ <section id="projects" class="projects">
+ <div class="container">
+ <h2>Projects</h2>
+ <div class="project-cards">
+ <div class="project-card">
+ <h3>SPACE</h3>
+ <p>Advanced computational modeling for space applications</p>
+ </div>
+ <div class="project-card">
+ <h3>PNNR</h3>
+ <p>High-performance computing solutions for scientific research</p>
+ </div>
+ </div>
+ </div>
+ </section>
+
+ <section id="collaborate" class="collaborate">
+ <div class="container">
+ <h2>Work with Us</h2>
+ <p>We're actively seeking collaborations in HPC+AI projects. If you have an interesting project, we'd love to hear from you.</p>
+ <a href="#contact" class="cta-button">Get in Touch</a>
+ </div>
+ </section>
+</main>
+
+<footer>
+ <div class="container">
+ <p>Computational Physics Group at CINECA</p>
+ <nav class="footer-nav">
+ <a href="#privacy">Privacy Policy</a>
+ <a href="#terms">Terms of Use</a>
+ </nav>
+ </div>
+</footer>
diff --git a/index.scroll b/index.scroll
new file mode 100644
index 0000000..f4fdcdc
--- /dev/null
+++ b/index.scroll
@@ -0,0 +1,10 @@
+buildHtml
+baseUrl https://compphys.scroll.pub
+metaTags
+ description "Computational Physics Group at CINECA - Specializing in HPC, GPU optimization, and parallel computing for scientific applications"
+ keywords "computational physics, HPC, GPU computing, parallel computing, CINECA, scientific computing"
+editButton /edit.html
+title Computational Physics Group | CINECA
+style.css
+body.html
+script.js
diff --git a/readme.scroll b/readme.scroll
new file mode 100644
index 0000000..1575979
--- /dev/null
+++ b/readme.scroll
@@ -0,0 +1,2 @@
+# compphys.scroll.pub
+Website generated by Claude from prompt: We are small group of Computational Physics at HPC computation center CINECA, where we desgin, optimize, port to the gpus, delpoy code Massivily parallel code on heterogensous system and provide support at high level support to Industry and University. I want to create website for my group: Group Name: Computational Physics Member: here whenenver i click the name of each person it shoul open a url with brief bio of each member Project: SPACE, PNNR Work with us: If you have an intersting project HPC+AI then reach out with us. We are constantly looking for collaboration
\ No newline at end of file
diff --git a/script.js b/script.js
new file mode 100644
index 0000000..60cb24b
--- /dev/null
+++ b/script.js
@@ -0,0 +1,55 @@
+// Team members data
+const teamMembers = [
+ {
+ name: "Dr. John Doe",
+ role: "Group Leader",
+ bio: "Specialist in GPU optimization"
+ },
+ {
+ name: "Dr. Jane Smith",
+ role: "Senior Researcher",
+ bio: "Expert in parallel computing"
+ },
+ // Add more team members as needed
+];
+
+// Populate team members
+function populateTeam() {
+ const teamGrid = document.getElementById('teamGrid');
+ teamMembers.forEach(member => {
+ const memberElement = document.createElement('div');
+ memberElement.className = 'team-member';
+ memberElement.innerHTML = `
+ <h3>${member.name}</h3>
+ <p>${member.role}</p>
+ `;
+ memberElement.addEventListener('click', () => showBio(member));
+ teamGrid.appendChild(memberElement);
+ });
+}
+
+// Show member bio in a modal
+function showBio(member) {
+ alert(`${member.name}\n${member.role}\n\n${member.bio}`);
+ // In a real implementation, replace with a proper modal
+}
+
+// Mobile navigation toggle
+document.querySelector('.nav-toggle').addEventListener('click', () => {
+ document.querySelector('.nav-links').classList.toggle('active');
+});
+
+// Smooth scroll for navigation links
+document.querySelectorAll('a[href^="#"]').forEach(anchor => {
+ anchor.addEventListener('click', function (e) {
+ e.preventDefault();
+ document.querySelector(this.getAttribute('href')).scrollIntoView({
+ behavior: 'smooth'
+ });
+ });
+});
+
+// Initialize
+document.addEventListener('DOMContentLoaded', () => {
+ populateTeam();
+});
diff --git a/style.css b/style.css
new file mode 100644
index 0000000..730c2b5
--- /dev/null
+++ b/style.css
@@ -0,0 +1,178 @@
+:root {
+ --primary-color: #2c3e50;
+ --accent-color: #3498db;
+ --text-color: #2c3e50;
+ --background-color: #f9f9f9;
+ --card-background: #ffffff;
+}
+
+* {
+ margin: 0;
+ padding: 0;
+ box-sizing: border-box;
+}
+
+body {
+ font-family: 'Segoe UI', system-ui, sans-serif;
+ line-height: 1.6;
+ color: var(--text-color);
+ background-color: var(--background-color);
+}
+
+.container {
+ max-width: 1200px;
+ margin: 0 auto;
+ padding: 0 2rem;
+}
+
+/* Header & Navigation */
+header {
+ background-color: var(--primary-color);
+ position: fixed;
+ width: 100%;
+ top: 0;
+ z-index: 1000;
+}
+
+nav {
+ display: flex;
+ justify-content: space-between;
+ align-items: center;
+ padding: 1rem 2rem;
+}
+
+.logo {
+ color: white;
+ font-size: 1.5rem;
+ font-weight: bold;
+}
+
+.nav-links {
+ display: flex;
+ list-style: none;
+ gap: 2rem;
+}
+
+.nav-links a {
+ color: white;
+ text-decoration: none;
+ transition: color 0.3s ease;
+}
+
+.nav-links a:hover {
+ color: var(--accent-color);
+}
+
+/* Hero Section */
+.hero {
+ height: 100vh;
+ display: flex;
+ align-items: center;
+ background: linear-gradient(135deg, var(--primary-color), var(--accent-color));
+ color: white;
+ text-align: center;
+}
+
+.hero h1 {
+ font-size: 3.5rem;
+ margin-bottom: 1rem;
+}
+
+/* Team Section */
+.team-grid {
+ display: grid;
+ grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
+ gap: 2rem;
+ padding: 2rem 0;
+}
+
+.team-member {
+ background: var(--card-background);
+ padding: 1.5rem;
+ border-radius: 8px;
+ box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
+ transition: transform 0.3s ease;
+ cursor: pointer;
+}
+
+.team-member:hover {
+ transform: translateY(-5px);
+}
+
+/* Projects Section */
+.project-cards {
+ display: grid;
+ grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
+ gap: 2rem;
+ padding: 2rem 0;
+}
+
+.project-card {
+ background: var(--card-background);
+ padding: 2rem;
+ border-radius: 8px;
+ box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
+}
+
+/* Collaborate Section */
+.collaborate {
+ background-color: var(--primary-color);
+ color: white;
+ padding: 4rem 0;
+ text-align: center;
+}
+
+.cta-button {
+ display: inline-block;
+ padding: 1rem 2rem;
+ background-color: var(--accent-color);
+ color: white;
+ text-decoration: none;
+ border-radius: 4px;
+ margin-top: 2rem;
+ transition: background-color 0.3s ease;
+}
+
+.cta-button:hover {
+ background-color: #2980b9;
+}
+
+/* Mobile Responsive */
+.nav-toggle {
+ display: none;
+ flex-direction: column;
+ gap: 6px;
+ cursor: pointer;
+}
+
+.nav-toggle span {
+ width: 25px;
+ height: 2px;
+ background-color: white;
+ transition: 0.3s;
+}
+
+@media (max-width: 768px) {
+ .nav-toggle {
+ display: flex;
+ }
+
+ .nav-links {
+ display: none;
+ position: absolute;
+ top: 100%;
+ left: 0;
+ right: 0;
+ background-color: var(--primary-color);
+ flex-direction: column;
+ padding: 1rem;
+ }
+
+ .nav-links.active {
+ display: flex;
+ }
+
+ .hero h1 {
+ font-size: 2.5rem;
+ }
+}