Skip to content

Commit

Permalink
nice nice
Browse files Browse the repository at this point in the history
  • Loading branch information
Dae Sanghwi committed Nov 19, 2024
1 parent f8c2707 commit 3b35b60
Show file tree
Hide file tree
Showing 3 changed files with 173 additions and 222 deletions.
227 changes: 99 additions & 128 deletions about.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -3,155 +3,126 @@
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta name="description" content="Learn about YeonSphere - Our mission, vision, and the team behind innovative technology solutions">
<meta name="keywords" content="YeonSphere, about, team, mission, vision, technology">
<meta name="author" content="Jeremy Matlock (Dae Sanghwi)">

<title>About - YeonSphere</title>

<!-- Preload Critical Resources -->
<link rel="preload" href="styles.css" as="style">
<link rel="preload" href="js/main.js" as="script">

<!-- Stylesheets -->
<title>About Me - YeonSphere</title>
<link rel="stylesheet" href="styles.css">
<link href="https://fonts.googleapis.com/css2?family=Google+Sans:wght@400;500;700&display=swap" rel="stylesheet">
<link href="https://fonts.googleapis.com/icon?family=Material+Icons+Round" rel="stylesheet">

<!-- Favicons -->
<link rel="icon" href="assets/favicon/favicon.ico" sizes="any">
<link rel="icon" href="assets/favicon/icon.svg" type="image/svg+xml">
<link rel="apple-touch-icon" href="assets/favicon/apple-touch-icon.png">
<link rel="manifest" href="assets/favicon/manifest.webmanifest">
</head>
<body>
<!-- Loading Screen -->
<div class="loading-screen">
<div class="loading-spinner"></div>
</div>
<header class="header">
<nav class="nav-container">
<a href="index.html" class="nav-logo">YeonSphere</a>
<ul class="nav-links">
<li><a href="index.html">Home</a></li>
<li><a href="about.html" class="active">About</a></li>
<li><a href="projects.html">Projects</a></li>
<li><a href="blog.html">Blog</a></li>
<li><a href="contact.html">Contact</a></li>
</ul>
</nav>
</header>

<!-- Navigation Menu -->
<nav class="nav-menu collapsed">
<button class="nav-toggle" aria-label="Toggle navigation menu">
<span class="material-icons-round">menu</span>
</button>
<div class="nav-links">
<a href="index.html" class="nav-link">
<span class="material-icons-round">home</span>
<span class="nav-text">Home</span>
</a>
<a href="projects.html" class="nav-link">
<span class="material-icons-round">code</span>
<span class="nav-text">Projects</span>
</a>
<a href="about.html" class="nav-link active">
<span class="material-icons-round">person</span>
<span class="nav-text">About</span>
</a>
<a href="blog.html" class="nav-link">
<span class="material-icons-round">article</span>
<span class="nav-text">Blog</span>
</a>
<a href="contact.html" class="nav-link">
<span class="material-icons-round">mail</span>
<span class="nav-text">Contact</span>
</a>
<a href="https://github.com/YeonSphere" class="nav-link" target="_blank" rel="noopener noreferrer">
<span class="material-icons-round">hub</span>
<span class="nav-text">GitHub</span>
</a>
</div>
</nav>

<main id="main">
<!-- About Hero Section -->
<main class="main">
<section class="about-hero">
<div class="container">
<h1>About YeonSphere</h1>
<p>Pioneering the future of cross-platform development and innovative technology solutions.</p>
<h1>About Me</h1>
<p class="hero-subtitle">Creating Technology That Empowers Freedom</p>
</div>
</section>

<!-- Mission Section -->
<section class="mission">
<section class="about-content">
<div class="container">
<h2>Our Mission</h2>
<p>At YeonSphere, we're dedicated to pushing the boundaries of what's possible in technology. Our focus is on creating innovative solutions that bridge platforms and enhance the developer experience through:</p>
<ul class="mission-points">
<li>Cross-platform development excellence</li>
<li>Open-source collaboration</li>
<li>Developer-centric tools and frameworks</li>
<li>Performance-focused solutions</li>
</ul>
</div>
</section>
<div class="about-grid">
<div class="about-text">
<h2>Who I Am</h2>
<p>Hi, I'm Dae Sanghwi (대상휘), though I'm legally known as Jeremy Matlock. I chose the name Dae Sanghwi because it resonates more deeply with who I am. I'm a passionate developer who believes in creating technology that gives users more control and freedom over their digital experience.</p>

<h3>Technical Skills</h3>
<div class="skill-grid">
<div class="skill-category">
<h4>Programming Languages</h4>
<div class="chip-group">
<span class="chip">Elixir</span>
<span class="chip">Flutter</span>
<span class="chip">Python</span>
<span class="chip">Java</span>
</div>
</div>

<div class="skill-category">
<h4>Web Development</h4>
<div class="chip-group">
<span class="chip">HTML</span>
<span class="chip">CSS</span>
<span class="chip">JavaScript</span>
</div>
</div>
</div>

<!-- Founder Section -->
<section class="founder">
<div class="container">
<h2>The Developer</h2>
<div class="founder-content">
<img src="assets/images/founder.jpg" alt="Jeremy Matlock (Dae Sanghwi)" class="founder-image">
<div class="founder-info">
<h3>Jeremy Matlock (Dae Sanghwi)</h3>
<p>A passionate software developer focused on creating efficient, cross-platform solutions. With expertise in systems programming, compiler design, and web technologies, I'm dedicated to building tools that make developers' lives easier.</p>
<div class="expertise">
<h4>Core Expertise</h4>
<ul>
<li>Systems Programming</li>
<li>Compiler Design</li>
<li>Cross-Platform Development</li>
<li>Web Technologies</li>
<li>Performance Optimization</li>
</ul>
<h3>Current Projects</h3>
<div class="project-highlights">
<div class="highlight-item">
<h4>AetherOS</h4>
<p>A custom operating system project focused on user freedom and control.</p>
</div>
<div class="highlight-item">
<h4>Nexus & Nexus for Android</h4>
<p>Cross-platform applications emphasizing user control and customization.</p>
</div>
<div class="highlight-item">
<h4>Seoggi</h4>
<p>A development project exploring new possibilities in software creation.</p>
</div>
<div class="highlight-item">
<h4>Seokjin-AI</h4>
<p>An artificial intelligence project with a focus on user privacy and control.</p>
</div>
</div>
</div>
</div>
</div>
</section>

<!-- Current Projects Section -->
<section class="current-projects">
<div class="container">
<h2>Current Focus</h2>
<div class="project-cards">
<div class="project-card">
<h3>Seoggi Language</h3>
<p>A modern programming language designed for simplicity and performance.</p>
<a href="/projects.html#seoggi" class="project-link">
<span class="material-icons-round">arrow_forward</span>
Learn More
</a>
<h3>Philosophy & Interests</h3>
<p>I'm driven by a passion for creating technology that respects user freedom. In recent years, I've observed a trend where users have increasingly less control over their digital tools and experiences. This motivates me to develop alternatives that put control back in users' hands.</p>

<p>I love to tinker and experiment with technology, always looking for ways to improve and customize existing solutions. My projects reflect this philosophy, aiming to provide more open and flexible alternatives to conventional software.</p>
</div>
<div class="project-card">
<h3>Cross-Platform Tools</h3>
<p>Development tools and utilities for seamless cross-platform development.</p>
<a href="/projects.html#tools" class="project-link">
<span class="material-icons-round">arrow_forward</span>
View Tools
</a>

<div class="about-sidebar">
<div class="profile-card">
<img src="assets/profile.jpg" alt="Dae Sanghwi" class="profile-image">
<div class="profile-info">
<h3>Dae Sanghwi</h3>
<p class="english-name">Jeremy Matlock</p>
<p class="korean-name">대상휘</p>
<p class="location">
<span class="material-icons-round">location_on</span>
Caraway, Arkansas, USA (Central Time)
</p>
</div>
<div class="social-links">
<a href="https://github.com/YeonSphere" class="button button-tonal">
<span class="material-icons-round">code</span>
GitHub
</a>
<a href="https://discord.gg/your-server" class="button button-tonal">
<span class="material-icons-round">chat</span>
Discord
</a>
<a href="https://instagram.com/your-profile" class="button button-tonal">
<span class="material-icons-round">photo_camera</span>
Instagram
</a>
</div>
</div>
</div>
</div>
</div>
</section>
</main>

<!-- JavaScript -->
<script src="js/main.js" defer></script>
<script>
// Loading Screen
window.addEventListener('load', () => {
document.querySelector('.loading-screen').classList.add('hidden');
});
<footer class="footer">
<div class="container">
<p>&copy; 2024 YeonSphere. All rights reserved.</p>
</div>
</footer>

// Navigation Menu
const navToggle = document.querySelector('.nav-toggle');
const navMenu = document.querySelector('.nav-menu');

navToggle.addEventListener('click', () => {
navMenu.classList.toggle('collapsed');
navMenu.classList.toggle('expanded');
});
</script>
<script src="script.js"></script>
</body>
</html>
58 changes: 43 additions & 15 deletions index.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -84,8 +84,8 @@
<main class="main">
<section class="hero">
<div class="container">
<h1 class="hero-title">Welcome to YeonSphere</h1>
<p class="hero-subtitle">Exploring the intersection of code and creativity</p>
<h1 class="hero-title">Jeremy Matlock (Dae Sanghwi)</h1>
<p class="hero-subtitle">Full Stack Developer specializing in Systems Programming and Modern Web Technologies</p>
<div class="hero-actions">
<a href="projects.html" class="button button-filled">
<span class="material-icons-round">rocket_launch</span>
Expand All @@ -104,19 +104,32 @@ <h1 class="hero-title">Welcome to YeonSphere</h1>
<h2 class="section-title">Featured Projects</h2>
<div class="project-grid">
<article class="project-card">
<img src="assets/project1.jpg" alt="Project 1" class="project-card-image">
<img src="assets/seoggi.jpg" alt="Seoggi Language Project" class="project-card-image">
<div class="project-card-content">
<h3 class="project-title">Project One</h3>
<p class="project-description">A brief description of the first project and its key features.</p>
<h3 class="project-title">Seoggi Programming Language</h3>
<p class="project-description">A modern systems programming language focused on performance, safety, and developer experience. Features include memory safety without garbage collection, powerful metaprogramming, and first-class concurrency support.</p>
<div class="chip-group">
<span class="chip">React</span>
<span class="chip">Rust</span>
<span class="chip">LLVM</span>
<span class="chip">Systems Programming</span>
</div>
<a href="projects/seoggi.html" class="button button-tonal">View Project</a>
</div>
</article>

<article class="project-card">
<img src="assets/windsurf.jpg" alt="Windsurf IDE Project" class="project-card-image">
<div class="project-card-content">
<h3 class="project-title">Windsurf IDE</h3>
<p class="project-description">A next-generation IDE built with Rust and WebAssembly, featuring AI-powered code assistance and real-time collaboration capabilities.</p>
<div class="chip-group">
<span class="chip">Rust</span>
<span class="chip">WebAssembly</span>
<span class="chip">TypeScript</span>
<span class="chip">Material You</span>
</div>
<a href="#" class="button button-tonal">Learn More</a>
<a href="projects/windsurf.html" class="button button-tonal">View Project</a>
</div>
</article>
<!-- More project cards... -->
</div>
</div>
</section>
Expand All @@ -126,21 +139,36 @@ <h3 class="project-title">Project One</h3>
<h2 class="section-title">Latest Blog Posts</h2>
<div class="post-grid">
<article class="blog-post">
<h3 class="post-title">Blog Post Title</h3>
<p class="post-excerpt">A brief excerpt from the blog post that gives readers an idea of the content.</p>
<h3 class="post-title">Building a Modern Programming Language</h3>
<p class="post-excerpt">An in-depth look at the design decisions and implementation challenges in developing the Seoggi programming language.</p>
<div class="post-meta">
<span class="chip">
<span class="material-icons-round">calendar_today</span>
Jan 15, 2024
</span>
<span class="chip">
<span class="material-icons-round">label</span>
Programming Languages
</span>
</div>
<a href="blog/seoggi-development.html" class="button button-outlined">Read More</a>
</article>

<article class="blog-post">
<h3 class="post-title">WebAssembly and the Future of Web Development</h3>
<p class="post-excerpt">Exploring how WebAssembly is revolutionizing web applications and enabling new possibilities in browser-based development tools.</p>
<div class="post-meta">
<span class="chip">
<span class="material-icons-round">calendar_today</span>
Jan 1, 2024
Jan 8, 2024
</span>
<span class="chip">
<span class="material-icons-round">label</span>
Technology
Web Development
</span>
</div>
<a href="#" class="button button-outlined">Read More</a>
<a href="blog/wasm-future.html" class="button button-outlined">Read More</a>
</article>
<!-- More blog posts... -->
</div>
</div>
</section>
Expand Down
Loading

0 comments on commit 3b35b60

Please sign in to comment.